La estructura de un proyecto

Al generar un proyecto de ReactJS con el generador podemos encontrar la estructura con las siguientes carpetas y archivos.

A continuación se explica cada uno de estos y la importancia para alguien de nivel principiante.

Pero antes, debemos hacer una aclaración: siempre que veas el signo: / (signo división) significa que es una carpeta.

La manera de identificar si es un archivo es que va a tener: . (punto) seguido de letras que detallan el nombre del formato que es ese archivo.

Por ejemplo: archivo.js significa que es un archivo de formato JavaScript.

La carpeta /src

Esta carpeta es de las principales debido a que contiene los archivos donde vamos a escribir el código.

Al generar un proyecto automatico, dentro de la carpeta /src podemos encontrar:

• App.css (-)
• App.js (*) (principal archivo JavaScript)
• App.test.js (-)
• index.css (*) (archivo de estilos css)
• logo.svg (-)
• serviceWorker.js (-)
• setupTests.js (-)

(*) Los archivos que contienen un asterisco son aquellos que inicialmente un principiante debe aprender
(-) aquellos archivos que se pueden eliminar por el momento siendo principiantes. U omitir hasta una etapa más avanzada de entendimiento.

Es decir en realidad solo debemos centrar nuestra atención en los siguientes archivos en la carpeta /src

• App.js
• index.css
• index.js