- Créer un compte github pour tous les membres des équipes: https://github.com/
- Créer un compte Netlify par équipe: https://www.netlify.com/
- Cloner le repo :
git clone git@github.com:emmanuelgratuze/mmi-react-course-p2021.git - Installer les dépendances :
npm install - Démarrer le projet:
npm start - Les fichiers des exercices se trouve dans :
./src/exercices
- Forker : https://github.com/emmanuelgratuze/mmi-react-course-p2021-project-base ou
- Créer son repository de zéro et créer sa propre base de projet (de préférence avec create-react-app)
Vous pouvez passer cette étape si vous avez déjà une clé SSH configurée avec votre compte Github
- Générer une clé SSH et ajouter l'ajouter à notre compte Github: https://docs.github.com/en/free-pro-team@latest/github/authenticating-to-github/generating-a-new-ssh-key-and-adding-it-to-the-ssh-agent
- Récupérer le code :
git clone <url du repository>L'URL du repo se trouve sur la page de votre projet forké. Elle devrait être au format :git@github.com:<votre-username-github>/mmi-react-course-p2021-project-base.git - Installer les dépendances :
npm install
- Modifier par exemple
src/pages/Homeen ajoutant une ligne ou n'importe quel contenu git status(optionnel : vérifie les modifications en cours). Vous devriez voir apparaître le fichiersrc/pages/Homeque vous venez de modifiergit add -A(sélectionne toutes les modifications que l'on vient de faire)git statusde nouveau (optionnel). Le nom du fichiersrc/pages/Homeest normalement maintenant vert ce qui signifie qu'il est sélectionnégit commit -m "Our first commit"(crée le commit en local)git push origin main(envoie le commit que l'on vient de faire sur la branche "main" de notre dépot) Si quelqu'un de l'équipe a déjà envoyé un commit avant, il faut le récupérer avant de pouvoir pousser le sien :git pull origin main(récupère les derniers commits sur la branche "main")- Le cas échéant... résoudre les conflits 🤪 et lancer de nouveau la précédente commande
- https://www.netlify.com/ Conseil: utiliser son compte Github, c'est plus simple 😎
- Depuis le dashboard, cliquer sur "Create new site"
- Sélectionner Github comme "Git provider"
- Autoriser l'application depuis la fenêtre qui vient de s'ouvrir
- Sélectionner le repository forké précédemment
- Laisser les champs du formulaire qui suit tels quels et cliquer sur "Deploy site"
Si le projet n'est pas créé à partir de celui de
mmi-react-course-p2021-project-base, vérifiez bien que la commande de build "Build command" et la destination vers les fichiers buildés "Publish directory" sont corrects. - Attendre la fin du déploiement et vérifier que le site fonctionne correctement
- Nous communiquer l'URL de votre site 🙂
public: Les fichiers qu'il contient ne sont pas compilés et sont copiés à la racine de mon site.
Exemple : si on crée un fichier public/image.jpg, alors ce fichier sera accessible ici :
http://localhost:3000/image.jpgen développement (local)https://votre.site.sur.netlify.com/image.jpgen production (sur Netlify)
src/: Emplacement de vos fichiers Javascript et de style. Aucune arborescence n'est imposée.
craco.config.js: Configuration Craco
node_modules: Emplacement des paquets installés via NPM
.env et .env.local: Permettent la définition de variables d'environnement
.gitignore: Liste des fichiers que l'on ne souhaite pas envoyer sur git
package.json: Fichier de configuration de NPM
-
Create React fournit la configuration de base au projet. Documentation
-
On utilise Craco pour configurer CRA, via le fichier
craco.config.jsprésent à la racine du projet. Documentation