diff --git a/apps/learneth/src/App.tsx b/apps/learneth/src/App.tsx
index 8582be5a75..e61fbf7b74 100644
--- a/apps/learneth/src/App.tsx
+++ b/apps/learneth/src/App.tsx
@@ -1,15 +1,15 @@
-import React from 'react';
-import { createBrowserRouter, RouterProvider } from 'react-router-dom';
-import { ToastContainer } from 'react-toastify';
-import LoadingScreen from './components/LoadingScreen';
-import LogoPage from './pages/Logo';
-import HomePage from './pages/Home';
-import StepListPage from './pages/StepList';
-import StepDetailPage from './pages/StepDetail';
-import 'react-toastify/dist/ReactToastify.css';
-import './App.css';
+import React from 'react'
+import {createHashRouter, RouterProvider} from 'react-router-dom'
+import {ToastContainer} from 'react-toastify'
+import LoadingScreen from './components/LoadingScreen'
+import LogoPage from './pages/Logo'
+import HomePage from './pages/Home'
+import StepListPage from './pages/StepList'
+import StepDetailPage from './pages/StepDetail'
+import 'react-toastify/dist/ReactToastify.css'
+import './App.css'
 
-export const router = createBrowserRouter([
+export const router = createHashRouter([
   {
     path: '/',
     element: <LogoPage />,
@@ -26,26 +26,16 @@ export const router = createBrowserRouter([
     path: '/detail',
     element: <StepDetailPage />,
   },
-]);
+])
 
 function App(): JSX.Element {
   return (
     <>
       <RouterProvider router={router} />
       <LoadingScreen />
-      <ToastContainer
-        position="bottom-right"
-        newestOnTop
-        closeOnClick
-        rtl={false}
-        pauseOnFocusLoss
-        draggable
-        pauseOnHover
-        autoClose={false}
-        theme="colored"
-      />
+      <ToastContainer position="bottom-right" newestOnTop closeOnClick rtl={false} pauseOnFocusLoss draggable pauseOnHover autoClose={false} theme="colored" />
     </>
-  );
+  )
 }
 
-export default App;
+export default App
diff --git a/apps/learneth/src/components/BackButton/index.tsx b/apps/learneth/src/components/BackButton/index.tsx
index 22a2fbfff4..cb476cd826 100644
--- a/apps/learneth/src/components/BackButton/index.tsx
+++ b/apps/learneth/src/components/BackButton/index.tsx
@@ -1,5 +1,5 @@
 import React, {useState} from 'react'
-import {Link, useNavigate} from 'react-router-dom'
+import {Link, useLocation, useNavigate} from 'react-router-dom'
 import {Button, Modal, Tooltip, OverlayTrigger} from 'react-bootstrap'
 import {FontAwesomeIcon} from '@fortawesome/react-fontawesome'
 import {faHome, faBars, faChevronLeft, faChevronRight} from '@fortawesome/free-solid-svg-icons'
@@ -8,6 +8,7 @@ import './index.scss'
 
 function BackButton({entity}: any) {
   const navigate = useNavigate()
+  const location = useLocation()
   const [show, setShow] = useState(false)
   // const theme = useAppSelector((state) => state.remixide.theme)
   const isDetailPage = location.pathname === '/detail'
diff --git a/apps/learneth/src/pages/StepDetail/index.tsx b/apps/learneth/src/pages/StepDetail/index.tsx
index 38ec41cec7..2df3b9efe6 100644
--- a/apps/learneth/src/pages/StepDetail/index.tsx
+++ b/apps/learneth/src/pages/StepDetail/index.tsx
@@ -1,43 +1,44 @@
-import React, { useEffect } from 'react';
-import { useNavigate } from 'react-router-dom';
-import Markdown from 'react-markdown';
-import rehypeRaw from 'rehype-raw';
-import BackButton from '../../components/BackButton';
-import { useAppSelector, useAppDispatch } from '../../redux/hooks';
-import './index.scss';
+import React, {useEffect} from 'react'
+import {useLocation, useNavigate} from 'react-router-dom'
+import Markdown from 'react-markdown'
+import rehypeRaw from 'rehype-raw'
+import BackButton from '../../components/BackButton'
+import {useAppSelector, useAppDispatch} from '../../redux/hooks'
+import './index.scss'
 
 function StepDetailPage() {
-  const navigate = useNavigate();
-  const dispatch = useAppDispatch();
-  const queryParams = new URLSearchParams(location.search);
-  const id = queryParams.get('id') as string;
-  const stepId = Number(queryParams.get('stepId'));
+  const navigate = useNavigate()
+  const location = useLocation()
+  const dispatch = useAppDispatch()
+  const queryParams = new URLSearchParams(location.search)
+  const id = queryParams.get('id') as string
+  const stepId = Number(queryParams.get('stepId'))
   const {
-    workshop: { detail, selectedId },
-    remixide: { errorLoadingFile, errors, success },
-  } = useAppSelector((state: any) => state);
-  const entity = detail[selectedId].entities[id];
-  const steps = entity.steps;
-  const step = steps[stepId];
-  console.log(step);
+    workshop: {detail, selectedId},
+    remixide: {errorLoadingFile, errors, success},
+  } = useAppSelector((state: any) => state)
+  const entity = detail[selectedId].entities[id]
+  const steps = entity.steps
+  const step = steps[stepId]
+  console.log(step)
 
   useEffect(() => {
     dispatch({
       type: 'remixide/displayFile',
       payload: step,
-    });
+    })
     dispatch({
       type: 'remixide/save',
-      payload: { errors: [], success: false },
-    });
-    window.scrollTo(0, 0);
-  }, [step]);
+      payload: {errors: [], success: false},
+    })
+    window.scrollTo(0, 0)
+  }, [step])
 
   useEffect(() => {
     if (errors.length > 0 || success) {
-      window.scrollTo(0, document.documentElement.scrollHeight);
+      window.scrollTo(0, document.documentElement.scrollHeight)
     }
-  }, [errors, success]);
+  }, [errors, success])
 
   return (
     <>
@@ -57,7 +58,7 @@ function StepDetailPage() {
               dispatch({
                 type: 'remixide/displayFile',
                 payload: step,
-              });
+              })
             }}
           >
             Load the file
