diff --git a/nodemon.json b/nodemon.json
new file mode 100644
index 0000000..44ce3e3
--- /dev/null
+++ b/nodemon.json
@@ -0,0 +1,3 @@
+{
+  "ignore": ["data/*"]
+}
diff --git a/package-lock.json b/package-lock.json
index 0780663..911c25d 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -26,9 +26,27 @@
         "path": "^0.12.7"
       },
       "devDependencies": {
+        "@faker-js/faker": "^9.8.0",
         "pm2": "^6.0.6"
       }
     },
+    "node_modules/@faker-js/faker": {
+      "version": "9.8.0",
+      "resolved": "https://registry.npmjs.org/@faker-js/faker/-/faker-9.8.0.tgz",
+      "integrity": "sha512-U9wpuSrJC93jZBxx/Qq2wPjCuYISBueyVUGK7qqdmj7r/nxaxwW8AQDCLeRO7wZnjj94sh3p246cAYjUKuqgfg==",
+      "dev": true,
+      "funding": [
+        {
+          "type": "opencollective",
+          "url": "https://opencollective.com/fakerjs"
+        }
+      ],
+      "license": "MIT",
+      "engines": {
+        "node": ">=18.0.0",
+        "npm": ">=9.0.0"
+      }
+    },
     "node_modules/@isaacs/cliui": {
       "version": "8.0.2",
       "resolved": "https://registry.npmjs.org/@isaacs/cliui/-/cliui-8.0.2.tgz",
diff --git a/package.json b/package.json
index 953572a..03dc6a5 100644
--- a/package.json
+++ b/package.json
@@ -33,6 +33,7 @@
     "path": "^0.12.7"
   },
   "devDependencies": {
+    "@faker-js/faker": "^9.8.0",
     "pm2": "^6.0.6"
   }
 }
