diff --git a/views/about.ejs b/views/about.ejs
new file mode 100644
index 0000000..4f99dae
--- /dev/null
+++ b/views/about.ejs
@@ -0,0 +1,5 @@
+
+<%-include('partials/header')-%>
+<h1>About </h1>
+<p> <%=aboutContent%> </p>
+<%-include('partials/footer')-%>
diff --git a/views/compose.ejs b/views/compose.ejs
new file mode 100644
index 0000000..11a78bf
--- /dev/null
+++ b/views/compose.ejs
@@ -0,0 +1,9 @@
+<%-include('partials/header')-%>
+<h1>Compose</h1>
+<form action = '/compose' method = "post">
+<div class = "form-group">
+<b>Title</b><br><input class = "form-control"type = "text" name ="postTitle"/>
+<b>Post</b><br><textarea class = "form-control"name="postData" rows="5" cols="30"></textarea>
+</div>
+<button type = "submit" name = "submit" class = "btn btn-primary">Publish</button>
+<%-include('partials/footer')-%>
diff --git a/views/contact.ejs b/views/contact.ejs
new file mode 100644
index 0000000..ba600f8
--- /dev/null
+++ b/views/contact.ejs
@@ -0,0 +1,4 @@
+<%-include('partials/header')-%>
+<h1>Contact </h1>
+<p> <%=contactContent%> </p>
+<%-include('partials/footer')-%>
diff --git a/views/home.ejs b/views/home.ejs
new file mode 100644
index 0000000..a802246
--- /dev/null
+++ b/views/home.ejs
@@ -0,0 +1,16 @@
+<!-- import header and footer from the partials folder -->
+<!--the scriptlet tag allows us to write js inside the ejs file-->
+<!-- <% used for js code in the ejs file%> -->
+<%-include('partials/header.ejs')-%>
+<h1>Home</h1>
+<p> <%= homeContent %> </p>
+
+<% posts.forEach(function(post) { %>
+<h1> <%=post.title%> </h1>
+  <p>
+    <%=post.content.slice(0,100) +'...' %>
+    <a href = "/posts/<%=post.title%>">Read more</a>
+  </p>
+
+<% }) %>
+<%-include('partials/footer')-%>
diff --git a/views/partials/footer.ejs b/views/partials/footer.ejs
new file mode 100644
index 0000000..f1e51df
--- /dev/null
+++ b/views/partials/footer.ejs
@@ -0,0 +1,9 @@
+
+</div>
+<div class="footer-padding"></div>
+  <div class="footer">
+    <p>Made with ❤️ by The App Brewery</p>
+  </div>
+</div>
+</body>
+</html>
diff --git a/views/partials/header.ejs b/views/partials/header.ejs
new file mode 100644
index 0000000..dc4dcbf
--- /dev/null
+++ b/views/partials/header.ejs
@@ -0,0 +1,25 @@
+<!DOCTYPE html>
+<html lang="en" dir="ltr">
+
+<head>
+  <meta charset="utf-8">
+  <title>Daily Journal</title>
+  <meta charset="utf-8">
+  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
+  <link rel="stylesheet" href="/css/styles.css">
+  <nav class="navbar navbar-default">
+    <div class="container">
+      <div class="navbar-header">
+        <p class="navbar-brand">DAILY JOURNAL</p>
+      </div>
+        <ul class="nav navbar-nav navbar-right">
+          <!-- 6 -->
+          <li id="home"><a href="/">HOME</a></li>
+          <li id="about"><a href="/about">ABOUT US</a></li>
+          <li id="contact"><a href="/contact">CONTACT US</a></li>
+        </ul>
+    </div>
+  </nav>
+
+  <body>
+    <div class="container">
diff --git a/views/post.ejs b/views/post.ejs
new file mode 100644
index 0000000..24915e2
--- /dev/null
+++ b/views/post.ejs
@@ -0,0 +1,4 @@
+<%-include('partials/header.ejs')-%>
+<h1> <%= postTitle %> </h1>
+<p>  <%=postContent %> </p>
+<%-include('partials/footer')-%>
