react-eth-challenge icon indicating copy to clipboard operation
react-eth-challenge copied to clipboard

[completed] react-eth-challenge: UchihaCFC

Open UchihaCFC opened this issue 2 years ago • 0 comments

DESCRIPTION

Solución al reto:

Nombre: Carolina Fernández Usuario Platzi: @UchihaCFC

Link al deploy del proyecto: react-eth-uchihacfc

Reto:

  • [X] Primer problema
  • [X] Segundo problema
  • [X] Tercer problema
  • [X] Cuarto Problema
  • [X] Quinto Problema
  • [X] Sexto Problema
  • [X] Septimo Problema

[Anexo] Documentación:

Pequeño proyecto donde se simula un CV para el primer reto del eth developer program.

  • Creación de componentes

    Los componentes están en la carpeta /components, hay un componente por cada una de las secciones. A cada uno le llegan props y child props según las necesidades de cada caso.

    El render está hecho en react 16.x y no tal y como indicaría hacerlo para 18.x.

  • Función getData.js y custom API

    Se ha creado la función getData con un fetch para retornar los datos de la API siempre en un JSON.

    Se ha cambiado la información por default de la API. En el proyecto local ésta se puede seguir utilizando a través de json-server con el comando npm run server pero para el deploy se ha creado una custom API con beeceptor, para poder hacer el fetch de los datos sin necesidad de levantar json-server.

  • Estilos de los componentes

    Los estilos de los componentes están en la carpeta /src/styles/ cada uno con el nombre de su componente correspondiente. En el archivo App.styl están los estilos generales que repercuten a toda la app o a más de un componente concreto. Es por esto que no todos los componentes tienen su propio archivo de estilos, ya que no todos necesitan propiamente un estilo asignado sino que lo heredan de otro. No se está siguiendo ninguna nomenclatura como BEM o similares, ya que las clases vienen dadas por el proyecto del reto original.

Se han agregado pequeños estilos para que la app sea responsive de forma básica.

  • Deploy

    El deploy está hecho en Netlify desde el repositorio del fork. En el deploy de Netlify se hace un npm run build y se despliega la app desde la carpeta correspondiente.

    Para poder hacer el build correctamente con las versiones actuales del package.json se ha tenido que agregar una variable de entorno dentro de Netlify para que instale correctamente todas las dependencias.

UchihaCFC avatar Jul 11 '22 10:07 UchihaCFC