Learn React Native Fast

Name: Learn React Native Fast
Rating: 4.3 (16 reviews)

Avoid Wasting Time and Learn Core React Native with TypeScript and Expo Without the Fluff

Last updated 7/2023

English

What you'll learn

3 sections • 17 lectures • 5h 46m total length

What will we learn?4:34
Review of layout of source code
Quick Overview of Expo and project setup
Show npx create-expo-app -t expo-template-blank-typescript
Show npx expo install <package> -- -D
Warning: sometimes when working with multiple React Native projects the NPM cache can get corrupted and you may get errors like "unable to resolve <some node module>" or warnings about watchman. Use the script clear-cache.sh on the root of the project to cleanup your local caches.
Components (the elements of React)13:53
Reactive State13:20
Learn about Hooks by using with Components and State29:06
Combine the learnings from the prior videos and also use React Hooks beyond just State Hooks

What will we learn?2:36
Since we now understand the fundamentals of React in this section we will go a bit further by learning how to build commonly used features of most React Native apps.
Layouts and FlexBox14:09
Using React Native Animations15:25
Handling and Display of Network Images14:58
Dealing with files in React Native is surprisingly difficult. I'll show how to handle images quickly and easily
Creating Application Navigation with React Navigation24:49
Using Redux Toolkit for managing Global State46:32
How to select form the three State Management methods: local, props, and Redux.

What will we learn?2:28
Did you know Twitter, Facebook, Coinbase, Microsoft Office, Shopify and Discord are all built using React Native?
In this section we will code review a Twitter Clone App.
In prior videos we learned "How" to do things in React Native. In this section we will understand "Why".
We will go line by line and see how each feature was created and understand the design choices that were made.
Overview of Project Structure11:45
Overview of project configuration and folder structure. Also understand how to use the available Api Server.
Understanding the Theming and Styling System13:54
Understanding the component design for Home Screen1:11:48
Understanding the component design for Post Message Screen52:36
Understanding the Navigation implementation7:41
Understand how to structure navigation in a React Native app, using a navigation container as the root, applying global and screen-specific styles, and using custom headers with back navigation.
Bonus: How to create an in memory api/data store for testing7:24
This is an optional video for those who would like to try and continue building out the app. Note this video is intended for those who have not built an in memory data store for testing.

You should already know TypeScript and have previous experience building Front End apps

Understand the core features of React Native and how they work--including how React Native's Reactive State system controls UI, how to use React Hooks to control app components, how to build complex components (which are the building blocks of React) and also how to bring all of these features together into a cohesive reliable whole.
Use Expo to help debug and build high quality React Native applications
Use TypeScript for all coding activities throughout course
Create commonly used React Native features and components from scratch. This will include things like complex component hierarchies, a custom theming system handling dark and light modes, animated sheet modals, Redux Toolkit Reducers, multiple nested React Navigation Routers, and more
Learn when to select one of the three main state management methods: Local, Props, and Redux. And how to build a properly functioning state management system
Learn how to make sound decisions for component hierarchy design. We'll learn when to break something out into its own component. And how to create complex component hierarchies.
Bring all of our learning together by code reviewing a complex Twitter Clone application. We'll investigate design decisions, component hierarchies, mixed state management scenarios, and go through the code line by line so we fully understand what goes on under the hood of a large complex React Native application