diff --git a/web/html/home.html b/web/html/user.html
similarity index 56%
rename from web/html/home.html
rename to web/html/user.html
index f61c705..e7176f0 100644
--- a/web/html/home.html
+++ b/web/html/user.html
@@ -87,14 +87,13 @@
 
     
 <header class="navbar navbar-dark sticky-top bg-dark flex-md-nowrap p-0 shadow">
-  <a class="navbar-brand col-md-3 col-lg-2 me-0 px-3 fs-6" href="#">Company name</a>
+  <a class="navbar-brand col-md-3 col-lg-2 me-0 px-3 fs-6"  href="/html/home.html"><- Retour à la liste</a>
   <button class="navbar-toggler position-absolute d-md-none collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#sidebarMenu" aria-controls="sidebarMenu" aria-expanded="false" aria-label="Toggle navigation">
     <span class="navbar-toggler-icon"></span>
   </button>
-  <input class="form-control form-control-dark w-100 rounded-0 border-0" type="text" placeholder="Search" aria-label="Search">
   <div class="navbar-nav">
     <div class="nav-item text-nowrap">
-      <a class="nav-link px-3" id="signout" href="#">Sign out</a>
+      <a class="nav-link px-3" id="signout" href="#">Deconnecté</a>
     </div>
   </div>
 </header>
@@ -111,69 +110,74 @@
             </a>
           </li>
           
-          
-         
+                   
         </ul>
 
-        <h6 class="sidebar-heading d-flex justify-content-between align-items-center px-3 mt-4 mb-1 text-muted text-uppercase">
-          <span>Saved reports</span>
-          <a class="link-secondary" href="#" aria-label="Add a new report">
-            <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-plus-circle align-text-bottom" aria-hidden="true"><circle cx="12" cy="12" r="10"></circle><line x1="12" y1="8" x2="12" y2="16"></line><line x1="8" y1="12" x2="16" y2="12"></line></svg>
-          </a>
-        </h6>
-        <ul class="nav flex-column mb-2">
-          <li class="nav-item">
-            <a class="nav-link" href="#">
-              <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-file-text align-text-bottom" aria-hidden="true"><path d="M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z"></path><polyline points="14 2 14 8 20 8"></polyline><line x1="16" y1="13" x2="8" y2="13"></line><line x1="16" y1="17" x2="8" y2="17"></line><polyline points="10 9 9 9 8 9"></polyline></svg>
-              Current month
-            </a>
-          </li>
-        </ul>
       </div>
     </nav>
 
     <main class="col-md-9 ms-sm-auto col-lg-10 px-md-4">
       <div class="d-flex justify-content-between flex-wrap flex-md-nowrap align-items-center pt-3 pb-2 mb-3 border-bottom">
         <h1 class="h2">Utilisateurs</h1>
-        <div class="btn-toolbar mb-2 mb-md-0">
-          <div class="btn-group me-2">
-            <button type="button" class="btn btn-sm btn-outline-secondary">Share</button>
-            <button type="button" class="btn btn-sm btn-outline-secondary">Export</button>
-          </div>
-          <button type="button" class="btn btn-sm btn-outline-secondary dropdown-toggle">
-            <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-calendar align-text-bottom" aria-hidden="true"><rect x="3" y="4" width="18" height="18" rx="2" ry="2"></rect><line x1="16" y1="2" x2="16" y2="6"></line><line x1="8" y1="2" x2="8" y2="6"></line><line x1="3" y1="10" x2="21" y2="10"></line></svg>
-            This week
-          </button>
-        </div>
       </div>
 
-      <h2>Liste d'utilisateur</h2>
-      <div class="table-responsive">
-        <table id=users class="table table-striped table-sm">
-          <thead>
-            <tr>
-              <th scope="col">ID</th>
-              <th scope="col">Pseudo</th>
-              <th scope="col">Mail</th>
-              <th scope="col">Rôle</th>
-              <th scope="col">Statut</th>
-            </tr>
-          </thead>
-          <tbody>
-            <tr>
-              <td></td>
-              <td></td>
-              <td></td>
-              <td></td>
-              <td><span class="activeStatus hidden">Activé</span><span class="disableStatus hidden">Désactivé</span><span class="confirmStatus hidden">En attente de confirmation</span><span class="removeStatus hidden">En attente de suppression</span><span class="unknownStatus hidden">Statut inconnu</span></td>
-            </tr>
-            
-          </tbody>
-        </table>
-        <div id="page" class="hidden">
-          <a href="#" id="previous">Précédent</a><span><a href="#"></a>1</span><a href="#" id="next">Suivant</a>
-        </div>
+      <h2>Utilisateur</h2>
+      <div class="input-group mb-3">
+        <span class="input-group-text" id="idUpdate">ID</span>
+        <input id="idUpdateInput" type="text" class="form-control" placeholder="" aria-label="Id" aria-describedby="idUpdate" disabled>
       </div>
