Web
5$/h – Techniques et outils modernes pour le développement web – React et Next.js
Objectifs:
Cette formation pratique de 40 heures vous apprendra à concevoir, programmer et déployer une application Web dans l’écosystème React et Next.js. Vous réaliserez progressivement une application complète comprenant une interface interactive, une partie serveur, une API, une base de données et un accès protégé.
Un projet fil conducteur, par exemple une application de finances personnelles gamifiées, permettra de mettre les notions en pratique. Git, GitHub, Tailwind CSS, les outils de test et de déploiement ainsi que des assistants de programmation fondés sur l’intelligence artificielle seront utilisés pendant la formation. L’IA sera abordée comme un outil de développement : vous programmerez, lirez et modifierez le code, puis vérifierez les solutions proposées.
Contenu du cours:
Séance 1 – Fondements du Web et introduction à React et Next.js : revoir HTML, CSS, JavaScript et le fonctionnement client-serveur afin de comprendre l’environnement dans lequel l’application sera développée.
Séance 2 – Premier composant React : créer le projet et construire une première interface à partir de composants réutilisables.
Séance 3 – État et interactions : gérer les données de l’interface, les événements, les listes et l’affichage conditionnel afin de rendre l’application interactive.
Séance 4 – Formulaires et organisation du code : créer des formulaires, valider les informations saisies et structurer l’application React.
Séance 5 – Architecture de Next.js : organiser la navigation et comprendre la répartition du travail entre le navigateur et le serveur.
Séance 6 – Interface avec Tailwind CSS : concevoir une interface cohérente, adaptée aux différents formats d’écran et accessible.
Séance 7 – API et base de données : relier l’interface au serveur afin d’enregistrer, de consulter et de modifier les données.
Séance 8 – Authentification et autorisation : créer un espace personnel et protéger l’accès aux données.
Séance 9 – Qualité, tests et introduction à TypeScript : tester et déboguer l’application, vérifier les versions utilisées et découvrir les principales différences entre JavaScript et TypeScript.
Séance 10 – Déploiement et documentation : mettre l’application en ligne, vérifier son fonctionnement et documenter le projet.
Git, GitHub, la documentation officielle et les assistants de programmation fondés sur l’IA seront utilisés tout au long du projet. Une attention particulière sera accordée à la compréhension du code, à la vérification des solutions proposées et à la détection du code ou des exemples reposant sur des versions dépassées.
Préalables
Pour garantir une bonne compréhension de la matière durant le cours, il est recommandé d’avoir au moins des connaissances de base dans les domaines suivants :
- Les fondamentaux du web : adresse web, URL, architecture client-serveur, internet
- Les fondamentaux de la programmation : fonction, variable, structures de décisions et de contrôle
- Les bases du HTML
Matériel requis
Le cours peut se faire sur Mac ou PC. Il faut simplement une bonne connexion internet et 2 GB d’espace disque dur. Pour l’ordinateur : un CPU de moins de 8 ans et 4GB de mémoire vive.