Mar 15
Loading video player...
✨ Try Neon for FREE: https://dub.sh/neon1 🚀 Try Clerk for FREE: https://dub.sh/clerk2 💫 Try Sentry for FREE: https://dub.sh/sentry1 (Get $80 for FREE) 🎉 My 100+ Hours Udemy Course: https://dub.sh/udemy-discount ✨ Source Code: https://dub.sh/2code (Give it a star) 💥 Diagrams: https://dub.sh/diagrams4 To start the project, type this command in your terminal: 👉 npx create-expo-app@latest --template default@next ✨ Highlights: 📱 Fully Functional Mobile App built with React Native & Expo 🧑💻 Beginner-Friendly 📱 Cross-Platform Support (iOS & Android) 🔐 Authentication with Clerk (Google, Apple & GitHub login) 🧾 List Screen to manage grocery items ✅ Mark Items as Purchased with check functionality 🔢 Update Item Quantities 🗑️ Delete Items 📝 Planner Screen to add new grocery items 📊 Insights Screen with profile information and analytics 🚪 Secure Logout Flow 🧹 Clear Completed Items with a single button 💬 User Feedback Button to collect feature suggestions and bug reports 🎨 Liquid Glass iOS Tab Effect using Expo Native Tabs 🗄️ PostgreSQL Database for persistent data storage 🧩 Drizzle ORM for type-safe database queries ☁️ Cloud Database Hosting with Neon 🎨 Styling with NativeWind (TailwindCSS for React Native) ⚡ Global State Management with Zustand 🚀 Modern Full-Stack Mobile Architecture 🆓 100% Free Setup — No credit card required 📂 Full Source Code Provided Timestamps: 00:00:00 - 0- Project Preview 00:03:46 - 1- Project Setup & Understanding React Native 00:33:33 - 2- NativeWind Setup 00:40:17 - 3- Auth Setup with Clerk 01:04:39 - 4- Building Our Custom Auth Screen 01:36:20 - 5- Database & Drizzle Setup 01:58:08 - 6- Bottom Tabs with Native Tabs 02:09:17 - 7- Expo API Routes 02:25:06 - 8- Setting Up Our Store with Zustand 02:44:35 - 9- Building the List Screen 03:19:04 - 10- Building the Planner Screen 03:46:39 - 11- Building the Insights Screen 04:05:26 - 12- Adding the Feedback Button Thanks for watching! Keywords: React Native Tutorial. Mobile Apps with React Native. Build a Mobile App. #coding #webdevelopment #mobiledeveloper #react #reactnative #programming #codesistency