+
+      <div class="input-group mb-3">
+        <span class="input-group-text" id="pseudoUpdate">Pseudo</span>
+        <input id="pseudoUpdateInput" type="text" class="form-control" placeholder="Pseudo" aria-label="Pseudo" aria-describedby="pseudoUpdate">
+      </div>
+
+      <div class="input-group mb-3">
+        <span class="input-group-text" id="nameUpdate">Nom</span>
+        <input id="nameUpdateInput" type="text" class="form-control" placeholder="Nom" aria-label="Nom" aria-describedby="nameUpdate">
+      </div>
+
+      <div class="input-group mb-3">
+        <span class="input-group-text" id="firstNameUpdate">Prenom</span>
+        <input id="firstNameUpdateInput" type="text" class="form-control" placeholder="Prenom" aria-label="Prenom" aria-describedby="firstNameUpdate">
+      </div>
+
+      <div class="input-group mb-3">
+        <span class="input-group-text" id="emailUpdate">Email</span>
+        <input id="emailUpdateInput" type="text" class="form-control" placeholder="Email" aria-label="Email" aria-describedby="emailUpdate">
+      </div>
+      
+
+      <div class="input-group mb-3">
+        <label class="input-group-text" for="rolesSelector">Roles</label>
+        <select class="form-select" id="rolesSelector">
+          <option value="Admin">Administrateur</option>
+          <option value="User">Utilisateur</option>
+        </select>
+      </div>
+
+
+      <div class="input-group mb-3">
+        <span class="input-group-text" id="birthUpdate">Date de naissance</span>
+        <input id="birthUpdateInput" type="date" class="form-control" placeholder="Date de naissance" aria-label="Date de naissance" aria-describedby="birthdateUpdate">
+      </div>
+
+      <div class="input-group mb-3">
+        <label class="input-group-text" for="statusSelector">Statut</label>
+        <select class="form-select" id="statusSelector" disabled>
+          <option value="-2" selected>Statut</option>
+          <option value="-1">En cours de suppression</option>
+          <option value="0">Desactivé</option>
+          <option value="1">Activé</option>
+          <option value="2">En attente de validation</option>
+        </select>
+      </div>
+
+      
+     
+     
+
+      
     </main>
   </div>
 </div>
@@ -185,5 +189,5 @@
   
       <script src="../js/config.js"></script>
       <script src="../js/library.js"></script>
-      <script src="../js/home.js"></script>
+      <script src="../js/user.js"></script>
 </body></html>
\ No newline at end of file
diff --git a/web/html/users.html b/web/html/users.html
index b17ae9f..7418523 100644
--- a/web/html/users.html
+++ b/web/html/users.html
@@ -87,13 +87,14 @@
 
     
 <header class="navbar navbar-dark sticky-top bg-dark flex-md-nowrap p-0 shadow">
-  <a class="navbar-brand col-md-3 col-lg-2 me-0 px-3 fs-6"  href="/html/home.html"><- Retour à la liste</a>
+  <a class="navbar-brand col-md-3 col-lg-2 me-0 px-3 fs-6" href="#">Company name</a>
   <button class="navbar-toggler position-absolute d-md-none collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#sidebarMenu" aria-controls="sidebarMenu" aria-expanded="false" aria-label="Toggle navigation">
     <span class="navbar-toggler-icon"></span>
   </button>
+  <input class="form-control form-control-dark w-100 rounded-0 border-0" type="text" placeholder="Search" aria-label="Search">
   <div class="navbar-nav">
     <div class="nav-item text-nowrap">
-      <a class="nav-link px-3" id="signout" href="#">Deconnecté</a>
+      <a class="nav-link px-3" id="signout" href="#">Sign out</a>
     </div>
   </div>
 </header>
