diff --git a/src/frontend/package-lock.json b/src/frontend/package-lock.json
index 463d76023..af3545a45 100644
--- a/src/frontend/package-lock.json
+++ b/src/frontend/package-lock.json
@@ -28,6 +28,7 @@
         "react": "^18.2.0",
         "react-dom": "^18.2.0",
         "react-infinite-scroll-component": "^6.1.0",
+        "react-router-dom": "^6.4.2",
         "react-scripts": "^5.0.1",
         "styled-components": "^5.3.6",
         "web-vitals": "^2.1.4"
@@ -3502,6 +3503,14 @@
         "url": "https://opencollective.com/popperjs"
       }
     },
+    "node_modules/@remix-run/router": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/@remix-run/router/-/router-1.0.2.tgz",
+      "integrity": "sha512-GRSOFhJzjGN+d4sKHTMSvNeUPoZiDHWmRnXfzaxrqe7dE/Nzlc8BiMSJdLDESZlndM7jIUrZ/F4yWqVYlI0rwQ==",
+      "engines": {
+        "node": ">=14"
+      }
+    },
     "node_modules/@rollup/plugin-babel": {
       "version": "5.3.1",
       "resolved": "https://registry.npmjs.org/@rollup/plugin-babel/-/plugin-babel-5.3.1.tgz",
@@ -13364,6 +13373,36 @@
         "node": ">=0.10.0"
       }
     },
+    "node_modules/react-router": {
+      "version": "6.4.2",
+      "resolved": "https://registry.npmjs.org/react-router/-/react-router-6.4.2.tgz",
+      "integrity": "sha512-Rb0BAX9KHhVzT1OKhMvCDMw776aTYM0DtkxqUBP8dNBom3mPXlfNs76JNGK8wKJ1IZEY1+WGj+cvZxHVk/GiKw==",
+      "dependencies": {
+        "@remix-run/router": "1.0.2"
+      },
+      "engines": {
+        "node": ">=14"
+      },
+      "peerDependencies": {
+        "react": ">=16.8"
+      }
+    },
+    "node_modules/react-router-dom": {
+      "version": "6.4.2",
+      "resolved": "https://registry.npmjs.org/react-router-dom/-/react-router-dom-6.4.2.tgz",
+      "integrity": "sha512-yM1kjoTkpfjgczPrcyWrp+OuQMyB1WleICiiGfstnQYo/S8hPEEnVjr/RdmlH6yKK4Tnj1UGXFSa7uwAtmDoLQ==",
+      "dependencies": {
+        "@remix-run/router": "1.0.2",
+        "react-router": "6.4.2"
+      },
+      "engines": {
+        "node": ">=14"
+      },
+      "peerDependencies": {
+        "react": ">=16.8",
+        "react-dom": ">=16.8"
+      }
+    },
     "node_modules/react-scripts": {
       "version": "5.0.1",
       "resolved": "https://registry.npmjs.org/react-scripts/-/react-scripts-5.0.1.tgz",
@@ -18547,6 +18586,11 @@
       "resolved": "https://registry.npmjs.org/@popperjs/core/-/core-2.11.6.tgz",
       "integrity": "sha512-50/17A98tWUfQ176raKiOGXuYpLyyVMkxxG6oylzL3BPOlA6ADGdK7EYunSa4I064xerltq9TGXs8HmOk5E+vw=="
     },
+    "@remix-run/router": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/@remix-run/router/-/router-1.0.2.tgz",
+      "integrity": "sha512-GRSOFhJzjGN+d4sKHTMSvNeUPoZiDHWmRnXfzaxrqe7dE/Nzlc8BiMSJdLDESZlndM7jIUrZ/F4yWqVYlI0rwQ=="
+    },
     "@rollup/plugin-babel": {
       "version": "5.3.1",
       "resolved": "https://registry.npmjs.org/@rollup/plugin-babel/-/plugin-babel-5.3.1.tgz",
@@ -25605,6 +25649,23 @@
       "resolved": "https://registry.npmjs.org/react-refresh/-/react-refresh-0.11.0.tgz",
       "integrity": "sha512-F27qZr8uUqwhWZboondsPx8tnC3Ct3SxZA3V5WyEvujRyyNv0VYPhoBg1gZ8/MV5tubQp76Trw8lTv9hzRBa+A=="
     },
