Completed
00:00:00 – Intro / Live Demo
Class Central Classrooms beta
YouTube videos curated by Class Central.
Classroom Contents
Build an AI-Powered Meditation App with React Native
Automatically move to the next video in the Classroom when playback concludes
- 1 00:00:00 – Intro / Live Demo
- 2 00:06:33 – Creating Project
- 3 00:07:49 – Resetting Project
- 4 00:09:19 – Running Project
- 5 00:10:19 – Implementing Authentication
- 6 00:11:42 – Clerk Expo UI Overview
- 7 00:13:36 – Setting Up Clerk Dashboard
- 8 00:15:03 – Enabling Native Application in Clerk
- 9 00:16:40 – Creating a Development Build
- 10 00:19:59 – Implementing Clerk Native UI
- 11 00:23:15 – Expo Router Authentication
- 12 00:26:23 – Adding Token Cache
- 13 00:26:45 – Installing Expo Secure Store
- 14 00:27:18 – Configuring Clerk Publishable Key
- 15 00:30:03 – Adding Clerk Wrapper Component
- 16 00:31:30 – Expo Router Protected Routes
- 17 00:36:47 – Implementing Auth Screens
- 18 00:40:32 – Testing Authentication Flow
- 19 00:45:25 – Styling Auth Screens
- 20 00:46:47 – Implementing Animated Gradient with Skia
- 21 00:47:48 – Installing React Native Skia
- 22 00:52:06 – Changing Gradient Size
- 23 00:56:20 – Animating Gradient in Y Axis
- 24 01:04:17 – Animated Gradient from A to B
- 25 01:06:52 – Animating Gradient Radius
- 26 01:16:30 – Adding Gradient Pulse Animation
- 27 01:23:00 – Testing Gradient Animation States
- 28 01:26:55 – ElevenLabs Intro
- 29 01:28:12 – ElevenLabs Dashboard Overview
- 30 01:28:54 – Creating a New AI Agent
- 31 01:35:15 – Adding Agent Environment Variable
- 32 01:35:37 – Installing ElevenLabs Dependencies
- 33 01:36:34 – Adding ElevenLabs Provider
- 34 01:37:32 – Implementing Agent Conversation
- 35 01:38:15 – Adding WebRTC Plugins
- 36 01:39:28 – Generating App Icon with AI
- 37 01:42:26 – Creating Agent Session Screen
- 38 01:48:04 – Start Conversation Function
- 39 01:49:24 – End Conversation Function
- 40 01:50:18 – Starting an Agent Session
- 41 01:52:32 – Agent Dynamic Variables
- 42 01:53:44 – Adding Meditation Sessions List
- 43 02:00:33 – Using Route Params to Get Session
- 44 02:03:15 – Testing Agent with Dynamic Session Params
- 45 02:03:55 – Improving Session Screen UI
- 46 02:06:50 – Creating a Button Component
- 47 02:18:01 – Getting Conversation ID
- 48 02:18:30 – Integrating Client Tools Brightness
- 49 02:22:15 – Configuring Brightness Tool in ElevenLabs
- 50 02:27:42 – Adding Agent Server-Side Tools
- 51 02:31:47 – Creating Session Summary Screen
- 52 02:35:28 – Adding Server-Side ElevenLabs API Key
- 53 02:36:57 – Adding Conversation Types
- 54 02:37:52 – Creating Conversations API Route
- 55 02:44:00 – Deploying API Route to EAS Hosting
- 56 02:46:46 – Testing Summary Screen API
- 57 02:48:28 – Displaying Session Summary
- 58 02:51:16 – Parallax Scroll View Component
- 59 03:09:03 – Adding Explore Session Section
- 60 03:14:30 – Appwrite Overview
- 61 03:15:48 – Creating a New Appwrite Project
- 62 03:16:18 – Appwrite Project ID Env Variable
- 63 03:17:00 – Creating Database
- 64 03:17:40 – Appwrite New Database Terminology
- 65 03:18:46 – Creating a Sessions Table
- 66 03:20:32 – Database Permissions
- 67 03:22:25 – Installing Appwrite Dependencies
- 68 03:23:25 – Appwrite Configuration File
- 69 03:26:35 – Adding Types for Sessions Data
- 70 03:29:01 – Fetching User Sessions
- 71 03:32:34 – Saving User Sessions to Database
- 72 03:37:01 – Adding a Refresh Sessions Button
- 73 03:38:45 – Render Users Session History
- 74 03:43:13 – Minor UI Improvements
- 75 03:43:38 – Displaying User Card
- 76 03:45:07 – Recap