@@ -110,74 +111,69 @@
             </a>
           </li>
           
-                   
+          
+         
         </ul>
 
+        <h6 class="sidebar-heading d-flex justify-content-between align-items-center px-3 mt-4 mb-1 text-muted text-uppercase">
+          <span>Saved reports</span>
+          <a class="link-secondary" href="#" aria-label="Add a new report">
+            <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-plus-circle align-text-bottom" aria-hidden="true"><circle cx="12" cy="12" r="10"></circle><line x1="12" y1="8" x2="12" y2="16"></line><line x1="8" y1="12" x2="16" y2="12"></line></svg>
+          </a>
+        </h6>
+        <ul class="nav flex-column mb-2">
+          <li class="nav-item">
+            <a class="nav-link" href="#">
+              <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-file-text align-text-bottom" aria-hidden="true"><path d="M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z"></path><polyline points="14 2 14 8 20 8"></polyline><line x1="16" y1="13" x2="8" y2="13"></line><line x1="16" y1="17" x2="8" y2="17"></line><polyline points="10 9 9 9 8 9"></polyline></svg>
+              Current month
+            </a>
+          </li>
+        </ul>
       </div>
     </nav>
 
     <main class="col-md-9 ms-sm-auto col-lg-10 px-md-4">
       <div class="d-flex justify-content-between flex-wrap flex-md-nowrap align-items-center pt-3 pb-2 mb-3 border-bottom">
         <h1 class="h2">Utilisateurs</h1>
+        <div class="btn-toolbar mb-2 mb-md-0">
+          <div class="btn-group me-2">
+            <button type="button" class="btn btn-sm btn-outline-secondary">Share</button>
+            <button type="button" class="btn btn-sm btn-outline-secondary">Export</button>
+          </div>
+          <button type="button" class="btn btn-sm btn-outline-secondary dropdown-toggle">
+            <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-calendar align-text-bottom" aria-hidden="true"><rect x="3" y="4" width="18" height="18" rx="2" ry="2"></rect><line x1="16" y1="2" x2="16" y2="6"></line><line x1="8" y1="2" x2="8" y2="6"></line><line x1="3" y1="10" x2="21" y2="10"></line></svg>
+            This week
+          </button>
+        </div>
       </div>
 
-      <h2>Utilisateur</h2>
-      <div class="input-group mb-3">
-        <span class="input-group-text" id="idUpdate">ID</span>
-        <input id="idUpdateInput" type="text" class="form-control" placeholder="" aria-label="Id" aria-describedby="idUpdate" disabled>
+      <h2>Liste d'utilisateur</h2>
+      <div class="table-responsive">
+        <table id=users class="table table-striped table-sm">
+          <thead>
+            <tr>
+              <th scope="col">ID</th>
+              <th scope="col">Pseudo</th>
+              <th scope="col">Mail</th>
+              <th scope="col">Rôle</th>
+              <th scope="col">Statut</th>
+            </tr>
+          </thead>
+          <tbody>
+            <tr>
+              <td></td>
+              <td></td>
+              <td></td>
+              <td></td>
+              <td><span class="activeStatus hidden">Activé</span><span class="disableStatus hidden">Désactivé</span><span class="confirmStatus hidden">En attente de confirmation</span><span class="removeStatus hidden">En attente de suppression</span><span class="unknownStatus hidden">Statut inconnu</span></td>
+            </tr>
+            
+          </tbody>
+        </table>
+        <div id="page" class="hidden">
+          <a href="#" id="previous">Précédent</a><span><a href="#"></a>1</span><a href="#" id="next">Suivant</a>
+        </div>
       </div>
