Dynamic routes

Dynamic routes match a specific pattern in the URL. For example, /greet/:name will match routes like /greet/John or /greet/Lucy, but NOT /greet/John/Lucy.

Example

Let's create a /greet/[name].ts page.

// routes/greet/[name].js
import { LitElement, html } from "lit";

export default class Greet extends LitElement {
  render() {
    return html` <div>Greetings to you, ${this.ctx.params.name}!</div> `;
  }
}

Now, you can open the http://localhost:8000/greet/John and your page is ready.

The Concepts: Routes page has more details aboyt how you can build more advanced patterns.