@@ -71,9 +72,7 @@ function StepDetailPage() {
         </>
       )}
       <div className="container-fluid">
-        <Markdown rehypePlugins={[rehypeRaw]}>
-          {step.markdown?.content}
-        </Markdown>
+        <Markdown rehypePlugins={[rehypeRaw]}>{step.markdown?.content}</Markdown>
       </div>
       {step.test?.content ? (
         <>
@@ -85,7 +84,7 @@ function StepDetailPage() {
                   dispatch({
                     type: 'remixide/displayFile',
                     payload: step,
-                  });
+                  })
                 }}
               >
                 Load the file
@@ -100,7 +99,7 @@ function StepDetailPage() {
                         dispatch({
                           type: 'remixide/testStep',
                           payload: step,
-                        });
+                        })
                       }}
                     >
                       Check Answer
@@ -112,7 +111,7 @@ function StepDetailPage() {
                           dispatch({
                             type: 'remixide/showAnswer',
                             payload: step,
-                          });
+                          })
                         }}
                       >
                         Show answer
@@ -126,11 +125,7 @@ function StepDetailPage() {
                         <button
                           className="nav-item rounded-0 nav-link btn btn-success test"
                           onClick={() => {
-                            navigate(
-                              stepId === steps.length - 1
-                                ? `/list?id=${id}`
-                                : `/detail?id=${id}&stepId=${stepId + 1}`,
-                            );
+                            navigate(stepId === steps.length - 1 ? `/list?id=${id}` : `/detail?id=${id}&stepId=${stepId + 1}`)
                           }}
                         >
                           Next
@@ -142,7 +137,7 @@ function StepDetailPage() {
                               dispatch({
                                 type: 'remixide/showAnswer',
                                 payload: step,
-                              });
+                              })
                             }}
                           >
                             Show answer
