src/pages 아래 src/pages/[post].astro 인 dynamic routing 을 설정 가능

single page로 multiple URLs, blog처럼 고정된 structure이 있는 경우 사용 가능

[post]는 variable이다.

frontmatter 안에 Astro.params를 사용해서 가져올수 있다

getStaticPaths() 를 define하고 export해야한다.

⇒ an array of objects which contain the values allowed for the dynamic segment

---
import Layout from '../layouts/Layout.astro'
const { post } = Astro.params

export async function getStaticPaths() {
  return [
    { params: { post: 'test' } },
    { params: { post: 'test2' } },
    { params: { post: 'test3' } },
  ]
}
---

<Layout title='Post'>
  <h1 style="color: white">{post}</h1>
</Layout>

localhost:4321/test, [localhost:4321/test](<http://localhost:4321/test1>)2 …

이런식으로 들어가면 하단 html이 생성되어 렌더링됨

또한 /[category]/[post] 처럼 multiple level dynamic segments가 가능