React Native Full 8 Hours Course (Expo, Expo Router, Supabase)
notJustā€¤dev notJustā€¤dev
108K subscribers
90,051 views
0

 Published On Premiered Feb 6, 2024

Take a complete and immersive journey from a beginner to an expert in Full Stack Mobile Development with our 8 hour Masterclass. Immerse yourself in React Native and Supabase, mastering the necessary skills to create strong and scalable mobile applications. This detailed guide will help you become a professional in Full Stack development, by building a Food Ordering Application with a beautiful Frontend and powerful backend. Begin your journey today and master Full Stack Mobile Development in just 8 hours!

šŸŽ’ Asset Bundle(dummy data, files, images): https://assets.notjust.dev/pizza
šŸ“š Follow along with our step-by-step guide: https://notjust.notion.site/notjust/R...
šŸ’» Source Code: https://github.com/notJust-dev/FoodOr...

šŸ”— Useful Links:
Supabase Signup: https://supabase.com/dashboard/sign-u...
Download Xcode: https://developer.apple.com/xcode/
Download Android Studio: https://developer.android.com/studio

šŸ§­ Navigate using timecodes:

INTRO AND OVERVIEW

00:00 Introduction and Structure
01:25 Module 1 Overview: UI
02:19 Module 2 Overview: Backend
03:06 Module 3 Overview: Production
03:25 Asset Bundle and Project Guide Download

MODULE 1: UI

04:26 Development Environment Configuration
07:16 Setting Up a Fresh Expo Project
15:17 UI Development
16:53 Text Rendering and Styling
21:42 Replacing Hardcoded Data
23:40 Image Rendering and Styling
27:43 Custom Component Creation
36:09 Fixing UI Issues
43:02 Implementing TypeScript Path Aliases
46:28 FlatList Implementation
52:34 Flatlist Edge Cases
53:13 Image Fixes
54:25 Expo Router Screens
55:13 Creating Screens with Expo Router
01:02:37 Code Structure for Screens
01:11:39 Product Details Screen
01:15:11 Select Size Component
01:26:16 Managing Selected Size with State
01:34:36 Shopping Cart Implementation
01:35:38 Using Modals
01:40:31 Sharing Data with React Context
01:58:42 Rendering Shopping Cart Items
02:13:26 Additional Shopping Cart Features
02:19:05 Application Overview
02:19:05 Admin Side Introduction
02:20:14 Admin Side Screens Structure
02:30:01 Creating a Product Screen
02:31:52 Working with Text Inputs and Forms
02:40:57 Image Picker Implementation
02:44:56 Product Screen Overview
02:45:51 Update and Delete Product
02:55:20 Module 1 Final Overview
03:00:57 Assignment 1 Solution
03:05:08 Assignment 2 Solution
03:22:32 Update Order Status Feature
03:24:57 Orders Top Tab Navigator

MODULE 2: Backend

03:33:06 Module 2 Overview: Backend
03:35:14 Creating and Configuring Supabase
03:36:37 Configuring Supabase in React Native
03:45:47 User Session Management
03:58:52 Admin Side Authentication with Supabase
04:10:53 Product CRUD Operations
04:10:53 Products Table Creation
04:27:34 Reading Products by ID
04:33:32 Creating Products
04:42:33 Updating Products
04:49:15 Deleting Products
04:52:31 CRUD Operations Overview
04:53:02 Typescript Integration with Supabase
05:00:59 Orders CRUD Operations
05:00:59 Reading Orders
05:21:53 Creating Orders
05:32:38 Linking Order Items
05:45:17 Updating Orders
05:49:40 CRUD Operations Overview
05:50:02 Real-Time Data with Subscriptions
05:50:55 Enabling Real-Time Subscriptions
05:51:39 New Orders Subscription
05:57:21 Order Status Change Subscription
05:59:17 Testing Real-Time Updates
06:01:19 Storage with Supabase
06:01:19 Storage Implementation
06:09:12 Downloading Images
06:12:36 Image Scaling with CDN

MODULE 3: Production

06:13:45 Module 3 Overview: Production
06:14:51 Bug Fixes and Polish
06:19:00 User Logout Functionality
06:22:01 Local Supabase Setup
06:37:10 Admin Account Creation
06:39:36 Integrating Stripe Payments
06:42:23 Stripe Payments Resources
06:43:06 Payment Flow Explanation
06:45:58 Stripe Key Setup
06:47:10 Stripe Payment Intent Creation
07:00:58 Payment Collection Form
07:14:06 Stripe Customer Creation
07:15:29 Linking Stripe Customers
07:19:34 Creating Stripe Customer
07:34:43 Push Notifications Overview
07:35:31 Expo Application Services Integration
07:38:38 Push Notifications Services Comparison
07:42:43 Setting Expo Push Notifications
07:57:10 Implementing Remote Push Notifications
08:02:11 Sending Remote Notifications
08:03:33 Supabase Remote Env Variable Setup
08:15:50 Outro

šŸ’¬ Join the notJust Development gang and let's build together:
Twitter: Ā Ā /Ā vadimnotjustdevĀ Ā 
Instagram: Ā Ā /Ā vadimnotjus.Ā Ā .
Facebook: Ā Ā /Ā notjustdevĀ Ā 
LinkedIn: Ā Ā /Ā vadimsavinĀ Ā 
Discord: Ā Ā /Ā discordĀ Ā 

#tutorial #reactnative #beginners

show more

Share/Embed