CATALOGUE Code & Data Formation JavaScript Apprendre Vue JS 3

Tutoriel pour Nettoyer les Fichiers Vite et Construire une Interface d'Application

Retour à la formation
Chapitre 6 Leçon 2
Précédent
Suivant

Apprenez à faire le ménage dans les fichiers générés par Vite et à construire l'interface de votre application à partir de zéro.

Détails de la leçon

Description de la leçon

Dans cette vidéo, nous abordons la procédure initiale de nettoyage des fichiers générés par Vite ainsi que la construction de l'interface utilisateur de l'application. Vous apprendrez à supprimer les composants par défaut créés par Vite dans les dossiers SRC, Components, Icons, et Assets. Nous vous montrerons ensuite comment créer un composant principal avec une balise template contenant une balise div qui affichera le stock actuel et deux boutons pour modifier ce stock. En outre, vous découvrirez comment ajouter des règles CSS pour styliser ce composant.

Finalement, nous évoquerons l'utilisation de Pina pour la gestion d'état, en commençant par vérifier la présence du dossier store généré automatiquement, prêt à être modifié dans une prochaine vidéo.

Objectifs de cette leçon

À la fin de cette vidéo, vous serez capable de :

  • Nettoyer les fichiers par défaut générés par Vite
  • Élaborer une interface utilisateur de base pour votre application
  • Appliquer des styles CSS pour améliorer l'apparence de votre interface

Prérequis pour cette leçon

Avant de commencer cette vidéo, assurez-vous d'avoir :

  • Des connaissances basiques en Vue.js
  • Installé l'environnement de développement Vite
  • Des notions de base en CSS pour styliser les composants

Métiers concernés

Les compétences abordées dans cette vidéo sont particulièrement utiles pour :

  • Développeurs front-end
  • Ingénieurs logiciels
  • Développeurs d'applications web

Alternatives et ressources

Pour ceux qui cherchent des alternatives à Vite, vous pouvez explorer :

  • Webpack - Un autre bundler populaire pour JavaScript
  • Parcel - Un outil de build rapide et convivial
  • Create React App - Pour les projets utilisant React.js

Questions & Réponses

Le fichier main.css est supprimé dans le dossier Assets.
Une balise div contenant le stock actuel et deux boutons pour les actions de vente et de réapprovisionnement.
Pina est l'outil mentionné pour la gestion d'état dans l'application.