Skip to content

How to setup the Flutter starter template on Appwrite Sites_

Learn the process of deploying the Flutter starter template on Appwrite Sites.

Most web hosting platforms don't support Flutter Web out of the box, often forcing developers to jump through hoops just to get their apps online. This lack of native support can make deploying Flutter Web projects unnecessarily complex and time-consuming.

Appwrite Sites changes that by offering built-in support for Flutter Web, making it easy to host and scale your applications. Alongside Flutter, Appwrite also provides starter kits for popular frameworks like Next.js, React, Vue, Nuxt, Angular, and SvelteKit. In this blog, you'll learn how to set up the Flutter starter template and deploy it to Appwrite Sites.

Overview of the starter template

Flutter Web is a part of the Flutter framework that allows developers to build responsive, high-performance web applications using a single Dart codebase.

Appwrite's Flutter starter template includes:

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

Deployed app
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
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 Flutter starter and click on the template.

Starter 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.

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
Congratulations

Next steps

And with that, the Flutter 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:

Read next

Ready to build?_