Introduction - Séance 1
Bienvenue dans le cours R4A10 - Compléments Web ! Cette première séance pose les fondations nécessaires pour maîtriser le développement frontend avec React.
Présentation du cours
Ce cours se compose de 5 séances de 3h30 each, progressant du JavaScript fondamental aux concepts avancés de React.
Plan des séances
-
Séance 1 - Bases JavaScript (cette séance)
- Rappels HTML/CSS/DOM
- JavaScript moderne ES6+
-
Séance 2 - Introduction à React
- JSX, Composants, Props
- Structure de projet
-
Séance 3 - useState
- Gestion d'état
- Événements et rendu conditionnel
-
Séance 4 - useEffect
- Cycle de vie des composants
- Appels API et async/await
-
Séance 5 - Architecture
- Bonnes pratiques
- Structure de projet
- Révisions
Règles du cours
Important
Voici les règles à respecter durant ce cours :
Présence et ponctualité
- 1 cours = 1 TP noté à rendre
- Retard de plus de 20 minutes = absence
- Tolérance le matin en cas de problème de transport
- Absences doivent être justifiées
Travail et évaluation
- Plagiat = note divisée par le nombre de personnes concernées
- L'IA est autorisée sur les TPs, mais attention aux erreurs !
- Travaillez de manière autonome et comprenez le code que vous soumettez
Outils recommandés
Éditeur de code : VSCode (recommandé)
- Mais vous pouvez utiliser celui que vous préférez
- Extensions utiles : ESLint, Prettier, ES7+ React snippets
Objectifs de cette séance
Ce que vous allez apprendre
À la fin de cette séance, vous serez capable de :
- Comprendre les fondamentaux du web (HTML, CSS, JavaScript)
- Utiliser la syntaxe JavaScript moderne (ES6+)
- Manipuler des tableaux et objets efficacement
- Écrire du code compatible avec React
- Collaborer efficacement avec l'IA pour coder
Pourquoi JavaScript moderne ?
L'importance des bases
Connaître les concepts JS = mieux collaborer avec l'IA
Cette année, l'IA peut vous aider à coder. Mais sans comprendre les fondamentaux, vous ne pourrez pas :
- Valider le code généré
- Déboguer les erreurs
- Donner des prompts précis
- Adapter les solutions à vos besoins
L'objectif : vous pilotez, l'IA exécute !