Class Central is learner-supported. When you buy through links on our site, we may earn an affiliate commission.

Zero To Mastery

Complete React Native Developer [with Hooks]

via Zero To Mastery

Overview

The only React Native course you need to learn React Native, build large-scale React Native iOS + Android apps from scratch and get hired as a Mobile App Developer this year.
  • Build enterprise level React Native apps and deploy them to the Apple App Store and Google Play Store
  • Learn to lead Mobile App projects by making good architecture decisions and helping others on your team
  • Learn the latest features in React Native including Hooks, Context API, AsyncStorage, Animation, and more
  • Become a top 10% React Native Developer
  • Set up authentication and user accounts using Firebase and Firebase Functions
  • Use the latest ES6/ES7/ES8/ES9/ES10 JavaScript to write clean code
  • Google Maps API and adding interactive maps to your projects
  • Build reactive, performant, large scale applications like a Senior Mobile App Developer
  • Build cross platform mobile apps for iOS and Android without using Swift, Objective C, Java, and Kotlin
  • Master the latest ecosystem of a React Native Developer from scratch
  • Stripe Payments (online payments) integration in your mobile apps
  • Routing with React Navigation
  • Using native phone capabilities like Camera and Vibration
  • Styled-Components and native styling to make beautiful, modern apps

Syllabus

  •   Introduction
    • React Native: Zero to Mastery
    • Course Outline
    • Exercise: Meet Your Classmates and Instructor
    • Meeting Bruno
    • Complete Course Resources + Code
    • How-to's: Speed up videos, Downloading videos, Subtitles
  •   React Native Fundamentals
    • How We Got Here - React Native History
    • How We Got Here 2 - React Native History
    • Why React Native?
    • Our First React Native App
    • React Native Internals
    • React Native Internals 2
    • Exercise: Is There CSS?
    • Unlimited Updates
  •   The 2 Paths
    • The 2 Paths
    • React DOM vs React Native
    • Recommended Setup
    • Keeping Your App Up To Date
    • Endorsements On LinkedIn
  •   Building With React Native: FocusTime App
    • FocusTime Demo
    • Before We Get Going!
    • Introduction To Expo
    • Getting Ready To Hit The Ground Running!
    • Who Likes Snacks?
    • Running Snacks On Your Device
    • Running The FocusTime Demo On Your Device
    • Proper Preparation Prevents Poor Snacking!
    • Quick Recap On What We've Done So Far
    • A Rundown Of What's In Our Snack
    • Why We Don't Run On Web
    • How To Avoid The Notch
    • How To Avoid The StatusBar
    • Styling The Background
    • Setting Up Our Focus Feature
    • Adding Text Input
    • Storing A Subject
    • Adding A Button
    • Making The App Reactive
    • Cleaning Up Spacing
    • Adding A Countdown Component
    • Adding The Timer Feature
    • Hooking Up Our Countdown
    • Adding The Focus Subject
    • Hooking Up The Progress Bar
    • Vibrating When The Timer Ends
    • Adding Timer Controls
    • Resetting The Timer
    • Keeping The App Awake
    • Focus History Feature Setup
    • Designing Our Focus List
    • Populating The Focus History
  •   Mobile Development Professional: Local Setup
    • Before You Start, Read This!
    • [MAC] Exporting FocusTime Locally
    • [MAC] Installing GIT
    • [MAC] Installing Node and Yarn
    • [MAC] Running it on IOS Simulator
    • [MAC] Installing Android Studio
    • [MAC] Installing Android SDK Tools
    • [MAC] Running On An Emulator
    • [MAC] Installing VSCode
    • [MAC] Optional: Using GIT With Visual Studio Code
    • [WINDOWS] Exporting FocusTime Locally
    • [WINDOWS] Installing GIT And VSCode
    • [WINDOWS] Optional: Using GIT With Visual Studio Code Part 1
    • [WINDOWS] Optional: Using GIT With Visual Studio Code Part 2
    • Github What Is It Good For?
    • Github Appendix
    • [WINDOWS] Optional: Publishing Your Code To Github
    • [MAC] Optional: Publishing Your Code To Github
    • [WINDOWS] Installing Android Studio
    • [WINDOWS] Installing Node and Yarn
    • [WINDOWS] Running FocusTime On My Device
    • What If I'm Still Running Into Issues?
  •   Master Project: MealsToGo Project Setup
    • MealsToGo Demo
    • Project Files
    • Exercise: Imposter Syndrome
    • Setting Up Our Master Project
    • Note For Windows Users
    • Creating The MealsToGo Project
    • [Optional] MealsToGo On Github
    • Watch This Before Getting Started!
  •   Master Project: MealsToGo Core Part 1
    • Time For Yoga!
    • Let's Do Some Yoga!
    • React Native Flexbox And Snacks
    • Spring Cleaning The Expo Setup
    • Quick Note On Publishing Your App
    • Exercise App Layout
    • Solution App Layout
    • Android StatusBar Issue
    • Quick Note On Debugging
    • Keeping Up With The Code Step By Step
    • Setting Up Eslint And Prettier
    • Using Eslint
    • Optimizing Eslint
    • Setting Up Prettier
    • Exercise SearchBar
    • Solution SearchBar
    • Feature Overview: Restaurant List Item
    • Restaurant Info Setup Part 1
    • Restaurant Info Setup Part 2
    • Exercise Restaurant Info Card
    • Solution Restaurant Info Card
    • Reflection Time Restaurant Info
    • The Way We Are Styling Feels Weird
    • Trying Out Styled Components
    • Installing And Using Styled Component
    • Quick Note On How To Look At Changes
    • Exercise Migrating To Styled Components
    • Solution Migrating To Styled Components
    • Uhoh We Have An IOS Error
    • How Do We Make Things Consistent
    • Setting Up Our Theme
    • Exercise Theme Cleanup
    • Solution Theme Cleanup
    • Custom Fonts Fonts Fonts!
    • Loading Custom Fonts
    • Adding The Address
    • Using SVG With Rating
    • Exercise Adding Open Now SVG
    • Solution Finishing Our Restaurant Card
    • Quick Reminder
    • Building A Spacer Component
    • Optimizing The Spacer Component
    • Hold Up Why Do We Need Consistency
    • Wait A Second It Won't Render On Android
    • Creating A Typography Component And Cleanup
    • Solution Code Cleanup
    • FlatList!
    • List It!
    • Note On Content Container Style
    • No Inline Styles
    • Why Is There A White Bar?
    • Feature Overview: App Navigation
    • Navigation Installation
    • Exercise Tab Navigation
    • Solution Tab Navigation
    • Exercise Tab Bar Icons
    • Solution Tab Bar Icons
    • Simplifying Tab Icon Logic
  •   Master Project: MealsToGo Core Part 2
    • Feature Overview: Adding Data
    • Quick Recap Of What We'll Be Doing
    • Fake An API Request
    • Quick Refresh On Promises
    • Let's Transform The Data
    • Let's Transform The Data Part 2
    • Setting Up RestaurantContext
    • Hooking Up Our Context
    • Exercise Activity Indicator
    • Solution Activity Indicator
    • Quick Architecture Overview
    • Feature Overview Geocoding And Search
    • Setting Up Our Geocoding Service
    • Setting Up Our Geocoding Context
    • Hooking Up The Searchbar
    • Searching For Restaurants
    • Oh No A Bug!
    • Oh No A Bug Solution!
    • Key Warnings
    • Oh No An Anti-Pattern
    • Our Next Feature!
    • Let's Optimize Before We Build!
    • Building Navigation Infrastructure For Scale
    • Restructuring Navigation
    • Setting Up Stack Navigation
    • Setting Up Restaurant Detail Navigation
    • Modals And Touch Feedback
    • Exercise Rendering The Card
    • Solution Rendering The Card
    • Back To Our Feature!
    • Exercise Menu List
    • Solution Menu List
    • Feature Overview Map
    • Installing React Native Maps
    • Map Screen And Search
    • Setting The Map Region
    • Rendering Map Markers
    • Custom Map Callout Exercise
    • Custom Map Callout Solution
    • Linking A Callout To Details
    • Feature Overview Favourites
    • Favourites Context
    • Hooking Up Favourites Part 1
    • Hooking Up Favourites Part 2
    • Building A Favourites Bar Part 1
    • Building A Favourites Bar Part 2
    • Storing Favourites
    • Uh Oh An Android Bug
    • Feature Overview Firebase And Authentication
    • Firebase Installation
    • Quick Note On Firebase
    • Let's Test Authentication
    • Authentication Service And Context
    • Account And Authentication Navigation
    • Image Background Exercise
    • Image Background Solution
    • Lighten Up The Background
    • Account Screen Buttons
    • Exercise Login Screen
    • Solution Login Screen
    • Tying Up Some Loose Ends
    • Feature Overview: Registration
    • Activity Indicators
    • Favourites Is Broken Part 1
    • Favourites Is Broken Part 2
    • Adding A Watermelon Animation
    • Feature Overview: Settings
    • Building The Settings Feature
    • Making The Settings Screen Look Nice
    • Favourites Screen Exercise
    • Favourites Screen Solution
    • Animations And Polish
    • App Icons
    • Expo Publish
  •   Bonus: Mobile Camera Module
    • Feature Overview Camera Module
    • Setting Up The Infrastructure
    • Exercise Expo Camera
    • Solution Expo Camera
    • Taking A Picture
    • Additional Changes For Android To Take a Picture
    • Storing And Retrieving The Picture
  •   Bonus: Google Maps Integration
    • Important Note On This Section!
    • Setting Up Your Payment Information For Firebase
    • Setting Up Firebase CLI
    • Quick Note On Running Functions Locally
    • Running Firebase Functions Locally
    • Moving Location Mock Part 1
    • Moving Location Mock Part 2
    • Moving Restaurants Mock
    • Deploying Our Functions
    • Switching Between Local And Deployed Functions
    • Oh No Android Doesn't Work!
    • Creating a Google Cloud Account
    • A Cautionary Tale
    • Configuring Our Google Cloud Project
    • Setting Up Google Node SDK
    • Firebase Environment
    • Integrating Geocoding API
    • Integrating Places API
    • Integrating Places Photos
    • Publishing Our Expo App And Functions
    • Minor Optimizations
    • Error Management
  •   Bonus: Mobile Payments With Stripe
    • Stripe Integration Demo
    • Stripe Integration Architecture
    • Signing Up For Stripe
    • Quick Recap On Firebase Functions
    • High Level Stripe Payment Flow
    • React Native Stripe Client
    • Setting Up Our Checkout
    • Our Credit Card Input
    • Getting Our First Stripe Token
    • Hooking Up Our Credit Card Form
    • Checkout Cart Overview
    • Building The Cart Context
    • Integrating Our Cart
    • Oh No! A Cart Bug
    • An Empty Cart
    • Adding The Checkout UI
    • Starting On The Payment Flow
    • Getting The Payee Name
    • Setting Up For Payment
    • Building Our Payment Gateway
    • Payment Request Part 1
    • Payment Request Part 2
    • Payment Request Part 3
    • Adding Loading State
    • Handling Error States
    • Exercise Cart Persistence
    • Solution Cart Persistence
  •   Bonus: Releasing To The App Stores
    • Before We Get Started
    • What Will I Get Out Of This Section
    • Building Standalone Apps
    • Building An APK For Android
    • Running Our APK On The Emulator
    • Creating A Play Store Account
    • Building iOS With Expo
    • Testing Your iOS Build On A Simulator
    • AppStore Connect And TestFlight
  •   Bonus: App Polish + Customizing MealsToGo
    • Adding Some Polish
    • Adapting The Theme Colors
    • Improving The Settings Screen
    • Improving Restaurant Detail Screen
    • The Favourites Bar
  •   Keeping Your App Up To Date
    • New Year New Me
    • Why Upgrade
    • Upgrading
    • Smoke Testing the Upgrade
  •   Where To Go From Here?
    • Thank You!
    • Review This Course!
    • Learning Guideline
    • LinkedIn Endorsements
    • Become An Alumni
    • Coding Challenges
  •   Appendix: Learn React
    • Before We Start
    • Introduction To React.js
    • Create React App
    • React App Folder Structure
    • React 18 Update
    • React Fundamentals
    • React Fundamentals 2
    • Class vs Functional App.js
    • Hooks vs Classes
    • Quick Note: Service Worker File
    • Your First React Component
    • Building A React App 1
    • Exercise: Learn to Read the Docs
    • Building A React App 2
    • Building A React App 3
    • Styling Your React App
    • Quick Note: JSON Placeholder
    • Building A React App 4
    • Building A React App 5
    • Building A React App 6
    • Project Files
    • Keeping Your Projects Up To Date
    • Exercise: React 18
    • Solution: Try Upgrading to React 18
    • React Review
    • Error Boundaries In React
    • Deploying Our React App
    • React Hooks
    • React Hooks 2
    • React Hooks 3
    • React Hooks 4
    • React Hooks 5
    • React Hooks 6
    • React Hooks 7
    • React Hooks 8
    • Project Files
    • React Hooks 9
    • Next Steps
  •   Appendix: Git + Github
    • CWD: Git + Github
    • Github Update: Master --> Main
    • CWD: Git + Github 2
  •   Appendix: Open Source Projects
    • Contributing To Open Source
    • Contributing To Open Source 2
    • Exercise: Contributing To Open Source

Taught by

Andrei Neagoie and Mo Binni

Reviews

Start your review of Complete React Native Developer [with Hooks]

Never Stop Learning.

Get personalized course recommendations, track subjects and courses with reminders, and more.

Someone learning on their laptop while sitting on the floor.