@@ -159,11 +154,7 @@ function StepDetailPage() {
             <button
               className="w-100 rounded-0 nav-item nav-link btn btn-success"
               onClick={() => {
-                navigate(
-                  stepId === steps.length - 1
-                    ? `/list?id=${id}`
-                    : `/detail?id=${id}&stepId=${stepId + 1}`,
-                );
+                navigate(stepId === steps.length - 1 ? `/list?id=${id}` : `/detail?id=${id}&stepId=${stepId + 1}`)
               }}
             >
               Next
@@ -171,28 +162,19 @@ function StepDetailPage() {
           )}
           <div id="errors">
             {success && (
-              <div
-                className="alert rounded-0 alert-success mb-0 mt-0"
-                role="alert"
-              >
+              <div className="alert rounded-0 alert-success mb-0 mt-0" role="alert">
                 Well done! No errors.
               </div>
             )}
             {errors.length > 0 && (
               <>
                 {!success && (
-                  <div
-                    className="alert rounded-0 alert-danger mb-0 mt-0"
-                    role="alert"
-                  >
+                  <div className="alert rounded-0 alert-danger mb-0 mt-0" role="alert">
                     Errors
                   </div>
                 )}
                 {errors.map((error: string, index: number) => (
-                  <div
-                    key={index}
-                    className="alert rounded-0 alert-warning mb-0 mt-0"
-                  >
+                  <div key={index} className="alert rounded-0 alert-warning mb-0 mt-0">
                     {error}
                   </div>
                 ))}
@@ -210,7 +192,7 @@ function StepDetailPage() {
                   dispatch({
                     type: 'remixide/showAnswer',
                     payload: step,
-                  });
+                  })
                 }}
               >
                 Show answer
@@ -221,7 +203,7 @@ function StepDetailPage() {
             <button
               className="w-100 btn btn-success"
               onClick={() => {
-                navigate(`/detail?id=${id}&stepId=${stepId + 1}`);
+                navigate(`/detail?id=${id}&stepId=${stepId + 1}`)
               }}
             >
               Next
@@ -231,7 +213,7 @@ function StepDetailPage() {
             <button
               className="w-100 btn btn-success"
               onClick={() => {
-                navigate(`/list?id=${id}`);
+                navigate(`/list?id=${id}`)
               }}
             >
               Finish tutorial
@@ -240,7 +222,7 @@ function StepDetailPage() {
         </>
       )}
     </>
-  );
+  )
 }
 
-export default StepDetailPage;
+export default StepDetailPage
diff --git a/apps/learneth/src/pages/StepList/index.tsx b/apps/learneth/src/pages/StepList/index.tsx
index cba5fc583d..1c05930e24 100644
--- a/apps/learneth/src/pages/StepList/index.tsx
+++ b/apps/learneth/src/pages/StepList/index.tsx
@@ -1,16 +1,17 @@
-import React from 'react';
-import { Link } from 'react-router-dom';
-import Markdown from 'react-markdown';
-import BackButton from '../../components/BackButton';
-import SlideIn from '../../components/SlideIn';
-import { useAppSelector } from '../../redux/hooks';
-import './index.scss';
+import React from 'react'
+import {Link, useLocation} from 'react-router-dom'
+import Markdown from 'react-markdown'
+import BackButton from '../../components/BackButton'
+import SlideIn from '../../components/SlideIn'
+import {useAppSelector} from '../../redux/hooks'
+import './index.scss'
 
 function StepListPage(): JSX.Element {
-  const queryParams = new URLSearchParams(location.search);
-  const id = queryParams.get('id') as string;
-  const { detail, selectedId } = useAppSelector((state) => state.workshop);
-  const entity = detail[selectedId].entities[id];
+  const location = useLocation()
+  const queryParams = new URLSearchParams(location.search)
+  const id = queryParams.get('id') as string
+  const {detail, selectedId} = useAppSelector((state) => state.workshop)
+  const entity = detail[selectedId].entities[id]
 
   return (
     <>
@@ -27,18 +28,14 @@ function StepListPage(): JSX.Element {
       <SlideIn>
         <article className="list-group m-3">
           {entity.steps.map((step: any, i: number) => (
-            <Link
-              key={i}
-              to={`/detail?id=${id}&stepId=${i}`}
-              className="rounded-0 btn btn-light border-bottom text-left steplink"
-            >
+            <Link key={i} to={`/detail?id=${id}&stepId=${i}`} className="rounded-0 btn btn-light border-bottom text-left steplink">
               {step.name} »
             </Link>
           ))}
         </article>
       </SlideIn>
     </>
-  );
+  )
 }
 
-export default StepListPage;
+export default StepListPage