+    "react-router": {
+      "version": "6.4.2",
+      "resolved": "https://registry.npmjs.org/react-router/-/react-router-6.4.2.tgz",
+      "integrity": "sha512-Rb0BAX9KHhVzT1OKhMvCDMw776aTYM0DtkxqUBP8dNBom3mPXlfNs76JNGK8wKJ1IZEY1+WGj+cvZxHVk/GiKw==",
+      "requires": {
+        "@remix-run/router": "1.0.2"
+      }
+    },
+    "react-router-dom": {
+      "version": "6.4.2",
+      "resolved": "https://registry.npmjs.org/react-router-dom/-/react-router-dom-6.4.2.tgz",
+      "integrity": "sha512-yM1kjoTkpfjgczPrcyWrp+OuQMyB1WleICiiGfstnQYo/S8hPEEnVjr/RdmlH6yKK4Tnj1UGXFSa7uwAtmDoLQ==",
+      "requires": {
+        "@remix-run/router": "1.0.2",
+        "react-router": "6.4.2"
+      }
+    },
     "react-scripts": {
       "version": "5.0.1",
       "resolved": "https://registry.npmjs.org/react-scripts/-/react-scripts-5.0.1.tgz",
diff --git a/src/frontend/package.json b/src/frontend/package.json
index c699c60a5..e1d87929f 100644
--- a/src/frontend/package.json
+++ b/src/frontend/package.json
@@ -23,6 +23,7 @@
     "react": "^18.2.0",
     "react-dom": "^18.2.0",
     "react-infinite-scroll-component": "^6.1.0",
+    "react-router-dom": "^6.4.2",
     "react-scripts": "^5.0.1",
     "styled-components": "^5.3.6",
     "web-vitals": "^2.1.4"
diff --git a/src/frontend/public/index.html b/src/frontend/public/index.html
index c79cf8fa8..1e0a2f980 100644
--- a/src/frontend/public/index.html
+++ b/src/frontend/public/index.html
@@ -12,6 +12,7 @@
       homescreen on Android. See https://developers.google.com/web/fundamentals/engage-and-retain/web-app-manifest/
     -->
     <link rel="manifest" href="%PUBLIC_URL%/manifest.json" />
+    <link rel="shortcut icon" href="#" />
     <!--
       Notice the use of %PUBLIC_URL% in the tags above.
       It will be replaced with the URL of the `public` folder during the build.
diff --git a/src/frontend/src/.eslintrc.json b/src/frontend/src/.eslintrc.json
index 107be7c9b..7e5eac6cd 100644
--- a/src/frontend/src/.eslintrc.json
+++ b/src/frontend/src/.eslintrc.json
@@ -31,5 +31,6 @@
 
    "overrides": [],
    "plugins": ["react", "@typescript-eslint"],
-   "rules": {}
+   "rules": {},
+   "ignorePatterns": ["**/*.css"]
 }
diff --git a/src/frontend/src/App.tsx b/src/frontend/src/App.tsx
index a8074f757..60adba433 100644
--- a/src/frontend/src/App.tsx
+++ b/src/frontend/src/App.tsx
@@ -1,14 +1,24 @@
 import React from 'react';
+import { BrowserRouter, Route, Routes } from 'react-router-dom';
 import './App.css';
