React Native Auth UI

A beautiful auth template starter app built with React Native, Expo and Appwrite.

Blog: Coming soon

What is Appwrite

Appwrite is an open-source backend server that helps you build modern apps faster. It is a secure end-to-end backend server that is specially designed for frontend and mobile developers. It is a self-hosted solution that provides developers with a set of easy-to-use APIs to build any kind of project.

Learn more about Appwrite here.

Features

• Supports Email sign-in and sign-up
• Supports for OAuth providers
• Forgot password and reset password
• Beautiful and animated UI
• Built on File-based routing

Tech Stack

• React Native
• Expo
• Appwrite
• Expo Router

Getting started

If you are new to Github and haven't heard how to use this template, I recommend refer to getting-started guide on how to use this template.

Once you have the project setup, let's setup Appwrite Project and configure the app.

Appwrite Setup

1. Create an account on Appwrite if you don't have already.

2. If you don't have and org setup, create a new organization.

3. Once thats done, create a new project. Give it a name and a custom project Id.

4. Add a new Ios and Android platform to the project. You can find the bundle identifier in the app.json file.

5. To Setup OAuth providers, go to the Auth => Settings tab in the Appwrite dashboard and add the providers you want to use. Refer to their individual docs on how to setup the OAuth providers.

That's it for the Appwrite setup. Now let's configure the app.

App Configuration

1. Copy the .env.example file to .env and fill in the details.

   cp .env.example .env

2. Fill in the Appwrite details in the .env file.

   EXPO_PUBLIC_API_URL=your_appwrite_api_url
   EXPO_PUBLIC_PROJECT_ID=your_appwrite_project_id
   EXPO_PUBLIC_PLATFORM=your_app_bundle_id

3. Ensure you change the app name , app slug and bundle identifier in the app.json file.

Note

Ensure the bundle identifier is the same as the one you added in the Appwrite project.

4. (Optional) you can change the app splash screen and icon in the app.json file.

Running the app

1. Install dependencies

   npm install

2. Prebuild the app

   npx expo prebuild

3. If you are development mode, ensure you type npm run ios or npm run android to start the app.

4. If the app is already installed, npm run start should be fine for you

Contributing

Contributions are highly Welcomed 💙 . Feel free to open PRs for small issues such as typos. For large issues or features, please open an issue and wait for it to be assigned to you.

Join the community

Join Appwrite community of developers and contributors to get help, share your projects and contribute to the platform.

• Appwrite on GitHub: View appwrite open source platform and contribute.
• Discord community: Geek out with other Appwriters and get help from the community.

License

This project is open source and available under the MIT License.