# 170: Vea a un aficionado desarrollar un proyecto de módulos React + Babel + Webpack + CSS - Trucos CSS

Tabla de contenido

¡Advertencia justa! Esta no es una explicación rápida, sencilla y dirigida por expertos sobre cómo configurar estas tecnologías. Aunque, al final, logramos que todo funcione correctamente. Se trata de documentar la experiencia del mundo real al realizar este tipo de trabajo. Algunas cosas funcionan fácilmente, otras no. A veces es culpa mía. A veces, los documentos no están claros. A veces se han producido cambios bajo nuestros pies. Tenemos que luchar contra todo.

Tenemos un pequeño plan aquí. Lo que queremos hacer es poner en marcha un proyecto local que utilice:

  1. Reaccionar: Digamos que estamos construyendo un SPA y deseamos trabajar con un modelo de componentes.
  2. ReactDOM: estamos construyendo para la web.
  3. Webpack: Queremos un servidor de desarrollo, recarga de módulos en caliente y una forma de agrupar nuestras dependencias de una manera digna de producción.
  4. Babel: Puede que no necesitemos mucha compilación de JavaScript en el futuro, pero sí necesitamos JSX, y Babel es lo que lo compila.
  5. Módulos CSS: queremos escribir algunos CSS aislados específicos de componentes y esta es una buena manera de hacerlo donde nuestros estilos permanecen en las hojas de estilo.

Afortunadamente, mientras planeaba hacer este video, encontré el artículo “Cómo crear una aplicación React desde cero usando Webpack 4” de Linh Nguyen My. 12.5K aplausos en Medium! ¡Guau! También le agregué una gran cantidad de aplausos, porque parece ser el único tutorial que realmente cubre esta combinación súper popular de amigos de una manera accesible que realmente funciona.

¡Eso no quiere decir que todo vaya fácil y sin problemas! Me encuentro con un montón de pequeños problemas en el camino. Algunas de ellas son cosas que me tocan gordas. Algunos de ellos son errores misteriosos que aparecen cuando ejecutamos comandos que apenas entiendo. Parte de ella parece faltar documentación sobre características. Sin embargo, al final lo arreglamos todo y tenemos un proyecto de trabajo.

Articulos interesantes...