diff --git a/src/client/src/components/home_image.js b/src/client/src/components/homeimage.js
similarity index 86%
rename from src/client/src/components/home_image.js
rename to src/client/src/components/homeimage.js
index 144c7df..8d251ee 100644
--- a/src/client/src/components/home_image.js
+++ b/src/client/src/components/homeimage.js
@@ -2,7 +2,7 @@ import * as React from "react";
 import { BrowserRouter as Router, Link, Route, Routes } from "react-router-dom";
 import logo from "./../Asura2222.png";
 
-export default function Home_Image() {
+export default function HomeImage() {
   return (
     <Link to="/">
       <img src={logo} alt="Tournament logo"></img>
diff --git a/src/client/src/components/manage_button.js b/src/client/src/components/managebutton.js
similarity index 70%
rename from src/client/src/components/manage_button.js
rename to src/client/src/components/managebutton.js
index 8039a50..4bc43bb 100644
--- a/src/client/src/components/manage_button.js
+++ b/src/client/src/components/managebutton.js
@@ -1,9 +1,9 @@
 import React from "react";
 import { BrowserRouter as Router, Link, Route, Routes } from "react-router-dom";
 
-export default function Manage_Button(props) {
+export default function ManageButton(props) {
   return (
-    <button className="Manage_Button">
+    <button className="ManageButton">
       <Link to="/tournament/manage">Manage Tournament</Link>
     </button>
   );
diff --git a/src/client/src/components/overview_button.js b/src/client/src/components/overviewbutton.js
similarity index 68%
rename from src/client/src/components/overview_button.js
rename to src/client/src/components/overviewbutton.js
index 0c64b32..15f87fb 100644
--- a/src/client/src/components/overview_button.js
+++ b/src/client/src/components/overviewbutton.js
@@ -1,9 +1,9 @@
 import React from "react";
 import { BrowserRouter as Router, Link, Route, Routes } from "react-router-dom";
 
-export default function Overview_Button(props) {
+export default function OverviewButton(props) {
   return (
-    <button className="Overview_Button">
+    <button className="OverviewButton">
       <Link to="/tournament">View Tournament</Link>
     </button>
   );
diff --git a/src/client/src/components/save_button.js b/src/client/src/components/save_button.js
deleted file mode 100644
index 43b93a7..0000000
--- a/src/client/src/components/save_button.js
+++ /dev/null
@@ -1,10 +0,0 @@
-import * as React from "react";
-import { BrowserRouter as Router, Link, Route, Routes } from "react-router-dom";
-
-export default function Save_Button(props) {
-    return (
-      <Link to="/">
-        <button>Create Tournament!</button>
-      </Link>
-    );
-  }
\ No newline at end of file
diff --git a/src/client/src/components/savebutton.js b/src/client/src/components/savebutton.js
new file mode 100644
index 0000000..c38f689
--- /dev/null
+++ b/src/client/src/components/savebutton.js
@@ -0,0 +1,10 @@
+import * as React from "react";
+import { BrowserRouter as Router, Link, Route, Routes } from "react-router-dom";
+
+export default function SaveButton(props) {
+  return (
+    <Link to="/">
+      <button>Create Tournament!</button>
+    </Link>
+  );
+}
diff --git a/src/client/src/create_tournament.js b/src/client/src/create_tournament.js
deleted file mode 100644
index 7f4ad89..0000000
--- a/src/client/src/create_tournament.js
+++ /dev/null
@@ -1,43 +0,0 @@
-import * as React from "react";
-import { BrowserRouter as Router, Link, Route, Routes } from "react-router-dom";
-import Save_Button from "./components/save_button";
-import Home_Image from "./components/home_image";
-
-function Format_Selector(props) {
-  return (
-    <div>
-      <select>
-        <option value="Single Elimination">Single Elimination</option>
-        <option value="Double Elimination">Double Elimination</option>
-      </select>
-    </div>
-  );
-}
-
-function Create_Form(props) {
-  return (
-    <form>
-      <label for="organizer">Tournament Organizer:</label><br />
-      <input type="text" id="organizer" /><br />
-      <label for="name">Tournament Name:</label><br />
-      <input type="text" id="name" /><br />
-      <label for="description">Description</label><br />
-      <input type="text" id="description" /><br />
-      <label for="image">Tournament Image:</label><br />
-      <input type="image" id="image" /><br />
-      <label for="date">Start Time:</label><br />
-      <input type="date" id="date" /><br />
-    </form>
-  )
-}
-
-export default function Create_Tournament(props) {
-  return (
-    <React.Fragment>
-      <Home_Image />
-      <Create_Form />
-      <Format_Selector />
-      <Save_Button />
-    </React.Fragment>
-  );
-}
diff --git a/src/client/src/createtournament.js b/src/client/src/createtournament.js
new file mode 100644
index 0000000..f496a25
--- /dev/null
+++ b/src/client/src/createtournament.js
@@ -0,0 +1,55 @@
+import * as React from "react";
+import { BrowserRouter as Router, Link, Route, Routes } from "react-router-dom";
+import SaveButton from "./components/savebutton";
+import HomeImage from "./components/homeimage";
+
+function FormatSelector(props) {
+  return (
+    <div>
+      <select>
+        <option value="Single Elimination">Single Elimination</option>
+        <option value="Double Elimination">Double Elimination</option>
+      </select>
+    </div>
+  );
+}
+
+function CreateForm(props) {
+  return (
+    <React.Fragment>
+      <form>
+        <label for="organizer">Tournament Organizer:</label>
+        <input type="text" id="organizer" />
+        <br />
+        <label for="name">Tournament Name:</label>
+        <input type="text" id="name" />
+        <br />
+        <label for="description">Description:</label>
+        <input type="text" id="description" />
+        <br />
+        <label for="image">Tournament Image:</label>
+        <input
+          type="file"
+          id="image"
+          accept="image/png, image/jpeg, image/jpg"
+        />
+        <br />
+        <label for="date">Start Date:</label>
+        <input type="date" id="date" />
+        <input type="time" id="time" />
+        <br />
+      </form>
+    </React.Fragment>
+  );
+}
+
+export default function CreateTournament(props) {
+  return (
+    <React.Fragment>
+      <HomeImage />
+      <CreateForm />
+      <FormatSelector />
+      <SaveButton />
+    </React.Fragment>
+  );
+}
diff --git a/src/client/src/front_page.js b/src/client/src/front_page.js
deleted file mode 100644
index e99fffc..0000000
--- a/src/client/src/front_page.js
+++ /dev/null
@@ -1,73 +0,0 @@
-import * as React from "react";
-import { BrowserRouter as Router, Link, Route, Routes } from "react-router-dom";
-import Manage_Button from "./components/manage_button";
-import Create_Tournament from "./create_tournament.js";
-import Tournament_Overview from "./tournament_overview.js";
-import Tournament_Manager from "./manage_tournament.js";
-import Home_Image from "./components/home_image";
-
-import 'bootstrap/dist/css/bootstrap.min.css'
-import Button from 'react-boostrap/Button'
-import Container from 'react-boostrap/Container'
-import Card from 'react-boostrap/Card'
-
-function Create_Button(props) {
-  return (
-    <Button className="Create_Button" variant='primary'>
-      <Link to="/create">Create Tournament</Link>
-    </Button>
-  );
-}
-
-function Overview_Button(props) {
-  return (
-    <Button className="Overview_Button" variant='secondary'>
-      <Link to="/tournament">View Tournament</Link>
-    </Button>
-  );
-}
-
-function ListElement(props) {
-  return (
-    <Container>
-      <Card className="ListElement">
-        <div className="tournamentDetails">
-          {props.name}, {props.competitors} competitors, Date: {props.date}
-        </div>
-        <Manage_Button />
-        <Overview_Button />
-      </Card>
-    </Container>
-  );
-}
-
-function Home() {
-  return (
-    <React.StrictMode>
-      <Home_Image />
-      <Create_Button />
-      <Card id="tournamentList">
-        <ListElement name="Weekend Warmup" competitors="16" date="29.04.2022" />
-        <ListElement
-          name="Saturday Showdown"
-          competitors="8"
-          date="30.04.2022"
-        />
-        <ListElement name="Sunday Funday" competitors="64" date="01.05.2022" />
-      </Card>
-    </React.StrictMode>
-  );
-}
-
-export default function App() {
-  return (
-    <Router>
-      <Routes>
-        <Route path="/" element={<Home />} />
-        <Route path="/create" element={<Create_Tournament />} />
-        <Route path="/tournament" element={<Tournament_Overview />} />
-        <Route path="/tournament/manage" element={<Tournament_Manager />} />
-      </Routes>
-    </Router>
-  );
-}
diff --git a/src/client/src/frontpage.js b/src/client/src/frontpage.js
new file mode 100644
index 0000000..14fc92b
--- /dev/null
+++ b/src/client/src/frontpage.js
@@ -0,0 +1,79 @@
+import * as React from "react";
+import { BrowserRouter as Router, Link, Route, Routes } from "react-router-dom";
+import ManageButton from "./components/managebutton";
+import CreateTournament from "./createtournament.js";
+import TournamentOverview from "./tournamentoverview.js";
+import TournamentManager from "./managetournament.js";
+import HomeImage from "./components/homeimage";
+
+import "bootstrap/dist/css/bootstrap.min.css";
+import Button from "react-bootstrap/Button";
+import Container from "react-bootstrap/Container";
+import Card from "react-bootstrap/Card";
+import Row from "react-bootstrap/Row";
+import Col from "react-bootstrap/Col";
+
+function CreateButton(props) {
+  return (
+    <Link to="/create">
+      <Button variant="primary">Create Tournament</Button>
+    </Link>
+  );
+}
+
+function OverviewButton(props) {
+  return (
+    <Button variant="secondary">
+      <Link to="/tournament">View Tournament</Link>
+    </Button>
+  );
+}
+
+function ListElement(props) {
+  return (
+    <Container>
+      <Row>
+        <Col xs={6}>
+          {props.name}, {props.competitors} competitors, Date: {props.date}
+        </Col>
+        <Col>
+          <ManageButton />
+        </Col>
+        <Col>
+          <OverviewButton />
+        </Col>
+      </Row>
+    </Container>
+  );
+}
+
+function Home() {
+  return (
+    <React.StrictMode>
+      <HomeImage />
+      <CreateButton />
+      <Container>
+        <ListElement name="Weekend Warmup" competitors="16" date="29.04.2022" />
+        <ListElement
+          name="Saturday Showdown"
+          competitors="8"
+          date="30.04.2022"
+        />
+        <ListElement name="Sunday Funday" competitors="64" date="01.05.2022" />
+      </Container>
+    </React.StrictMode>
+  );
+}
+
+export default function App() {
+  return (
+    <Router>
+      <Routes>
+        <Route path="/" element={<Home />} />
+        <Route path="/create" element={<CreateTournament />} />
+        <Route path="/tournament" element={<TournamentOverview />} />
+        <Route path="/tournament/manage" element={<TournamentManager />} />
+      </Routes>
+    </Router>
+  );
+}
diff --git a/src/client/src/index.js b/src/client/src/index.js
index 2f72208..4e90d2d 100644
--- a/src/client/src/index.js
+++ b/src/client/src/index.js
@@ -1,7 +1,7 @@
 import React from "react";
 import ReactDOM from "react-dom";
 import "./index.css";
-import App from "./front_page.js";
+import App from "./frontpage.js";
 
 ReactDOM.render(
   <React.StrictMode>
diff --git a/src/client/src/manage_tournament.js b/src/client/src/manage_tournament.js
deleted file mode 100644
index 45ee2e3..0000000
--- a/src/client/src/manage_tournament.js
+++ /dev/null
@@ -1,33 +0,0 @@
-import * as React from "react";
-import { BrowserRouter as Router, Link, Route, Routes } from "react-router-dom";
-import Home_Image from "./components/home_image";
-
-function Manage_Tournament(props) {
-  return (
-    <form>
-      <label>Edit name: <br />
-        <input type="text" id="edtName" /><br />
-      </label>
-      <label>Edit description: <br />
-        <input type="text" id="edtDesc" /><br />
-      </label>
-      <label>Edit image: <br />
-        <input type="image" id="edtImage" /><br />
-      </label>
-      <label>Edit start time: <br />
-        <input type="date" id="edtTime" /><br />
-      </label>
-    </form>
-  )
-}
-
-
-export default function Tournament_Manager() {
-  return (
-    <React.Fragment>
-      <Home_Image />
-      <Manage_Tournament />
-      <Save_Button />
-    </React.Fragment>
-  );
-}
diff --git a/src/client/src/managetournament.js b/src/client/src/managetournament.js
new file mode 100644
index 0000000..395d742
--- /dev/null
+++ b/src/client/src/managetournament.js
@@ -0,0 +1,42 @@
+import * as React from "react";
+import { BrowserRouter as Router, Link, Route, Routes } from "react-router-dom";
+import HomeImage from "./components/homeimage";
+import SaveButton from "./components/savebutton";
+
+function ManageTournament(props) {
+  return (
+    <React.Fragment>
+      <form>
+        <label>Edit name: </label>
+        <input type="text" id="edtName" />
+        <br />
+        <label>Edit description: </label>
+        <input type="text" id="edtDesc" />
+        <br />
+        <label>Edit image: </label>
+        <input
+          type="file"
+          id="edtImage"
+          accept="image/png, image/jpeg, image/jpg"
+        />
+        <br />
+        <label>Edit start time: </label>
+        <input type="date" id="edtDate" />
+        <input type="time" id="edtTime" />
+        <br />
+        <br />
+      </form>
+      <button>.</button>
+    </React.Fragment>
+  );
+}
+
+export default function TournamentManager() {
+  return (
+    <React.Fragment>
+      <HomeImage />
+      <ManageTournament />
+      <SaveButton />
+    </React.Fragment>
+  );
+}
diff --git a/src/client/src/tournament_overview.js b/src/client/src/tournament_overview.js
deleted file mode 100644
index aed295b..0000000
--- a/src/client/src/tournament_overview.js
+++ /dev/null
@@ -1,7 +0,0 @@
-import * as React from "react";
-import { BrowserRouter as Router, Link, Route, Routes } from "react-router-dom";
-import Home_Image from "./components/home_image";
-
-export default function Tournament_Overview(props) {
-  return <Home_Image />;
-}
diff --git a/src/client/src/tournamentoverview.js b/src/client/src/tournamentoverview.js
new file mode 100644
index 0000000..5409b1c
--- /dev/null
+++ b/src/client/src/tournamentoverview.js
@@ -0,0 +1,7 @@
+import * as React from "react";
+import { BrowserRouter as Router, Link, Route, Routes } from "react-router-dom";
+import HomeImage from "./components/homeimage";
+
+export default function TournamentOverview(props) {
+  return <HomeImage />;
+}