Full-stack project, a Photo Album using:
- Pexels API,
- Node.js
- Express.js for the backend
- Javascript
- CSS and HTML
- Sass
- Intersection Observer for lazy loading images and infinite scroll features.
Link to live project(takes some seconds to start because of Glitch server): https://spangle-stupendous-noodle.glitch.me
Initial page -
This is the first page loaded(you can go back to it by clicking the Imagify logo).
Tablet screen size
Smartphone screen size
Image hovered -
When the image is hovered more information about the author and Pexels page appears. In smaller screen that information is displayed by default.
Searched theme page -
Page after user input in the search bar.
Note how the search bar state changes slightly when clicked, to indicate you can input text.
Displaying backend error messages in a user-friendly manner to indicate what's happening
Server error -
If the API limit is reached or an XSS atack is attempted
No results -
A message indicates when there are no results at all for a searched theme.
No more results -
In the bottom of the page a message indicates there are no more results for this searched theme.
Fullscreen mode
When you click an image, the fullscreen mode opens
