Skip to content

Sign in with Apple authentication within React Native and backend built with Express.js connected to a MongoDB for user management. Following best practices for iOS development.

Notifications You must be signed in to change notification settings

marinspira/apple-auth-react-native

Repository files navigation

Apple Auth for React Native

This repository provides a seamless integration of Sign in with Apple authentication within React Native applications. It includes a simple and secure way to implement Apple ID-based authentication, following best practices for iOS development.

🚨 Important Notice

This Sign in with Apple feature is designed to work exclusively on Apple devices. Due to the nature of Apple's authentication system, it is not supported on Android devices or any non-Apple platforms.

To test or use this feature, ensure you are using an iOS device or simulator. If you attempt to use this on non-Apple devices, you will not be able to complete the authentication process.

✨ Features:

Easy Setup: Quickly integrate Sign in with Apple into your React Native app with minimal configuration. Native Support: Leverages native iOS capabilities for a smooth and reliable user experience. Secure Authentication: Handles user authentication securely using Apple's standards and best practices. Customizable UI: Modify the appearance of the Apple sign-in button to match your app's design.

🛠 Requirements

Before you begin, make sure you meet the following requirements:

Node.js: Ensure you have Node.js installed (version 14.x or higher).

Expo CLI: Install Expo CLI globally on your machine with npm install -g expo-cli. Ngrok: To expose your local server to the web and test on real devices.

🚀 Installation & Usage:

Clone the repository:

Install the necessary package:

  • npm i

Environment Variables

To get started with the project, you'll need to set up environment variables for your backend. Create a .env file inside the 'backend' folder with the following variables:

  • MONGO_DB_URI=<your_mongodb_connection_string>
  • PORT=8000
  • JWT_SECRET=<your_jwt_secret>

🌐 Exposing the Local Server with Ngrok

To enable Apple authentication and save or create a new user on the data base, you need a public URL for your server; use Ngrok to expose your local server for testing.

Install Ngrok:

Download and install Ngrok from the official website 'ngrok.com and' and start it in a new terminal window:

  • ngrok http 8000

Update the environment variable:

Copy the URL generated by Ngrok (something like https://abc123.ngrok.io).

After that, search for EXPO_PUBLIC_SERVER_ADDRESS and replace the environment variable to point to the Ngrok URL

Restart Expo to apply the changes:

  • npx expo start --tunnel

Now your project is set up for Apple authentication with a public URL exposed, allowing testing on real devices and communication with Apple servers.

🤝 Contributions:

Contributions, issues, and feature requests are welcome! Feel free to check out the issues page or submit a pull request

About

Sign in with Apple authentication within React Native and backend built with Express.js connected to a MongoDB for user management. Following best practices for iOS development.

Topics

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published