diff --git a/src/App.js b/src/App.js
index a5e5fca..cb579d2 100644
--- a/src/App.js
+++ b/src/App.js
@@ -2,9 +2,7 @@ import { FirebaseConfig } from "./config/Config";
 import { initializeApp } from "firebase/app";
 import {Routes, Route} from "react-router-dom";
 
-import "react-bootstrap/Container"
-import "react-bootstrap/Navbar"
-import "react-bootstrap/Nav"
+import { Header } from "./components/Header";
 import './App.css';
 import { About } from "./pages/About";
 import { Home } from "./pages/Home";
diff --git a/src/components/Header.js b/src/components/Header.js
new file mode 100644
index 0000000..18309ed
--- /dev/null
+++ b/src/components/Header.js
@@ -0,0 +1,16 @@
+import Container from "react-bootstrap/Container"
+import Navbar from "react-bootstrap/Navbar"
+import Nav from "react-bootstrap/Nav"
+
+export function Header ( props ) {
+    return (    <Navbar>
+        <Container>
+          <Navbar.Brand>App</Navbar.Brand>
+          <Nav>
+            <Nav.Link href="/">Home</Nav.Link>
+            <Nav.Link href="/about">About</Nav.Link>
+            <Nav.Link href="/contact">Contact</Nav.Link>
+            </Nav>
+        </Container>
+      </Navbar>)
+}
\ No newline at end of file