Frontend Frameworks

Manage your Svelte application content with a powerful headless CMS. 
Open Source, customizable, and self-hosted, Strapi provides an intuitive admin panel as well as an API consumable from any http client.

## The easiest way to manage your content

Effortlessly create content structures that flex to your needs. No matter which data structure is the best for your business, you can easily define models and add relations to create rich layout experiences.
Seamlessly write, edit and manage any content types.
Easily build apps and digital experiences without the distraction of CMS complexities.
Consume the API from Svelte using REST or GraphQL.

## Svelte has a lot of benefits

[Svelte](https://svelte.dev/) is a radical new approach to building user interfaces. Whereas traditional frameworks like React and Vue do the bulk of their work in the browser, Svelte shifts that work into a compile step that happens when you build your app.

1. **Write less code**: Build boilerplate-free components using languages you already know — HTML, CSS and JavaScript.
2. **No Virtual DOM**: Svelte compiles your code to tiny, framework-less vanilla JS — your app starts fast and stays fast.
3. **Reactive**: No more complex state management libraries — Svelte brings reactivity to JavaScript itself.

Many http clients exists in Javascript in order to communicate with a Strapi API: [Fetch API](https://developer.mozilla.org/en-US/docs/Web/API/Fetch_API), [axios](https://github.com/axios/axios) or [request](https://github.com/request/request).

## Strapi, the best fit with Svelte

The out-of-the-box Strapi features allow you to get up-and-running in no time:

1. **Single types**: Create one-off pages that have a unique content structure
2. **Customizable API**: With Strapi, you can just hop in your code editor and edit the code to fit your API to your needs.
3. **Integrations**: Strapi supports integrations with Cloudinary, SendGrid, Algolia, and others.
4. **Editor interface**: The editor allows you to pull in dynamic blocks of content.
5. **Authentication**: Secure and authorize access to your API with JWT or providers.
6. **RBAC**: Help maximize operational efficiency, reduce dev team support work, safeguard against unauthorized access or configuration modifications.
7. **i18n**: Manage content in multiple languages. Easily query the different locales through the API.

Svelte is a radical new approach to building user interfaces as it writes code that surgically updates the DOM when the state of your app changes.

cover-svelte-cms

svelte-logo

Illu.StrapiDoc

Learn how to create an Svelte application with Strapi by following our documentation.

Get Started with Svelte

In this tutorial, you’ll learn the basics of SvelteKit and create a blog website using the SvelteKit framework and using Strapi for content management.


Frame 84-3.png

How to Create a Blog with SvelteKit and Strapi

In this tutorial you will learn how to use three modern and powerful technologies Strapi, Svelte, and Tailwind CSS, to build an elegant and functional todo app.

Strapi Custom Plugin-10.jpg

Building a To-do app with Svelte, Strapi and Tailwind CSS

SvelteKit is a relatively new SSR framework for SvelteJS. We can compare it to NextJS, but instead of using React, it uses Svelte. In this tutorial, you'll learn how you can create a blog website with SvelteKit and Strapi as a CMS.


Find more Svelte resources on our blog

React-logo

Nextjs-logo

gatsby-logo

vuejs-logo

nuxt-2021.svg

gridsome-logo

Angular_logo

Node.js_logo.svg

sapper-logo

Ionic_Logo.svg

Cordova-logo-by-gengns.svg

logo_lockup_dart_horizontal.png

flutter_973b4a4354

Kotlin_Icon.svg

Swift_logo.svg

Logo_of_Hugo_the_static_website_generator.svg

jekyll-logo

11ty-logo

ruby-logo

Ruby_On_Rails_Logo.svg

python-logo

Flask_logo.svg

Django_logo.svg

PHP-logo.svg

Symfony2.svg

Logo.min 1.svg

NET_Logo.svg

kisspng-logo-java-development-kit-portable-network-graphic-5d0f25d6adc385 1.svg

Crystal_language_logo.svg

Go_Logo_Blue.svg

Rust_programming_language_black_logo.svg

elixir-lang-ar21.svg

phoenix-seeklogo.com.svg

Keep in touch with the latest Strapi and Svelte updates

Svelte