Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/Axolodev/next-appwrite-users
App that showcases how to use Next.js with Appwrite as its backend
https://github.com/Axolodev/next-appwrite-users
appwrite nextjs
Last synced: 2 months ago
JSON representation
App that showcases how to use Next.js with Appwrite as its backend
- Host: GitHub
- URL: https://github.com/Axolodev/next-appwrite-users
- Owner: Axolodev
- Created: 2022-10-10T08:38:43.000Z (over 2 years ago)
- Default Branch: main
- Last Pushed: 2022-10-23T22:37:06.000Z (about 2 years ago)
- Last Synced: 2024-08-11T16:09:06.638Z (5 months ago)
- Topics: appwrite, nextjs
- Language: TypeScript
- Homepage:
- Size: 311 KB
- Stars: 6
- Watchers: 1
- Forks: 4
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
- awesome-appwrite - Source code
README
# Appwrite Next.js Authentication
Next.JS App that uses Appwrite as its backend. It features:
- A simple signup and login flow, powered by [Appwrite's web SDK](https://www.npmjs.com/package/appwrite)
- Two API routes that handle User data. Both routes require authorization which is done through [Appwrite's Node SDK](https://www.npmjs.com/package/node-appwrite). More about them on [API Routes](#api-routes)## Setup
### Installing dependencies
Clone this repository and install its dependencies:
```bash
# npm
npm install
# or yarn
yarn
```### Setting up Environment Variables
Create a `.env.local` file based on the `.env.local.example` file included in the project. It should have the following values:
| Value | Description | Example |
| ------------------------------- | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ---------------------------- |
| NEXT_PUBLIC_APPWRITE_HOSTNAME | The URL where your Appwrite server is hosted. Include the protocol and no trailing slash | https://appwrite.example.com |
| NEXT_PUBLIC_APPWRITE_PROJECT_ID | Your Project ID generated by Appwrite. You can get it from `Your Project > Settings > Project ID` ([Screenshot](/gitAssets/screenshot-1.png)) | abc123abc123 |
| APPWRITE_SECRET_API_KEY | An API Key with permissions for `users.read` and `users.write`. ([Screenshot](/gitAssets/screenshot-2.png)) | abcasdfpojo123432 |
| ADMIN_TEAM_ID | A team where all your users with Admin rights will be included. You can find the ID on `Authentication > Teams > Select a team > Team ID`. ([Screenshot](/gitAssets/screenshot-3.png)) | 863451289065430265436 |### Launching the project
Run the project by using
```bash
npm run dev
# Or
yarn dev
```## API Routes
| Route | Description | Requirements |
| ------------ | --------------------------------------------------------------------------------------------------------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| users/all | Gets an array with all the users that have registered in the app. | User needs to be authenticated and part of the Admin team. Refer to [Setting up Environment Variables](#setting-up-environment-variables) for more information. |
| users/\[id\] | Gets a single user based on their ID. If using `me` as the id, it will return the current user's profile. | User needs to be authenticated to get their own profile, or to be part of the Admin team to get other users. Refer to [Setting up Environment Variables](#setting-up-environment-variables) for more information. |## Support
If you need help with this app or found a bug, you can submit an issue on the Issues tab or by messaging me on Twitter [@Axolodev](https://twitter.com/axolodev)
## Screenshots
![Simple login page with email and password fields](/gitAssets/app_screenshot-1.png)
![User list on the home page. Every user has their name, email, and a link to their profile page.](/gitAssets/app_screenshot-2.png)
![Very simple user profile. Just the user's name, email, and their first initial](/gitAssets/app_screenshot-3.png)