Creación de un proyecto de inicio

Completado

Usaremos un proyecto de inicio para que podamos empezar a escribir código rápidamente. El proyecto de inicio contiene la estructura mínima que necesitamos para empezar a desarrollar una aplicación React con Snowpack:

• Dos archivos
• Dos directorios vacíos

Clonación del repositorio e instalación de paquetes

1. Abra una ventana de terminal o comandos y ejecute los siguientes comandos:

   # Linux or macOS
   git clone https://github.com/MicrosoftDocs/mslearn-react
   cd mslearn-react/code/0-starter
   
   # Windows
   git clone https://github.com/MicrosoftDocs/mslearn-react
   cd mslearn-react/code/0-starter
   

2. Instale los paquetes necesarios mediante el comando siguiente en la misma ventana de terminal o comandos:

   npm install
   

3. Abra el directorio en Visual Studio Code mediante la ejecución de este comando:

   code .
   

Exploración del proyecto de inicio

Vamos a examinar las carpetas y los archivos del proyecto de inicio:

• package.jsen contiene la lista de paquetes y scripts:
  • Paquetes:
    • React para React
    • ReactDOM para montar la aplicación en el explorador
  • Scripts:
    • start para ejecutar el servidor de desarrollo desde Snowpack:
      • Compila prácticamente todos los archivos JavaScript y HTML.
      • Hospeda y reinicia automáticamente el servidor a medida que se modifican los archivos.
    • build para generar archivos de producción para la implementación
• snowpack.config.js contiene la configuración básica de Snowpack.
  • mount crea dos directorios virtuales para el servidor Snowpack.
    • public contiene todos los archivos estáticos (como HTML, CSS e imágenes). Se hospeda como /.
    • src contiene todos los archivos JSX y los archivos de React asociados. Se hospeda como dist.
• public contiene todos los archivos estáticos.
• src contiene todos los archivos de React.