La historia y caída de Create React App, una leyenda del desarrollo web

¿Recuerdas 2016? Intentar crear rápidamente un proyecto simple de React en aquel entonces era como ensamblar un gabinete sin instrucciones. Tenías que cablear manualmente Webpack, configurar Babel, escribir configuraciones para loaders de CSS y configurar un servidor de desarrollo local. Configurar el entorno llevaba un día entero, aunque no hubieras tocado ni una sola línea de tu código real de la aplicación.

Luego Facebook lanzó Create React App (CRA). Un único comando npx create-react-app my-app generaba un proyecto listo para usar. Sin preguntas, sin cuadros de diálogo, sin miles de líneas de configuración.

Hoy esta herramienta ha sido oficialmente marcada como obsoleta y enviada a retiro a largo plazo. La documentación de React asesora directamente cambiar a alternativas como Vite o Next.js. Exploremos cómo CRA transformó la industria frontend, qué había bajo el capó y por qué llegó a su fin su era.

Qué hacía Create React App

La idea de la herramienta encajaba en el concepto de "cero configuración". El desarrollador obtenía una pila funcional sin necesidad de profundizar en la configuración de las herramientas de build.

Toda la infraestructura estaba oculta dentro de un único paquete — react-scripts. Era una caja negra que contenía Webpack, Babel, ESLint y PostCSS.

Un inicio rápido lucía así:

npx create-react-app my-app
cd my-app
npm start

Después de unos treinta segundos, se abría una página en tu navegador en http://localhost:3000.

La estructura del directorio terminaba extremadamente limpia. Sin archivos .babelrc o webpack.config.js en la raíz:

my-app
├── README.md
├── node_modules
├── package.json
├── public
│   ├── favicon.ico
│   ├── index.html
│   └── manifest.json
└── src
    ├── App.css
    ├── App.js
    ├── App.test.js
    ├── index.css
    └── index.js

Cómo funcionaba bajo el capó

CRA se construyó sobre tres principios: una única dependencia de build, cero configuración inicial y un comando de escape.

Dependencia única

Anteriormente, actualizar las herramientas se convertía en un infierno. Actualizabas Webpack — Babel se rompía. Actualizabas Babel — un plugin de ESLint dejaba de funcionar.

En CRA, react-scripts era responsable de todo. Actualizar esta única biblioteca actualizaba toda la cadena de build por debajo. Incluía:

• Soporte para JSX, ES6+ y TypeScript listo para usar
• Inyección automática de prefijos de proveedor en CSS mediante Autoprefixer
• Ejecuciones de pruebas interactivas con Jest y vigilancia de archivos
• Sobrecapas de errores de build directamente en el navegador

Si cometías un error de sintaxis, CRA mostraba una pantalla clara señalando la línea y el carácter exactos:

El mecanismo de Eject

¿Y si la configuración por defecto no era suficiente? Digamos que necesitabas un plugin raro para procesar tipos específicos de archivos.

Para estos casos, los creadores agregaron el comando npm run eject. Literalmente daba vuelta el proyecto: eliminaba react-scripts y copiaba todos los cientos de líneas de configuraciones de Webpack y Babel directamente a tu proyecto.

Esto era un billete de ida. No había forma de volver a la estructura limpia, y tenías que mantener el desastre de configuración tú mismo.

Por qué Create React App quedó obsoleto

El tiempo trabajó en contra de CRA. Las tecnologías avanzaron y las decisiones arquitectónicas de la herramienta se convirtieron en debilidades.

Primero, la velocidad. Webpack reconstruye y analiza todo el proyecto desde cero al iniciar el servidor de desarrollo. Cuando un proyecto crece hasta cientos de componentes, el inicio y el hot reload toman decenas de segundos. Vite, que llegó después, usa módulos ES nativos del navegador y construye código sobre la marcha con el ultrarrápido compilador Go esbuild.

Segundo, el cambio hacia SSR y componentes de servidor. CRA solo podía construir aplicaciones de una sola página (SPA) centradas en el cliente — un archivo HTML vacío que se llenaba con scripts en el navegador del usuario. Una buena SEO y una primera pintura rápida requerían renderizado del lado del servidor, lo cual CRA simplemente no podía proporcionar.

Tercero, el tamaño inflado. La carpeta node_modules de un proyecto recién creado pesaba cientos de megabytes, e instalar las dependencias tomaba un par de minutos incluso con una conexión rápida.

Qué usar en lugar de CRA

La guía oficial de React da indicaciones claras:

• Vite — si necesitas una SPA rápida, un proyecto personal o un blog sin renderizado del lado del servidor. Inicia en milisegundos y funciona notablemente más rápido.
• Next.js o Remix — si estás construyendo una aplicación de producción completa con SSR, enrutamiento, optimización de imágenes y componentes de servidor.
• Expo — si planeas escribir una aplicación móvil multiplataforma con React Native.

Memoria de una leyenda

Create React App hizo lo más importante: estableció un alto estándar para la Experiencia del Desarrollador. Le mostró a toda la industria que construir una aplicación web podía ser simple y no requerir conocimiento profundo de Webpack desde tu primer día de trabajo.

Comenzar proyectos serios nuevos en CRA hoy no tiene valor práctico. Pero si te encuentras con un tutorial de hace tres años o necesitas crear rápidamente un sandbox — CRA seguirá funcionando.