Creating the Topbar | React Native School

Autoplay
Autocomplete

Previous Lecture Complete and Continue

React Native Advanced

Welcome

Course Outline
Join Our Online Classroom!
Exercise: Meet The Community
Accessing Code
Environment Setup & Basics

Let's Get Building

Let’s check out the Master Project (4:18)
Let’s go over the Master Project Features (1:17)
Understanding Mobile Layouts (1:45)
Creating Layouts using Flexbox (4:49)
Exercise: Initialze our Master Project (0:38)
Solution: Initialize our Master Project (1:33)
Writing Clean Code (4:55)
Configuring Eslint (5:18)
Basic App Layout (8:04)
Writing More Clean Code (1:46)
iPhone StatusBar (1:49)
Android StatusBar (4:55)
Creating the Topbar (5:33)
Using SVG (2:46)
Adding Map Icon to Topbar (2:46)
Uh Oh: Debugging SVGs (5:26)
Modularize Topbar (6:39)
Exercise: Build Bottom Navigation (0:35)
Solution: Build Bottom Navigation (4:57)
Adding Icons to the Bottom Navigation (2:12)
Add Labels to the Bottom Navigation Icons (4:46)
Navigation Code Cleanup & Using PropsTypes (8:48)
Using Seed Data (1:10)
Closeby Restaurants Seed Data (1:11)
ReactNative SectionList Overview (3:41)
SectionList: CloseBy Restaurants (9:51)
CloseBy Restaurants Code Cleanup (2:48)
Favorite Restaurants Section Overview (0:43)
Favorite Restaurants Seed Data (0:45)
SectionList: Favorite Restaurants (10:17)
SectionList: Code Cleanup (7:45)
Using React Native Swiper (3:41)
Setup React Native Swiper (6:45)
Favorites Restaurants Swiper Data Structure (2:05)
Code Favorite Restaurants Swiper Data Structure (9:43)
Code Cleanup: Favorites Restaurants Swiper (12:27)
Folder Structure Overview (1:42)
App Folder Structure (10:11)
Setup: Module Resolver (4:35)
Using the Module Resolver (4:27)
Exercise: Refactor RestaurantList (0:52)
Solution: Refactor RestaurantList (16:08)
Global Styles (4:52)
Exercise: Update Styles (1:45)
Solution: Update Styles (6:52)
Style Sweep: Home Screen (8:44)
Setup: Custom Fonts (8:09)
Using Custom Fonts (9:06)
Restaurant Map View (10:54)
Add Restaurant Map Markers (8:03)
Selecting Map Markers (14:36)
Mutating State Gotcha (1:50)
Restaurant Selected Card (8:44)
Exercise: Create RestaurantSelected Component (2:29)
Solution: Restaurant Selected Component (16:36)
Navigation Overview (2:08)
Tab Navigation Setup (10:29)
Add Icons to Tab Navigation (8:57)
Code Cleanup: Tab Navigation Cleanup (10:38)
Add Support for Map Modal (7:03)
Connect Home and Map Modal (11:48)
Code Cleanup: Navigation (10:57)
Understanding React Hooks (2:18)
Setup Search Input using React Hooks (8:09)
Resetting Search Input Using Hooks (5:55)
Building Search Results Component (15:45)
Connect Search Input and Search Results (7:30)
Reset Search Input (7:30)
Initial Restaurant Details Screen (3:11)
Building Restaurant Details Modal (10:29)
Add Back Button to Restaurant Details (6:52)
Exercise: Favourite Restaurant (2:08)
Solution: Favorite Restaurant (2:37)
Restaurant Menu (14:49)
Restaurant Menu Items (3:48)
Exercise: Navigate to Restaurant Modal (2:34)
Solution: Navigate to Restaurant Modal (15:13)
Passing Route Parameters to Restaurant Details (12:32)
Setup Navigation for Authentication (4:46)
Welcome Screen Design (5:10)
Log In Screen (11:50)
Sign up Screen (7:13)
Firebase Setup (3:08)
Configure Firebase (1:22)
Firebase API Overview (1:25)
Firebase Service (7:17)
Setup Firebase as a Service (11:14)
Setup App Signout (5:36)
Exercise: Profile Screen (1:35)
Solution: Refactor Profiler Screen (9:44)
Add Location Modal (8:40)
Fetch User Profile (6:05)
Update User Profile (3:29)
Display User Profile (3:01)
Google Maps APIs (1:32)
Setup Google Maps (7:30)
Store User Location (3:16)
Search User's Close by Restaurants (5:58)
Use Google Places (7:08)
Using Custom Hooks (2:11)
Creating Custom Hooks: Search & User (4:32)
Update Search to use Custom Hook (10:41)
Update App to use Custom Hooks (11:50)
Using Lottie Animation (10:52)
Favorite a Restaurant (10:14)
Show Favourite Restaurants on Home Screen (6:11)

Teach online with

Creating the Topbar

Lecture content locked

If you're already enrolled, you'll need to login.

Enroll in Course to Unlock