alxmcr / fe-bees-app-react-ts

Bees App — Administra tus contactos. ¡Fácilmente!

🐝 Bees App

Es una aplicación web que permita el registro, eliminación, búsqueda de contactos (bees 🐝) y paginación de resultados.

Features

• Listar contactos
• Paginación de contactos
• Registrar contactos
• Eliminar contactos
• Desktop y Mobile version

Lessons Learned

Yo aprendí y practiqué más acerca de React.js, React Hooks, Redux (Reducers, Actions, Store), React Context y TypeScript.

Run Locally

Clonar el proyecto

  git clone https://github.com/alxmcr/bees-app

Ir donde se encuentra el directorio del proyecto.

  cd bees-app

Install dependencies

  npm install

Iniciar el Frontend server

  npm run start

Extra: Iniciar Backend server (Backend API)

cd frontend-test
npm install
npm run start

Nota.- Es probable, que necesite:

• Cambiar el puerto del backend de 3000 a 4000 (Conflicto de puertos entre React y API).
• Instalar Nodemon para una rápida actualización de la base de datos.
• Actualizar algunos links de imagenes, algunos links fuerón necesarios modificarlos.

Environment Variables

Para arrancar el proyecto se necesita de variables de entorno(.env). Donde se puede, colocar en la raíz del proyecto: bees-app/.env (ver: .env-sample)

REACT_APP_BACKEND_API_BASE_URL=http://localhost:4000

Rutas Habilitadas

• Inicio (/)
• Contacto (/contacts/:id)

Tech Stack

HTML, CSS, Sass, JavaScript, Typescript, React.js, and Redux.

Screenshoots

Authors

• Alejandro M. Coca Rojas (@alxmcr)

Feedback

If you have any feedback, please reach out to me at [e-mail].