All Projects โ†’ Sooraj-s-98 โ†’ appwrite-todo-with-nextjs

Sooraj-s-98 / appwrite-todo-with-nextjs

Licence: MIT license
About A basic demo example for integrating between Appwrite & Next JS ๐Ÿ’™

Programming Languages

javascript
184084 projects - #8 most used programming language
CSS
56736 projects

Projects that are alternatives of or similar to appwrite-todo-with-nextjs

demo-todo-with-react
A basic demo example for integrating between Appwrite & React JS ๐Ÿ’™
Stars: โœญ 88 (+528.57%)
Mutual labels:  appwrite
playground-for-php
Simple examples that help you get started with Appwrite + PHP (=โค๏ธ)
Stars: โœญ 24 (+71.43%)
Mutual labels:  appwrite
sdk-for-kotlin
[READ-ONLY] Official Appwrite Kotlin SDK ๐Ÿ’™๐Ÿงก
Stars: โœญ 41 (+192.86%)
Mutual labels:  appwrite
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.
Stars: โœญ 69 (+392.86%)
Mutual labels:  appwrite
playground-for-android
Simple examples that help you get started with Appwrite + Android (=โค๏ธ)
Stars: โœญ 48 (+242.86%)
Mutual labels:  appwrite
demos-for-vue
Demos and tutorials for getting started with Appwrite + Vue.js
Stars: โœญ 37 (+164.29%)
Mutual labels:  appwrite
demos-for-svelte
Demos and tutorials for getting started with Appwrite + Svelte
Stars: โœญ 27 (+92.86%)
Mutual labels:  appwrite
sdk-for-php
[READ-ONLY] Official Appwrite PHP SDK ๐Ÿ˜
Stars: โœญ 109 (+678.57%)
Mutual labels:  appwrite
sdk-for-android
[READ-ONLY] Official Appwrite Android SDK ๐Ÿ’š ๐Ÿค–
Stars: โœญ 62 (+342.86%)
Mutual labels:  appwrite
FoodMagic
An AR App for Restaurants and Food Delivery โœจโœจ
Stars: โœญ 53 (+278.57%)
Mutual labels:  appwrite
php-clamav
ClamAV network and pipe client for PHP
Stars: โœญ 45 (+221.43%)
Mutual labels:  appwrite
Appwrite
Appwrite is a secure end-to-end backend server for Web, Mobile, and Flutter developers that is packaged as a set of Docker containers for easy deployment ๐Ÿš€
Stars: โœญ 14,592 (+104128.57%)
Mutual labels:  appwrite
sdk-for-dart
[READ-ONLY] Official Appwrite Dart SDK ๐Ÿ’™
Stars: โœญ 79 (+464.29%)
Mutual labels:  appwrite
sdk-for-dotnet
[READ-ONLY] Official Appwrite .NET SDK
Stars: โœญ 37 (+164.29%)
Mutual labels:  appwrite
vscode-appwrite
Appwrite extension for Visual Studio Code
Stars: โœญ 30 (+114.29%)
Mutual labels:  appwrite
sdk-for-ruby
[READ-ONLY] Official Appwrite Ruby SDK ๐Ÿ’Ž ๐Ÿ”ด
Stars: โœญ 45 (+221.43%)
Mutual labels:  appwrite
playground-for-python
Simple examples that help you get started with Appwrite + Python (=โค๏ธ)
Stars: โœญ 36 (+157.14%)
Mutual labels:  appwrite
playground-for-node
Simple examples that help you get started with Appwrite + Node.js (=โค๏ธ)
Stars: โœญ 39 (+178.57%)
Mutual labels:  appwrite

๐Ÿ”– Todo With NextJS

logo A simple todo app built with Appwrite and Nextjs

๐ŸŽฌ 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.

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

  2. Create a new collection with the following properties

  • Rules

Add the following rules to the collection.

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

Content Rule

IsComplete Rule

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

  • REACT_APP_ENDPOINT - Your Appwrite endpoint
  • REACT_APP_PROJECT - Your Appwrite project ID
  • REACT_APP_COLLECTION_ID - Your Appwrite collection ID

Run locally

Follow these instructions to run the demo app locally

$ git clone https://github.com/Sooraj-s-98/appwrite-todo-with-nextjs
$ cd appwrite-todo-with-nextjs

Now fill your environment variables

image

Now run the following commands and you should be good to go ๐Ÿ’ช๐Ÿผ

$ npm install
$ npm run dev

Screenshot

image

image

Thanks

Glad to see here! Show some love by starring this repository.

Note that the project description data, including the texts, logos, images, and/or trademarks, for each open source project belongs to its rightful owner. If you wish to add or remove any projects, please contact us at [email protected].