https://github.com/mavadev/proyectofinalweb-soyhenry

Proyecto Final para SoyHenry (Sin actualizar servidor en Heroku )
https://github.com/mavadev/proyectofinalweb-soyhenry

framer-motion react redux sass

Last synced: about 1 month ago
JSON representation

Proyecto Final para SoyHenry (Sin actualizar servidor en Heroku )

• Host: GitHub
• URL: https://github.com/mavadev/proyectofinalweb-soyhenry
• Owner: mavadev
• Created: 2022-02-25T02:04:02.000Z (about 3 years ago)
• Default Branch: master
• Last Pushed: 2022-04-14T00:30:44.000Z (about 3 years ago)
• Last Synced: 2025-02-14T23:46:02.113Z (3 months ago)
• Topics: framer-motion, react, redux, sass
• Language: JavaScript
• Homepage:
• Size: 1.38 MB
• Stars: 0
• Watchers: 1
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

        
# Level Up! 🎮

El projecto se basa en una SPA, desarrollada como proyecto individual para el bootcamp de [SoyHenry](https://www.soyhenry.com/). 

Encuentra tus videojuegos favoritos y conoce mas sobre ellos para convertirte en el mejor conocedor de Videojuegos.

## 🚀 Instalación

1. Clona este proyecto.

2. Ve a la carpeta del proyecto `cd videogamesApp`

3. En una terminal:

    * Ve a la carpeta api `cd api/`

    * Instala las dependencias `npm install`

    * Corre el servidor local `npm run start`

4. En otra terminal:

    * Ve a la carpeta client `cd client/`

    * Instala las dependencias `npm install`

    * Corre el ambiente local `npm run dev`

## ✍️ Objetivos del Proyecto

La idea general fue crear una aplicación en la cual se puedan ver los distintos videojuegos disponibles junto con información relevante de los mismos utilizando la api externa [Rawg](https://rawg.io/apidocs) y a partir de ella poder:

  - Buscar videjuegos por nombre.

  - Ordenar por orden alfabético o por rating.

  - Filtrar por género y por videojuego existente o agregado por nosotros.

  - Agregar nuevos videojuegos mediante formulario controlado con JavaScript.

  - Paginado para ir cambiando entre los videojuegos, mostrando 15 videojuegos por página.

### Endpoints utilizadas de la Api Externa:

  - GET https://api.rawg.io/api/genres

  - GET https://api.rawg.io/api/games

  - GET https://api.rawg.io/api/games/{id}

  - GET https://api.rawg.io/api/games?search={game}

## 🛠️ Construido con:

### Frontend

* [Sass](https://sass-lang.com/) - Preprocesador CSS.

* [React](https://es.reactjs.org/) - La librería web usada. 

* [React Router Dom](https://reactrouterdotcom.fly.dev/docs/en/v6) - Para el enrutamiento en React.

* [React Icons](https://react-icons.github.io/react-icons/) - El uso de iconos.

* [Redux](https://redux.js.org/) - Para la gestión del estado.

* [Framer Motion](https://www.framer.com/motion/) - Animaciones de la aplicación.

### Backend

* [Node JS](https://nodejs.org/es/) - Desarrollo del Backend.

* [Express](http://expressjs.com/) - Para la creación de la API.

* [PostgreSQL](https://www.postgresql.org/) - Sistema de Gestión de Bases de Datos.

* [Sequalize](https://sequelize.org/) - ORM de Node.js utilizada para Postgres.

## 📸 Capturas :