diff --git a/public/css/footer.css b/public/css/footer.css
index dc9c922..42615c5 100644
--- a/public/css/footer.css
+++ b/public/css/footer.css
@@ -48,9 +48,7 @@
 footer nav {
   margin-top: 0;
   margin-bottom: 0;
-  /* Make the nav a flex container to arrange its children horizontally */
   display: flex;
-  /* Space out the items evenly */
   gap: 1.5rem; /* Adjust this value to control spacing between links */
   /* If you want them centered within the nav */
   justify-content: center;
diff --git a/public/css/header.css b/public/css/header.css
index 38b78bf..0186ce4 100644
--- a/public/css/header.css
+++ b/public/css/header.css
@@ -2,7 +2,7 @@
 header {
   background-color: #2c3e50;
   color: #ecf0f1;
-  box-shadow: 0 2px 5px rgba(0,0,0,0.1);
+  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
 }
 
 header .container {
@@ -13,9 +13,34 @@
   padding: 1rem 0;
 }
 
-header h1 {
+header .logo {
   font-size: 1.8rem;
-  font-weight: 700;
+  font-weight: bolder;
+  position: relative;
+}
+
+header .logo a {
+  color: inherit;
+  text-decoration: none;
+  position: relative;
+  display: inline-block;
+}
+
+header .logo a::after {
+  content: "";
+  position: absolute;
+  left: 0;
+  bottom: -2px;
+  width: 100%;
+  height: 2px;
+  background-color: #ecf0f1;
+  transform: scaleX(0);
+  transform-origin: left;
+  transition: transform 0.3s ease;
+}
+
+header .logo a:hover::after {
+  transform: scaleX(1);
 }
 
 header nav {
diff --git a/public/css/main.css b/public/css/main.css
index 7b5cff9..e3e94a6 100644
--- a/public/css/main.css
+++ b/public/css/main.css
@@ -7,7 +7,7 @@
   box-shadow: 0 2px 6px rgba(0,0,0,0.05);
 }
 
-main h2 {
+main h1 {
   font-size: 1.5rem;
   font-weight: 600;
   margin-bottom: 1rem;
diff --git a/public/css/nav.css b/public/css/nav.css
index b27490e..0120b73 100644
--- a/public/css/nav.css
+++ b/public/css/nav.css
@@ -1,8 +1,3 @@
-.sidebar h3.menu-year,
-.sidebar h4,
-.sidebar a {
-  text-transform: capitalize !important;
-}
 /* Navigation adjustments for small screens */
 @media (max-width: 600px) {
   nav {
diff --git a/public/css/newsletter.css b/public/css/newsletter.css
new file mode 100644
index 0000000..5d2e716
--- /dev/null
+++ b/public/css/newsletter.css
@@ -0,0 +1,46 @@
+form {
+  max-width: 400px;
+  margin: 1rem auto;
+  padding: 1rem;
+  background: #f5f7fa;
+  border-radius: 6px;
+  box-shadow: 0 2px 6px rgba(44, 62, 80, 0.15);
+  font-family: Arial, sans-serif;
+}
+
+label {
+  display: block;
+  margin-bottom: 0.25rem;
+  font-weight: 600;
+  color: #2c3e50;
+}
+
+input[type="email"] {
+  width: 100%;
+  padding: 0.5rem 0.75rem;
+  border: 1.5px solid #ccc;
+  border-radius: 4px;
+  font-size: 1rem;
+  transition: border-color 0.3s ease;
+}
+
+input[type="email"]:focus {
+  border-color: #2980b9;
+  outline: none;
+}
+
+button[type="submit"] {
+  margin-top: 1rem;
+  padding: 0.6rem 1.2rem;
+  background-color: #2980b9;
+  color: #ecf0f1;
+  border: none;
+  border-radius: 4px;
+  font-weight: 700;
+  cursor: pointer;
+  transition: background-color 0.25s ease;
+}
+
+button[type="submit"]:hover {
+  background-color: #1f598a;
+}
diff --git a/public/css/page.css b/public/css/page.css
index de48217..44ad59b 100644
--- a/public/css/page.css
+++ b/public/css/page.css
@@ -1,5 +1,5 @@
 
-.page-content {
+.markdown-content {
     max-width: 900px;
     margin: 0; /* Remove auto centering since it's already in a flex container */
     padding: 3rem 2.5rem;
@@ -12,7 +12,7 @@
     position: relative;
 }
 
-.page-content::before {
+.markdown-content::before {
     content: '';
     position: absolute;
     top: 0;
@@ -22,8 +22,8 @@
     background: linear-gradient(90deg, #667eea 0%, #764ba2 100%);
     border-radius: 12px 12px 0 0;
 }
-
-.page-content h1 {
+/* 
+.markdown-content h1 {
     font-size: 3.2rem;
     color: #1a202c;
     margin-bottom: 1rem;
@@ -38,9 +38,9 @@
     padding-bottom: 1.5rem;
     border-bottom: 3px solid #e2e8f0;
     margin-bottom: 2.5rem;
-}
+} */
 
-.page-content h2 {
+.markdown-content h1 {
     font-size: 1.9rem;
     color: #2d3748;
     margin-top: 3.5rem;
@@ -52,7 +52,7 @@
     padding-left: 1rem;
 }
 
-.page-content h2::before {
+.markdown-content h1::before {
     content: '';
     position: absolute;
     left: 0;
@@ -63,7 +63,7 @@
     border-radius: 2px;
 }
 
-.page-content p {
+.markdown-content p {
     font-size: 1.125rem;
     margin-bottom: 1.5rem;
     color: #4a5568;
@@ -71,7 +71,7 @@
     hyphens: auto;
 }
 
-.page-content h2 + p {
+.markdown-content h1 + p {
     font-size: 1.2rem;
     color: #2d3748;
     font-weight: 500;
@@ -79,7 +79,7 @@
 }
 
 
-.page-content ul {
+.markdown-content ul {
     list-style: none;
     margin-left: 0;
     padding-left: 0;
@@ -87,7 +87,7 @@
     space-y: 1rem;
 }
 
-.page-content ul li {
+.markdown-content ul li {
     margin-bottom: 1.5rem;
     padding-left: 2rem;
     position: relative;
@@ -99,12 +99,12 @@
     transition: transform 0.2s ease, box-shadow 0.2s ease;
 }
 
-.page-content ul li:hover {
+.markdown-content ul li:hover {
     transform: translateY(-2px);
     box-shadow: 0 4px 16px rgba(0, 0, 0, 0.08);
 }
 
-.page-content ul li::before {
+.markdown-content ul li::before {
     content: '▸';
     position: absolute;
     left: 1rem;
@@ -114,17 +114,17 @@
     font-weight: bold;
 }
 
-.page-content ul li p {
+.markdown-content ul li p {
     margin-bottom: 0.8rem;
     font-size: 1.1rem;
     line-height: 1.6;
 }
 
-.page-content ul li p:last-child {
+.markdown-content ul li p:last-child {
     margin-bottom: 0;
 }
 
-.page-content hr {
+.markdown-content hr {
     border: none;
     height: 1px;
     background: linear-gradient(90deg, transparent 0%, #cbd5e0 20%, #cbd5e0 80%, transparent 100%);
@@ -132,7 +132,7 @@
     position: relative;
 }
 
-.page-content hr::after {
+.markdown-content hr::after {
     content: '✦';
     position: absolute;
     top: 50%;
@@ -144,7 +144,7 @@
     font-size: 1.2rem;
 }
 
-.page-content strong {
+.markdown-content strong {
     font-weight: 700;
     /* color: #2d3748; */
     color: #4a5568;
@@ -153,13 +153,13 @@
     border-radius: 4px;
 }
 
-.page-content strong {
+.markdown-content strong {
     font-weight: 700; /* Keeps it bold */
      /* Slightly darker than regular paragraph text for subtle emphasis */
     /* Removed background, padding, and border-radius */
 }
 
-.page-content a {
+.markdown-content a {
     color: #667eea;
     text-decoration: none;
     font-weight: 600;
@@ -167,7 +167,7 @@
     transition: color 0.3s ease;
 }
 
-.page-content a::after {
+.markdown-content a::after {
     content: '';
     position: absolute;
     bottom: -2px;
@@ -178,16 +178,16 @@
     transition: width 0.3s ease;
 }
 
-.page-content a:hover {
+.markdown-content a:hover {
     color: #764ba2;
 }
 
-.page-content a:hover::after {
+.markdown-content a:hover::after {
     width: 100%;
 }
 
 /* Social media links special styling */
-.page-content ul li a {
+.markdown-content ul li a {
     display: inline-flex;
     align-items: center;
     padding: 0.5rem 1rem;
@@ -200,80 +200,80 @@
     margin-right: 0.5rem;
 }
 
-.page-content ul li a:hover {
+.markdown-content ul li a:hover {
     transform: translateY(-2px);
     box-shadow: 0 4px 12px rgba(102, 126, 234, 0.4);
     color: white;
 }
 
-.page-content ul li a::after {
+.markdown-content ul li a::after {
     display: none; /* Remove the underline effect for these buttons */
 }
 
 @media (max-width: 900px) {
-    .page-content {
+    .markdown-content {
         padding: 2rem 1.5rem;
         margin: 0 1rem;
         border-radius: 8px;
     }
     
-    .page-content h1 {
+    /* .markdown-content h1 {
         font-size: 2.5rem;
-    }
+    } */
     
-    .page-content h2 {
+    .markdown-content h1 {
         font-size: 1.6rem;
         margin-top: 2.5rem;
     }
 }
 
 @media (max-width: 600px) {
-    .page-content {
+    .markdown-content {
         padding: 1.5rem 1rem;
         margin: 0 0.5rem;
         border-radius: 6px;
     }
     
-    .page-content h1 {
+    /* .markdown-content h1 {
         font-size: 2rem;
         padding-bottom: 1rem;
         margin-bottom: 1.5rem;
-    }
+    } */
     
-    .page-content h2 {
+    .markdown-content h1 {
         font-size: 1.4rem;
         margin-top: 2rem;
     }
     
-    .page-content p {
+    .markdown-content p {
         font-size: 1rem;
         text-align: left;
     }
     
-    .page-content ul li {
+    .markdown-content ul li {
         padding: 1rem 1rem 1rem 2.5rem;
         margin-bottom: 1rem;
     }
     
-    .page-content hr {
+    .markdown-content hr {
         margin: 2.5rem 0;
     }
 }
 
 @media (max-width: 480px) {
-    .page-content {
+    .markdown-content {
         padding: 1rem 0.8rem;
     }
     
-    .page-content h1 {
+    /* .markdown-content h1 {
         font-size: 1.8rem;
-    }
+    } */
     
-    .page-content h2 {
+    .markdown-content h1 {
         font-size: 1.3rem;
     }
     
-    .page-content ul li a {
+    .markdown-content ul li a {
         display: block;
         margin-bottom: 0.5rem;
         text-align: center;
diff --git a/public/css/placeholder.css b/public/css/placeholder.css
index a874c0d..a65d445 100644
--- a/public/css/placeholder.css
+++ b/public/css/placeholder.css
@@ -9,14 +9,14 @@
   color: #666;
 }
 
-h2 {
+h1 {
   font-size: 2.5rem;
   font-weight: 600;
   color: #333;
   margin-top: 1rem;
   margin-bottom: 0.5rem;
 }
-h3 {
+h2 {
   font-size: 1.8rem;
   font-weight: 500;
   color: #444;
diff --git a/public/css/post.css b/public/css/post.css
index 84e19c5..5a03f89 100644
--- a/public/css/post.css
+++ b/public/css/post.css
@@ -1,22 +1,22 @@
-.post-content > * + * {
+.markdown-content > * + * {
     margin-top: 1.5rem;
   }
-  .post-content p, .post-content li {
+  .markdown-content p, .markdown-content li {
     line-height: 1.6;
     letter-spacing: 0.02em;
   }
-  .post-content p,
-  .post-content li {
+  .markdown-content p,
+  .markdown-content li {
     max-width: 60ch;
     line-height: 1.6;
     margin-bottom: 1.25rem;
   }
-  .post-content h2, .post-content h3 {
+  .markdown-content h1, .markdown-content h2 {
     margin-top: 2rem;
     margin-bottom: 1rem;
     font-weight: 700;
   }
-  .post-content pre {
+  .markdown-content pre {
     background-color: #2d2d2d;
     color: #ccc;
     padding: 1rem;
@@ -27,19 +27,19 @@
     margin-bottom: 1.5rem;
   }
   
-  .post-content code {
+  .markdown-content code {
     padding: 0.15rem 0.3rem;
     border-radius: 3px;
     font-family: monospace;
     font-size: 0.9rem;
   }
-  .post-content img {
+  .markdown-content img {
     max-width: 100%;
     height: auto;
     margin: 1rem 0;
     display: block;
   }
-  .post-content blockquote {
+  .markdown-content blockquote {
     border-left: 4px solid #ccc;
     padding-left: 1rem;
     color: #667;
@@ -47,12 +47,12 @@
     margin: 1rem 0;
   }
 
-  .post-content a {
+  .markdown-content a {
     color: #0366d6;
     text-decoration: none;
   }
   
-  .post-content a:hover {
+  .markdown-content a:hover {
     text-decoration: underline;
   }
   
\ No newline at end of file
diff --git a/public/css/sidebar.css b/public/css/sidebar.css
index 97aff11..835befa 100644
--- a/public/css/sidebar.css
+++ b/public/css/sidebar.css
@@ -8,7 +8,11 @@
   font-family: Arial, sans-serif;
   box-shadow: 2px 0 5px rgba(0, 0, 0, 0.05);
 }
-
+.sidebar h3.menu-year,
+.sidebar h4,
+.sidebar a {
+  text-transform: capitalize !important;
+}
 .sidebar .menu-year {
   font-weight: 700;
   font-size: 1.2rem;
diff --git a/public/css/styles.css b/public/css/styles.css
index a15825a..e243488 100644
--- a/public/css/styles.css
+++ b/public/css/styles.css
@@ -3,6 +3,7 @@
 @import url('layout.css');
 @import url('header.css');
 @import url('sidebar.css');
+@import url('toc.css');
 @import url('main.css');
 @import url('footer.css');
 @import url('responsive.css');
diff --git a/public/css/toc.css b/public/css/toc.css
new file mode 100644
index 0000000..9c2cbd3
--- /dev/null
+++ b/public/css/toc.css
@@ -0,0 +1,184 @@
+/* Enhanced TOC Styles */
+.toc {
+  background: #f8f9fa;
+  border: 1px solid #e9ecef;
+  border-radius: 8px;
+  box-sizing: border-box;
+  margin-bottom: 1em;
+  padding: 1.5em;
+  transition: all 0.3s ease;
+  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
+}
+
+.toc.sticky {
+  position: fixed;
+  top: 20px;
+  z-index: 1000;
+  max-height: calc(100vh - 40px);
+  overflow-y: auto;
+  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.15);
+  border-color: #dee2e6;
+}
+
+.toc.sticky.bottom-boundary {
+  position: fixed;
+  max-height: none;
+  overflow-y: auto;
+}
+
+/* Custom Scrollbar - Subtle and Non-intrusive */
+.toc::-webkit-scrollbar {
+  width: 6px;
+}
+
+.toc::-webkit-scrollbar-track {
+  background: transparent;
+  border-radius: 3px;
+}
+
+.toc::-webkit-scrollbar-thumb {
+  background: rgba(0, 0, 0, 0.2);
+  border-radius: 3px;
+  transition: background 0.3s ease;
+}
+
+.toc::-webkit-scrollbar-thumb:hover {
+  background: rgba(0, 0, 0, 0.4);
+}
+
+/* Firefox Scrollbar */
+.toc {
+  scrollbar-width: thin;
+  scrollbar-color: rgba(0, 0, 0, 0.2) transparent;
+}
+
+/* TOC Content Styles */
+.toc ul {
+  list-style: none;
+  padding: 0;
+  margin: 0;
+}
+
+.toc li {
+  margin: 0.5rem 0;
+  position: relative;
+}
+
+.toc li.h3 {
+  margin-left: 1rem;
+  font-size: 0.9rem;
+}
+
+.toc a {
+  display: block;
+  padding: 0.5rem 0.75rem;
+  text-decoration: none;
+  color: #495057;
+  border-radius: 4px;
+  transition: all 0.2s ease;
+  border-left: 3px solid transparent;
+  word-wrap: break-word;
+  line-height: 1.4;
+}
+
+.toc a:hover {
+  background-color: #e9ecef;
+  color: #2c3e50;
+  border-left-color: #007bff;
+  transform: translateX(2px);
+}
+
+.toc a:focus {
+  outline: 2px solid #007bff;
+  outline-offset: 2px;
+}
+
+/* Active link highlighting */
+.toc a.active {
+  background-color: #e3f2fd;
+  color: #1976d2;
+  border-left-color: #1976d2;
+  font-weight: 600;
+}
+
+.toc-header {
+  font-weight: 700;
+  font-size: 1.1rem;
+  margin-bottom: 1rem;
+  color: #2c3e50;
+  border-bottom: 2px solid #dee2e6;
+  padding-bottom: 0.5rem;
+  text-transform: uppercase;
+  letter-spacing: 0.5px;
+}
+
+/* Responsive adjustments */
+@media (max-width: 900px) {
+  .toc.sticky {
+    position: relative;
+    top: auto;
+    left: auto;
+    width: auto !important;
+    max-height: 300px;
+    z-index: auto;
+  }
+}
+
+@media (max-width: 600px) {
+  .toc {
+    padding: 1rem;
+    margin-bottom: 1.5rem;
+  }
+  
+  .toc-header {
+    font-size: 1rem;
+  }
+  
+  .toc a {
+    padding: 0.4rem 0.5rem;
+    font-size: 0.9rem;
+  }
+  
+  .toc li.h3 {
+    margin-left: 0.5rem;
+  }
+}
+
+/* Sidebar adjustments for better TOC integration */
+.sidebar {
+  width: 250px;
+  background-color: #f8f9fa;
+  border-right: 1px solid #e0e0e0;
+  padding: 1em;
+  font-size: 0.95rem;
+  font-family: Arial, sans-serif;
+  box-shadow: 2px 0 5px rgba(0, 0, 0, 0.05);
+  position: relative; /* Ensure proper positioning context */
+}
+
+/* Ensure proper spacing between sidebar sections */
+.sidebar nav > * + .toc {
+  margin-top: 2rem;
+  border-top: 1px solid #dee2e6;
+  padding-top: 1.5rem;
+}
+
+/* Animation for smooth transitions */
+.toc {
+  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
+}
+
+.toc.sticky {
+  animation: slideInSticky 0.3s ease-out;
+}
+
+@keyframes slideInSticky {
+  from {
+    opacity: 0;
+    transform: translateY(-10px);
+  }
+  to {
+    opacity: 1;
+    transform: translateY(0);
+  }
+}
diff --git a/public/css/tools.css b/public/css/tools.css
index af6740f..5450e97 100644
--- a/public/css/tools.css
+++ b/public/css/tools.css
@@ -24,11 +24,10 @@
     background: linear-gradient(90deg, #667eea 0%, #764ba2 100%);
     border-radius: 12px 12px 0 0;
 }
-
-/* --- Main Page Title (H1) --- */
+/* 
 .page-content h1 {
     font-size: 3.2rem;
-    color: #1a202c; /* Fallback color */
+    color: #1a202c; 
     margin-bottom: 1rem;
     line-height: 1.2;
     text-align: center;
@@ -41,10 +40,10 @@
     padding-bottom: 1.5rem;
     border-bottom: 3px solid #e2e8f0;
     margin-bottom: 2.5rem;
-}
+} */
 
-/* --- Section Headings (H2) --- */
-.page-content h2 {
+/* --- Section Headings (h1) --- */
+.page-content h1 {
     font-size: 1.9rem;
     color: #2d3748;
     margin-top: 3.5rem;
@@ -56,8 +55,8 @@
     padding-left: 1rem;
 }
 
-/* --- H2 Left Border/Accent --- */
-.page-content h2::before {
+/* --- h1 Left Border/Accent --- */
+.page-content h1::before {
     content: '';
     position: absolute;
     left: 0;
@@ -77,8 +76,8 @@
     hyphens: auto;
 }
 
-/* --- Paragraphs immediately following H2 --- */
-.page-content h2 + p {
+/* --- Paragraphs immediately following h1 --- */
+.page-content h1 + p {
     font-size: 1.2rem;
     color: #2d3748;
     font-weight: 500;
@@ -246,12 +245,12 @@
         margin: 0 1rem;
         border-radius: 8px;
     }
-    
+/*     
     .page-content h1 {
         font-size: 2.5rem;
-    }
+    } */
     
-    .page-content h2 {
+    .page-content h1 {
         font-size: 1.6rem;
         margin-top: 2.5rem;
     }
@@ -263,14 +262,14 @@
         margin: 0 0.5rem;
         border-radius: 6px;
     }
-    
+/*     
     .page-content h1 {
         font-size: 2rem;
         padding-bottom: 1rem;
         margin-bottom: 1.5rem;
-    }
+    } */
     
-    .page-content h2 {
+    .page-content h1 {
         font-size: 1.4rem;
         margin-top: 2rem;
     }
@@ -307,12 +306,12 @@
     .page-content {
         padding: 1rem 0.8rem;
     }
-    
+/*     
     .page-content h1 {
         font-size: 1.8rem;
-    }
+    } */
     
-    .page-content h2 {
+    .page-content h1 {
         font-size: 1.3rem;
     }
     
diff --git a/public/js/post.js b/public/js/post.js
index 5df5298..9625c9a 100644
--- a/public/js/post.js
+++ b/public/js/post.js
@@ -29,40 +29,6 @@
   pre.appendChild(btn);
 });
 
-// Table of Contents Generation from h2, h3 in .post-content
-(function generateTOC() {
-  const content = document.querySelector(".post-content");
-  if (!content) return;
-  const tocContainer = document.createElement("nav");
-  tocContainer.className = "toc";
-  const tocList = document.createElement("ul");
-
-  content.querySelectorAll("h2, h3").forEach((heading) => {
-    if (!heading.id)
-      heading.id = heading.textContent
-        .trim()
-        .toLowerCase()
-        .replace(/\s+/g, "-");
-
-    const li = document.createElement("li");
-    li.className = heading.tagName.toLowerCase();
-
-    const a = document.createElement("a");
-    a.href = `#${heading.id}`;
-    a.textContent = heading.textContent;
-
-    li.appendChild(a);
-    tocList.appendChild(li);
-  });
-
-  tocContainer.appendChild(tocList);
-
-  // Insert TOC before post content or in sidebar if exists
-  const sidebar = document.querySelector(".sidebar nav");
-  if (sidebar) sidebar.appendChild(tocContainer);
-  else content.parentNode.insertBefore(tocContainer, content);
-})();
-
 // Smooth Scroll for Anchor Links
 document.querySelectorAll('a[href^="#"]').forEach((anchor) => {
   anchor.addEventListener("click", (e) => {
@@ -73,32 +39,6 @@
   });
 });
 
-// Dark Mode Toggle
-(function darkModeToggle() {
-  const toggle = document.createElement("button");
-  toggle.textContent = "Toggle Dark Mode";
-  toggle.id = "dark-mode-toggle";
-  document.body.prepend(toggle);
-
-  function applyMode(dark) {
-    document.documentElement.setAttribute(
-      "data-theme",
-      dark ? "dark" : "light"
-    );
-    localStorage.setItem("darkMode", dark);
-  }
-
-  toggle.addEventListener("click", () => {
-    const dark = document.documentElement.getAttribute("data-theme") === "dark";
-    applyMode(!dark);
-  });
-
-  // Initialize from saved preference or system
-  const saved = localStorage.getItem("darkMode");
-  if (saved !== null) applyMode(saved === "true");
-  else applyMode(window.matchMedia("(prefers-color-scheme: dark)").matches);
-})();
-
 // External Link Detection and Attributes
 document.querySelectorAll('.post-content a[href^="http"]').forEach((link) => {
   if (new URL(link.href).origin !== location.origin) {
diff --git a/public/js/sticky-toc.js b/public/js/sticky-toc.js
new file mode 100644
index 0000000..a66561f
--- /dev/null
+++ b/public/js/sticky-toc.js
@@ -0,0 +1,126 @@
+(function generateTOC() {
+  const content = document.querySelector(".markdown-content");
+  if (!content) return;
+  const headings = content.querySelectorAll("h2, h3");
+  if (headings.length <= 1) return;
+
+  const tocContainer = document.createElement("nav");
+  tocContainer.className = "toc";
+
+  const tocHeader = document.createElement("h2");
+  tocHeader.className = "toc-header";
+  tocHeader.textContent = "Table of Contents";
+  tocContainer.appendChild(tocHeader);
+
+  const tocList = document.createElement("ul");
+  headings.forEach((heading) => {
+    if (!heading.id)
+      heading.id = heading.textContent
+        .trim()
+        .toLowerCase()
+        .replace(/\s+/g, "-");
+
+    const li = document.createElement("li");
+    li.className = heading.tagName.toLowerCase();
+
+    const a = document.createElement("a");
+    a.href = `#${heading.id}`;
+    a.textContent = heading.textContent;
+
+    li.appendChild(a);
+    tocList.appendChild(li);
+  });
+  tocContainer.appendChild(tocList);
+
+  const sidebar = document.querySelector(".sidebar nav");
+  if (sidebar) sidebar.appendChild(tocContainer);
+  else content.parentNode.insertBefore(tocContainer, content);
+
+  // Enhanced sticky behavior with footer boundary
+  const tocParent = tocContainer.parentElement;
+  const footer = document.querySelector("footer");
+
+  // Get initial measurements
+  let stickyOffset = tocContainer.offsetTop;
+  let tocHeight = tocContainer.offsetHeight;
+
+  function updateStickyBehavior() {
+    const scrollTop = window.pageYOffset;
+    const windowHeight = window.innerHeight;
+    const footerTop = footer.offsetTop;
+
+    // Recalculate measurements on scroll (handles dynamic content)
+    tocHeight = tocContainer.offsetHeight;
+
+    // Calculate the maximum scroll position where TOC should stop being sticky
+    // This ensures the TOC doesn't overlap with the footer
+    const maxStickyPosition = footerTop - tocHeight - 20; // 20px buffer
+
+    if (scrollTop >= stickyOffset && scrollTop <= maxStickyPosition) {
+      // Normal sticky behavior
+      tocContainer.classList.add("sticky");
+      tocContainer.classList.remove("bottom-boundary");
+      tocContainer.style.width = `${tocParent.offsetWidth}px`;
+      const parentRect = tocParent.getBoundingClientRect();
+      tocContainer.style.left = `${parentRect.left}px`;
+      tocContainer.style.top = "20px"; // Small top margin when sticky
+      tocContainer.style.bottom = "auto";
+    } else if (scrollTop > maxStickyPosition) {
+      // Hit the footer boundary - absolute position relative to footer
+      tocContainer.classList.add("sticky");
+      tocContainer.classList.add("bottom-boundary");
+      tocContainer.style.width = `${tocParent.offsetWidth}px`;
+      const parentRect = tocParent.getBoundingClientRect();
+      tocContainer.style.left = `${parentRect.left}px`;
+      tocContainer.style.top = "auto";
+      tocContainer.style.bottom = `${
+        document.body.offsetHeight - footerTop + 20
+      }px`;
+    } else {
+      // Not sticky - normal position
+      tocContainer.classList.remove("sticky");
+      tocContainer.classList.remove("bottom-boundary");
+      tocContainer.style.width = "";
+      tocContainer.style.left = "";
+      tocContainer.style.top = "";
+      tocContainer.style.bottom = "";
+    }
+  }
+
+  // Throttle scroll event for better performance
+  let ticking = false;
+  function requestTick() {
+    if (!ticking) {
+      requestAnimationFrame(updateStickyBehavior);
+      ticking = true;
+      setTimeout(() => {
+        ticking = false;
+      }, 16); // ~60fps
+    }
+  }
+
+  window.addEventListener("scroll", requestTick);
+  window.addEventListener("resize", () => {
+    // Recalculate offset on resize
+    if (!tocContainer.classList.contains("sticky")) {
+      stickyOffset = tocContainer.offsetTop;
+    }
+    requestTick();
+  });
+
+  // Smooth scroll for TOC links
+  tocContainer.addEventListener("click", (e) => {
+    if (e.target.tagName === "A") {
+      e.preventDefault();
+      const targetId = e.target.getAttribute("href").substring(1);
+      const targetElement = document.getElementById(targetId);
+      if (targetElement) {
+        const offsetTop = targetElement.offsetTop - 80; // Account for sticky header
+        window.scrollTo({
+          top: offsetTop,
+          behavior: "smooth",
+        });
+      }
+    }
+  });
+})();
diff --git a/public/js/toggle-dark-mode.js b/public/js/toggle-dark-mode.js
new file mode 100644
index 0000000..fca02cd
--- /dev/null
+++ b/public/js/toggle-dark-mode.js
@@ -0,0 +1,25 @@
+// Dark Mode Toggle
+(function darkModeToggle() {
+  const toggle = document.createElement("button");
+  toggle.textContent = "Toggle Dark Mode";
+  toggle.id = "dark-mode-toggle";
+  document.body.prepend(toggle);
+
+  function applyMode(dark) {
+    document.documentElement.setAttribute(
+      "data-theme",
+      dark ? "dark" : "light"
+    );
+    localStorage.setItem("darkMode", dark);
+  }
+
+  toggle.addEventListener("click", () => {
+    const dark = document.documentElement.getAttribute("data-theme") === "dark";
+    applyMode(!dark);
+  });
+
+  // Initialize from saved preference or system
+  const saved = localStorage.getItem("darkMode");
+  if (saved !== null) applyMode(saved === "true");
+  else applyMode(window.matchMedia("(prefers-color-scheme: dark)").matches);
+})();
diff --git a/src/app.js b/src/app.js
index 8f25507..663e99d 100644
--- a/src/app.js
+++ b/src/app.js
@@ -5,7 +5,7 @@
 const setupMiddleware = require("./middleware");
 const { registerHelpers } = require("./utils/hbsHelpers");
 const app = express();
-const path = require("path");
+// const path = require("path");
 
 const hbs = exphbs.create({
   layoutsDir: "src/views/layouts",
diff --git a/src/middleware/index.js b/src/middleware/index.js
index 77320f7..557de6e 100644
--- a/src/middleware/index.js
+++ b/src/middleware/index.js
@@ -15,10 +15,11 @@
   morganWarn,
   morganError,
 } = require("./logging");
-const limiter = rateLimit({ windowMs: 1 * 60 * 1000, max: 100 });
 
 function setupMiddleware(app) {
-  app.use(limiter);
+  if (process.env.NODE_ENV === "production") {
+    app.use(rateLimit({ windowMs: 1 * 60 * 1000, max: 100 }));
+  }
   app.use(compression());
   app.use(morganInfo);
   app.use(morganWarn);
diff --git a/src/routes/construction.js b/src/routes/construction.js
index 11d2d73..9927584 100644
--- a/src/routes/construction.js
+++ b/src/routes/construction.js
@@ -51,14 +51,21 @@
   });
 };
 
-construction("/newsletter", "Newsletter");
+if (process.env.NODE_ENV === "production") {
+  construction("/newsletter", "Newsletter");
+  construction("/projects", "Projects");
+} else {
+  page("/projects", "projects");
+  const newsletter = require("./newsletter");
+  router.use(newsletter);
+}
+
 construction("/changelog", "Changelog");
 construction("/archive", "Archive");
 construction("/rss-feed.xml", "RSS Feed");
 construction("/tags", "Tags");
 construction("/blog", "Blog");
 
-page("/projects", "projects");
 page("/tools", "tools", "tools");
 
 module.exports = router;
diff --git a/src/routes/contact.js b/src/routes/contact.js
index a15699f..128d3ae 100644
--- a/src/routes/contact.js
+++ b/src/routes/contact.js
@@ -1,7 +1,7 @@
 // src/routes/contact.js
 const express = require("express");
 const router = express.Router();
-const sendContactMail = require("../utils/mailer");
+const sendContactMail = require("../utils/sendContactMail");
 const getBaseContext = require("../utils/baseContext");
 
 router.post("/contact", async (req, res, next) => {
diff --git a/src/routes/index.js b/src/routes/index.js
index 8d3523c..e6eb621 100644
--- a/src/routes/index.js
+++ b/src/routes/index.js
@@ -4,12 +4,26 @@
 
 const getBaseContext = require("../utils/baseContext");
 
+const newsletter = require("./newsletter");
 const contact = require("./contact");
 const about = require("./about");
 const site_map = require("./site-map");
 const post = require("./post");
 const construction = require("./construction");
 
+const isProduction = process.env.NODE_ENV === "production";
+
+if (isProduction) {
+  router.get("/newsletter", (req, res) => {
+    res.render("pages/construction", {
+      title: "Newsletter",
+      message: "This page is under construction. Please check back soon.",
+    });
+  });
+} else {
+  router.use(newsletter);
+}
+
 router.use(contact);
 router.use(about);
 router.use(site_map);
diff --git a/src/routes/newsletter.js b/src/routes/newsletter.js
new file mode 100644
index 0000000..2afd2e6
--- /dev/null
+++ b/src/routes/newsletter.js
@@ -0,0 +1,36 @@
+const express = require("express");
+const router = express.Router();
+const sendNewsletterSubscriptionMail = require("../utils/sendNewsletterSubscriptionMail");
+const { saveEmail } = require("../services/newsletterService");
+
+const getBaseContext = require("../utils/baseContext");
+
+router.get("/newsletter", async (req, res) => {
+  const context = await getBaseContext({
+    title: "Newsletter",
+  });
+  res.render("pages/newsletter.handlebars", context);
+});
+
+router.get("/newsletter/success", async (req, res) => {
+  const context = await getBaseContext({
+    title: "Thank You",
+  });
+  res.render("pages/thankyou.handlebars", context);
+});
+
+router.post("/newsletter", async (req, res, next) => {
+  const { email } = req.body;
+  if (!email) {
+    return res.status(400).send("Email is required");
+  }
+  try {
+    saveEmail(email);
+    await sendNewsletterSubscriptionMail({ email });
+    res.redirect("/newsletter/success");
+  } catch (err) {
+    next(err);
+  }
+});
+
+module.exports = router;
diff --git a/src/services/newsletterService.js b/src/services/newsletterService.js
new file mode 100644
index 0000000..400ee0f
--- /dev/null
+++ b/src/services/newsletterService.js
@@ -0,0 +1,45 @@
+// src/services/newsletterService.js
+const fs = require("fs").promises;
+const path = require("path");
+
+const filePath = path.join(__dirname, "../../data/newsletter-emails.json");
+
+async function saveEmail(email) {
+  try {
+    // Ensure the directory exists
+    await fs.mkdir(path.dirname(filePath), { recursive: true });
+
+    let data = [];
+    try {
+      const file = await fs.readFile(filePath, "utf8");
+      // Attempt to parse the file content
+      data = JSON.parse(file);
+    } catch (e) {
+      // If file doesn't exist (ENOENT) or contains invalid JSON (SyntaxError),
+      // we treat it as an empty array and proceed.
+      // Other errors should still be re-thrown.
+      if (e.code !== "ENOENT" && !(e instanceof SyntaxError)) {
+        console.error("Failed to parse newsletter-emails.json:", e);
+        throw e;
+      }
+      // If ENOENT or SyntaxError, 'data' remains an empty array, which is desired.
+    }
+    console.log("test");
+
+    if (!data.includes(email)) {
+      data.push(email);
+      try {
+        await fs.writeFile(filePath, JSON.stringify(data, null, 2));
+      } catch (err) {
+        console.error("writeFile failed:", err);
+        throw err;
+      }
+    }
+  } catch (err) {
+    console.error("Failed to save email:", err);
+    throw err;
+  }
+  console.log("test2");
+}
+
+module.exports = { saveEmail };
diff --git a/src/services/postsService.js b/src/services/postsService.js
index 378926d..a314938 100644
--- a/src/services/postsService.js
+++ b/src/services/postsService.js
@@ -1,3 +1,5 @@
+const matter = require("gray-matter");
+
 const path = require("path");
 const fs = require("fs").promises;
 
@@ -17,17 +19,24 @@
       const monthPath = path.join(yearPath, monthDir.name);
       const files = await fs.readdir(monthPath);
 
-      const posts = files
-        .filter((f) => f.endsWith(".md"))
-        .map((f) => {
-          const slug = f.replace(/\.md$/, "");
-          return {
-            slug,
-            title: slug.replace(/-/g, " "),
-            year: yearDir.name,
-            month: monthDir.name,
-          };
-        });
+      const posts = await Promise.all(
+        files
+          .filter((f) => f.endsWith(".md"))
+          .map(async (f) => {
+            const slug = f.replace(/\.md$/, "");
+            const filePath = path.join(monthPath, f);
+            const fileContent = await fs.readFile(filePath, "utf8");
+            const { data } = matter(fileContent);
+
+            return {
+              slug,
+              title: data.title || slug.replace(/-/g, " "),
+              date: data.date || null,
+              year: yearDir.name,
+              month: monthDir.name,
+            };
+          })
+      );
 
       monthsData.push({ month: monthDir.name, posts });
     }
diff --git a/src/utils/mailer.js b/src/utils/mailer.js
deleted file mode 100644
index a9178e1..0000000
--- a/src/utils/mailer.js
+++ /dev/null
@@ -1,33 +0,0 @@
-// src/utils/mailer.js
-const nodemailer = require("nodemailer");
-require("dotenv").config();
-
-let auth = null;
-if (process.env.MAIL_AUTH != "null") {
-  auth = {
-    user: process.env.MAIL_USER,
-    pass: process.env.MAIL_PASS,
-  };
-}
-console.log(process.env.MAIL_PORT);
-const transporter = nodemailer.createTransport({
-  host: process.env.MAIL_HOST,
-  port: parseInt(process.env.MAIL_PORT, 10),
-  secure: process.env.MAIL_SECURE === "true",
-  auth,
-});
-
-function sendContactMail({ name, email, subject, message }) {
-  const { DOMAIN: domain } = process.env;
-  const data = {
-    from: `"Contact Form" <no-reply@${domain}>`,
-    to: process.env.MAIL_USER,
-    replyTo: `"${name}" <${email}>`,
-    subject: subject || "New Contact Form Submission",
-    text: message,
-  };
-  console.log(data);
-  return transporter.sendMail(data);
-}
-
-module.exports = sendContactMail;
diff --git a/src/utils/sendContactMail.js b/src/utils/sendContactMail.js
new file mode 100644
index 0000000..a9178e1
--- /dev/null
+++ b/src/utils/sendContactMail.js
@@ -0,0 +1,33 @@
+// src/utils/mailer.js
+const nodemailer = require("nodemailer");
+require("dotenv").config();
+
+let auth = null;
+if (process.env.MAIL_AUTH != "null") {
+  auth = {
+    user: process.env.MAIL_USER,
+    pass: process.env.MAIL_PASS,
+  };
+}
+console.log(process.env.MAIL_PORT);
+const transporter = nodemailer.createTransport({
+  host: process.env.MAIL_HOST,
+  port: parseInt(process.env.MAIL_PORT, 10),
+  secure: process.env.MAIL_SECURE === "true",
+  auth,
+});
+
+function sendContactMail({ name, email, subject, message }) {
+  const { DOMAIN: domain } = process.env;
+  const data = {
+    from: `"Contact Form" <no-reply@${domain}>`,
+    to: process.env.MAIL_USER,
+    replyTo: `"${name}" <${email}>`,
+    subject: subject || "New Contact Form Submission",
+    text: message,
+  };
+  console.log(data);
+  return transporter.sendMail(data);
+}
+
+module.exports = sendContactMail;
diff --git a/src/utils/sendNewsletterSubscriptionMail.js b/src/utils/sendNewsletterSubscriptionMail.js
new file mode 100644
index 0000000..5a54b3a
--- /dev/null
+++ b/src/utils/sendNewsletterSubscriptionMail.js
@@ -0,0 +1,40 @@
+// src/utils/mailer.js
+const nodemailer = require("nodemailer");
+require("dotenv").config();
+
+let auth = null;
+if (process.env.MAIL_AUTH !== "null") {
+  auth = {
+    user: process.env.MAIL_USER || null,
+    pass: process.env.MAIL_PASS || null,
+  };
+}
+
+const credentials = {
+  host: process.env.MAIL_HOST,
+  port: parseInt(process.env.MAIL_PORT, 10),
+  secure: process.env.MAIL_SECURE === "true",
+  auth,
+};
+console.log(credentials);
+const transporter = nodemailer.createTransport(credentials);
+
+const sendNewsletterSubscriptionMail = async function ({ email }) {
+  const { DOMAIN: domain } = process.env;
+  const data = {
+    from: `"Newsletter" <no-reply@${domain}>`,
+    to: email,
+    subject: "New Newsletter Subscription",
+    text: `Please add this email to the newsletter list: ${process.env.MAIL_NEWSLETTER}`,
+  };
+  console.log(data);
+  try {
+    const result = await transporter.sendMail(data);
+    console.log(result);
+    return result;
+  } catch (e) {
+    console.log(e);
+  }
+};
+
+module.exports = sendNewsletterSubscriptionMail;
diff --git a/src/views/pages/about.handlebars b/src/views/pages/about.handlebars
index 595b430..af53a48 100644
--- a/src/views/pages/about.handlebars
+++ b/src/views/pages/about.handlebars
@@ -1,6 +1,9 @@
 <section>
-  <h2>About</h2>
+  <h1>About</h1>
   <article>
     <p>This blog is maintained by Jason Poage. It covers programming, technology, and related topics.</p>
   </article>
 </section>
+{{#section "scripts"}}
+<script src="/static/js/sticky-toc.js"></script>
+{{/section}}
diff --git a/src/views/pages/construction.handlebars b/src/views/pages/construction.handlebars
index a266706..59d4db7 100644
--- a/src/views/pages/construction.handlebars
+++ b/src/views/pages/construction.handlebars
@@ -2,8 +2,8 @@
 <link rel="stylesheet" href="/static/css/placeholder.css" />
 {{/section}}
 <div class="placeholder">
-    <h2>{{title}}</h2>
-    <h3>Page Under Construction</h3>
+    <h1>{{title}}</h1>
+    <h2>Page Under Construction</h2>
     <p>This page is a placeholder. Content will be added soon.</p>
     <div class="loader" aria-label="Loading"></div>
 </div>
diff --git a/src/views/pages/contact.handlebars b/src/views/pages/contact.handlebars
index 00ef036..3bdccb1 100644
--- a/src/views/pages/contact.handlebars
+++ b/src/views/pages/contact.handlebars
@@ -2,7 +2,7 @@
 <link rel="stylesheet" href="/static/css/contact.css" />
 {{/section}}
 <section>
-  <h2>{{title}}</h2>
+  <h1>{{title}}</h1>
   <form action="/contact" method="POST">
     <div class="form-group">
       <label class="required" for="name">Name</label>
diff --git a/src/views/pages/home.handlebars b/src/views/pages/home.handlebars
index a4ec0e0..fcf6728 100644
--- a/src/views/pages/home.handlebars
+++ b/src/views/pages/home.handlebars
@@ -1,6 +1,6 @@
 <!-- pages/home.handlebars -->
 <section>
-  <h2>{{title}}</h2>
+  <h1>{{title}}</h1>
   <article>
     <p>{{content}}</p>
   </article>
diff --git a/src/views/pages/newsletter.handlebars b/src/views/pages/newsletter.handlebars
new file mode 100644
index 0000000..e39b170
--- /dev/null
+++ b/src/views/pages/newsletter.handlebars
@@ -0,0 +1,16 @@
+{{#section "styles"}}
+<link rel="stylesheet" href="/static/css/newsletter.css" />
+{{/section}}
+
+<section>
+    <h1>{{title}}</h1>
+    <form action="/newsletter" method="POST" class="newsletter-form">
+        <div class="form-group">
+            <label class="required" for="email">Email</label>
+            <input id="email" name="email" type="email" placeholder="you@example.com" required
+                pattern="[a-zA-Z0-9._%+-]+@[a-zA-Z0-9.-]+\.[a-zA-Z]{2,}" />
+        </div>
+        <button type="submit">Subscribe</button>
+    </form>
+    <p class="required-note"><small><sup>*</sup> Required field</small></p>
+</section>
diff --git a/src/views/pages/page.handlebars b/src/views/pages/page.handlebars
index 0684d5a..807b311 100644
--- a/src/views/pages/page.handlebars
+++ b/src/views/pages/page.handlebars
@@ -1,6 +1,9 @@
 {{#section "styles"}}
 <link rel="stylesheet" href="/static/css/page.css" />
 {{/section}}
-<div class="page-content">
+<div class="markdown-content">
   {{{content}}}
 </div>
+{{#section "scripts"}}
+<script src="/static/js/sticky-toc.js"></script>
+{{/section}}
diff --git a/src/views/pages/post.handlebars b/src/views/pages/post.handlebars
index 974edf1..0b36552 100644
--- a/src/views/pages/post.handlebars
+++ b/src/views/pages/post.handlebars
@@ -1,10 +1,11 @@
 {{#section "styles"}}
 <link rel="stylesheet" href="/static/css/post.css" />
 {{/section}}
-<div class="post-content">
+<div class="markdown-content">
   {{{content}}}
 </div>
 {{#section "scripts"}}
 <script src="/static/js/prism.js"></script>
+<script src="/static/js/sticky-toc.js"></script>
 <script src="/static/js/post.js"></script>
 {{/section}}
diff --git a/src/views/pages/site-map.handlebars b/src/views/pages/site-map.handlebars
index e8f43be..977ff3b 100644
--- a/src/views/pages/site-map.handlebars
+++ b/src/views/pages/site-map.handlebars
@@ -21,6 +21,6 @@
         <li><a href="/tools">Tools I Use</a></li>
         <li><a href="/archive">Archive</a></li>
         <li><a href="/changelog">Site Updates / Changelog</a></li>
-        <li><a href="/rss-rss.xml">RSS Feed</a></li>
+        <li><a href="/rss-feed.xml">RSS Feed</a></li>
     </ul>
 </nav>
diff --git a/src/views/pages/thankyou.handlebars b/src/views/pages/thankyou.handlebars
index cd9247e..697d946 100644
--- a/src/views/pages/thankyou.handlebars
+++ b/src/views/pages/thankyou.handlebars
@@ -1,6 +1,6 @@
 <!-- pages/thankyou.handlebars -->
 <section>
-  <h2>Thank You</h2>
+  <h1>Thank You</h1>
   <article>
     <p>Your message has been sent successfully. We will get back to you shortly.</p>
   </article>
diff --git a/src/views/partials/headers.handlebars b/src/views/partials/headers.handlebars
index 01fc49a..539b84e 100644
--- a/src/views/partials/headers.handlebars
+++ b/src/views/partials/headers.handlebars
@@ -1,9 +1,11 @@
 <header>
   <div class="container">
-    <h1>{{siteOwner}}</h1>
+    <div class="logo">
+      <a href="/">{{siteOwner}}</a>
+    </div>
     <nav>
       {{#each navLinks}}
-        <a href="{{this.href}}">{{this.label}}</a>
+      <a href="{{this.href}}">{{this.label}}</a>
       {{/each}}
     </nav>
   </div>
diff --git a/src/views/partials/postsMenu.handlebars b/src/views/partials/postsMenu.handlebars
index 11ed636..7986042 100644
--- a/src/views/partials/postsMenu.handlebars
+++ b/src/views/partials/postsMenu.handlebars
@@ -1,18 +1,18 @@
 {{!-- partials/postsMenu.handlebars --}}
 {{#each years}}
-  <section class="year-block">
-    <h3 class="menu-year">{{year}}</h3>
-    <ul class="months-list">
-      {{#each months}}
-        <li class="menu-month">
-          <h4>{{formatMonth month}}</h4>
-          <ul class="posts-list">
-            {{#each posts}}
-              <li><a href="/post/{{../../year}}/{{../month}}/{{slug}}">{{title}}</a></li>
-            {{/each}}
-          </ul>
-        </li>
-      {{/each}}
-    </ul>
-  </section>
+<section class="year-block">
+  <h3 class="menu-year">{{year}}</h3>
+  <ul class="months-list">
+    {{#each months}}
+    <li class="menu-month">
+      <h4>{{formatMonth month}}</h4>
+      <ul class="posts-list">
+        {{#each posts}}
+        <li><a href="/post/{{../../year}}/{{../month}}/{{slug}}">{{title}}</a></li>
+        {{/each}}
+      </ul>
+    </li>
+    {{/each}}
+  </ul>
+</section>
 {{/each}}
diff --git a/wireframe.ascii b/wireframe.ascii
new file mode 100644
index 0000000..240f57a
--- /dev/null
+++ b/wireframe.ascii
@@ -0,0 +1,45 @@
++----------------------------------------------------------------------------------+
+|                                  HEADER                                          |
+| +------------------------------------------------------------------------------+ |
+| | Jason Poage                                                                  | |
+| | +--------+--------+----------+-----------+----------+---------+------------+ | |
+| | | Home   | About  | Newsletter| Tools I use| Projects | Contact |          | | |
+| | +--------+--------+----------+-----------+----------+---------+------------+ | |
+| +------------------------------------------------------------------------------+ |
++----------------------------------------------------------------------------------+
+
++----------------------------------------------------------------------------------+
+| +------------------+-----------------------------------------------------------+ |
+| |     SIDEBAR      |                      MAIN CONTENT                         | |
+| | +--------------+ | +-------------------------------------------------------+ | |
+| | | YYYY         | | | Post Title                                            | | |
+| | | +----------+ | | | Lorem ipsum dolor sit amet, consectetur adipiscing    | | |
+| | | | Month    | | | | elit, sed do eiusmod tempor incididunt ut labore et   | | |
+| | | |  - item1 | | | | dolore magna aliqua.                                  | | |
+| | | +----------+ | | |                                                       | | |
+| | | +----------+ | | |                                                       | | |
+| | | | Month    | | | |                                                       | | |
+| | | |  - item2 | | | |                                                       | | |
+| | | +----------+ | | |                                                       | | |
+| | +--------------+ | | Post List:                                            | | |
+| |                  | |   - Sample Entry One                                  | | |
+| |                  | |   - Sample Entry Two                                  | | |
+| |                  | |   - Sample Entry Three                                | | |
+| |                  | |                                                       | | |
+| |                  | | Featured Section:                                     | | |
+| |                  | |   Widget Name: Brief description of widget function.  | | |
+| |                  | |                                                       | | |
+| |                  | +-------------------------------------------------------+ | |
+| +------------------+----------------------------------------------------------+  |
++----------------------------------------------------------------------------------+
+
++----------------------------------------------------------------------------------+
+| |                                 FOOTER                                       | |
+| |               To the extent possible under law, Jason Poage has waived       | |
+| |              all copyright and related or neighboring rights to this work.   | |
+| |                                  [CC0 Badge]                                 | |
+| |                                                                              | |
+| |                              Site Map   Archive   RSS Feed                   | |
+| |                                                                              | |
+| |                     [LinkedIn Icon] [GitHub Icon] [Mail Icon]                | |
++----------------------------------------------------------------------------------+
diff --git a/wireframe.html b/wireframe.html
new file mode 100644
index 0000000..22fbe61
--- /dev/null
+++ b/wireframe.html
@@ -0,0 +1,58 @@
+<html>
+    <head>
+        <title> Wireframe</title>
+        <style type="text/css">
+            pre {
+                font-family: Consolas, 'Courier New', monospace;
+            }
+    </style>
+    </head>
+    <body>
+        <pre>+----------------------------------------------------------------------------------+
+|                                  HEADER                                          |
+| +------------------------------------------------------------------------------+ |
+| | Jason Poage                                                                  | |
+| | +--------+--------+----------+-----------+----------+---------+------------+ | |
+| | | Home   | About  | Newsletter| Tools I use| Projects | Contact |          | | |
+| | +--------+--------+----------+-----------+----------+---------+------------+ | |
+| +------------------------------------------------------------------------------+ |
++----------------------------------------------------------------------------------+
+
++----------------------------------------------------------------------------------+
+| +------------------+-----------------------------------------------------------+ |
+| |     SIDEBAR      |                      MAIN CONTENT                         | |
+| | +--------------+ | +-------------------------------------------------------+ | |
+| | | YYYY         | | | Post Title                                            | | |
+| | | +----------+ | | | Lorem ipsum dolor sit amet, consectetur adipiscing    | | |
+| | | | Month    | | | | elit, sed do eiusmod tempor incididunt ut labore et   | | |
+| | | |  - item1 | | | | dolore magna aliqua.                                  | | |
+| | | +----------+ | | |                                                       | | |
+| | | +----------+ | | |                                                       | | |
+| | | | Month    | | | |                                                       | | |
+| | | |  - item2 | | | |                                                       | | |
+| | | +----------+ | | |                                                       | | |
+| | +--------------+ | | Post List:                                            | | |
+| |                  | |   - Sample Entry One                                  | | |
+| |                  | |   - Sample Entry Two                                  | | |
+| |                  | |   - Sample Entry Three                                | | |
+| |                  | |                                                       | | |
+| |                  | | Featured Section:                                     | | |
+| |                  | |   Section Name: Brief description of widget function. | | |
+| |                  | |                                                       | | |
+| |                  | +-------------------------------------------------------+ | |
+| +------------------+----------------------------------------------------------+  |
++----------------------------------------------------------------------------------+
+
++----------------------------------------------------------------------------------+
+| |                                 FOOTER                                       | |
+| |               To the extent possible under law, Jason Poage has waived       | |
+| |              all copyright and related or neighboring rights to this work.   | |
+| |                                  [CC0 Badge]                                 | |
+| |                                                                              | |
+| |                              Site Map   Archive   RSS Feed                   | |
+| |                                                                              | |
+| |                     [LinkedIn Icon] [GitHub Icon] [Mail Icon]                | |
++----------------------------------------------------------------------------------+
+</pre>
+</body>
+</html>
diff --git a/yarn.lock b/yarn.lock
index 0c0ff40..6960a3a 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -2,6 +2,11 @@
 # yarn lockfile v1
 
 
+"@faker-js/faker@^9.8.0":
+  version "9.8.0"
+  resolved "https://registry.npmjs.org/@faker-js/faker/-/faker-9.8.0.tgz"
+  integrity sha512-U9wpuSrJC93jZBxx/Qq2wPjCuYISBueyVUGK7qqdmj7r/nxaxwW8AQDCLeRO7wZnjj94sh3p246cAYjUKuqgfg==
+
 "@isaacs/cliui@^8.0.2":
   version "8.0.2"
   resolved "https://registry.npmjs.org/@isaacs/cliui/-/cliui-8.0.2.tgz"