Welcome to the Supabase React Native Starter Kit, your ultimate toolkit for building apps with speed and ease! 🛠️ Built on the powerful Expo platform, this starter kit combines modern tools and technologies to help you kickstart your React Native project with Supabase. 💡
Tech Stack includes:
- ⚛️ React Native
- 🌟 Expo
- 🔥 Supabase
- 🧭 React Navigation
- ✉️ Resend
Here’s what you get out of the box with this starter kit:
- 🔑 Authentication: Fully integrated sign-up/sign-in using Supabase.
- 🛤️ Navigation: Pre-configured and smooth navigation with React Navigation.
- 📧 Email Verification: Ensure users validate their emails with Resend.
- 👤 Profile: A sleek profile screen for updating and viewing user information.
Ready to dive in? Follow these steps to get started:
1️⃣ Clone the repository:
git clone https://github.com/Jaseyacey/react-native-supa-starter.git2️⃣ Install dependencies:
yarn install3️⃣ Set up Supabase:
- 🌐 Head to Supabase and create an account.
- 🔑 Create a new project and grab the URL + API keys.
- 🔐 Create a new table called
userswith the following columns:user_uuid(UUID)user_email(TEXT)created_at(TIMESTAMP)
4️⃣ Configure Supabase:
Add these variables to a .env file in your project’s root:
EXPO_PUBLIC_SUPABASE_KEY=YOUR_SUPABASE_PUBLISHABLE_KEY
SUPABASE_SERVICE_ROLE_KEY=YOUR_SUPABASE_SECRET_KEY
EXPO_PUBLIC_SUPABASE_URL=YOUR_SUPABASE_SERVICE_URL
JWT_SECRET=YOUR_JWT_SECRET5️⃣ Set up Resend:
- ✉️ Create an account at Resend.
- 🔑 Grab your API key and add it to the
.envfile:
EXPO_PUBLIC_RESEND_API_KEY=YOUR_RESEND_API_KEY6️⃣ Run the app:
yarn start🎉 Boom! Your app is live!
Here’s how to use the app:
1️⃣ Sign up:
- Click the
Sign Upbutton. - Enter your email and password.
- Check your inbox 📩, and click the verification link.
2️⃣ Sign in:
- Click the
Sign Inbutton. - Enter your email and password to log in. ✅
This starter kit is licensed under the MIT License. Feel free to use it however you like! 🌈
We ❤️ contributions! Follow these steps to get involved:
1️⃣ Fork the repository 🍴
2️⃣ Create a new branch 🌿
3️⃣ Create an issue in the Project, then use the issue name as the 🌿 name
4️⃣ Make your changes ✍️
5️⃣ Commit your changes 📦
6️⃣ Push your branch 🚢
7️⃣ Open a pull request 🚀
8️⃣ Wait for review and merge! 🎉
Big shoutout to these awesome tools that make this starter kit possible:
- ⚛️ React Native
- 🌟 Expo
- 🔥 Supabase
- 🧭 React Navigation
- ✉️ Resend
Got questions or feedback? Let’s chat! 💬
📧 Email: Jason Beedle