diff --git a/src/App.css b/src/App.css
deleted file mode 100644
index e69de29..0000000
diff --git a/src/App.js b/src/App.js
deleted file mode 100644
index 676bc70..0000000
--- a/src/App.js
+++ /dev/null
@@ -1,17 +0,0 @@
-import { ThemeProvider, createGlobalStyle } from 'styled-components';
-import { theme } from './styles/theme.js'
-import NavBar from './components/NavBar'
-
-import './App.css';
-
-function App() {
-  return (
-    <div className="App">
-      <ThemeProvider theme={theme}>
-        <NavBar/>
-      </ThemeProvider>
-    </div>
-  );
-}
-
-export default App;
diff --git a/src/Main.js b/src/Main.js
new file mode 100644
index 0000000..f18cda0
--- /dev/null
+++ b/src/Main.js
@@ -0,0 +1,7 @@
+import NavBar from './components/NavBar'
+
+export default function Main() {
+    return (
+        <NavBar />
+    )
+}
\ No newline at end of file
diff --git a/src/styles/theme.js b/src/assets/theme.js
similarity index 100%
rename from src/styles/theme.js
rename to src/assets/theme.js
diff --git a/src/components/VerticalAppbar.js b/src/components/VerticalAppbar.js
index 07868f9..8c137f5 100644
--- a/src/components/VerticalAppbar.js
+++ b/src/components/VerticalAppbar.js
@@ -2,6 +2,8 @@ import { Toolbar } from "@material-ui/core";
 
 function VerticalAppBar() {
     return(
-        Toolbar
+        AppBar(
+            
+        )
     );
 }
\ No newline at end of file
diff --git a/src/index.js b/src/index.js
index 9d7b688..6332931 100644
--- a/src/index.js
+++ b/src/index.js
@@ -1,17 +1,28 @@
 import React from 'react';
-import ReactDOM from 'react-dom/client';
-import './index.css';
-import App from './App';
+import ReactDOM from 'react-dom';
 import reportWebVitals from './utils/reportWebVitals';
+import { ThemeProvider, createGlobalStyle } from 'styled-components';
+import { theme } from './assets/theme.js'
+import './styles.css';
 
-const root = ReactDOM.createRoot(document.getElementById('root'));
-root.render(
-  <React.StrictMode>
-    <App />
-  </React.StrictMode>
-);
+import Main from './Main.js'
+
+function App() {
+  return (
+    <React.StrictMode>
+      <div className="App">
+        <ThemeProvider theme={theme}>
+          <Main/>
+        </ThemeProvider>
+      </div>
+    </React.StrictMode>
+  );
+}
 
 // If you want to start measuring performance in your app, pass a function
 // to log results (for example: reportWebVitals(console.log))
 // or send to an analytics endpoint. Learn more: https://bit.ly/CRA-vitals
 reportWebVitals();
+
+const rootElement = document.getElementById("root");
+ReactDOM.render(<App />, rootElement);
\ No newline at end of file
diff --git a/src/index.css b/src/styles.css
similarity index 100%
rename from src/index.css
rename to src/styles.css