114 lines
4.2 KiB
Markdown
114 lines
4.2 KiB
Markdown
# Projet-Dev-Web-In1
|
|
|
|
Bienvenue dans le projet **DevWeb** ! Ce projet utilise **Vite** et **React** pour créer une application web moderne et performante.
|
|
|
|
## Prérequis
|
|
|
|
Avant de commencer, assurez-vous que vous avez les éléments suivants installés sur votre machine :
|
|
|
|
- **Node.js** (version 16 ou supérieure) : Vous pouvez télécharger Node.js depuis [nodejs.org](https://nodejs.org).
|
|
- **Git** : Pour cloner le projet depuis GitHub, vous devez avoir Git installé. Vous pouvez le télécharger depuis [git-scm.com](https://git-scm.com).
|
|
|
|
## Récupérer le projet
|
|
|
|
### Cloner le dépôt
|
|
|
|
Ouvrez votre terminal et clonez le projet depuis GitHub :
|
|
|
|
```bash
|
|
git clone git@github.com:Charles40130/Projet-Dev-Web-Ing1.git
|
|
```
|
|
Ou si vous utilisez HTTPS :
|
|
```bash
|
|
git clone https://github.com/Charles40130/Projet-Dev-Web-Ing1.git
|
|
```
|
|
Ensuite, entrez dans le répertoire du projet cloné :
|
|
|
|
```bash
|
|
|
|
cd Projet-Dev-Web-Ing1
|
|
Installation des dépendances
|
|
```
|
|
Une fois que vous avez cloné le projet, vous devez installer les dépendances nécessaires.
|
|
|
|
Exécutez la commande suivante dans le terminal à partir du répertoire du projet :
|
|
```bash
|
|
npm install
|
|
```
|
|
Cela téléchargera et installera toutes les dépendances du projet listées dans le fichier package.json.
|
|
|
|
Lancer l'application
|
|
|
|
En mode développement
|
|
Pour démarrer l'application en mode développement, utilisez la commande suivante :
|
|
```bash
|
|
npm run dev
|
|
```
|
|
Cela démarrera un serveur local, généralement accessible sur http://localhost:3000, où vous pourrez voir l'application en direct.
|
|
|
|
En mode production
|
|
Si vous souhaitez tester l'application en mode production, exécutez la commande suivante :
|
|
```bash
|
|
npm run build
|
|
npm run preview
|
|
```
|
|
Cela générera une version optimisée de votre application dans le dossier dist et vous permettra de la prévisualiser localement.
|
|
|
|
Structure du projet
|
|
|
|
Voici un aperçu de la structure des dossiers et fichiers principaux du projet :
|
|
|
|
/Projet-Dev-Web-Ing1
|
|
├── /node_modules # Dépendances installées
|
|
├── /public # Fichiers publics (images, index.html, etc.)
|
|
├── /src # Code source de l'application (React)
|
|
│ ├── /assets # Ressources comme les images
|
|
│ ├── /components # Composants React
|
|
│ ├── /styles # Fichiers CSS ou SCSS
|
|
│ └── /App.jsx # Composant principal de l'application
|
|
├── package.json # Dépendances et scripts de l'application
|
|
└── README.md # Ce fichier
|
|
|
|
Commandes utiles
|
|
|
|
npm run dev : Lance l'application en mode développement.
|
|
npm run build : Crée une version optimisée de l'application pour la production.
|
|
npm run preview : Prévisualise l'application en mode production après la construction.
|
|
Contribution
|
|
|
|
Si vous souhaitez contribuer à ce projet, voici quelques étapes pour commencer :
|
|
|
|
Forkez ce dépôt sur GitHub.
|
|
Clonez votre fork localement.
|
|
Créez une nouvelle branche pour vos modifications :
|
|
```bash
|
|
git checkout -b nom-de-votre-branche
|
|
```
|
|
Apportez vos modifications.
|
|
Commitez vos changements :
|
|
```bash
|
|
git commit -m "Description des modifications"
|
|
```
|
|
Poussez vos changements sur votre fork :
|
|
git push origin nom-de-votre-branche
|
|
Ouvrez une Pull Request pour proposer vos modifications.
|
|
License
|
|
|
|
Ce projet est sous licence MIT - voir le fichier LICENSE pour plus de détails.
|
|
|
|
Merci d'utiliser ce projet et bonne utilisation ! 🚀
|
|
|
|
|
|
---
|
|
|
|
### Explication du contenu :
|
|
- **Prérequis** : Indique les outils nécessaires pour faire fonctionner le projet (Node.js, Git).
|
|
- **Récupérer le projet** : Explique comment cloner le projet depuis GitHub.
|
|
- **Installation des dépendances** : Donne la commande pour installer les dépendances via `npm`.
|
|
- **Lancer l'application** : Détaille les commandes pour lancer l'application en mode développement et production.
|
|
- **Structure du projet** : Présente l'arborescence du projet pour mieux comprendre sa structure.
|
|
- **Commandes utiles** : Liste des commandes npm pour les tâches courantes.
|
|
- **Contribution** : Explique comment contribuer au projet si d'autres développeurs souhaitent participer.
|
|
- **License** : Mentionne la licence du projet, à ajuster si nécessaire.
|
|
|
|
Cela devrait aider n'importe quel développeur à récupérer et à lancer facilement ton |