This games web app was a good challenge to put into practice my skills in React.js, Redux (toolkit), React Router, Styled Components and Axios. This project is using a game API called rawg.io. If you want to see a live version of the app, you can visit this link.
- My Linkedin Linkedin
- My email [email protected]
- Live Project Games Web App
- Get more info about a game clicking it.
- See the trailer of the clicked game.
- Get some recommendated games realationed with the game clicked.
- Filter games by title, genres, platforms, stores, tags, publishers, etc.
- Add and remove a game as a favorite, played, play later. and
- A navbar to navigate through the different endpoints for the games add as a favorite, played, play later.
- Save the games added to
localStorageto render them again when the user refresh the page. - Get a presental game that is gonna change every 15s on the home page.
- Infite scroll to load more games.
- View the optimal layout for the app depending on their device's screen size.
- See hover states for all interactive elements on the page.
- React - JS library
- Redux - Toolkit
- React Router - Router library for React
- Styled Components - CSS in JS library
- axios - HTTP library for JS
- LocalStorage - To save the games added to localStorage to render them again when the user refresh the page.
- Some javascript new features like intersection observer.
- Mobile-first workflow
- CSS Flexbox
- CSS Grid
- CSS custom properties
- Semantic HTML5 markup
- On the first load, render a navbar to navigate to the different endpoints and set the filters, render the home page with a presental game which is gonna change every 15s and a infinite scroll of games.
- Handle errors when fetching games, etc.
- A condicionaly render of some components depending on if the API return their content or not.