-
-      <div class="input-group mb-3">
-        <span class="input-group-text" id="pseudoUpdate">Pseudo</span>
-        <input id="pseudoUpdateInput" type="text" class="form-control" placeholder="Pseudo" aria-label="Pseudo" aria-describedby="pseudoUpdate">
-      </div>
-
-      <div class="input-group mb-3">
-        <span class="input-group-text" id="nameUpdate">Nom</span>
-        <input id="nameUpdateInput" type="text" class="form-control" placeholder="Nom" aria-label="Nom" aria-describedby="nameUpdate">
-      </div>
-
-      <div class="input-group mb-3">
-        <span class="input-group-text" id="firstNameUpdate">Prenom</span>
-        <input id="firstNameUpdateInput" type="text" class="form-control" placeholder="Prenom" aria-label="Prenom" aria-describedby="firstNameUpdate">
-      </div>
-
-      <div class="input-group mb-3">
-        <span class="input-group-text" id="emailUpdate">Email</span>
-        <input id="emailUpdateInput" type="text" class="form-control" placeholder="Email" aria-label="Email" aria-describedby="emailUpdate">
-      </div>
-      
-
-      <div class="input-group mb-3">
-        <label class="input-group-text" for="rolesSelector">Roles</label>
-        <select class="form-select" id="rolesSelector">
-          <option value="Admin">Administrateur</option>
-          <option value="User">Utilisateur</option>
-        </select>
-      </div>
-
-
-      <div class="input-group mb-3">
-        <span class="input-group-text" id="birthUpdate">Date de naissance</span>
-        <input id="birthUpdateInput" type="date" class="form-control" placeholder="Date de naissance" aria-label="Date de naissance" aria-describedby="birthdateUpdate">
-      </div>
-
-      <div class="input-group mb-3">
-        <label class="input-group-text" for="statusSelector">Statut</label>
-        <select class="form-select" id="statusSelector" disabled>
-          <option value="-2" selected>Statut</option>
-          <option value="-1">En cours de suppression</option>
-          <option value="0">Desactivé</option>
-          <option value="1">Activé</option>
-          <option value="2">En attente de validation</option>
-        </select>
-      </div>
-
-      
-     
-     
-
-      
     </main>
   </div>
 </div>