+import Header from './components/Header';
+import Login from './components/Login';
 import Searching from './components/SearchAndDisplayResults';
 
 function App() {
    return (
       <div className="App">
-         {/*<LeftSection/>
-         <Header/>
-         <Login/>*/}
-         <Searching />
+         <BrowserRouter>
+            <Header />
+            <Routes>
+               <Route path="/login">
+                  <Route index element={<Login />} />
+               </Route>
+               <Route path="/">
+                  <Route index element={<Searching />} />
+               </Route>
+            </Routes>
+         </BrowserRouter>
       </div>
    );
 }
diff --git a/src/frontend/src/components/List.tsx b/src/frontend/src/components/List.tsx
deleted file mode 100644
index 6e0fee9ce..000000000
--- a/src/frontend/src/components/List.tsx
+++ /dev/null
@@ -1,34 +0,0 @@
-import React from 'react';
-import data from '../staticdata.json';
-import './SearchBarStyles.css';
-import SingleCard from './SingleCard';
-
-interface Props {
-   props: string;
-}
-
-const List = ({ props }: Props) => {
-   // eslint-disable-next-line
-   const filteredData = data.filter((el: any) => {
-      if (props === '') {
-         return el;
-      } else if (el.name) {
-         return el.name.toLowerCase().includes(props);
-      }
-   });
-   return (
-      <div className="list">
-         {filteredData.splice(0, 5).map((apartment, index) => {
-            if (props !== '') {
-               return (
-                  <div key={index} className="box">
-                     <p key={apartment.id}>{apartment.name}</p>
-                  </div>
-               );
-            }
-         })}
-      </div>
-   );
-};
-
-export default List;
diff --git a/src/frontend/src/components/SearchAndDisplayResults.tsx b/src/frontend/src/components/SearchAndDisplayResults.tsx
index b13f0024d..55834ee63 100644
--- a/src/frontend/src/components/SearchAndDisplayResults.tsx
+++ b/src/frontend/src/components/SearchAndDisplayResults.tsx
@@ -1,19 +1,27 @@
-import { ToggleButton, ToggleButtonGroup } from '@mui/material';
-import React, { useState, useRef, useCallback, KeyboardEvent } from 'react';
+import {
+   Autocomplete,
+   Stack,
+   TextField,
+   ToggleButton,
+   ToggleButtonGroup,
+} from '@mui/material';
+import React, { useState, useRef, useCallback } from 'react';
 import SingleCard from './SingleCard';
