https://cegepmv.github.io/420-211/3-apps-dynamiques/3-formulaires/index.htmlUn des outils permettant à une application dynamique de récupérer des données entrées par un utilisateur sont les formulaires. Ces données sont le plus souvent envoyées à un serveur (API) pour y être traitées. Exemple de cas d’utilisation de formulaires : Inscription à une application Connexion à un site Les bases ​ App.jsx index.css function App() { return ( <section className="container"> <h2>Inscription</h2> <form className="form"> <label htmlFor="email">Email :</label> <input type="email" id="email" name="email" placeholder="john-doe@exemple.com" /> <label htmlFor="password">Mot de passe :</label> <input type="password" id="password" name="password" /> <button className="submit-btn">Inscription</button> </form> </section> ) } export default App * { margin: 0; padding: 0; } body{ background-color: #2CA1CC; font-family: 'Roboto', sans-serif; } .container{ width: 400px; margin: auto; margin-top: 50px; padding-bottom: 30px; background-color: #fff; border-radius:5px; color: #1F1F1F; } .container h2 { padding: 20px; text-align: center; } .form { display: flex; flex-direction: column; margin: 10px 40px 0; } .form input { margin: 10px 0 20px; padding: 10px; width:90%; background-color: #EAEDF2; border: none; border-radius:3px; color:#A0A0A0; } .form textarea { resize: none; margin: 10px 0 20px; padding: 10px; width:90%; height: 15vh; background-color: #EAEDF2; border: none; border-radius:3px; color:#A0A0A0; } .form fieldset { display: flex; flex-direction: column; border: none; margin: 10px 0; } .form fieldset legend { margin-bottom: 5px; } .form fieldset input { width:fit-content; margin: 10px 10px 7px 2px; } .form fieldset label { width:fit-content; } .form .submit-btn { border:none; padding: 10px; border-radius:5px; color:#F7F6FF; cursor: pointer; width: 96%; margin-bottom:10px; margin-top: 20px; background-color: #19B8D6; height: 37px; } Toutes les entrées d’un formulaire doivent être à l’intérieur d’une balise <form>Hugofr-fr