diff --git a/bin/auth.js b/bin/auth.js
index 01121a6..9ebfe78 100644
--- a/bin/auth.js
+++ b/bin/auth.js
@@ -23,7 +23,6 @@ module.exports.check = function(token) {
     })
 
     if(isApproved) {
-        alog.log("Connexion par Token de l'utilisateur : " + username)
         return true
     } else {
         if(token) {
@@ -88,4 +87,27 @@ module.exports.signout = function(token) {
         return false
     }
 
+}
+
+module.exports.getUserByToken = function(token) {
+    var isApproved = false;
+    var userGetted = null
+    users.getUsers().forEach((fetchUser) => {
+        if(fetchUser.tokens.includes(token)) {
+            userGetted = fetchUser
+        }
+
+    })
+
+    if(userGetted) {
+        return userGetted
+
+    } else {
+        if(token) {
+
+            alog.warn("Erreur d'authentification - Token n'existe pas : " + token)
+        }
+        return false
+    }
+
 }
\ No newline at end of file
diff --git a/bin/global-variables.js b/bin/global-variables.js
index 802b003..a4d275d 100644
--- a/bin/global-variables.js
+++ b/bin/global-variables.js
@@ -5,6 +5,7 @@ const __glob = {
     ROUTES: root + path.sep + "routes" + path.sep,
     ROOT: root,
     LOGS: root + path.sep + "logs",
+    ICON: root + path.sep + "public" + path.sep + 'images' + path.sep + "FormatLogo_WHITE.ico",
     DATA: root + path.sep + "data",
     USERS: root + path.sep + "data" + path.sep + "users.json",
     CONFIG: root + path.sep + "data" + path.sep + "config.json"
diff --git a/bin/server.js b/bin/server.js
new file mode 100644
index 0000000..921d23a
--- /dev/null
+++ b/bin/server.js
@@ -0,0 +1,78 @@
+const { LogType } = require("loguix")
+const fs = require("fs")
+const path = require("path")
+const { __glob } = require("./global-variables")
+const auth = require("./auth")
+const plog = new LogType("Web")
+const cook = require("cookie")
+const http = require("http")
+
+/**
+ * NOTE INTERNE
+ * 
+ * Changer les pictures de users autre part
+ */
+
+/**
+ * 
+ * @param {http.Server} server 
+ */
+
+module.exports.serverIO = function(server) {
+
+    const io = require('socket.io')(server)
+
+    io.on("connection", (socket) => {
+        let token = cook.parse(socket.handshake.headers.cookie).token
+        const user = auth.getUserByToken(token)
+
+        if(user) {
+            plog.log("Connexion au panel par '" + user.username + "' avec le socket : " + socket.id)
+            user.setLastLogin(new Date())
+            /*
+            GET REQUEST
+            */ 
+
+            // Get Users
+            GetRequest("USERINFO", () => {
+
+                GetAnswer("USERINFO", {username: user.username, display_name: user.display_name ,picture: user.picture, permission: user.permission})
+            })
+
+    
+
+            socket.on("disconnect", () => {
+
+                plog.log("Déconnexion au panel par '" + user.username + "' avec le socket : " + socket.id)
+            })
+
+            function GetRequest(GQname, GQcallback) {
+                socket.on("GET/" + GQname, () => {
+    
+                    plog.log(user.username + " - Socket : " + socket.id  + " - GET/" + GQname + " - [RECIEVED]") 
+                    GQcallback()
+                })
+        
+            }
+    
+            function GetAnswer(GRname, GRvalue) {
+            
+                plog.log(user.username + " - Socket : " + socket.id  + " - GET/" + GRname + " - [ANSWERED]") 
+                socket.emit("ANSWER/GET/" + GRname, GRvalue)
+    
+            }
+
+        } else {
+
+            socket.disconnect()
+            plog.warn("Connexion directe vers le panel avec un token inexistant : " + this.token)
+        }
+        
+
+        
+    
+       
+    })
+
+
+}
diff --git a/bin/users.js b/bin/users.js
index feaa711..b0c954f 100644
--- a/bin/users.js
+++ b/bin/users.js
@@ -45,11 +45,40 @@ module.exports.fetchUsers = function () {
             permission: userFetched.permission,
             tokens: userFetched.tokens,
             lastLogin: userFetched.lastLogin,
+            picture: userFetched.picture
 
         })
 
         usersList.set(user.username, user)    
     }
+
+    if(usersList.size == 0) {
+        const adminUser = new this.User({
+            "username": "admin",
+            "password": "neutral",
+            "display_name": "Administrateur",
+            "permission": [
+                "FILES_EXPLORER",
+                "SERVICES",
+                "SERVERS",
+                "PIPELINES",
+                "METRICS",
+                "USERS",
+                "LINKS",
+                "SETTINGS"
+            ],
+            "tokens": [],
+            "lastLogin": "DEFAULT ACCOUNT",
+            "picture": "/images/users/default.jpg"
+          })
+    
+    
+          adminUser.register()
+      
+
+    }
+
+    
     ulog.step.end("fetch_user")
 }
 
