Réagissez avec Vite On Steroids

Un modèle de démarrage puissant pour le développement Web moderne

Créer des applications React en toute simplicité avec React with Vite On Steroids – Un modèle de démarrage pour créer facilement des applications React hautes performances.

Qu'y a-t-il à l'intérieur ?

Ce modèle regorge de fonctionnalités conçues pour rationaliser votre processus de développement :

• Vite : L'outil de build ultra-rapide qui garantit un développement rapide et des builds de production optimisés.
• React : la bibliothèque JavaScript populaire pour créer des interfaces utilisateur.
• TypeScript : ajoutez une sécurité de type et des outils améliorés à votre JavaScript.
• Tailwind CSS : un framework CSS axé sur les utilitaires pour créer des designs époustouflants sans écrire de CSS personnalisé.
• ESLint : gardez votre base de code propre et cohérente avec les règles de peluchage enfichables.
• Prettier : un formateur de code avisé qui applique un style cohérent dans l'ensemble de votre projet.
• Vitest : un framework de tests unitaires ultra-rapide avec une approche Vite-native.
• Bibliothèque de tests : utilitaires de tests simples et complets qui encouragent les bonnes pratiques de test.
• Playwright : un framework de test polyvalent de bout en bout qui prend en charge plusieurs navigateurs.
• Husky : Automatisez vos hooks Git, tels que les hooks de pré-validation, pour garantir un code de qualité avant qu'il n'atteigne le référentiel.

Commencer

Conditions préalables

Avant de plonger, assurez-vous d'avoir installé les éléments suivants :

• Node.js (version 20.x ou supérieure)
• Fil (ou npm ou pnpm)

Installation

Démarrez votre projet avec ces étapes simples :

1. Cloner le dépôt :

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

1. Installer les dépendances :

   yarn

Exécution du serveur de développement

Prêt à commencer à coder ? Lancez le serveur de développement avec :

yarn dev

Bâtiment pour la production

Lorsque vous êtes prêt à déployer, créez une version de production avec :

yarn build

Exécution de tests

Ce modèle est livré avec des utilitaires de test intégrés pour garantir que votre code fonctionne comme prévu.

• Tests unitaires avec Vitest :

  yarn test

• Vérifier la couverture des tests :

  yarn coverage

• Tests de bout en bout avec le dramaturge :

  • Exécutez tous les tests :

  yarn playwright test
  

  • Mode interface utilisateur interactive :

  yarn playwright test --ui
  

  • Exécutez des tests uniquement sur Desktop Chrome :

  yarn playwright test --project=chromium
  

  • Exécuter des tests dans un fichier spécifique :

  yarn playwright test example
  

  • Mode débogage :

  yarn playwright test --debug
  

  • Générer automatiquement des tests avec Codegen :

  yarn playwright codegen
  

Pelucheux et formatage

Maintenez la qualité et la cohérence du code avec ces commandes :

• Lint le code :

  yarn lint

• Corriger les erreurs de peluchage :

  yarn lint:fix

• Formater le code :

  yarn format

Licence

Ce projet est sous licence MIT. Pour plus de détails, consultez le fichier LICENCE.

Remerciements

Un immense merci aux développeurs et aux communautés derrière ces outils incroyables :

• Vite
• Réagir
• TypeScript
• CSS Tailwind
• ESLint
• Plus jolie
• Vitest
• Bibliothèque de tests
• Dramaturge
• Husky

Découvrez le modèle @RicardoGEsteves

J'en ai beaucoup sur mon site Web à https://www.ricardogesteves.com

Suivez-moi @ricardogesteves
X(twitter)

RicardoGEsteves (Ricardo Esteves) · GitHub

Développeur Full-Stack | Passionné par la création d'expériences utilisateur intuitives et percutantes | Basé à Lisbonne, Portugal ?? - Ricardo GEsteves

github.com

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!