El objetivo es completar la prueba de React Junior de Ninja Talent. Al acceder a la página principal, se muestra un encabezado con un ícono, el título del proyecto, mis nombres y apellidos, y un enlace (@Spanioulis) que redirige a mi página web. En la parte inferior izquierda se encuentra una barra de navegación con cuatro botones (rutas futuras para la próxima versión) y tres íconos que enlazan a mi cuenta de GitHub, Linkedin y correo electrónico.
En la parte inferior derecha (sección de Usuarios) se muestra una tabla con información detallada de cada usuario, como su nombre, género, fecha de nacimiento, edad y correo electrónico. Al hacer clic en la imagen de cualquier usuario, se abre un modal que proporciona información adicional y detallada del usuario, como dirección, ciudad, código postal, país y número de teléfono. Para cerrar el modal, puedes hacer clic en el icono ✖, presionar la tecla Esc o hacer clic fuera del modal.
🖐️ Click aquí
Proyecto realizado con React & JavaScript y maquetado con styled-components. Se ha usado Vite por su rapidez de compilación. Enfocado en la versión de escritorio; utilizando Atomic Design (atoms, molecules y organisms) para los componentes, carpeta page para la ruta principal ('/'), carpeta styles (estilos de la app, con archivos colors, dimensions, FlexBox y GlobalStyle), carpeta utils (custom hook useFetch), y carpeta assets (icono web). En otro nivel de la carpeta src se encuentra la carpeta tests.
code_challenge_jr.webm
- Clona el repositorio en tu equipo: git clone https://github.com/Spanioulis/code-challenge-react-jr.git
- Instala las dependencias:
npm install - Inicia el servidor de desarrollo:
npm run dev - Abre http://localhost:5173 en tu navegador para ver la aplicación en acción