@@ -64,7 +93,7 @@ module.exports.User =  class {
     permission = []
     tokens = [] 
     lastLogin = new Date()
-    
+    picture = "/images/users/default.jpg"
     
     constructor(properties) {
 
@@ -76,6 +105,7 @@ module.exports.User =  class {
             this.permission = properties.permission
             this.tokens = properties.tokens
             this.lastLogin = properties.lastLogin
+            this.picture = properties.picture
 
             const userFile = getFile()
         
@@ -123,7 +153,9 @@ module.exports.User =  class {
         if(this.lastLogin == null) {
             this.lastLogin = new Date()
         }
-      
+        if(this.picture == null) {
+            this.picture = "/images/users/default.jpg"
+        }
        
      
     }
@@ -251,6 +283,28 @@ module.exports.User =  class {
 
     }
 
+    setPicture(text) {
+        this.#sync()
+        this.picture = text
+        this.register()
+        ulog.log("La photo de l'utilisateur a été modifié : " + this.username) 
+
+    }
+
+    setDisplayName(text) {
+        this.#sync()
+        this.display_name = text
+        this.register()
+        ulog.log("Le nom d'affichage de l'utilisateur a été modifié : " + this.username) 
+
+    }
+
+    setLastLogin(text) {
+        this.#sync()
+        this.lastLogin = text
+        this.register()
+    }
+
     #sync() {
 
         for(var userGet of usersList.keys()) {
diff --git a/bin/www b/bin/www
index 1fed09d..6b9c341 100644
--- a/bin/www
+++ b/bin/www
@@ -8,15 +8,19 @@ var {LogType} = require("loguix")
 var { __glob } = require("./global-variables")
 log.setup(__glob.LOGS)
 
-const wlog = new LogType("Web")
+const wlog = new LogType("Serveur")
+
+if(process.env.DEV ) {
+
+  wlog.log("MODE DEVELOPEMENT ACTIF")
+}
 
 wlog.step.init("start_server",  "Démarrage du serveur Express JS")
 
 var app = require('../main');
-var debug = require('debug')('neutral:server');
 var http = require('http');
 var config = require("./config")
-
+var serverIO = require("./server")
 
 /**
  * Get port from environment and store in Express.
@@ -30,6 +34,7 @@ app.set('port', port);
  */
 
 var server = http.createServer(app);
+serverIO.serverIO(server)
 
 /**
  * Listen on provided port, on all network interfaces.
diff --git a/main.js b/main.js
index 1ff6e70..2834bf8 100644
--- a/main.js
+++ b/main.js
@@ -2,6 +2,7 @@ const createError = require('http-errors');
 const express = require('express');
 const path = require('path');
 const cookieParser = require('cookie-parser');
+const favicon = require('express-favicon');
 const app = express();
 const fs = require("fs");
 const log = require("loguix")
@@ -12,7 +13,7 @@ const {User} = require("./bin/users")
 
 
 
-var wlog = log.getInstance("Web")
+var wlog = log.getInstance("Serveur")
 
 
 
@@ -47,6 +48,7 @@ function setup() {
   app.use(express.urlencoded({ extended: false }));
   app.use(cookieParser());
   app.use(express.static(path.join(__dirname, 'public')));
+  app.use(favicon(__glob.ICON));
 
   getRouters()
   users.fetchUsers()
diff --git a/package-lock.json b/package-lock.json
index 8795ed3..32aed08 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -1,12 +1,12 @@
 {
   "name": "neutral",
-  "version": "0.1.1",
+  "version": "0.2.0",
   "lockfileVersion": 2,
   "requires": true,
   "packages": {
     "": {
       "name": "neutral",
-      "version": "0.1.1",
+      "version": "0.2.0",
       "license": "ISC",
       "dependencies": {
         "cookie-parser": "~1.4.4",
@@ -14,12 +14,40 @@
         "debug": "~2.6.9",
         "ejs": "~2.6.1",
         "express": "~4.16.1",
+        "express-favicon": "^2.0.4",
         "http-errors": "~1.6.3",
         "loguix": "1.4.1",
         "nodemon": "^3.0.1",
+        "socket.io": "^4.7.2",
         "uuid": "^9.0.1"
       }
     },
+    "node_modules/@socket.io/component-emitter": {
+      "version": "3.1.0",
+      "resolved": "https://registry.npmjs.org/@socket.io/component-emitter/-/component-emitter-3.1.0.tgz",
+      "integrity": "sha512-+9jVqKhRSpsc591z5vX+X5Yyw+he/HCB4iQ/RYxw35CEPaY1gnsNE43nf9n9AaYjAQrTiI/mOwKUKdUs9vf7Xg=="
+    },
+    "node_modules/@types/cookie": {
+      "version": "0.4.1",
+      "resolved": "https://registry.npmjs.org/@types/cookie/-/cookie-0.4.1.tgz",
+      "integrity": "sha512-XW/Aa8APYr6jSVVA1y/DEIZX0/GMKLEVekNG727R8cs56ahETkRAy/3DR7+fJyh7oUgGwNQaRfXCun0+KbWY7Q=="
+    },
+    "node_modules/@types/cors": {
+      "version": "2.8.15",
+      "resolved": "https://registry.npmjs.org/@types/cors/-/cors-2.8.15.tgz",
+      "integrity": "sha512-n91JxbNLD8eQIuXDIChAN1tCKNWCEgpceU9b7ZMbFA+P+Q4yIeh80jizFLEvolRPc1ES0VdwFlGv+kJTSirogw==",
+      "dependencies": {
+        "@types/node": "*"
+      }
+    },
+    "node_modules/@types/node": {
+      "version": "20.8.10",
+      "resolved": "https://registry.npmjs.org/@types/node/-/node-20.8.10.tgz",
+      "integrity": "sha512-TlgT8JntpcbmKUFzjhsyhGfP2fsiz1Mv56im6enJ905xG1DAYesxJaeSbGqQmAw8OWPdhyJGhGSQGKRNJ45u9w==",
+      "dependencies": {
+        "undici-types": "~5.26.4"
+      }
+    },
     "node_modules/abbrev": {
       "version": "1.1.1",
       "resolved": "https://registry.npmjs.org/abbrev/-/abbrev-1.1.1.tgz",
@@ -59,6 +87,14 @@
       "resolved": "https://registry.npmjs.org/balanced-match/-/balanced-match-1.0.2.tgz",
       "integrity": "sha512-3oSeUO0TMV67hN1AmbXsK4yaqU7tjiHlbxRDZOpH0KW9+CeX4bRAaX0Anxt0tx2MrpRpWwQaPwIlISEJhYU5Pw=="
     },
+    "node_modules/base64id": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/base64id/-/base64id-2.0.0.tgz",
+      "integrity": "sha512-lGe34o6EHj9y3Kts9R4ZYs/Gr+6N7MCaMlIFA3F1R2O5/m7K06AxfSeO5530PEERE6/WyEg3lsuyw4GHlPZHog==",
+      "engines": {
+        "node": "^4.5.0 || >= 5.9"
+      }
+    },
     "node_modules/binary-extensions": {
       "version": "2.2.0",
       "resolved": "https://registry.npmjs.org/binary-extensions/-/binary-extensions-2.2.0.tgz",
@@ -187,6 +223,18 @@
       "resolved": "https://registry.npmjs.org/cookie-signature/-/cookie-signature-1.0.6.tgz",
       "integrity": "sha512-QADzlaHc8icV8I7vbaJXJwod9HWYp8uCqf1xa4OfNu1T7JVxQIrUgOWtHdNDtPiywmFbiS12VjotIXLrKM3orQ=="
     },
+    "node_modules/cors": {
+      "version": "2.8.5",
+      "resolved": "https://registry.npmjs.org/cors/-/cors-2.8.5.tgz",
+      "integrity": "sha512-KIHbLJqu73RGr/hnbrO9uBeixNGuvSQjul/jdFvS/KFSIH1hWVd1ng7zOHx+YrEfInLG7q4n6GHQ9cDtxv/P6g==",
+      "dependencies": {
+        "object-assign": "^4",
+        "vary": "^1"
+      },
+      "engines": {
+        "node": ">= 0.10"
+      }
+    },
     "node_modules/crypto-js": {
       "version": "4.2.0",
       "resolved": "https://registry.npmjs.org/crypto-js/-/crypto-js-4.2.0.tgz",
@@ -234,6 +282,55 @@
         "node": ">= 0.8"
       }
     },
+    "node_modules/engine.io": {
+      "version": "6.5.3",
+      "resolved": "https://registry.npmjs.org/engine.io/-/engine.io-6.5.3.tgz",
+      "integrity": "sha512-IML/R4eG/pUS5w7OfcDE0jKrljWS9nwnEfsxWCIJF5eO6AHo6+Hlv+lQbdlAYsiJPHzUthLm1RUjnBzWOs45cw==",
+      "dependencies": {
+        "@types/cookie": "^0.4.1",
+        "@types/cors": "^2.8.12",
+        "@types/node": ">=10.0.0",
+        "accepts": "~1.3.4",
+        "base64id": "2.0.0",
+        "cookie": "~0.4.1",
+        "cors": "~2.8.5",
+        "debug": "~4.3.1",
+        "engine.io-parser": "~5.2.1",
+        "ws": "~8.11.0"
+      },
+      "engines": {
+        "node": ">=10.2.0"
+      }
+    },
+    "node_modules/engine.io-parser": {
+      "version": "5.2.1",
+      "resolved": "https://registry.npmjs.org/engine.io-parser/-/engine.io-parser-5.2.1.tgz",
+      "integrity": "sha512-9JktcM3u18nU9N2Lz3bWeBgxVgOKpw7yhRaoxQA3FUDZzzw+9WlA6p4G4u0RixNkg14fH7EfEc/RhpurtiROTQ==",
+      "engines": {
+        "node": ">=10.0.0"
+      }
+    },
+    "node_modules/engine.io/node_modules/debug": {
+      "version": "4.3.4",
+      "resolved": "https://registry.npmjs.org/debug/-/debug-4.3.4.tgz",
+      "integrity": "sha512-PRWFHuSU3eDtQJPvnNY7Jcket1j0t5OuOsFzPPzsekD52Zl8qUfFIPEiswXqIvHWGVHOgX+7G/vCNNhehwxfkQ==",
+      "dependencies": {
+        "ms": "2.1.2"
+      },
+      "engines": {
+        "node": ">=6.0"
+      },
+      "peerDependenciesMeta": {
+        "supports-color": {
+          "optional": true
+        }
+      }
+    },
+    "node_modules/engine.io/node_modules/ms": {
+      "version": "2.1.2",
+      "resolved": "https://registry.npmjs.org/ms/-/ms-2.1.2.tgz",
+      "integrity": "sha512-sGkPx+VjMtmA6MX27oA4FBFELFCZZ4S4XqeGOXCv68tT+jb3vk/RyaKWP0PTKyWtmLSM0b+adUTEvbs1PEaH2w=="
+    },
     "node_modules/escape-html": {
       "version": "1.0.3",
       "resolved": "https://registry.npmjs.org/escape-html/-/escape-html-1.0.3.tgz",
@@ -287,6 +384,14 @@
         "node": ">= 0.10.0"
       }
     },
+    "node_modules/express-favicon": {
+      "version": "2.0.4",
+      "resolved": "https://registry.npmjs.org/express-favicon/-/express-favicon-2.0.4.tgz",
+      "integrity": "sha512-JDGzumJdwF+WcJf+qwyhdpF1yzducuMCxZa+G6hxR3hor7ae/1CqpAPj8FXCGaGtqBA6ExDMfeszjuYRw5GUuQ==",
+      "engines": {
+        "node": ">=4"
+      }
+    },
     "node_modules/express/node_modules/cookie": {
       "version": "0.3.1",
       "resolved": "https://registry.npmjs.org/cookie/-/cookie-0.3.1.tgz",
@@ -602,6 +707,14 @@
         "node": ">=0.10.0"
       }
     },
+    "node_modules/object-assign": {
+      "version": "4.1.1",
+      "resolved": "https://registry.npmjs.org/object-assign/-/object-assign-4.1.1.tgz",
+      "integrity": "sha512-rJgTQnkUnH1sFw8yT6VSU3zD3sWmu6sZhIseY8VX+GRu3P6F7Fu+JNDoXfklElbLJSnc3FUQHVe4cU5hj+BcUg==",
+      "engines": {
+        "node": ">=0.10.0"
+      }
+    },
     "node_modules/on-finished": {
       "version": "2.3.0",
       "resolved": "https://registry.npmjs.org/on-finished/-/on-finished-2.3.0.tgz",
@@ -772,6 +885,85 @@
         "node": ">=10"
       }
     },
+    "node_modules/socket.io": {
+      "version": "4.7.2",
+      "resolved": "https://registry.npmjs.org/socket.io/-/socket.io-4.7.2.tgz",
+      "integrity": "sha512-bvKVS29/I5fl2FGLNHuXlQaUH/BlzX1IN6S+NKLNZpBsPZIDH+90eQmCs2Railn4YUiww4SzUedJ6+uzwFnKLw==",
+      "dependencies": {
+        "accepts": "~1.3.4",
+        "base64id": "~2.0.0",
+        "cors": "~2.8.5",
+        "debug": "~4.3.2",
+        "engine.io": "~6.5.2",
+        "socket.io-adapter": "~2.5.2",
+        "socket.io-parser": "~4.2.4"
+      },
+      "engines": {
+        "node": ">=10.2.0"
+      }
+    },
+    "node_modules/socket.io-adapter": {
+      "version": "2.5.2",
+      "resolved": "https://registry.npmjs.org/socket.io-adapter/-/socket.io-adapter-2.5.2.tgz",
+      "integrity": "sha512-87C3LO/NOMc+eMcpcxUBebGjkpMDkNBS9tf7KJqcDsmL936EChtVva71Dw2q4tQcuVC+hAUy4an2NO/sYXmwRA==",
+      "dependencies": {
+        "ws": "~8.11.0"
+      }
+    },
+    "node_modules/socket.io-parser": {
+      "version": "4.2.4",
+      "resolved": "https://registry.npmjs.org/socket.io-parser/-/socket.io-parser-4.2.4.tgz",
+      "integrity": "sha512-/GbIKmo8ioc+NIWIhwdecY0ge+qVBSMdgxGygevmdHj24bsfgtCmcUUcQ5ZzcylGFHsN3k4HB4Cgkl96KVnuew==",
+      "dependencies": {
+        "@socket.io/component-emitter": "~3.1.0",
+        "debug": "~4.3.1"
+      },
+      "engines": {
+        "node": ">=10.0.0"
+      }
+    },
+    "node_modules/socket.io-parser/node_modules/debug": {
+      "version": "4.3.4",
+      "resolved": "https://registry.npmjs.org/debug/-/debug-4.3.4.tgz",
+      "integrity": "sha512-PRWFHuSU3eDtQJPvnNY7Jcket1j0t5OuOsFzPPzsekD52Zl8qUfFIPEiswXqIvHWGVHOgX+7G/vCNNhehwxfkQ==",
+      "dependencies": {
+        "ms": "2.1.2"
+      },
+      "engines": {
+        "node": ">=6.0"
+      },
+      "peerDependenciesMeta": {
+        "supports-color": {
+          "optional": true
+        }
+      }
+    },
+    "node_modules/socket.io-parser/node_modules/ms": {
+      "version": "2.1.2",
+      "resolved": "https://registry.npmjs.org/ms/-/ms-2.1.2.tgz",
+      "integrity": "sha512-sGkPx+VjMtmA6MX27oA4FBFELFCZZ4S4XqeGOXCv68tT+jb3vk/RyaKWP0PTKyWtmLSM0b+adUTEvbs1PEaH2w=="
+    },
+    "node_modules/socket.io/node_modules/debug": {
+      "version": "4.3.4",
+      "resolved": "https://registry.npmjs.org/debug/-/debug-4.3.4.tgz",
+      "integrity": "sha512-PRWFHuSU3eDtQJPvnNY7Jcket1j0t5OuOsFzPPzsekD52Zl8qUfFIPEiswXqIvHWGVHOgX+7G/vCNNhehwxfkQ==",
+      "dependencies": {
+        "ms": "2.1.2"
+      },
+      "engines": {
+        "node": ">=6.0"
+      },
+      "peerDependenciesMeta": {
+        "supports-color": {
+          "optional": true
+        }
+      }
+    },
+    "node_modules/socket.io/node_modules/ms": {
+      "version": "2.1.2",
+      "resolved": "https://registry.npmjs.org/ms/-/ms-2.1.2.tgz",
+      "integrity": "sha512-sGkPx+VjMtmA6MX27oA4FBFELFCZZ4S4XqeGOXCv68tT+jb3vk/RyaKWP0PTKyWtmLSM0b+adUTEvbs1PEaH2w=="
+    },
     "node_modules/statuses": {
       "version": "1.4.0",
       "resolved": "https://registry.npmjs.org/statuses/-/statuses-1.4.0.tgz",
@@ -830,6 +1022,11 @@
       "resolved": "https://registry.npmjs.org/undefsafe/-/undefsafe-2.0.5.tgz",
       "integrity": "sha512-WxONCrssBM8TSPRqN5EmsjVrsv4A8X12J4ArBiiayv3DyyG3ZlIg6yysuuSYdZsVz3TKcTg2fd//Ujd4CHV1iA=="
     },
+    "node_modules/undici-types": {
+      "version": "5.26.5",
+      "resolved": "https://registry.npmjs.org/undici-types/-/undici-types-5.26.5.tgz",
+      "integrity": "sha512-JlCMO+ehdEIKqlFxk6IfVoAUVmgz7cU7zD/h9XZ0qzeosSHmUJVOzSQvvYSYWXkFXC+IfLKSIffhv0sVZup6pA=="
+    },
     "node_modules/unpipe": {
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/unpipe/-/unpipe-1.0.0.tgz",
@@ -866,6 +1063,26 @@
         "node": ">= 0.8"
       }
     },
+    "node_modules/ws": {
+      "version": "8.11.0",
+      "resolved": "https://registry.npmjs.org/ws/-/ws-8.11.0.tgz",
+      "integrity": "sha512-HPG3wQd9sNQoT9xHyNCXoDUa+Xw/VevmY9FoHyQ+g+rrMn4j6FB4np7Z0OhdTgjx6MgQLK7jwSy1YecU1+4Asg==",
+      "engines": {
+        "node": ">=10.0.0"
+      },
+      "peerDependencies": {
+        "bufferutil": "^4.0.1",
+        "utf-8-validate": "^5.0.2"
+      },
+      "peerDependenciesMeta": {
+        "bufferutil": {
+          "optional": true
+        },
+        "utf-8-validate": {
+          "optional": true
+        }
+      }
+    },
     "node_modules/yallist": {
       "version": "4.0.0",
       "resolved": "https://registry.npmjs.org/yallist/-/yallist-4.0.0.tgz",
@@ -873,6 +1090,32 @@
     }
   },
   "dependencies": {
+    "@socket.io/component-emitter": {
+      "version": "3.1.0",
+      "resolved": "https://registry.npmjs.org/@socket.io/component-emitter/-/component-emitter-3.1.0.tgz",
+      "integrity": "sha512-+9jVqKhRSpsc591z5vX+X5Yyw+he/HCB4iQ/RYxw35CEPaY1gnsNE43nf9n9AaYjAQrTiI/mOwKUKdUs9vf7Xg=="
+    },
+    "@types/cookie": {
+      "version": "0.4.1",
+      "resolved": "https://registry.npmjs.org/@types/cookie/-/cookie-0.4.1.tgz",
+      "integrity": "sha512-XW/Aa8APYr6jSVVA1y/DEIZX0/GMKLEVekNG727R8cs56ahETkRAy/3DR7+fJyh7oUgGwNQaRfXCun0+KbWY7Q=="
+    },
+    "@types/cors": {
+      "version": "2.8.15",
+      "resolved": "https://registry.npmjs.org/@types/cors/-/cors-2.8.15.tgz",
+      "integrity": "sha512-n91JxbNLD8eQIuXDIChAN1tCKNWCEgpceU9b7ZMbFA+P+Q4yIeh80jizFLEvolRPc1ES0VdwFlGv+kJTSirogw==",
+      "requires": {
+        "@types/node": "*"
+      }
+    },
+    "@types/node": {
+      "version": "20.8.10",
+      "resolved": "https://registry.npmjs.org/@types/node/-/node-20.8.10.tgz",
+      "integrity": "sha512-TlgT8JntpcbmKUFzjhsyhGfP2fsiz1Mv56im6enJ905xG1DAYesxJaeSbGqQmAw8OWPdhyJGhGSQGKRNJ45u9w==",
+      "requires": {
+        "undici-types": "~5.26.4"
+      }
+    },
     "abbrev": {
       "version": "1.1.1",
       "resolved": "https://registry.npmjs.org/abbrev/-/abbrev-1.1.1.tgz",
@@ -906,6 +1149,11 @@
       "resolved": "https://registry.npmjs.org/balanced-match/-/balanced-match-1.0.2.tgz",
       "integrity": "sha512-3oSeUO0TMV67hN1AmbXsK4yaqU7tjiHlbxRDZOpH0KW9+CeX4bRAaX0Anxt0tx2MrpRpWwQaPwIlISEJhYU5Pw=="
     },
+    "base64id": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/base64id/-/base64id-2.0.0.tgz",
+      "integrity": "sha512-lGe34o6EHj9y3Kts9R4ZYs/Gr+6N7MCaMlIFA3F1R2O5/m7K06AxfSeO5530PEERE6/WyEg3lsuyw4GHlPZHog=="
+    },
     "binary-extensions": {
       "version": "2.2.0",
       "resolved": "https://registry.npmjs.org/binary-extensions/-/binary-extensions-2.2.0.tgz",
@@ -999,6 +1247,15 @@
       "resolved": "https://registry.npmjs.org/cookie-signature/-/cookie-signature-1.0.6.tgz",
       "integrity": "sha512-QADzlaHc8icV8I7vbaJXJwod9HWYp8uCqf1xa4OfNu1T7JVxQIrUgOWtHdNDtPiywmFbiS12VjotIXLrKM3orQ=="
     },
+    "cors": {
+      "version": "2.8.5",
+      "resolved": "https://registry.npmjs.org/cors/-/cors-2.8.5.tgz",
+      "integrity": "sha512-KIHbLJqu73RGr/hnbrO9uBeixNGuvSQjul/jdFvS/KFSIH1hWVd1ng7zOHx+YrEfInLG7q4n6GHQ9cDtxv/P6g==",
+      "requires": {
+        "object-assign": "^4",
+        "vary": "^1"
+      }
+    },
     "crypto-js": {
       "version": "4.2.0",
       "resolved": "https://registry.npmjs.org/crypto-js/-/crypto-js-4.2.0.tgz",
@@ -1037,6 +1294,43 @@
       "resolved": "https://registry.npmjs.org/encodeurl/-/encodeurl-1.0.2.tgz",
       "integrity": "sha512-TPJXq8JqFaVYm2CWmPvnP2Iyo4ZSM7/QKcSmuMLDObfpH5fi7RUGmd/rTDf+rut/saiDiQEeVTNgAmJEdAOx0w=="
     },
+    "engine.io": {
+      "version": "6.5.3",
+      "resolved": "https://registry.npmjs.org/engine.io/-/engine.io-6.5.3.tgz",
+      "integrity": "sha512-IML/R4eG/pUS5w7OfcDE0jKrljWS9nwnEfsxWCIJF5eO6AHo6+Hlv+lQbdlAYsiJPHzUthLm1RUjnBzWOs45cw==",
+      "requires": {
+        "@types/cookie": "^0.4.1",
+        "@types/cors": "^2.8.12",
+        "@types/node": ">=10.0.0",
+        "accepts": "~1.3.4",
+        "base64id": "2.0.0",
+        "cookie": "~0.4.1",
+        "cors": "~2.8.5",
+        "debug": "~4.3.1",
+        "engine.io-parser": "~5.2.1",
+        "ws": "~8.11.0"
+      },
+      "dependencies": {
+        "debug": {
+          "version": "4.3.4",
+          "resolved": "https://registry.npmjs.org/debug/-/debug-4.3.4.tgz",
+          "integrity": "sha512-PRWFHuSU3eDtQJPvnNY7Jcket1j0t5OuOsFzPPzsekD52Zl8qUfFIPEiswXqIvHWGVHOgX+7G/vCNNhehwxfkQ==",
+          "requires": {
+            "ms": "2.1.2"
+          }
+        },
+        "ms": {
+          "version": "2.1.2",
+          "resolved": "https://registry.npmjs.org/ms/-/ms-2.1.2.tgz",
+          "integrity": "sha512-sGkPx+VjMtmA6MX27oA4FBFELFCZZ4S4XqeGOXCv68tT+jb3vk/RyaKWP0PTKyWtmLSM0b+adUTEvbs1PEaH2w=="
+        }
+      }
+    },
+    "engine.io-parser": {
+      "version": "5.2.1",
+      "resolved": "https://registry.npmjs.org/engine.io-parser/-/engine.io-parser-5.2.1.tgz",
+      "integrity": "sha512-9JktcM3u18nU9N2Lz3bWeBgxVgOKpw7yhRaoxQA3FUDZzzw+9WlA6p4G4u0RixNkg14fH7EfEc/RhpurtiROTQ=="
+    },
     "escape-html": {
       "version": "1.0.3",
       "resolved": "https://registry.npmjs.org/escape-html/-/escape-html-1.0.3.tgz",
@@ -1091,6 +1385,11 @@
         }
       }
     },
+    "express-favicon": {
+      "version": "2.0.4",
+      "resolved": "https://registry.npmjs.org/express-favicon/-/express-favicon-2.0.4.tgz",
+      "integrity": "sha512-JDGzumJdwF+WcJf+qwyhdpF1yzducuMCxZa+G6hxR3hor7ae/1CqpAPj8FXCGaGtqBA6ExDMfeszjuYRw5GUuQ=="
+    },
     "fill-range": {
       "version": "7.0.1",
       "resolved": "https://registry.npmjs.org/fill-range/-/fill-range-7.0.1.tgz",
@@ -1311,6 +1610,11 @@
       "resolved": "https://registry.npmjs.org/normalize-path/-/normalize-path-3.0.0.tgz",
       "integrity": "sha512-6eZs5Ls3WtCisHWp9S2GUy8dqkpGi4BVSz3GaqiE6ezub0512ESztXUwUB6C6IKbQkY2Pnb/mD4WYojCRwcwLA=="
     },
+    "object-assign": {
+      "version": "4.1.1",
+      "resolved": "https://registry.npmjs.org/object-assign/-/object-assign-4.1.1.tgz",
+      "integrity": "sha512-rJgTQnkUnH1sFw8yT6VSU3zD3sWmu6sZhIseY8VX+GRu3P6F7Fu+JNDoXfklElbLJSnc3FUQHVe4cU5hj+BcUg=="
+    },
     "on-finished": {
       "version": "2.3.0",
       "resolved": "https://registry.npmjs.org/on-finished/-/on-finished-2.3.0.tgz",
@@ -1439,6 +1743,67 @@
         "semver": "^7.5.3"
       }
     },
+    "socket.io": {
+      "version": "4.7.2",
+      "resolved": "https://registry.npmjs.org/socket.io/-/socket.io-4.7.2.tgz",
+      "integrity": "sha512-bvKVS29/I5fl2FGLNHuXlQaUH/BlzX1IN6S+NKLNZpBsPZIDH+90eQmCs2Railn4YUiww4SzUedJ6+uzwFnKLw==",
+      "requires": {
+        "accepts": "~1.3.4",
+        "base64id": "~2.0.0",
+        "cors": "~2.8.5",
+        "debug": "~4.3.2",
+        "engine.io": "~6.5.2",
+        "socket.io-adapter": "~2.5.2",
+        "socket.io-parser": "~4.2.4"
+      },
+      "dependencies": {
+        "debug": {
+          "version": "4.3.4",
+          "resolved": "https://registry.npmjs.org/debug/-/debug-4.3.4.tgz",
+          "integrity": "sha512-PRWFHuSU3eDtQJPvnNY7Jcket1j0t5OuOsFzPPzsekD52Zl8qUfFIPEiswXqIvHWGVHOgX+7G/vCNNhehwxfkQ==",
+          "requires": {
+            "ms": "2.1.2"
+          }
+        },
+        "ms": {
+          "version": "2.1.2",
+          "resolved": "https://registry.npmjs.org/ms/-/ms-2.1.2.tgz",
+          "integrity": "sha512-sGkPx+VjMtmA6MX27oA4FBFELFCZZ4S4XqeGOXCv68tT+jb3vk/RyaKWP0PTKyWtmLSM0b+adUTEvbs1PEaH2w=="
+        }
+      }
+    },
+    "socket.io-adapter": {
+      "version": "2.5.2",
+      "resolved": "https://registry.npmjs.org/socket.io-adapter/-/socket.io-adapter-2.5.2.tgz",
+      "integrity": "sha512-87C3LO/NOMc+eMcpcxUBebGjkpMDkNBS9tf7KJqcDsmL936EChtVva71Dw2q4tQcuVC+hAUy4an2NO/sYXmwRA==",
+      "requires": {
+        "ws": "~8.11.0"
+      }
+    },
+    "socket.io-parser": {
+      "version": "4.2.4",
+      "resolved": "https://registry.npmjs.org/socket.io-parser/-/socket.io-parser-4.2.4.tgz",
+      "integrity": "sha512-/GbIKmo8ioc+NIWIhwdecY0ge+qVBSMdgxGygevmdHj24bsfgtCmcUUcQ5ZzcylGFHsN3k4HB4Cgkl96KVnuew==",
+      "requires": {
+        "@socket.io/component-emitter": "~3.1.0",
+        "debug": "~4.3.1"
+      },
+      "dependencies": {
+        "debug": {
+          "version": "4.3.4",
+          "resolved": "https://registry.npmjs.org/debug/-/debug-4.3.4.tgz",
+          "integrity": "sha512-PRWFHuSU3eDtQJPvnNY7Jcket1j0t5OuOsFzPPzsekD52Zl8qUfFIPEiswXqIvHWGVHOgX+7G/vCNNhehwxfkQ==",
+          "requires": {
+            "ms": "2.1.2"
+          }
+        },
+        "ms": {
+          "version": "2.1.2",
+          "resolved": "https://registry.npmjs.org/ms/-/ms-2.1.2.tgz",
+          "integrity": "sha512-sGkPx+VjMtmA6MX27oA4FBFELFCZZ4S4XqeGOXCv68tT+jb3vk/RyaKWP0PTKyWtmLSM0b+adUTEvbs1PEaH2w=="
+        }
+      }
+    },
     "statuses": {
       "version": "1.4.0",
       "resolved": "https://registry.npmjs.org/statuses/-/statuses-1.4.0.tgz",
@@ -1482,6 +1847,11 @@
       "resolved": "https://registry.npmjs.org/undefsafe/-/undefsafe-2.0.5.tgz",
       "integrity": "sha512-WxONCrssBM8TSPRqN5EmsjVrsv4A8X12J4ArBiiayv3DyyG3ZlIg6yysuuSYdZsVz3TKcTg2fd//Ujd4CHV1iA=="
     },
+    "undici-types": {
+      "version": "5.26.5",
+      "resolved": "https://registry.npmjs.org/undici-types/-/undici-types-5.26.5.tgz",
+      "integrity": "sha512-JlCMO+ehdEIKqlFxk6IfVoAUVmgz7cU7zD/h9XZ0qzeosSHmUJVOzSQvvYSYWXkFXC+IfLKSIffhv0sVZup6pA=="
+    },
     "unpipe": {
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/unpipe/-/unpipe-1.0.0.tgz",
@@ -1502,6 +1872,12 @@
       "resolved": "https://registry.npmjs.org/vary/-/vary-1.1.2.tgz",
       "integrity": "sha512-BNGbWLfd0eUPabhkXUVm0j8uuvREyTh5ovRa/dyow/BqAbZJyC+5fU+IzQOzmAKzYqYRAISoRhdQr3eIZ/PXqg=="
     },
+    "ws": {
+      "version": "8.11.0",
+      "resolved": "https://registry.npmjs.org/ws/-/ws-8.11.0.tgz",
+      "integrity": "sha512-HPG3wQd9sNQoT9xHyNCXoDUa+Xw/VevmY9FoHyQ+g+rrMn4j6FB4np7Z0OhdTgjx6MgQLK7jwSy1YecU1+4Asg==",
+      "requires": {}
+    },
     "yallist": {
       "version": "4.0.0",
       "resolved": "https://registry.npmjs.org/yallist/-/yallist-4.0.0.tgz",
diff --git a/package.json b/package.json
index 8457177..464af28 100644
--- a/package.json
+++ b/package.json
@@ -1,10 +1,11 @@
 {
   "name": "neutral",
-  "version": "0.1.3",
+  "version": "0.2.0",
   "description": "Panel d'administration de Raphix",
   "main": "index.js",
   "scripts": {
-    "start": "nodemon ./bin/www"
+    "start": "nodemon ./bin/www",
+    "dev": "set DEV=true & nodemon ./bin/www"
   },
   "repository": {
     "type": "git",
@@ -24,9 +25,11 @@
     "debug": "~2.6.9",
     "ejs": "~2.6.1",
     "express": "~4.16.1",
+    "express-favicon": "^2.0.4",
     "http-errors": "~1.6.3",
     "loguix": "1.4.1",
     "nodemon": "^3.0.1",
+    "socket.io": "^4.7.2",
     "uuid": "^9.0.1"
   },
   "author": "Raphix",
diff --git a/public/images/FormatLogo_WHITE.ico b/public/images/FormatLogo_WHITE.ico
new file mode 100644
index 0000000..87d1dc9
Binary files /dev/null and b/public/images/FormatLogo_WHITE.ico differ
diff --git a/public/images/users/b261e434-f140-437e-b860-6a0374562e01.png b/public/images/users/b261e434-f140-437e-b860-6a0374562e01.png
new file mode 100644
index 0000000..ca40fc8
Binary files /dev/null and b/public/images/users/b261e434-f140-437e-b860-6a0374562e01.png differ
diff --git a/public/images/users/default.jpg b/public/images/users/default.jpg
new file mode 100644
index 0000000..4a93ad1
Binary files /dev/null and b/public/images/users/default.jpg differ
diff --git a/public/javascripts/basics.js b/public/javascripts/basics.js
index b3e8fe0..0d60ba2 100644
--- a/public/javascripts/basics.js
+++ b/public/javascripts/basics.js
@@ -1,10 +1,18 @@
 // Get Document ID
 
-function getID(string) {
+/**
+ * Récupère depuis le document l'identifiant de l'élément
+ * @param {string} id Identifiant de l'élément `id='identifiant'`
+ * @returns 
+ */
+function getID(id) {
 
-    return document.getElementById(string)
+    return document.getElementById(id)
 }
 
+/**
+ * Permet de faire une pop-up automatique
+ */
 class InfoPop {
     constructor(name) {
         this.name = name
@@ -33,4 +41,5 @@ class InfoPop {
         this.element.innerHTML = "<i class='fa fa-info-circle'></i> " + text
     }
 
-}
\ No newline at end of file
+}
+
diff --git a/public/javascripts/indexscript.js b/public/javascripts/indexscript.js
new file mode 100644
index 0000000..7859b77
--- /dev/null
+++ b/public/javascripts/indexscript.js
@@ -0,0 +1,86 @@
+const infoUsername = getID("infoUsername")
+const infoUserimage = getID("infoUserimage")
+const infoDisplayname = getID("infoDisplayname")
+const views = getID("views")
+
+// User Request
+
+const REQ_user = get("USERINFO")
+
+REQ_user.then((ANS_user) => {
+    infoUserimage.src = ANS_user.picture
+    infoUsername.innerHTML = ANS_user.username
+    infoDisplayname.innerHTML = ANS_user.display_name
+
+    const permissions = ANS_user.permission
+
+    const AvailableViews = new Array()
+
+    permissions.forEach((permValue) => {
+        
+         if(permValue == "FILES_EXPLORER") {
+            AvailableViews.push(`<div class="view">
+            <span class="view-image"><i class="fa-solid fa-folder"></i></span>
+            <p class="view-text">Gestionnaire de fichiers</p>
+        </div>`)
+         }
+         if(permValue == "SERVICES") {
+            AvailableViews.push(`<div class="view">
+            <span class="view-image"><i class="fa-solid fa-layer-group"></i></span>
+            <p class="view-text">Gestion des services</p>
+        </div>`)
+         }
+         if(permValue == "SERVERS") {
+            AvailableViews.push(`<div class="view">
+            <span class="view-image"><i class="fa fa-server"></i></span>
+            <p class="view-text">Gestion des serveurs</p>
+          </div>`)
+         }
+         if(permValue == "PIPELINES") {
+            AvailableViews.push(` <div class="view">
+            <span class="view-image"><i class="fa-brands fa-jenkins"></i></span>
+            <p class="view-text">Gestion des pipelines</p>
+          </div>`)
+         }
+         if(permValue == "METRICS") {
+            AvailableViews.push(` <div class="view">
+            <span class="view-image"><i class="fa-solid fa-square-poll-vertical"></i></span>
+            <p class="view-text">Web Metrics</p>
+          </div>`)
+         }
+         if(permValue == "USERS") {
+            AvailableViews.push(` <div class="view">
+            <span class="view-image"><i class="fa fa-users"></i></span>
+            <p class="view-text">Gestion des utilisateurs</p>
+          </div>`)
+         }
+         if(permValue == "LINKS") {
+            AvailableViews.push(` <div class="view">
+            <span class="view-image"><i class="fa-solid fa-link"></i></span>
+            <p class="view-text">Générateur de lien</p>
+          </div>`)
+         }
+         if(permValue == "SETTINGS") {
+            AvailableViews.push(` <div class="view">
+            <span class="view-image"><i class="fa fa-gear"></i></span>
+            <p class="view-text">Paramètres</p>
+          </div>`)
+         }
+
+        
+    })
+    
+
+    if(AvailableViews.join("") == "") {
+
+        AvailableViews.push("<p class='yellow'><i class='fa-solid fa-warning'></i> Aucune permission ne semble vous êtes accordée<br>Demandez à Raphix afin de résoudre ce problème</p>")
+        views.classList.remove("views-box")
+    } else {
+
+        views.classList.add("views-box")
+    }
+
+    views.innerHTML = AvailableViews.join("")
+
+})
+
diff --git a/public/javascripts/io.js b/public/javascripts/io.js
new file mode 100644
index 0000000..8da2865
--- /dev/null
+++ b/public/javascripts/io.js
@@ -0,0 +1,42 @@
+// Socket IO - Communication
+
+var socketLink = null
+
+fetch('/internal/socketlink', {
+    method: "GET"
+}).then(link => {socketLink = link})
+
+const socket = io(socketLink);
+
+socket.on("connect", () => {
+    console.log("Connecté au serveur par le Socket avec l'ID : " + socket.id)
+});
+
+socket.on("disconnect", () => {
+
+    window.location.href = "/"
+})
+
+function get(request) {
+
+    return new Promise((resolve, reject) => {
+
+        socket.emit("GET/" + request)
+        console.log("Envoi de la requête GET : " + request)
+        
+        socket.once("ANSWER/GET/" + request, (answer) => {
+            
+            console.log("Réponse pour la requête : " + request)
+       
+            resolve(answer)
+                    
+        })
+        
+    })
+    
+}
+
+function getSocket() {
+
+    return socket
+}
diff --git a/public/stylesheets/style.css b/public/stylesheets/style.css
index df3ff9d..ec4a17d 100644
--- a/public/stylesheets/style.css
+++ b/public/stylesheets/style.css
@@ -85,6 +85,10 @@ html {
   color: #f01000!important; 
 }
 
+.lightred {
+  color: #ff5d51 !important;
+}
+
 .blue {
 
   color: rgb(66, 242, 255) !important;
@@ -251,6 +255,65 @@ a {
   background-color: #605e5863;
 }
 
+.panel-box {
+
+  width: 900px;
+  height: 500px;
+  border-radius: 0.5vw;
+  display: flex;
+  padding: 2%;
+  flex-direction: column;
+  justify-content: space-between;
+  background-color: #605e5863;
+  gap: 50px;
+}
+
+.subpanel-box {
+
+  width: 900px;
+  height: 50px;
+  border-radius: 0.5vw;
+  padding: 2%;
+  display: flex;
+  justify-content: space-between;
+  background-color: #605e5863;
+}
+
+.subpanel-image {
+
+  width: 50px;
+  height: 50px;
+  border-radius: 100%;
+}
+
+.subpanel-user {
+
+  display: flex;
+  flex-direction: row;
+  gap: 10px;
+  align-items: center;
+}
+
+.subpanel-userinfo {
+  text-align: start;
+  display: flex;
+  flex-direction: column;
+  gap: 5px;
+}
+
+.subpanel-username {
+
+  font-size: 14px;
+  color: rgba(255, 255, 255, 0.68);
+  margin-block: 0 !important;
+}
+
+
+.subpanel-dispname {
+
+  margin-block: 0 !important;
+}
+
 .m-align {
 
     margin-right: auto !important;
@@ -274,9 +337,71 @@ a {
 .LOG_body {
 
     display: flex;
+    flex-direction: column;
     justify-content: center;
+    gap: 10px;
     align-items: center;
     height: 100vh;
     padding: 0 !important;
     margin: 0 !important;
+}
+
+/*INDEX Specs*/
+
+@media (max-width: 640px) {
+
+  .views-box {
+    width: 100%;
+    height: 100%;
+    display: flex;
+    flex-direction: column;
+    gap: 10px;
+
+  
+  }
+  
+  
+} 
+
+@media (min-width: 640px) {
+
+  .views-box {
+    width: 100%;
+    height: 100%;
+    display: grid;
+    grid-template-columns: repeat(4, 1fr);
+    grid-template-rows: repeat(2, 1fr);
+    grid-column-gap: 10px;
+    grid-row-gap: 10px;
+  
+  }
+  
+
+}
+
+
+.view {
+  display: flex;
+  flex-direction: column;
+  user-select: none;
+  -webkit-user-select: none;
+  transition: 0.1s;
+
+}
+
+.view:hover {
+
+  cursor: pointer;
+  color: #ff5d51;
+  text-shadow: 0px 3px 2px #070607;
+}
+.view:active {
+
+  cursor: pointer;
+  color: #ff5d5194;
+}
+
+.view-image {
+
+  font-size: 72px;
 }
\ No newline at end of file
diff --git a/routes/internal.js b/routes/internal.js
new file mode 100644
index 0000000..a9f5c4e
--- /dev/null
+++ b/routes/internal.js
@@ -0,0 +1,16 @@
+var express = require('express');
+var router = express.Router();
+var path = require("path")
+
+router.get("/socketlink", (req,res,next) => {
+        
+    if(process.env.DEV == true) {
+
+        res.send("ws://localhost:3001")
+    } else {
+        res.send("ws://neutral.raphix.fr")
+    }
+})
+
+
+module.exports = router;
\ No newline at end of file
diff --git a/views/index.ejs b/views/index.ejs
index d9b4350..49a6df2 100644
--- a/views/index.ejs
+++ b/views/index.ejs
@@ -4,10 +4,61 @@
     <title>Neutral</title>
     <link rel='stylesheet' href='/stylesheets/style.css' />
   </head>
-  <body>
-    <h1>Neutral - Home</h1>
-    <p>Welcome to Neutral</p>
-    <a href="/login/signout"><button class="btn red"><span><i class="fa fa-sign-out"></i> Déconnexion</span></button></a>
+  <body class="LOG_body">
+    <div class="panel-box m-align t-center">
+      <div class="logo"><img class="logo-img" src="/images/FormatLogo_WHITE.svg"><p>Neutral</p></div>
+      <div id="views" class="views-box">
+          <div class="view">
+              <span class="view-image"><i class="fa-solid fa-folder"></i></span>
+              <p class="view-text">Gestionnaire de fichiers</p>
+          </div>
+            <div class="view">
+              <span class="view-image"><i class="fa-solid fa-layer-group"></i></span>
+              <p class="view-text">Gestion des services</p>
+          </div>
+          <div class="view">
+            <span class="view-image"><i class="fa fa-server"></i></span>
+            <p class="view-text">Gestion des serveurs</p>
+          </div>
+        <div class="view">
+          <span class="view-image"><i class="fa-brands fa-jenkins"></i></span>
+          <p class="view-text">Gestion des pipelines</p>
+        </div>
+        <div class="view">
+          <span class="view-image"><i class="fa-solid fa-square-poll-vertical"></i></span>
+          <p class="view-text">Web Metrics</p>
+        </div>
+        <div class="view">
+          <span class="view-image"><i class="fa fa-users"></i></span>
+          <p class="view-text">Gestion des utilisateurs</p>
+        </div>
+        <div class="view">
+          <span class="view-image"><i class="fa-solid fa-link"></i></span>
+          <p class="view-text">Générateur de lien</p>
+        </div>
+        <div class="view">
+          <span class="view-image"><i class="fa fa-gear"></i></span>
+          <p class="view-text">Paramètres</p>
+        </div>
+      </div>
+    </div>
+    <div class="subpanel-box m-align t-center">
+      <div class="subpanel-user">
+        <img id="infoUserimage" class="subpanel-image" src="/images/users/default.jpg">
+        <div class="subpanel-userinfo">
+          <p id="infoDisplayname" class="subpanel-dispname">DisplayName</p>
+          <p id="infoUsername" class="subpanel-username">Username</p>
+        </div>
+    
+      </div>
+      <a href="/login/signout"><button class="btn yellow"><span><i class="fa fa-sign-out"></i> Déconnexion</span></button></a>
+    </div>
+   
+    <script src="/socket.io/socket.io.js"></script>
     <script defer="" src="https://use.fontawesome.com/releases/v6.4.2/js/all.js" crossorigin="anonymous"></script>
+    <script src="/javascripts/basics.js"></script>
+    <script src="/javascripts/io.js"></script>
+    <script src="/javascripts/indexscript.js"></script>
+ 
   </body>
 </html>