diff --git a/src/components/App.tsx b/src/components/App.tsx
index eab3b939da6cd0d3f12587143ff6ad5bbb5c1fb0..bc57898940b8482e2423086ca14e540d15368ad3 100644
--- a/src/components/App.tsx
+++ b/src/components/App.tsx
@@ -9,6 +9,8 @@ import {
   faChalkboardTeacher,
 } from "@fortawesome/free-solid-svg-icons";
 import StandardView from "./pages/StandardView";
+import { Switch, Route } from "react-router-dom";
+import SignIn from "./pages/SignIn";
 
 type AppState = {
   toggledLeft: boolean;
@@ -83,29 +85,37 @@ class App extends React.Component<{}, AppState> {
 
     return (
       <>
-        <TopBar
-          pages={horizontalBarPages}
-          onFavIconClick={(e) => {
-            e.preventDefault();
-            this.toggleLeftBar();
-          }}
-          onUserIconClick={(e) => {
-            e.preventDefault();
-            this.toggleRightBar();
-          }}
-        />
+        <Switch>
+          <Route path="/signin">
+            <SignIn />
+          </Route>
 
-        <StandardView
-          pages={horizontalBarPages}
-          toggledLeft={this.state.toggledLeft}
-          toggledRight={this.state.toggledRight}
-          onOverlayClick={(e) => {
-            e.preventDefault();
-            this.setState({ toggledLeft: false, toggledRight: false });
-          }}
-        />
+          <Route path="/">
+            <TopBar
+              pages={horizontalBarPages}
+              onFavIconClick={(e) => {
+                e.preventDefault();
+                this.toggleLeftBar();
+              }}
+              onUserIconClick={(e) => {
+                e.preventDefault();
+                this.toggleRightBar();
+              }}
+            />
 
-        <BottomBar pages={horizontalBarPages} />
+            <StandardView
+              pages={horizontalBarPages}
+              toggledLeft={this.state.toggledLeft}
+              toggledRight={this.state.toggledRight}
+              onOverlayClick={(e) => {
+                e.preventDefault();
+                this.setState({ toggledLeft: false, toggledRight: false });
+              }}
+            />
+
+            <BottomBar pages={horizontalBarPages} />
+          </Route>
+        </Switch>
       </>
     );
   }
diff --git a/src/components/pages/SignIn/index.tsx b/src/components/pages/SignIn/index.tsx
new file mode 100644
index 0000000000000000000000000000000000000000..904eefd990a865a002579f15dda500ef28af3de7
--- /dev/null
+++ b/src/components/pages/SignIn/index.tsx
@@ -0,0 +1,11 @@
+import React from "react";
+
+const SignIn: React.FC = () => {
+  return (
+    <>
+      Sign In
+    </>
+  );
+};
+
+export default SignIn;