1 files changed, 29 insertions, 0 deletions
diff --git a/client/src/App.tsx b/client/src/App.tsx
new file mode 100644
index 0000000..edd9504
--- /dev/null
+++ b/client/src/App.tsx
@@ -0,0 +1,29 @@
+import React from "react";
+import { BrowserRouter as Router, Switch, Route } from "react-router-dom";
+import { Header } from "./Header/Header";
+import { About } from "./About/About";
+import { Mancala } from "./Mancala/Mancala";
+import "./App.css";
+
+export function App() {
+    return (
+        <Router>
+            {/* The header with navigation options is always on top of every page */}
+            <Header />
+
+            <div className="main-content">
+                <Switch>
+                    {/* If the user goes to the url /about, show the about page */}
+                    <Route path="/about">
+                        <About />
+                    </Route>
+
+                    {/* If the user goes to any other url, show the play page */}
+                    <Route path="/">
+                        <Mancala />
+                    </Route>
+                </Switch>
+            </div>
+        </Router>
+    )
+}
+\ No newline at end of file