Una potente plantilla inicial para el desarrollo web moderno

Creación de aplicaciones React de forma sencilla con React with Vite On Steroids: una plantilla inicial para crear aplicaciones React de alto rendimiento con facilidad.

¿Qué hay dentro?

Esta plantilla incluye funciones diseñadas para agilizar su proceso de desarrollo:

• Vite: la herramienta de compilación ultrarrápida que garantiza un desarrollo rápido y compilaciones de producción optimizadas.
• React: la popular biblioteca JavaScript para crear interfaces de usuario.
• TypeScript: agregue seguridad de tipos y herramientas mejoradas a su JavaScript.
• Tailwind CSS: un marco CSS de utilidad para crear diseños impresionantes sin escribir CSS personalizado.
• ESLint: Mantenga su código base limpio y coherente con reglas de linting conectables.
• Más bonito: un formateador de código obstinado que impone un estilo consistente en todo tu proyecto.
• Vitest: un marco de prueba unitario ultrarrápido con un enfoque nativo de Vite.
• Biblioteca de pruebas: Utilidades de prueba simples y completas que fomentan las buenas prácticas de prueba.
• Dramaturgo: Un marco de pruebas versátil de un extremo a otro que admite múltiples navegadores.
• Husky: automatiza tus enlaces de Git, como los enlaces de confirmación previa, para garantizar la calidad del código antes de que llegue al repositorio.

Empezando

Requisitos previos

Antes de sumergirte, asegúrate de tener instalado lo siguiente:

• Node.js (versión 20.x o superior)
• Hilo (o npm o pnpm)

Instalación

Pon en marcha tu proyecto con estos sencillos pasos:

1. Clonar el repositorio:

   git clone https://github.com/RicardoGEsteves/react-with-vite-on-steroids.git
   cd react-with-vite-on-steroids

1. Instalar dependencias:

   yarn

Ejecutando el servidor de desarrollo

¿Listo para comenzar a codificar? Ponga en marcha el servidor de desarrollo con:

yarn dev

Edificio para la producción

Cuando esté listo para implementar, cree una compilación de producción con:

yarn build

Ejecución de pruebas

Esta plantilla viene con utilidades de prueba integradas para garantizar que su código funcione como se espera.

• Pruebas unitarias con Vitest:

  yarn test

• Verificar cobertura de prueba:

  yarn coverage

• Pruebas de principio a fin con Dramaturgo:

  • Ejecutar todas las pruebas:

  yarn playwright test
  

  • Modo de interfaz de usuario interactiva:

  yarn playwright test --ui
  

  • Ejecutar pruebas solo en Chrome de escritorio:

  yarn playwright test --project=chromium
  

  • Ejecutar pruebas en un archivo específico:

  yarn playwright test example
  

  • Modo de depuración:

  yarn playwright test --debug
  

  • Autogenerar pruebas con Codegen:

  yarn playwright codegen
  

Linting y formato

Mantenga la calidad y coherencia del código con estos comandos:

• Pelusa el código:

  yarn lint

• Corregir errores de linting:

  yarn lint:fix

• Formatear el código:

  yarn format

Licencia

Este proyecto tiene la licencia MIT. Para obtener más detalles, consulte el archivo de LICENCIA.

Expresiones de gratitud

Muchas gracias a los desarrolladores y comunidades detrás de estas increíbles herramientas:

• Vita
• Reaccionar
• Mecanografiado
• CSS de viento de cola
• ESLint
• Más bonita
• Vitest
• Biblioteca de pruebas
• Dramaturgo
• Fornido

Consulta la plantilla @RicardoGEsteves

Tengo mucho en mi sitio web en https://www.ricardogesteves.com

Sígueme @ricardogesteves
X(gorjeo)

RicardoGEsteves (Ricardo Esteves) · GitHub

Desarrollador Full-Stack | Apasionado por crear experiencias de usuario intuitivas e impactantes | ¿Con sede en Lisboa, Portugal? - Ricardo GEsteves

github.com