Add a blog post entry linking to the big blog post explaining how/why…

… we built this template. Includes useful best practices for how to customize this template.

src/routes/(marketing)/blog/(posts)/how_we_built_our_saas_website/+page.svelte

@@ -0,0 +1,34 @@
+<p class="lead">How to use this template you to bootstrap your own site.</p>
+
+<p>
+  We've written a detailed blog post about how we took this template, and
+  created a real <a href="https://criticalmoments.io" target="_blank"
+    >SaaS company website</a
+  >. Topics include:
+</p>
+
+<ul>
+  <li>Optimizing the stack for performance and developer productivity</li>
+  <li>Creating rich interactive animations with Svelte</li>
+  <li>Creating pixel perfect designs without rasterization</li>
+  <li>Speed measurements: how we kept it small and lightning fast</li>
+</ul>
+
+<a
+  href="https://criticalmoments.io/blog/how_we_built_our_marketing_page"
+  target="_blank"
+  class="btn btn-primary">Read the Blog Post</a
+>
+
+<p>
+  The blog post is over on <a href="https://criticalmoments.io" target="_blank"
+    >criticalmoments.io</a
+  >, a page which uses this boilerplate as a starting point.
+</p>
+
+<p>
+  If you're looking for examples of blog posts with rich content rendered inside
+  this template, checkout the other demo posts <a href="/blog" class="link"
+    >here</a
+  >.
+</p>

src/routes/(marketing)/blog/posts.ts

@@ -14,6 +14,12 @@ export type BlogPost = {
 // Update this list with the actual blog post list
 // Create a page in the "(posts)" directory for each entry
 const blogPosts: BlogPost[] = [
+  {
+    title: "How we built a beautiful 41kb SaaS website with this template",
+    description: "How to use this template you to bootstrap your own site.",
+    link: "/blog/how_we_built_our_saas_website",
+    date: "2024-03-10",
+  },
   {
     title: "Example Blog Post 2",
     description: "Even more example content!",