Hi @lime escarp. I'm kapa.ai, your friendly support bot. I will try to answer your question by searching through the knowledge base. :wave:
#Do templating at runtime
waxen oarBOT
Astro is designed primarily as a static site generator, where dynamic values are injected at build time or, optionally, at request time if you enable server-side rendering (SSR). By default, Astro does not support runtime templating in the browser or on the server without SSR. Here’s how Astro handles dynamic values and what options you have:
1. Build-Time Templating (Static Sites)
Astro templates use JavaScript expressions in the frontmatter (between --- fences) to inject values into your HTML at build time. For example:
---const customerId = "12345";---
<p>Customer ID: {customerId}</p>
This will output the value directly into the HTML during the build process, so the resulting HTML will have the value in place, similar to how Twig works at render time, but only with values known at build time [Astro Syntax Reference].
2. Server-Side Rendering (On-Demand Rendering)
If you need to inject values at runtime (e.g., per-request, such as a unique customerId), you must enable SSR by adding an adapter (like Netlify, Vercel, etc.) and opt out of prerendering for the relevant pages:
---export const prerender = false;---
<html>
<body>
<p>Customer ID: {customerId}</p>
</body>
</html>
You would then provide customerId from your server logic, and Astro will render the HTML with the correct value for each request [On-demand rendering].
3. No Client-Side Templating
Astro does not support runtime templating in the browser (e.g., replacing %%customerId%% after the HTML is loaded) out of the box. All dynamic values must be injected either at build time (static) or at request time (SSR). There is no built-in mechanism for placeholder replacement like %%customerId%% that persists to the final HTML unless you implement a custom solution.
4. Using JavaScript Frameworks
You can use React, Svelte, etc., within Astro, but their dynamic rendering also happens at build time or via SSR unless you hydrate components for client-side interactivity. However, this does not help with injecting server-only values into static HTML at runtime without SSR [Front-end frameworks].
Summary:
If you need to inject dynamic values like customerId into your HTML at runtime (per request), you must use Astro’s SSR mode with an appropriate adapter. There is no built-in support for runtime placeholder replacement in static HTML. If you cannot execute JavaScript on the server, Astro may not fit your use case for runtime templating as a direct replacement for Twig [On-demand rendering].