• This repository has been archived on 26/Jan/2024
  • Stars
    star
    107
  • Rank 323,587 (Top 7 %)
  • Language Svelte
  • License
    MIT License
  • Created over 3 years ago
  • Updated over 1 year ago

Reviews

There are no reviews yet. Be the first to send feedback to the community and the maintainers!

Repository Details

A basic demo example for integrating between Appwrite & Svelte🧡

🔖 Todo With Svelte

Easter Eggs Claimed

A simple todo app built with Appwrite and Svelte

If you simply want to try out the App, go ahead and check out the demo at https://appwrite-todo-with-svelte.vercel.app/

🎬 Getting Started

🤘 Install Appwrite

Follow our simple Installation Guide to get Appwrite up and running in no time. You can either deploy Appwrite on your local machine or, on any cloud provider of your choice.

Note: If you setup Appwrite on your local machine, you will need to create a public IP so that your hosted frontend can access it.

We need to make a few configuration changes to your Appwrite server.

  1. Add a new Web App in Appwrite and enter the endpoint of your website (localhost, <project-name>.vercel.app etc) Appwrite Console

  2. Create a new collection with the following properties

  • Attributes Add the following attributes to the collection.

Make sure that your Attribute ID exactly matches the key in the images

Content Attribute

IsComplete Attribute

  • Permissions Add the following permissions to your collections. These permissions ensure that only registered users can access the collection.

Collection Permissions

🚀 Deploy the Front End

You have two options to deploy the front-end and we will cover both of them here. In either case, you will need to fill in these environment variables that help your frontend connect to Appwrite.

  • VITE_APP_ENDPOINT - Your Appwrite endpoint
  • VITE_APP_PROJECT - Your Appwrite project ID
  • VITE_APP_COLLECTION_ID - Your Appwrite collection ID
  • VITE_APP_DATABASE_ID - Your Appwrite database ID

Deploy to a Static Hosting Provider

Use the following buttons to deploy to your favourite hosting provider in one click! We support Vercel, Netlify and DigitalOcean. You will need to enter the environment variables above when prompted.

Note: Vercel is unable to auto detect the framework so please use the Svelte Framework in case of vercel.

Deploy with Vercel

Deploy to Heroku

Deploy to Netlify

Deploy to DO

Run locally

Follow these instructions to run the demo app locally

$ git clone https://github.com/appwrite/todo-with-svelte
$ cd todo-with-svelte

Run the following command to generate your .env vars

$ cp .env.example .env

Now fill in the envrionment variables we discussed above in your .env

Now run the following commands and you should be good to go 💪🏼

$ npm install
$ npm run dev

🤕 Support

If you get stuck anywhere, hop onto one of our support channels in discord and we'd be delighted to help you out 🤝

😧 Help Wanted

Our access credentials were recently compromised and someone tried to ruin these demos. They decided to leave behind 15 easter eggs 🥚 for you to discover. If you find them, submit a PR cleaning up that section of the code (One PR per person across all the repos). You can track the number of claimed Easter Eggs using the badge at the top.

The first 15 people to get their PRs merged will receive some Appwrite Swags 🤩 . Just head over to our Discord channel and share your PR link with us.

UPDATE 17-11-2021: The easter egg contest is now closed.

More Repositories

1

appwrite

Your backend, minus the hassle.
TypeScript
43,403
star
2

sdk-for-react-native

[READ ONLY] Official Appwrite React Native SDK 💙 ⚛︎
TypeScript
2,942
star
3

awesome-appwrite

Carefully curated list of awesome Appwrite resources 💪
954
star
4

pink

Pink. Appwrite's official framework agnostic design system 🎨 🩷
HTML
442
star
5

sdk-for-flutter

[READ-ONLY] Official Appwrite Flutter SDK 💙
Dart
364
star
6

console

The Console that makes Appwrite tick from the browser 🖥
Svelte
319
star
7

sdk-for-web

[READ-ONLY] Official Appwrite Web SDK 🧡
TypeScript
281
star
8

sdk-generator

Generating SDKs for multiple programming languages and platforms ⚙️
Twig
272
star
9

sdk-for-python

[READ-ONLY] Official Appwrite Python SDK 🐍
Python
221
star
10

sdk-for-node

[READ-ONLY] Official Appwrite Node.js SDK 🟢
TypeScript
205
star
11

demo-todo-with-react

A basic demo example for integrating between Appwrite & React JS 💙
JavaScript
201
star
12

website

