[U] Router

frontend/src/App.sass

@@ -1,19 +0,0 @@
-.App
-  text-align: center
-
-.App-logo
-  height: 40vmin
-  pointer-events: none
-
-.App-header
-  background-color: #282c34
-  min-height: 100vh
-  display: flex
-  flex-direction: column
-  align-items: center
-  justify-content: center
-  font-size: calc(10px + 2vmin)
-  color: white
-
-.App-link
-  color: #61dafb

frontend/src/App.test.tsx

@@ -1,9 +0,0 @@
-import React from 'react';
-import { render, screen } from '@testing-library/react';
-import App from './App';
-
-test('renders learn react link', () => {
-  render(<App />);
-  const linkElement = screen.getByText(/learn react/i);
-  expect(linkElement).toBeInTheDocument();
-});

frontend/src/App.tsx

@@ -1,15 +0,0 @@
-import React from 'react';
-import './App.sass';
-import {Route, BrowserRouter as Router} from "react-router-dom";
-
-function App() {
-  return <Router>
-    <div className="App">
-      <Route path="/about"></Route>
-      <Route path="/users"></Route>
-      <Route path="/"></Route>
-    </div>
-  </Router>
-}
-
-export default App;

frontend/src/index.tsx

@@ -1,15 +1,23 @@
 import React from 'react';
 import ReactDOM from 'react-dom/client';
 import './index.sass';
-import App from './App';
 import reportWebVitals from './reportWebVitals';
+import {createBrowserRouter, RouterProvider} from "react-router-dom";
+import Welcome from "./pages/Welcome";
+
+const router = createBrowserRouter([
+  {
+    path: '/',
+    element: <Welcome/>,
+  }
+])
 
 const root = ReactDOM.createRoot(
   document.getElementById('root') as HTMLElement
 );
 root.render(
   <React.StrictMode>
-    <App />
+    <RouterProvider router={router} />
   </React.StrictMode>
 );
 

frontend/src/pages/Welcome.tsx

@@ -0,0 +1,9 @@
+export default function Welcome()
+{
+  return <>
+    <div>Duolingo++</div>
+
+    <button>Login</button>
+    <button>Signup</button>
+  </>
+}