diff --git a/.vscode/settings.json b/.vscode/settings.json
index a434aa05093c22cb873a5b94b9ad57072ba1eeb1..13c8a5c22d7fc8b433e03ac2521364ee93da607f 100644
--- a/.vscode/settings.json
+++ b/.vscode/settings.json
@@ -29,5 +29,6 @@
   "sonarlint.connectedMode.project": {
     "connectionId": "sonarqube-forge-grandlyon",
     "projectKey": "web-et-numerique-llle-project-backoffice-client"
-  }
+  },
+  "cSpell.words": ["ecolyo"]
 }
diff --git a/nginx/site.conf b/nginx/site.conf
index cf2467c3dcdce3caffa5e92e38aec7fe3fbe7424..998e42faf52ab6b4197943f67c0fdcd41e89ab08 100644
--- a/nginx/site.conf
+++ b/nginx/site.conf
@@ -21,8 +21,8 @@ server {
         location /Logout {
             proxy_pass https://backend:1443/Logout;
         }
-        location /swagger {
-            proxy_pass https://backend:1443/swagger;
+        location /doc {
+            proxy_pass https://backend:1443/doc;
         }
         location /imageNames {
             proxy_pass https://backend:1443/api/admin/imageNames;
diff --git a/nginx/site.prod.conf b/nginx/site.prod.conf
index bd895ca51feded517ba578a9bff24b86f4bca64f..b03177f15d2ef1df2ae184b1c5331b55df63036b 100644
--- a/nginx/site.prod.conf
+++ b/nginx/site.prod.conf
@@ -19,9 +19,6 @@ server {
         location /Logout {
             proxy_pass https://backend:1443/Logout;
         }
-        location /swagger {
-            proxy_pass https://backend:1443/swagger;
-        }
         location /imageNames {
             proxy_pass https://backend:1443/api/admin/imageNames;
         }
diff --git a/src/components/Menu/Menu.tsx b/src/components/Menu/Menu.tsx
index 05b3b1689ea8b3b7342b31355a8c772f465c306d..486a779d7bc4e0b731766cfd5503f58b7ee53174 100644
--- a/src/components/Menu/Menu.tsx
+++ b/src/components/Menu/Menu.tsx
@@ -10,19 +10,23 @@ import { Route } from '../../models/route.model'
 const Menu: React.FC = () => {
   const { user } = useContext(UserContext)
   const { logoutUser } = useAuth()
+
   return (
     <nav className={'menu'}>
       <div className="logo-container">
         <img src={logo} alt="Ecolyo logo" className="logo" />
       </div>
       <div className="menu-list">
-        {routes.map((route: Route, index: number) => {
-          return (
-            <NavLink key={index} to={route.path} activeClassName="active">
-              {route.label}
-            </NavLink>
-          )
-        })}
+        {routes.map((route: Route) => (
+          <NavLink key={route.label} to={route.path} activeClassName="active">
+            {route.label}
+          </NavLink>
+        ))}
+        {process.env.NODE_ENV === 'development' && (
+          <a href="/doc/" target="_blank">
+            Swagger doc
+          </a>
+        )}
       </div>
       <div className="administration">
         {user ? (
diff --git a/src/components/Navbar/Navbar.tsx b/src/components/Navbar/Navbar.tsx
index ad45dd3f53172f92e9408679e62610c62ad7da53..209515a3fd64206879f56f37614f7689997c5065 100644
--- a/src/components/Navbar/Navbar.tsx
+++ b/src/components/Navbar/Navbar.tsx
@@ -9,14 +9,20 @@ import './navbar.scss'
 const Navbar: React.FC = () => {
   const { user } = useContext(UserContext)
   const { logoutUser } = useAuth()
+
   return (
     <div className="navbar">
       <div className="menu-list">
-        {routes.map((route: Route, index: number) => (
-          <NavLink key={index} to={route.path} activeClassName="active">
+        {routes.map((route: Route) => (
+          <NavLink key={route.label} to={route.path} activeClassName="active">
             {route.label}
           </NavLink>
         ))}
+        {process.env.NODE_ENV === 'development' && (
+          <a href="/doc/" target="_blank">
+            Swagger doc
+          </a>
+        )}
       </div>
       {user && (
         <button className="btnValid logButton" onClick={logoutUser}>