# SvelteKit and AgilityCMS

> Source: https://agilitycms.com/docs/sveltekit/sveltekit-and-agilitycms

With SvelteKit and Agility CMS, you can build a high-performance website that delivers an exceptional experience for both developers and content editors.

Our SvelteKit starter leverages server-side rendering (SSR) to generate your pages dynamically using the Sitemap’s layouts. Developers can focus on building reusable UI components while editors have full control over managing and structuring content with ease.

<a href="https://github.com/agility/sveltekit-starter" target="_blank" 
   style="display: inline-flex; align-items: center; background-color: #4600A8; color: white; 
          padding: 10px 15px; border-radius: 8px; text-decoration: none; font-weight: bold;">
  <svg width="24" height="24" viewBox="0 0 24 24" fill="white" xmlns="http://www.w3.org/2000/svg">
    <path d="M12 2C6.48 2 2 6.48 2 12c0 4.42 2.87 8.18 6.84 9.49.5.09.66-.22.66-.48 0-.23-.01-.84-.01-1.64-2.78.6-3.37-1.34-3.37-1.34-.45-1.15-1.11-1.46-1.11-1.46-.91-.62.07-.61.07-.61 1 .07 1.53 1.04 1.53 1.04 .89 1.53 2.33 1.09 2.9.83.09-.65.35-1.09.63-1.34-2.22-.25-4.56-1.11-4.56-4.95 0-1.09.39-1.98 1.02-2.68-.1-.25-.44-1.27.1-2.64 0 0 .83-.27 2.75 1.02A9.57 9.57 0 0 1 12 6.8c.84 0 1.68.11 2.47.32 1.92-1.3 2.75-1.02 2.75-1.02.54 1.37.2 2.39.1 2.64.63.7 1.02 1.59 1.02 2.68 0 3.85-2.34 4.7-4.57 4.95.36.31.68.92.68 1.86 0 1.34-.01 2.42-.01 2.75 0 .27.16.58.67.48A10.01 10.01 0 0 0 22 12c0-5.52-4.48-10-10-10z"/>
  </svg>
  <span style="margin-left: 8px;">Download the SvelteKit Github Repo</span>
</a>

or in your terminal run

```
git clone https://github.com/agility/sveltekit-starter.git
```

![](https://cdn.aglty.io/agility-cms-docs/images/block-editor/SvelteKitLogoAgilityLogo-02202025210725.png)

## A Seamless Editor Experience

Agility CMS empowers editors to create and manage pages effortlessly. They can select from a library of UI Components (Component Models and Layout Models) that developers have built, allowing them to compose content-rich pages without needing to touch code. Plus, editors can preview their changes in real time before publishing, ensuring a smooth content workflow.

## A Powerful Developer Experience

SvelteKit is a modern and flexible framework for content-driven websites, offering a smooth developer experience and fast performance. With built-in hot module replacement (HMR), developers can see updates instantly when modifying source files. The starter also fetches the latest staging content from Agility CMS in real time, so any content updates can be reflected immediately with a simple page reload. SvelteKit’s component-based structure makes it easy to create interactive and reusable UI elements that editors can mix and match.

## Get Up and Running Fast

The SvelteKit Starter template is preconfigured to connect with a sample Agility CMS instance, featuring ready-to-go pages and content for a blog-style website. Use it as a foundation and expand it with your own content to build a fully customized site.

Would you like any tweaks or additions?

<a href="https://github.com/agility/sveltekit-starter" target="_blank" 
   style="display: inline-flex; align-items: center; background-color: #4600A8; color: white; 
          padding: 10px 15px; border-radius: 8px; text-decoration: none; font-weight: bold;">
  <svg width="24" height="24" viewBox="0 0 24 24" fill="white" xmlns="http://www.w3.org/2000/svg">
    <path d="M12 2C6.48 2 2 6.48 2 12c0 4.42 2.87 8.18 6.84 9.49.5.09.66-.22.66-.48 0-.23-.01-.84-.01-1.64-2.78.6-3.37-1.34-3.37-1.34-.45-1.15-1.11-1.46-1.11-1.46-.91-.62.07-.61.07-.61 1 .07 1.53 1.04 1.53 1.04 .89 1.53 2.33 1.09 2.9.83.09-.65.35-1.09.63-1.34-2.22-.25-4.56-1.11-4.56-4.95 0-1.09.39-1.98 1.02-2.68-.1-.25-.44-1.27.1-2.64 0 0 .83-.27 2.75 1.02A9.57 9.57 0 0 1 12 6.8c.84 0 1.68.11 2.47.32 1.92-1.3 2.75-1.02 2.75-1.02.54 1.37.2 2.39.1 2.64.63.7 1.02 1.59 1.02 2.68 0 3.85-2.34 4.7-4.57 4.95.36.31.68.92.68 1.86 0 1.34-.01 2.42-.01 2.75 0 .27.16.58.67.48A10.01 10.01 0 0 0 22 12c0-5.52-4.48-10-10-10z"/>
  </svg>
  <span style="margin-left: 8px;">Download the SvelteKit Github Repo</span>
</a>

---

Index of every docs page: https://agilitycms.com/docs/llms.txt
