https://github.com/josueec/flagpedia-clone

🌎 All country information and tourist activities in one place.
https://github.com/josueec/flagpedia-clone

cssmodules javascript reactjs redux

Last synced: about 1 month ago
JSON representation

🌎 All country information and tourist activities in one place.

• Host: GitHub
• URL: https://github.com/josueec/flagpedia-clone
• Owner: JosueEC
• Created: 2023-06-09T01:05:16.000Z (about 3 years ago)
• Default Branch: main
• Last Pushed: 2023-06-21T03:56:43.000Z (almost 3 years ago)
• Last Synced: 2025-02-22T01:29:05.994Z (over 1 year ago)
• Topics: cssmodules, javascript, reactjs, redux
• Language: JavaScript
• Homepage:
• Size: 767 KB
• Stars: 0
• Watchers: 1
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

          
# **COUNTRIES** | Proyecto Individual

## **📌 OBJETIVOS**

-  Construir una Single Page Application utlizando las tecnologías: **Vite**, **ReactJS**, **Redux** y **CSS Modules**.

-  Poner en práctica recursos básicos de estilos y diseño (UX : UI).

-  Aprender mejores prácticas.

-  Aprender y practicar el workflow de GIT.

La idea de este proyecto es construir una aplicación web a partir de la API [**countries**] en la que se pueda:

-  Buscar países.

-  Visualizar la información de los países.

-  Filtrarlos.

-  Ordenarlos.

-  Crear actividades turísticas.




---

## **⚠️ IMPORTANTE**

Las versiones de NodeJS y NPM que se usaron para la construccion del proyecto se enlistan a continuacion. Asegúrate de contar con ellas para poder instalar correctamente las dependecias necesarias para correr el proyecto. Actualmente las versiónes necesarias son:

-  **Node**: 12.18.3 o mayor

-  **NPM**: 6.14.16 o mayor

Para verificar que versión tienes instalada:

```bash

node -v

npm -v

```

---




### **🖱 FRONT-END**

Se debe desarrollar una aplicación utilizando **React** y **Redux** que contenga las siguientes vistas:

**📍 LANDING PAGE |** deberás crear una página de inicio o bienvenida con:

-  Alguna imagen de fondo representativa al proyecto.

-  Botón para ingresar a la **`home page`**.




**📍 HOME PAGE |** la página principal de tu SPA debe contener:

-  SearchBar: un input de búsqueda para encontrar países por nombre.

-  Sector en el que se vea un listado de cards con los países. Al iniciar deberá cargar los primeros resultados obtenidos desde la ruta **`GET /countries`** y deberá mostrar su:

   -  Imagen de la bandera.

   -  Nombre.

   -  Continente.

-  Cuando se le hace click a una Card deberá redirigir al detalle de ese país específico.

-  Botones/Opciones para **filtrar** por continente y por tipo de actividad turística.

-  Botones/Opciones para **ordenar** tanto ascendentemente como descendentemente los países por orden alfabético y por cantidad de población.

-  Paginado: el listado de países se hará por partes. Tu SPA debe contar con un paginado que muestre un total de 10 países por página.




**📍 DETAIL PAGE |** en esta vista se deberá mostrar toda la información específica de un país:

-  ID (Código de tres letras).

-  Nombre.

-  Imagen de la bandera.

-  Continente.

-  Capital.

-  Subregión (si tiene).

-  Área (si tiene).

-  Población.




**📍 FORM PAGE |**: en esta vista se encontrará el formulario para crear una actividad turística.

-  Nombre.

-  Dificultad.

-  Duración.

-  Temporada.

-  Posibilidad de seleccionar/agregar varios países en simultáneo.

-  Botón para crear la actividad turística.

---