Module 2 : Introduction à React

React est une bibliothèque JavaScript pour construire des interfaces utilisateur. Ce module vous présente les concepts fondamentaux.

Pourquoi React ?

React a été créé par Facebook pour résoudre un problème : comment gérer des interfaces complexes qui changent fréquemment ?

Avantages de React :

  • Composants réutilisables : découper l'UI en morceaux indépendants
  • Virtual DOM : performances optimisées automatiquement
  • Flux de données unidirectionnel : prévisibilité et debugging facilité
  • Écosystème riche : énorme communauté et nombreuses bibliothèques

Chapitres

# Chapitre Contenu
1 Philosophie React Composants vs templates, Virtual DOM, flux de données
2 JSX Syntaxe, expressions, conditions, boucles
3 Composants Composants fonctionnels, props, composition

Objectifs du module

À la fin de ce module, vous saurez :

  • Comprendre la philosophie et l'architecture de React
  • Écrire du JSX correctement
  • Créer des composants fonctionnels
  • Passer des données via les props
  • Composer des composants entre eux

Différence fondamentale avec PHP

En PHP, vous générez du HTML côté serveur :

<?php foreach ($users as $user): ?>
    <div class="user"><?= $user['name'] ?></div>
<?php endforeach; ?>

En React, vous décrivez ce que l'UI devrait être en fonction des données :

function UserList({ users }) {
    return (
        <div>
            {users.map(user => (
                <div className="user" key={user.id}>{user.name}</div>
            ))}
        </div>
    );
}

React se charge de mettre à jour le DOM quand les données changent.

Temps estimé

Environ 2-3 heures pour parcourir ce module et faire les exercices.

Commencer : Philosophie React ->