Pages are files that live in the
src/pages/ subdirectory of your Astro project. They are responsible for handling routing, data loading, and overall page layout for every page in your website.
Supported page filesSection titled Supported page files
Astro supports the following file types in the
File-based routingSection titled File-based routing
Astro leverages a routing strategy called file-based routing. Each file in your
src/pages/ directory becomes an endpoint on your site based on its file path.
Write standard HTML
<a> elements in your component template to link between pages.
📚 Read more about Routing in Astro.
Astro PagesSection titled Astro Pages
Astro pages use the
.astro file extension and support the same features as Astro components.
To avoid repeating the same HTML elements on every page, you can move common
<body> elements into your own layout components. You can use as many or as few layout components as you’d like.
📚 Read more about layout components in Astro.
Markdown/MDX PagesSection titled Markdown/MDX Pages
Astro also treats any Markdown (
.md) files inside of
src/pages/ as pages in your final website. If you have the MDX Integration installed, it also treats MDX (
.mdx) files the same way. These are commonly used for text-heavy pages like blog posts and documentation.
Page layouts are especially useful for Markdown files. Markdown files can use the special
layout front matter property to specify a layout component that will wrap their Markdown content in a full
<html>...</html> page document.
📚 Read more about Markdown in Astro.
HTML PagesSection titled HTML Pages
Files with the
.html file extension can be placed in the
src/pages/ and used directly as pages on your site. Note that some key Astro features are not supported in HTML Components.
Custom 404 Error PageSection titled Custom 404 Error Page
For a custom 404 error page, you can create a
404.md file in
This will build to a
404.html page. Most deploy services will find and use it.