Dynamic routes are created using square brackets in the filename:

pages/
  posts/
    [id].js       → /posts/:id
    [...slug].js  → /posts/* (catch-all)

// pages/posts/[id].js
import { useRouter } from 'next/router';

function Post() {
  const router = useRouter();
  const { id } = router.query;
  
  return <h1>Post: {id}</h1>;
}

export default Post;