-import useSearchApartment from './getsApartments';
-import SearchBar from './SearchBar';
+import data from '../staticdata.json';
+import getApartments from './getApartments';
+import { useSearchParams } from 'react-router-dom';
+import './SearchBarStyles.css';
 
 export default function Searching() {
    const [query, setQuery] = useState('');
+   const [searchParams, setSearchParams] = useSearchParams();
    const [pageNum, setPageNum] = useState(1);
-   const [press, setPress] = useState(false);
+   const press = false;
    const emptyarray: string[] = [];
    const [selected, setSelected] = useState(emptyarray);
-   const { loading, error, apartments, hasMore } = useSearchApartment(
+   const { loading, error, apartments, hasMore } = getApartments(
       query,
       pageNum,
-      press,
       selected
    );
 
@@ -33,52 +41,25 @@ export default function Searching() {
       [loading, hasMore]
    );
 
-   /*const handleChange = (e: React.ChangeEvent<HTMLInputElement>) => {
-      setQuery(e.target.value);
-      setPageNum(1);
-      setPress(false);
-   };
-
-   const handlePress = (e: KeyboardEvent<HTMLInputElement>) => {
-      // POST request when enter is pressed
-      if (e.key === 'Enter') {
-         e.preventDefault();
-         setPress(true);
+   const handleSubmit = (
+      event: React.SyntheticEvent<Element, Event>,
+      value: string
+   ) => {
+      event.preventDefault();
+      setQuery(value);
+      if (value === '') {
+         searchParams.delete('searchQuery');
+         searchParams.set('search', 'False');
+      } else {
+         searchParams.set('searchQuery', value);
+         searchParams.set('search', 'True');
       }
+      searchParams.set('numApts', '10');
+      setSearchParams(searchParams);
    };
 
-   function handlePost(query: string, select: string[]) {
-      // POST request of the query and buttons selected
-      axios({
-         method: 'POST',
-         url: 'http://localhost:3333/mockdata',
-         data: {
-            q: query,
-            selected: select,
-         },
-         headers: {
-            'Content-Type': 'application/json',
-         },
-      })
-         .then((response) => {
-            console.log(response);
-         })
-         .catch((error) => {
-            if (error.response) {
-               console.log(error.response);
-               console.log(error.response.status);
-               console.log(error.response.headers);
-            }
-         });
-   }*/
-
-   //useEffect(() => {
-   // triggers a post request whenever a button is selected
-   //   handlePost(query, selected);
-   //}, [selected]);
-
    const handleToggle = (
-      event: React.MouseEvent<HTMLElement>,
+      event: React.SyntheticEvent<Element, Event>,
       newSelected: string[]
    ) => {
       // prevents "high-low" and "low-high" from being selected at the same time
@@ -93,25 +74,40 @@ export default function Searching() {
          }
       }
       setSelected(newSelected);
+      // sets URL
+      if (newSelected.includes('low-high')) {
+         searchParams.set('priceSort', '-1');
+      } else if (newSelected.includes('high-low')) {
+         searchParams.set('priceSort', '1');
+      } else {
+         searchParams.delete('priceSort');
+      }
+      if (newSelected.includes('most popular')) {
+         searchParams.set('ratingSort', '1');
+      } else {
+         searchParams.delete('ratingSort');
+      }
+      setSearchParams(searchParams);
    };
 
    return (
       <div className="App">
          <div>
-            <div style={{ display: 'flex', justifyContent: 'center' }}>
-               {/*<div className="search" style={{ width: '800px' }}>
-                  <TextField
-                     id="outlined-basic"
-                     variant="outlined"
-                     fullWidth
-                     value={query || ''}
-                     label="Apartment Search"
-                     onKeyDown={handlePress}
-                     onChange={handleChange}
+            <div style={{ display: 'flex', justifyContent: 'center' }}></div>
+            <h1>Apartment Search</h1>
+            <div className="search">
+               <Stack spacing={2} sx={{ width: 500 }}>
+                  <Autocomplete
+                     id="free-solo-demo"
+                     freeSolo
+                     onInputChange={handleSubmit}
+                     options={data.map((option) => option.name)}
+                     renderInput={(params) => (
+                        <TextField {...params} label="Search" />
+                     )}
                   />
-               </div>*/}
+               </Stack>
             </div>
-            <SearchBar />
             <br />
             <ToggleButtonGroup
                color="primary"
diff --git a/src/frontend/src/components/SearchBar.tsx b/src/frontend/src/components/SearchBar.tsx
deleted file mode 100644
index 6fa737599..000000000
--- a/src/frontend/src/components/SearchBar.tsx
+++ /dev/null
@@ -1,31 +0,0 @@
-import React from 'react';
-import { useState } from 'react';
-import TextField from '@mui/material/TextField';
-import List from './List';
-import './SearchBarStyles.css';
-
-const SearchBar = () => {
-   const [inputText, setInputText] = useState('');
-   return (
-      <div className="main">
-         <h1>Apartment Search</h1>
-         <div className="search">
-            <TextField
-               id="outlined-basic"
-               onChange={(e: React.ChangeEvent<HTMLInputElement>) =>
-                  setInputText(e.target.value.toLowerCase())
-               }
-               variant="outlined"
-               fullWidth
-               label="Search"
-               className="myInput"
-            />
-         </div>
-         <div className="myDropdown">
-            <List props={inputText} />
-         </div>
-      </div>
-   );
-};
-
-export default SearchBar;
diff --git a/src/frontend/src/components/SearchBarStyles.css b/src/frontend/src/components/SearchBarStyles.css
index c00eea9c8..b74d72757 100644
--- a/src/frontend/src/components/SearchBarStyles.css
+++ b/src/frontend/src/components/SearchBarStyles.css
@@ -4,7 +4,7 @@
    font-size: 16px;
    padding: 14px 20px 12px 45px;
    border: none;
-   margin-left: 600px;
+   margin-left: 500px;
    width: 500px;
 }
 
diff --git a/src/frontend/src/components/getApartments.tsx b/src/frontend/src/components/getApartments.tsx
new file mode 100644
index 000000000..048b1eadc
--- /dev/null
+++ b/src/frontend/src/components/getApartments.tsx
@@ -0,0 +1,82 @@
+import { useState, useEffect } from 'react';
+import axios from 'axios';
+
+function getApartments(query: string, pageNum: number, selected: string[]) {
+   const [loading, setLoading] = useState(true);
+   const [error, setError] = useState(false);
+   const array: {
+      // avoids linting warnings
+      name: string;
+      address: string;
+      image: string;
+      review: string;
+      rating: number;
+      price_min: string;
+      price_max: string;
+   }[] = [];
+   const [apartments, setApartments] = useState(array);
+   const [hasMore, setHasMore] = useState(false);
+
+   useEffect(() => {
+      // clears the apartments
+      setApartments(array);
+      pageNum = 1;
+   }, [query, selected]);
+
+   useEffect(() => {
+      // GETs new apartments whenever a button is selected
+      let limit = 2;
+      if (query === '') {
+         limit = 10;
+      }
+      setLoading(true);
+      setError(false);
+      const CancelToken = axios.CancelToken;
+      const source = CancelToken.source();
+      axios({
+         method: 'GET', //http://localhost:3333/mockdata?q=${query}&_page=${pageNum}&_limit=2
+         url: `http://localhost:3333/mockdata?q=${query}&_page=${pageNum}&_limit=${limit}`,
+         cancelToken: source.token,
+      })
+         .then((res) => {
+            const newApartments: {
+               name: string;
+               address: string;
+               image: string;
+               review: string;
+               rating: number;
+               price_min: string;
+               price_max: string;
+            }[] = [];
+            for (let i = 0; i < res.data.length; i++) {
+               if (res.data[i].name !== undefined) {
+                  newApartments.push({
+                     name: res.data[i].name,
+                     address: res.data[i].address,
+                     image: res.data[i].image,
+                     review: res.data[i].review,
+                     rating: res.data[i].rating,
+                     price_min: res.data[i].price_min,
+                     price_max: res.data[i].price_max,
+                  });
+               }
+            }
+            setApartments((prevApartments) => {
+               return [...new Set([...prevApartments, ...newApartments])];
+            });
+            setHasMore(res.data.length > 0);
+            setLoading(false);
+         })
+         .catch((e) => {
+            if (axios.isCancel(e)) return;
+            setError(true);
+         });
+      return () => {
+         source.cancel();
+      };
+   }, [query, pageNum, selected]);
+
+   return { loading, error, apartments, hasMore };
+}
+
+export default getApartments;
diff --git a/src/frontend/src/components/getsApartments.tsx b/src/frontend/src/components/getsApartments.tsx
deleted file mode 100644
index c414014c7..000000000
--- a/src/frontend/src/components/getsApartments.tsx
+++ /dev/null
@@ -1,147 +0,0 @@
-import { useState, useEffect, useRef } from 'react';
-import axios from 'axios';
-
-function useSearchApartment(
-   query: string,
-   pageNum: number,
-   press: boolean,
-   selected: string[]
-) {
-   const [loading, setLoading] = useState(true);
-   const [error, setError] = useState(false);
-   const array: {
-      // avoids linting warnings
-      name: string;
-      address: string;
-      image: string;
-      review: string;
-      rating: number;
-      price_min: string;
-      price_max: string;
-   }[] = [];
-   const [apartments, setApartments] = useState(array);
-   const [hasMore, setHasMore] = useState(false);
-
-   useEffect(() => {
-      // clears the apartments when "enter" is pressed or any button is selected
-      setApartments(array);
-   }, [press, selected]);
-
-   /* 
-   All useEffect functions are performed on page load and whenever the properties 
-   in the dependency array changes. For example, in the useEffect above, the 
-   dependency array is [press, selected], so whenever "press" or "selected" change, 
-   the useEffect is triggered.
-   */
-
-   const isInitialMount = useRef<boolean>(true); // this prevents useEffect from triggering everytime query is changed
-   useEffect(() => {
-      // populates the page on initial page load and when the search bar is ever empty
-      if (isInitialMount.current == true || query === '') {
-         isInitialMount.current = false;
-         setLoading(true);
-         setError(false);
-         const CancelToken = axios.CancelToken;
-         const source = CancelToken.source();
-         axios({
-            method: 'GET', // the "_limit=10" below is how many will be taken from the url
-            url: `http://localhost:3333/mockdata?q=${query}&_page=${pageNum}&_limit=10`,
-            cancelToken: source.token,
-         })
-            .then((res) => {
-               const newApartments: {
-                  // avoids linting warnings
-                  name: string;
-                  address: string;
-                  image: string;
-                  review: string;
-                  rating: number;
-                  price_min: string;
-                  price_max: string;
-               }[] = [];
-               for (let i = 0; i < res.data.length; i++) {
-                  newApartments.push({
-                     name: res.data[i].name,
-                     address: res.data[i].address,
-                     image: res.data[i].image,
-                     review: res.data[i].review,
-                     rating: res.data[i].rating,
-                     price_min: res.data[i].price_min,
-                     price_max: res.data[i].price_max,
-                  });
-               }
-               setApartments((prevApartments) => {
-                  // concats new apartments to the array
-                  return [...new Set([...prevApartments, ...newApartments])];
-               });
-               setHasMore(res.data.length > 0);
-               setLoading(false);
-            })
-            .catch((e) => {
-               if (axios.isCancel(e)) return;
-               setError(true);
-            });
-         return () => {
-            source.cancel();
-         };
-      }
-   }, [query]);
-
-   const isInitialPress = useRef<boolean>(true);
-   useEffect(() => {
-      // GETs new apartments whenever enter is pressed or a button is selected
-      if ((pageNum === 1 && press) || !isInitialPress.current) {
-         isInitialPress.current = false;
-         setLoading(true);
-         setError(false);
-         const CancelToken = axios.CancelToken;
-         const source = CancelToken.source();
-         axios({
-            method: 'GET', //http://localhost:3333/mockdata?q=${query}&_page=${pageNum}&_limit=2
-            url: `http://localhost:3333/mockdata?q=${query}&_page=${pageNum}&_limit=2`,
-            params: { q: query, page: pageNum },
-            cancelToken: source.token,
-         })
-            .then((res) => {
-               const newApartments: {
-                  name: string;
-                  address: string;
-                  image: string;
-                  review: string;
-                  rating: number;
-                  price_min: string;
-                  price_max: string;
-               }[] = [];
-               for (let i = 0; i < res.data.length; i++) {
-                  if (res.data[i].name !== undefined) {
-                     newApartments.push({
-                        name: res.data[i].name,
-                        address: res.data[i].address,
-                        image: res.data[i].image,
-                        review: res.data[i].review,
-                        rating: res.data[i].rating,
-                        price_min: res.data[i].price_min,
-                        price_max: res.data[i].price_max,
-                     });
-                  }
-               }
-               setApartments((prevApartments) => {
-                  return [...new Set([...prevApartments, ...newApartments])];
-               });
-               setHasMore(res.data.length > 0);
-               setLoading(false);
-            })
-            .catch((e) => {
-               if (axios.isCancel(e)) return;
-               setError(true);
-            });
-         return () => {
-            source.cancel();
-         };
-      }
-   }, [pageNum, press, selected]); // there's a bug here since pageNum will be triggered at the wrong time
-
-   return { loading, error, apartments, hasMore };
-}
-
-export default useSearchApartment;
diff --git a/src/frontend/src/staticdata.json b/src/frontend/src/staticdata.json
index a1d663184..f71562581 100644
--- a/src/frontend/src/staticdata.json
+++ b/src/frontend/src/staticdata.json
@@ -51,7 +51,7 @@
    },
    {
       "id": 6,
-      "name": "Champaign park",
+      "name": "Champ park",
       "address": "1032 E Kerr Ave",
       "review": "Slightly green",
       "image": "https://upload.wikimedia.org/wikipedia/commons/7/7f/St_James_Town1.jpg",
diff --git a/src/frontend/yarn.lock b/src/frontend/yarn.lock
index e32692ebc..fdacad468 100644
--- a/src/frontend/yarn.lock
+++ b/src/frontend/yarn.lock
@@ -1840,6 +1840,11 @@
   "resolved" "https://registry.npmjs.org/@popperjs/core/-/core-2.11.6.tgz"
   "version" "2.11.6"
 
+"@remix-run/router@1.0.2":
+  "integrity" "sha512-GRSOFhJzjGN+d4sKHTMSvNeUPoZiDHWmRnXfzaxrqe7dE/Nzlc8BiMSJdLDESZlndM7jIUrZ/F4yWqVYlI0rwQ=="
+  "resolved" "https://registry.npmjs.org/@remix-run/router/-/router-1.0.2.tgz"
+  "version" "1.0.2"
+
 "@rollup/plugin-babel@^5.2.0":
   "integrity" "sha512-WFfdLWU/xVWKeRQnKmIAQULUI7Il0gZnBIH/ZFO069wYIfPu+8zrfp/KMW0atmELoRDq8FbiP3VCss9MhCut7Q=="
   "resolved" "https://registry.npmjs.org/@rollup/plugin-babel/-/plugin-babel-5.3.1.tgz"
@@ -7894,6 +7899,21 @@
   "resolved" "https://registry.npmjs.org/react-refresh/-/react-refresh-0.11.0.tgz"
   "version" "0.11.0"
 
+"react-router-dom@^6.4.2":
+  "integrity" "sha512-yM1kjoTkpfjgczPrcyWrp+OuQMyB1WleICiiGfstnQYo/S8hPEEnVjr/RdmlH6yKK4Tnj1UGXFSa7uwAtmDoLQ=="
+  "resolved" "https://registry.npmjs.org/react-router-dom/-/react-router-dom-6.4.2.tgz"
+  "version" "6.4.2"
+  dependencies:
+    "@remix-run/router" "1.0.2"
+    "react-router" "6.4.2"
+
+"react-router@6.4.2":
+  "integrity" "sha512-Rb0BAX9KHhVzT1OKhMvCDMw776aTYM0DtkxqUBP8dNBom3mPXlfNs76JNGK8wKJ1IZEY1+WGj+cvZxHVk/GiKw=="
+  "resolved" "https://registry.npmjs.org/react-router/-/react-router-6.4.2.tgz"
+  "version" "6.4.2"
+  dependencies:
+    "@remix-run/router" "1.0.2"
+
 "react-scripts@^5.0.1":
   "integrity" "sha512-8VAmEm/ZAwQzJ+GOMLbBsTdDKOpuZh7RPs0UymvBR2vRk4iZWCskjbFnxqjrzoIvlNNRZ3QJFx6/qDSi6zSnaQ=="
   "resolved" "https://registry.npmjs.org/react-scripts/-/react-scripts-5.0.1.tgz"