This project was developed for a summer internship application challenge. Live Demo
The objective of the project was to develop a Single Page Application with React.js. The requested features were:
- Use of Giphy API to get the Gifs;
- Search of gifs based on user input, using the API;
- Favourite gifs;
- List the favourite gifs;
- Favourites must persist between sessions.
Make sure you have npm installed. Clone this repository, cd into it and run:
npm start
- Favourite and Unfavourite of Gifs, using sweet animations:
- Routing to the Feed and Favourites pages:
- Search capability:
- Self-made Infinite Scrolling on both tabs: Feed and Favourites:
These are the improvements I intend to work on before the project's due date, if time suffices:
- Implement lazy loading on Gifs.
- Use routing on search so that searched pages can be accessed by URL (example: /search?=magic ).
- Sticky navbar featuring the 'Feed' and 'Favorites' endpoints.
- Documentation, although the code was written so it is easily understood (using comments whenever it may be more complicated).
- No feedback when a gif is added.
- Gifs' fram rate is unnecessarily low.
- It is not easy to understand in which tab we are located in ( Feed or Favorites )
To learn the basics of React I used freeCodeCamp's tutorial on React. It explains the basics extremelly well and helped me a lot at getting to understand it!