Learn to build a complete full-stack mobile application in this comprehensive 8-hour tutorial that takes you through creating a Reddit clone using modern mobile development technologies. Master React Native fundamentals while working with Expo for streamlined development, implement robust authentication using Clerk, and create a powerful backend with Supabase database integration. Develop essential frontend skills including navigation with Expo Router, bottom tabs setup, custom component creation with TypeScript safety, FlatList implementation for displaying posts, and advanced React patterns using useRef, useMemo, and useCallback hooks. Build a complete user interface featuring post creation screens, comment sections, community filtering, and global state management. Implement secure user authentication with Clerk integration, including login/logout functionality and seamless Supabase integration for user management. Create a robust backend architecture by setting up Supabase projects, designing database tables, implementing data fetching with TypeScript support, and utilizing TanStack Query for efficient data management. Learn advanced backend concepts including mutations for data updates, query invalidation for real-time UI updates, row-level security (RLS) implementation, and CRUD operations for posts, comments, and upvotes. Enhance your application with practical features like image picking and storage capabilities, pagination for improved performance, and complete error handling throughout the application stack.

Syllabus

0:00 Introduction and Project Overview
01:47 What will you learn in this video
0:12:29 Set up Expo Router
0:24:01 Set up Bottom Tabs Navigation
0:37:36 Display a Basic Post
01:04:02 Create your First Custom Component
01:11:11 Create Type Safe Components
01:17:08 List of Items Flatlist
01:49:02 Details Post Screen
02:11:17 Create a Post Screen
02:33:33 Adding the KeyboardAvoidingView
02:41:26 Group Filter Screen
02:51:57 Displaying a List of Communities
02:57:39 Global State Management
03:10:05 Building the Comments Section
03:59:22 Implementing useRef, useMemo and useCallback
04:19:16 User Interface Recap
01:20:52 Authentication with Clerk
01:41:31 Adding Logging Out Functionality
05:47:27 Integrating Clerk with Supabase
04:21:55 Recap and Backend Introduction
04:22:44 Create a new Supabase Project
04:27:52 Setup Database Tables
04:33:03 Fetch data from Database into the app
04:38:58 Fetch Post Offer
04:41:33 Setup TypeScript for Supabase
04:48:56 What is Tanstack Query
05:03:46 Implementing Querying on the Details Page
05:26:43 Update data with Mutations
05:34:08 Extracting Mutation logic in another file
05:37:21 Performing actions in the UseMutation
05:40:04 Adding some Extra Bonus Features
05:41:40 Invalidating Queries to Update UI
06:15:13 Project Recap So Far
06:21:57 Implementing the DELETE Feature
06:30:11 Displaying Number of Upvotes
06:40:29 Creating a New Upvote
06:51:25 Enabling RLS Row Level Security for Upvotes
06:54:06 Implementing Backend for Comments
07:41:43 Implementing Image Picker
07:48:34 Image Storage
08:21:12 Implementing Pagination
08:36:29 Outro