DEV Community

Cover image for How to setup the SvelteKit starter template on Appwrite Sites
Aditya Oberai for Appwrite

Posted on • Originally published at appwrite.io

1

How to setup the SvelteKit starter template on Appwrite Sites

Building web applications requires both front-end expertise and back-end infrastructure. Appwrite Sites simplifies this process by providing a platform for deploying, hosting, and scaling web applications.

To ease this process even further, Appwrite Sites offers a variety of starter kits for popular frameworks like Next.js, React, Vue, Nuxt, Angular, SvelteKit, and Flutter. In this blog, you will learn how to set up the SvelteKit starter template and deploy it to Appwrite Sites.

Overview of the starter template

SvelteKit is a modern web framework built on top of Svelte that enables fast, server-rendered and client-enhanced web applications with powerful routing, data loading, and deployment features out of the box.

Appwrite's SvelteKit starter template includes:

  • A clean, single-page UI
  • Integration with Appwrite's SDK
  • Pre-configured deployment settings for Appwrite Sites' SSR rendering strategy

Deployed app

Deploy the starter template on Appwrite

Firstly, you must head to Appwrite Cloud and create an account if you haven't already (or self-host Appwrite 1.7). Next, create your first project, which will lead you to the project overview page.

Add platform

Head to the Sites page from the left sidebar, click on the Create site button, and select the Clone a template option. This will take you to the Appwrite Sites templates listing, where you should search Svelte starter and click on the template.

Starter template

After selecting the template, you can choose to connect a GitHub repository now or at a later time. If you choose to connect a repository, ensure you select a production branch (leave the root directory as is). Then, review the preset environment variables, update the domain name if you want, and click on the Deploy button. You can watch the deployment logs as the site is built.

Deployment logs

Alternative method to deploy starter template

As an alternative to the Appwrite console, you can create and deploy websites using the Appwrite CLI. Create your SvelteKit starter using the following shell command and configuration:

appwrite init sites
? What would you like to name your site? Svelte starter
? What ID would you like to have for your site? unique()
? What framework would you like to use? SvelteKit (sveltekit)
? What specification would you like to use? 0.5 CPU, 512MB RAM
Enter fullscreen mode Exit fullscreen mode

You can then make any edits to the website and deploy it using the following command:

appwrite push sites
Enter fullscreen mode Exit fullscreen mode

Test the starter template

After your site has been successfully deployed, Appwrite will show you a Congratulations page. You can then either choose to view the site by clicking on the Visit site button or view the site configuration (deployments, logs, domains, usage, and settings) by clicking on the Go to dashboard button.

Congratulations

Next steps

And with that, the SvelteKit starter kit is deployed to Appwrite Sites. You can explore other templates or deploy any other websites you'd like.

For more information about Appwrite Sites:

Tiugo image

Modular, Fast, and Built for Developers

CKEditor 5 gives you full control over your editing experience. A modular architecture means you get high performance, fewer re-renders and a setup that scales with your needs.

Start now

Top comments (0)

Tiger Data image

🐯 🚀 Timescale is now TigerData: Building the Modern PostgreSQL for the Analytical and Agentic Era

We’ve quietly evolved from a time-series database into the modern PostgreSQL for today’s and tomorrow’s computing, built for performance, scale, and the agentic future.

So we’re changing our name: from Timescale to TigerData. Not to change who we are, but to reflect who we’ve become. TigerData is bold, fast, and built to power the next era of software.

Read more

👋 Kindness is contagious

Delve into this thought-provoking piece, celebrated by the DEV Community. Coders from every walk are invited to share their insights and strengthen our collective intelligence.

A heartfelt “thank you” can transform someone’s day—leave yours in the comments!

On DEV, knowledge sharing paves our journey and forges strong connections. Found this helpful? A simple thanks to the author means so much.

Get Started