Skip to main content

​
Overview

The project uses Astro’s file-based routing system where .astro files in src/pages/ automatically become routes on your website.

​
Available Pages

Homepage

The main landing page at /

Blog Index

Blog listing page at /blog

Blog Post

Dynamic blog post pages at /blog/[slug]

YouTube Policy

Video monetization policy page at /youtube

404 Error Page

Custom error page for missing routes

​
File-Based Routing

Astro creates routes based on file paths: 
src/pages/
├── index.astro           → /
├── youtube.astro         → /youtube
├── 404.astro            → /404
└── blog/
    ├── index.astro       → /blog
    └── [slug].astro      → /blog/:slug

​
Page Structure

All pages follow a consistent structure:
1

Import Layout

Pages import the appropriate layout component:
import Layout from "../layouts/Layout.astro";
2

Import Components

Pages import necessary components:
import Video from "../components/Video.astro";
import Apps from "../components/Apps.astro";
3

Render Content

Pages wrap content in the layout:
<Layout title="Page Title" description="Page description">
  <!-- Page content -->
</Layout>

​
Dynamic Routes

The blog uses dynamic routing with [slug].astro:
src/pages/blog/[slug].astro
---
import { getCollection, type CollectionEntry } from 'astro:content';

export async function getStaticPaths() {
  const posts = await getCollection('blog');
  return posts.map(post => ({
    params: { slug: post.slug },
    props: { post },
  }));
}

const { post } = Astro.props;
---

<PostLayout {...post.data}>
  <Content />
</PostLayout>
This generates a static page for each blog post in the content collection.

​
SEO Integration

All pages use the SEO component for metadata: 
<Layout 
  title="Page Title" 
  description="Page description"
  image="/path/to/image.png"
  canonicalURL="https://example.com/page"
>
The Layout component passes these props to the SEO component for proper meta tags.

Base Layout

Learn about the base layout structure

Blog System

Understand the blog architecture

Build docs developers (and LLMs) love

Get started for freeTalk to us