The Appwrite website, docs and blog 🏠
Svelte
188
star
13

sdk-for-php

[READ-ONLY] Official Appwrite PHP SDK 🐘
PHP
140
star
14

demos-for-functions

Demo for Appwrite cloud functions in multiple coding languages ⚡️ 🌩
Kotlin
121
star
15

playground-for-flutter

Simple examples that help you get started with Appwrite + Flutter (=❤️)
C++
121
star
16

templates

Templates for Appwrite Functions ⚡️🌩️
JavaScript
117
star
17

demo-todo-with-vue

A basic demo example for integrating between Appwrite & Vue JS 💚
Vue
116
star
18

sdk-for-dart

[READ-ONLY] Official Appwrite Dart SDK 💙
Dart
112
star
19

sdk-for-android

[READ-ONLY] Official Appwrite Android SDK 💚 🤖
Kotlin
108
star
20

playground-for-web

Simple examples that help you get started with Appwrite + Web (=❤️)
HTML
99
star
21

sdk-for-apple

[READ-ONLY] Official Appwrite SDK for Apple Devices 🍎
Swift
99
star
22

sdk-for-dotnet

[READ-ONLY] Official Appwrite .NET SDK
C#
94
star
23

sdk-for-cli

[READ-ONLY] Official Appwrite CLI >_
JavaScript
89
star
24

demos-for-react

Demos and tutorials for getting started with Appwrite + React JS
JavaScript
89
star
25

docs

The official https://appwrite.io/docs documentation 📝
HTML
84
star
26

sdk-for-kotlin

[READ-ONLY] Official Appwrite Kotlin SDK 💙🧡
Kotlin
77
star
27

dynamic-links

Implement Dynamic Links with Appwrite Functions!
HTML
75
star
28

sdk-for-svelte

Appwrite SDK for Svelte 🧡 ⚠️ Warning - this SDK was designed to support Appwrite 0.9 and is not compatible with the latest Appwrite versions. We are planing to refactor it as part of the SDK Generator for better support and maintenance.
Svelte
74
star
29

demo-almost-netflix-for-flutter

A Netflix clone built with @appwrite + @flutter
Dart
73
star
30

sdk-for-deno

[READ-ONLY] Official Appwrite Deno SDK 🦕
TypeScript
71
star
31

demo-todo-with-angular

A basic demo example for integrating between Appwrite & Angular ❤️
TypeScript
67
star
32

playground-for-android

Simple examples that help you get started with Appwrite + Android (=❤️)
Kotlin
66
star
33

sdk-for-go

[READ-ONLY] Official Appwrite GO SDK
Go
65
star
34

lite

A single container version of Appwrite with minimum must have features ⚖️
Shell
65
star
35

php-clamav

ClamAV network and pipe client for PHP
PHP
63
star
36

playground-for-node

Simple examples that help you get started with Appwrite + Node.js (=❤️)
JavaScript
63
star
37

playground-for-python

Simple examples that help you get started with Appwrite + Python (=❤️)
Python
62
star
38

realtime-1-million

Learn how we built and tested our realtime server to 1M+ concurrent connections
Shell
59
star
39

sdk-for-ruby

[READ-ONLY] Official Appwrite Ruby SDK 💎 🔴
Ruby
58
star
40

demo-todo-with-nextjs

A basic demo example for integrating between Appwrite & Next.js 💙
TypeScript
55
star
41

rfc

Architectural and new features proposals and designs for Appwrite 📖
54
star
42

docker-clamav

ClamAV docker image with auto database updates
Shell
50
star
43

docker-smtp

SMTP server docker container for sending emails.
Dockerfile
48
star
44

assistant

Appwrite's AI assistant 🧠
JavaScript
48
star
45

sdk-for-swift

[READ-ONLY] Official Appwrite Swift SDK 🦅🍎
Swift
47
star
46

demos-for-vue

Demos and tutorials for getting started with Appwrite + Vue.js
Vue
44
star
47

runtimes

Appwrite configuration for Cloud Function runtimes settings 🌩
PHP
42
star
48

30daysofappwrite

Landing Page for 30 Days of Appwrite
Vue
41
star
49

techscrunch

Very relAIble open source alternative for TechCrunch
Svelte
40
star
50

builtwith

Explore popular projects built with Appwrite 🔍
TypeScript
40
star
51

demo-quiz-with-flutter

A basic demo example for integrating between Appwrite & Flutter 💙
Dart
40
star
52

playground-for-dart

