Pages

Astro uses file-based routing — drop a file in `src/pages/`, and it's served at the matching URL.

3 min read Level 1/5 #astro#pages#routing

What you'll learn

Recognize how pages map to URLs
Know which file types are pages
See where `index.astro` fits

Astro’s router is file-based. The folder tree in src/pages/ mirrors your URL tree. No router config, no route registration.

The Mapping

File	URL
`src/pages/index.astro`	`/`
`src/pages/about.astro`	`/about`
`src/pages/blog/index.astro`	`/blog`
`src/pages/blog/hello.astro`	`/blog/hello`
`src/pages/contact.md`	`/contact`
`src/pages/snippets/list.mdx`	`/snippets/list`

What Counts as a Page

Anything with one of these extensions inside src/pages/:

Extension	Use
`.astro`	The default — an `.astro` component IS a page
`.md`, `.mdx`	Markdown pages (rendered with the default layout)
`.html`	Plain static HTML files
`.js` / `.ts`	Endpoints — not pages (more on these later)

A Minimal Page

---
// src/pages/about.astro
const heading = "About Us";
---

<html lang="en">
  <head><title>{heading}</title></head>
  <body>
    <h1>{heading}</h1>
    <p>We make small fast websites.</p>
  </body>
</html>

Save it, hit /about — that’s the entire deal.

`index.astro` — The Default for a Folder

src/pages/blog/index.astro serves at /blog (no trailing index.html in the URL). Same as web servers have always done.

Why File-Based Routing?

Adding a page is just adding a file
Deleting a page is just deleting a file
File path = URL — zero indirection

Up Next

The conventions — nested routes, leading-underscore “private” files, and the rest.

File Routing Conventions →