diff --git a/web/js/home.js b/web/js/home.js
deleted file mode 100644
index 43be496..0000000
--- a/web/js/home.js
+++ /dev/null
@@ -1,65 +0,0 @@
-checkToken();
-signOut();
-
-var nbPages = 20;
-
-instance.get("users/count",  { withCredentials: true }).then(function(response){
-   
-    var count = response.data / nbPages;
-    var reste = response.data % nbPages;
-    var total = 0;
-    if(reste != 0){
-      total = Number.parseInt(count) + 1;
-    }
-
-    if(total > 1){
-
-      document.getElementById("page").classList.remove("hidden");
-
-    }
-
-});
-
-instance.get("users", {withCredentials: true, params :{ page:0, nbPages: nbPages}}).then(function(response){
-  var trTag = document.querySelector("#users tbody tr").cloneNode(true);
-  listData = response.data;
-  for (var i=0; i<listData.length; i++){
-    if(i != 0){
-      document.querySelector("#users tbody").append(trTag);
-    }
-    var trAll = document.querySelectorAll("#users tbody tr")
-    td = trAll[i].querySelectorAll("td");
-    td[0].textContent = listData[i].id;
-    td[1].textContent = listData[i].pseudo
-    td[2].textContent = listData[i].email
-    td[3].textContent = listData[i].roles
-    var classTd = "";
-    switch(listData[i].status){
-      case 1:
-        classTd = ".activeStatus";
-        break;
-      case 0:
-        classTd = ".disableStatus";
-        break;
-      case 2:
-        classTd = ".confirmStatus";
-        break;
-      case -1:
-        classTd = ".removeStatus";
-        break;
-      default:
-        classTd = ".unknownStatus"
-        break;
-    }
-    td[4].querySelector(classTd).classList.remove("hidden");
-    
-    trAll[i].addEventListener("click", function(e){
-      var id = e.currentTarget.querySelector("td").textContent;
-      location.href="/html/users.html?id="+id;
-    });
-
-  }
-});
-
-
-
diff --git a/web/js/library.js b/web/js/library.js
index 0484536..739aff5 100644
--- a/web/js/library.js
+++ b/web/js/library.js
@@ -4,7 +4,7 @@ function checkToken(){
     .then(function(response) { 
         if(location.pathname == "/") 
         { 
-            location.href="/html/home.html"; 
+            location.href="/html/users.html"; 
         }
     })
     .catch(function(error){
diff --git a/web/js/login.js b/web/js/login.js
index b19fc5b..51bd52d 100644
--- a/web/js/login.js
+++ b/web/js/login.js
@@ -7,7 +7,7 @@ document.getElementById("signin").addEventListener("submit", function(evt){
     var password = document.getElementById("floatingPassword");
     if((password.value.length > 0) || (pseudo.value.length > 0)){
         instance.get("token", { auth : {username: pseudo.value, password: password.value}, withCredentials: true})
-            .then(function(response) { location.href="html/home.html"; })
+            .then(function(response) { location.href="html/users.html"; })
             .catch(function(error){
 
                 switch (error.response.status){
diff --git a/web/js/user.js b/web/js/user.js
new file mode 100644
index 0000000..78daf72
--- /dev/null
+++ b/web/js/user.js
@@ -0,0 +1,29 @@
+checkToken();
+signOut();
+var id = getQuery("id");
+
+if(id.length > 0){
+    instance.get("users/"+id, {withCredentials: true})
+        .then(function(response){
+            var listValue = [ "id", "pseudo", "name", "firstName", "email", "birth"];
+            for (var i=0; i<listValue.length; i++){
+                document.getElementById(listValue[i]+"UpdateInput").value=response.data[listValue[i]];
+            }
+
+            
+            var listSelector = ["roles", "status"];
+            for (var i=0; i<listSelector.length; i++){
+                var select = document.getElementById(listSelector[i]+"Selector").querySelectorAll("option");
+                for (var j=0; j<select.length; j++){
+                    if(select[j].value == response.data[listSelector[i]]){
+                        select[j].setAttribute("selected", true);
+                    }
+                }
+            }
+            
+        })
+        .catch(function(error){
+            console.log(error);
+
+        });
+}
\ No newline at end of file
diff --git a/web/js/users.js b/web/js/users.js
index 78daf72..43be496 100644
--- a/web/js/users.js
+++ b/web/js/users.js
@@ -1,29 +1,65 @@
 checkToken();
 signOut();
-var id = getQuery("id");
 
-if(id.length > 0){
-    instance.get("users/"+id, {withCredentials: true})
-        .then(function(response){
-            var listValue = [ "id", "pseudo", "name", "firstName", "email", "birth"];
-            for (var i=0; i<listValue.length; i++){
-                document.getElementById(listValue[i]+"UpdateInput").value=response.data[listValue[i]];
-            }
+var nbPages = 20;
+
+instance.get("users/count",  { withCredentials: true }).then(function(response){
+   
+    var count = response.data / nbPages;
+    var reste = response.data % nbPages;
+    var total = 0;
+    if(reste != 0){
+      total = Number.parseInt(count) + 1;
+    }
+
+    if(total > 1){
+
+      document.getElementById("page").classList.remove("hidden");
+
+    }
+
+});
+
+instance.get("users", {withCredentials: true, params :{ page:0, nbPages: nbPages}}).then(function(response){
+  var trTag = document.querySelector("#users tbody tr").cloneNode(true);
+  listData = response.data;
+  for (var i=0; i<listData.length; i++){
+    if(i != 0){
+      document.querySelector("#users tbody").append(trTag);
+    }
+    var trAll = document.querySelectorAll("#users tbody tr")
+    td = trAll[i].querySelectorAll("td");
+    td[0].textContent = listData[i].id;
+    td[1].textContent = listData[i].pseudo
+    td[2].textContent = listData[i].email
+    td[3].textContent = listData[i].roles
+    var classTd = "";
+    switch(listData[i].status){
+      case 1:
+        classTd = ".activeStatus";
+        break;
+      case 0:
+        classTd = ".disableStatus";
+        break;
+      case 2:
+        classTd = ".confirmStatus";
+        break;
+      case -1:
+        classTd = ".removeStatus";
+        break;
+      default:
+        classTd = ".unknownStatus"
+        break;
+    }
+    td[4].querySelector(classTd).classList.remove("hidden");
+    
+    trAll[i].addEventListener("click", function(e){
+      var id = e.currentTarget.querySelector("td").textContent;
+      location.href="/html/users.html?id="+id;
+    });
+
+  }
+});
+
 
-            
-            var listSelector = ["roles", "status"];
-            for (var i=0; i<listSelector.length; i++){
-                var select = document.getElementById(listSelector[i]+"Selector").querySelectorAll("option");
-                for (var j=0; j<select.length; j++){
-                    if(select[j].value == response.data[listSelector[i]]){
-                        select[j].setAttribute("selected", true);
-                    }
-                }
-            }
-            
-        })
-        .catch(function(error){
-            console.log(error);
 
-        });
-}
\ No newline at end of file