Simple examples that help you get started with Appwrite + Dart (=❤️) as an Appwrite server-side integration.
Dart
40
star
53

integration-for-gitpod

Shell
39
star
54

hacktoberfest

🏡 Home to Appwrite's Hacktoberfest Landing Page
Svelte
39
star
55

playground-for-apple-swiftui

Simple examples that help you get started with Appwrite + Apple with SwiftUI (=❤️)
Swift
39
star
56

demo-todo-with-flutter

A basic demo example for integrating between Appwrite & Flutter 💙
Dart
38
star
57

docker-mariadb

MariaDB container with Appwrite server DB schema and tables initialized and ready to use for fresh installations.
Dockerfile
37
star
58

docker-resque-ui

Docker container for Resque web UI
Dockerfile
36
star
59

demos-for-svelte

Demos and tutorials for getting started with Appwrite + Svelte
JavaScript
36
star
60

playground-for-php

Simple examples that help you get started with Appwrite + PHP (=❤️)
PHP
35
star
61

docker-flutter

Flutter docker image for Appwrite CI
Dockerfile
33
star
62

install

CLI tool for easy installation of a self-hosted Appwrite server
PHP
32
star
63

docker-telegraf

Telegraf Docker image, pre-configured for Appwrite server setup.
Dockerfile
31
star
64

demos-for-astro

Astro
31
star
65

playground-for-deno

Simple examples that help you get started with Appwrite + Deno (=❤️)
TypeScript
30
star
66

functions-starter

Java
30
star
67

demo-job-portal-with-apple

A basic demo example for integrating between Appwrite & Apple (=❤️)
Swift
29
star
68

playground-for-dotnet

Simple examples that help you get started with Appwrite + .NET (=❤️)
C#
29
star
69

demo-almost-netflix-for-web

A Netflix clone built with @appwrite + @vuejs + @nuxt
Vue
29
star
70

playground-for-swift

Simple examples that help you get started with Appwrite + Swift for Server (=❤️)
Swift
29
star
71

demos-for-angular

Demos and tutorials for getting started with Appwrite + Angular JS
TypeScript
29
star
72

playground-for-ruby

Simple examples that help you get started with Appwrite + Ruby (=❤️)
Ruby
27
star
73

playground-for-apple-uikit

Simple examples that help you get started with Appwrite + iOS with UIKit (=❤️)
Swift
27
star
74

docker-influxdb

InfluxDB Docker image, pre-configured for Appwrite server setup.
Shell
26
star
75

playground-for-kotlin

Simple examples that help you get started with Appwrite + Kotlin (=❤️)
Kotlin
25
star
76

demo-watertracker-with-flutter

Dart
25
star
77

docker-altair

GraphQL client explorer packaged as a docker container 🕸
JavaScript
24
star
78

docker-mailcatcher

MailCatcher for catching mail content during development
Dockerfile
22
star
79

sdk-for-rust

[READ-ONLY] Official Appwrite Rust SDK ⚙️
22
star
80

setup-for-appwrite

22
star
81

docker-requestcatcher

RequestCatcher for catching requests response during development
Dockerfile
22
star
82

integration-for-digitalocean

Appwrite integration for DigitalOcean 1-Click Marketplace
Shell
21
star
83

demo-quiz-with-android

Kotlin
20
star
84

benchmarks

The Appwrite laboratory for benchmarks and experiments 🧪 👩‍🔬 🥽
20
star
85

docker-base

Appwrite base image
Dockerfile
18
star
86

demo-almost-netflix-for-android

Kotlin
17
star
87

docker-swagger

Swagger UI Docker image, pre-configured for Appwrite server setup
16
star
88

.github

16
star
89

demo-getstarted-with-android

Kotlin
15
star
90

sdk-for-console

TypeScript
15
star
91

demo-almost-netflix-for-apple

Swift
14
star
92

playground-for-react-native

Simple examples that help you get started with Appwrite + React Native (=❤️)
JavaScript
12
star
93

sdk-for-node-cli

JavaScript
11
star
94

snapwrite

A tool to convert code snippets into beautiful Appwrite-themed social-media images
Svelte
9
star
95

makers

Makers of Appwrite
Svelte
7
star
96

playground-for-rust

6
star
97

starter-for-vue

Appwrite's starter kit for Vue.js 👩‍💻
4
star
98

getting-started-projects

TypeScript
4
star
99

demos-for-apple

Demos and tutorials for getting started with Appwrite + Apple
Swift
4
star
100

incidents

Details of incidents that occurred in Appwrite Cloud
4
star