diff --git a/GrossesMitaines/grosses-mitaines-ui/src/pages/Register.js b/GrossesMitaines/grosses-mitaines-ui/src/pages/Register.js
index 6443b8c..160d10a 100644
--- a/GrossesMitaines/grosses-mitaines-ui/src/pages/Register.js
+++ b/GrossesMitaines/grosses-mitaines-ui/src/pages/Register.js
@@ -1,70 +1,86 @@
 import { useState } from "react";
 import { Button } from "react-bootstrap";
+import { useForm } from "react-hook-form";
 
-const Register = () => {
+// const Register = () => {
 
-    //const [username, setUsername] = useState("");
-    //const [password, setPassword] = useState("");
+//     //const [username, setUsername] = useState("");
+//     //const [password, setPassword] = useState("");
 
-    const handleLogin = async (e) => {
-        e.preventDefault();
+//     // const handleLogin = async (e) => {
+//     //     e.preventDefault();
 
-        const response = await fetch(`https://localhost:7292/api/Login?rememberme=true`, {
-            method: 'POST',
-            headers: {
-                'Accept': 'application/json',
-                'Content-Type': 'application/json'
-            },
-            //body: JSON.stringify({ username, password })
-        })  
+//     //     const response = await fetch(`https://localhost:7292/api/Login?rememberme=true`, {
+//     //         method: 'POST',
+//     //         headers: {
+//     //             'Accept': 'application/json',
+//     //             'Content-Type': 'application/json'
+//     //         },
+//     //         //body: JSON.stringify({ username, password })
+//     //     })  
 
-        // Partie de display d'erreur ou de redirection (faudrait checker pour se faire un state de connexion).
+//         // Partie de display d'erreur ou de redirection (faudrait checker pour se faire un state de connexion).
 
-    }
+//     }
 
-    return (
+export default function App() {
+    const { register, handleSubmit, watch, formState: { errors } } = useForm();
+    const onSubmit = data => console.log(data);
+return (
         <div className="inventaire-form-container">
-            <form className="form-horizontal" onSubmit={handleLogin}>
+            <form onSubmit={handleSubmit(onSubmit)}>
                 <h4 className="text-center">Nouvel utilisateur</h4>
+                <div className="Error_color">
                 <div className="form-group">
                     <label>Prénom: </label>
-                    <input type='text' className="form-control form-input"
-                        placeholder="Votre prénom..."/>
+                    <input placeholder="Votre prénom:" {...register("Prénom", { required: true, minLength: 2})} />
+                </div>
+                <div>
+                    {errors.Prénom && errors.Prénom.type === 'required' && <span>Vous devez entrer votre prénom!</span>}
+                    {errors.Prénom && errors.Prénom.type === 'minLength' && <span>Votre prénom doit avoir au moins 2 lettres!</span>}
                 </div>
                 <div className="form-group">
                     <label>Nom: </label>
-                    <input type='text' className="form-control form-input"
-                        placeholder="Votre Nom..."/>
+                    <input placeholder="Votre nom:" {...register("Nom", { required: true, minLength: 2})} />
+                </div>
+                <div>
+                    {errors.Nom && errors.Nom.type === 'required' && <span>Vous devez entrer votre nom!</span>}
+                    {errors.Nom && errors.Nom.type === 'minLength' && <span>Votre nom doit avoir au moins 2 lettres!</span>}
                 </div>
                 <div className="form-group">
                     <label>Numéro de téléphone: </label>
-                    <input type='text' className="form-control form-input"
-                        placeholder="Votre numéro de téléphone..."/>
+                    <input placeholder="Exemple: 111-111-1111" {...register("Téléphone", { required: true, pattern: /^[0-9]{3}-[0-9]{3}-[0-9]{4}$/ })} />
                 </div>
+                {errors.Téléphone && errors.Téléphone.type === 'required' && <span>Vous devez entrer un numéro de téléphone!</span>}
+                {errors.Téléphone && errors.Téléphone.type === 'pattern' && <span>Téléphone non valide!</span>}
                 <div className="form-group">
                     <label>Adresse civique: </label>
-                    <input type='text' className="form-control form-input"
-                        placeholder="Votre adresse..."/>
+                    <input placeholder="Votre adresse:" {...register("Adresse", { required: true })} />
                 </div>
+                {errors.Adresse && errors.Adresse.type === 'required' && <span>Vous devez entrer une adresse!</span>}
                 <div className="form-group">
                     <label>Adresse courriel: </label>
-                    <input type='text' className="form-control form-input"
-                        placeholder="Votre adresse courrirel..."/>
+                    <input placeholder="Votre courriel" {...register("Email", { required: true, pattern: /^[A-Za-z0-9+_.-]+@(.+)$/ })} />
+                </div>
+                <div>
+                {errors.Email && errors.Email.type === 'required' && <span>Vous devez entrer une adresse courriel!</span>}
+                {errors.Email && errors.Email.type === 'pattern' && <span>Adresse courriel non valide!</span>}
                 </div>
                 <div className="form-group">
                     <label>Mot de passe: </label>
-                    <input type='password' className="form-control form-input"
-                        placeholder="Mot de passe..."/>
+                    <input placeholder="Mot de passe..." {...register("MotPasse", { required: true, minLength: 5})} />
+                </div>
+                <div>
+                    {errors.MotPasse && errors.MotPasse.type === 'required' && <span>Vous devez entrer un mot de passe!</span>}
+                    {errors.MotPasse && errors.MotPasse.type === 'minLength' && <span>Votre mot de passe doit avoir au moins 5 caractères!</span>}
                 </div>
                 <div className="form-group">
                     <label>Pour un acount admin, entrer le mot de passe. Sinon laisser vide: </label>
-                    <input type='password' className="form-control form-input"
-                        placeholder="Mot de passe admin..."/>
+                    <input placeholder="Mot de passe admin..." {...register("MotPasseAdmin", { minLength: 0})} />
+                </div>
                 </div>
                 <Button className="btn-primary btn-ajouter-morceau" type="submit" >Confirmer</Button>
             </form>
         </div>
     )
-}
-
-export default Register;
\ No newline at end of file
+}
\ No newline at end of file
diff --git a/GrossesMitaines/grosses-mitaines-ui/src/stylesheets/site.css b/GrossesMitaines/grosses-mitaines-ui/src/stylesheets/site.css
index 4aba815..9db1879 100644
--- a/GrossesMitaines/grosses-mitaines-ui/src/stylesheets/site.css
+++ b/GrossesMitaines/grosses-mitaines-ui/src/stylesheets/site.css
@@ -634,6 +634,10 @@ a {
     margin-bottom: 10px;
 }
 
+.form-group input {
+    width: 100%;
+}
+
 .simple-item-top-container {
     display: flex;
 }