The Complete React Native and Redux Course

iOS and Android App Development from scratch - build fully native mobile apps ridiculously fast!
4.7 (1,341 ratings) Instead of using a simple lifetime average, Udemy calculates a
course's star rating by considering a number of different factors
such as the number of ratings, the age of ratings, and the
likelihood of fraudulent ratings.
7,466 students enrolled
$19
$95
80% off
Take This Course
  • Lectures 161
  • Length 17 hours
  • Skill Level All Levels
  • Languages English
  • Includes Lifetime access
    30 day money back guarantee!
    Available on iOS and Android
    Certificate of Completion
Wishlisted Wishlist

How taking a course works

Discover

Find online courses made by experts from around the world.

Learn

Take your courses with you and learn anywhere, anytime.

Master

Learn and practice real-world skills and achieve your goals.

About This Course

Published 9/2016 English

Course Description

If you're tired of spinning your wheels learning Swift or Android, this is the course for you.

Authentication? You will learn it.  Redux? Included.  Animations? Of course!

This course will get you up and running with React Native quickly, and teach you the core knowledge you need to deeply understand and build React components for mobile devices.

Both OSX and Windows supported - develop iOS or Android!

We'll start by mastering the fundamentals of React, including JSX, “props", “state", and event handling. Source code is provided for each lecture, so you will always stay up-to-date with the course pacing.  Special attention has been paid to creating reusable components that you'll be able to make use of on your own fantastic projects.

If you are new to React, or if you've been working to learn it but sometimes feel like you still don't quite 'get it', this is the React course for you! To learn React you have to understand it.

  • Learn how to use React's custom markup language, JSX, to clean up your Javascript code.
  • Learn the process of converting JSX to raw Javascript on the fly in your browser.
  • Master the process of breaking down a complex component into many smaller, interchangeable components.
  • Grasp the difference between “props" and “state" and when to use each.
  • Develop apps that are unique, fun, and responsive.
  • Build on both Android and iOS platforms
  • Master integration with Firebase for user authentication
  • Learn the core principles of navigation with React Native

I've built the course that I would have wanted to take when I was learning React Native. A course that explains the concepts and how they're implemented in the best order for you to learn and deeply understand them.

What are the requirements?

  • All you need is basic understanding of Javascript

What am I going to get from this course?

  • Create real-world native apps using React Native
  • Make truly reusable components that look great
  • Understand the terminology and concepts of Redux
  • Prototype and deploy your own applications to the Apple and Google Play Stores
  • Get up to speed with React design principles and methodologies
  • Discover mobile design patterns used by experienced engineers

What is the target audience?

  • This course is for anyone looking to make native apps

What you get with this course?

Not for you? No problem.
30 day money back guarantee.

Forever yours.
Lifetime access.

Learn on the go.
Desktop, iOS and Android.

Get rewarded.
Certificate of completion.

Curriculum

Section 1: Dive Right In!
Introduction - Course Roadmap
Preview
02:08
Roadmap to the First App
Preview
02:08
Official Course Github Repo
Article
Section 2: Got OSX? Go Here.
OSX Installation
06:02
More on OSX Installation
05:25
Running in the Simulator
02:12
Section 3: Got Windows? Go Here.
Windows Setup of React Native
06:31
Android Studio and React Native CLI Installation
05:12
Emulator Creation and System Variables
14:56
Section 4: [Optional] ESLint Setup
ESLint Setup and Overview
08:56
ESLint Setup with Atom
06:18
ESLint Setup with Sublime Text 3
08:22
ESLint Setup with VSCode
03:37
Section 5: Onwards!
Project Directory Walkthrough
Preview
04:28
Getting Content on the Screen
04:47
React vs React Native
03:11
Creating a Component with JSX
06:16
Registering a Component
03:45
Destructuring Imports
05:25
Application Outline
04:47
The Header Component
08:29
Consuming File Exports
06:50
Section 6: Making Great Looking Apps
Styling with React Native
Preview
04:33
More on Styling Components
04:51
Introduction to Flexbox
Preview
05:24
Header Styling
04:23
Making the Header Reusable
07:18
Section 7: HTTP Requests with React Native
Sourcing Album Data
04:51
List Component Boilerplate
06:07
Class Based Components
07:26
Lifecycle Methods
06:40
Network Requests
08:11
Component Level State
08:57
More on Component Level State
06:53
Rendering a List of Components
05:55
Displaying Individual Albums
09:30
Fantastic Reusable Components - The Card
05:25
Styling a Card
06:05
Passing Components as Props
04:12
Dividing Cards into Sections
08:23
Section 8: Handling Component Layout
Mastering Layout with Flexbox
05:12
Positioning of Elements on Mobile
05:20
More on Styling
04:27
Images with React Native
07:35
Displaying Album Artwork
08:40
Making Content Scrollable
04:30
Handling User Input with Buttons
07:50
Styling of Buttons with UX Considerations
05:28
Responding to User Input
07:18
Linking Between Mobile Apps
04:20
Setting Button Text by Props
02:29
App Wrapup
03:07
Section 9: Authentication with Firebase
Auth App Introduction
04:45
A Common Root Component
06:20
Copying Reusable Components
11:21
What is Firebase?
05:17
Firebase Client Setup
04:47
Login Form Scaffolding
06:10
Handling User Inputs
03:20
More on Handling User Inputs
03:18
How to Create Controlled Components
04:30
Making Text Inputs From Scratch
04:14
A Focus on Passing Props
05:01
Making the Input Pretty
06:00
Wrapping up Inputs
07:15
Password Inputs
08:35
Section 10: Processing Authentication Credentials
Logging a User In
05:35
Error Handling
07:18
More on Authentication Flow
07:30
Creating an Activity Spinner
04:59
Conditional Rendering of JSX
06:40
Clearing the Form Spinner
08:28
Handling Authentication Events
06:09
More on Conditional Rendering
07:19
Logging a User Out and Wrapup
05:30
Section 11: Digging Deeper with Redux
App Mockup and Approach
03:55
The Basics of Redux
08:30
More on Redux
07:37
Redux is Hard!
11:39
Application Boilerplate
03:49
More on Redux Boilerplate
08:14
Section 12: Back to React
Rendering the Header
05:31
Reducer and State Design
06:45
Library List of Data
07:31
JSON CopyPaste
Article
The Connect Function
10:06
MapStateToProps with Connect
07:31
A Quick Review and Breather
05:34

Students Who Viewed This Course Also Viewed

  • Loading
  • Loading
  • Loading

Instructor Biography

Stephen Grider, Engineering Architect

Stephen Grider has been building complex Javascript front ends for top corporations in the San Francisco Bay Area. With an innate ability to simplify complex topics, Stephen has been mentoring engineers beginning their careers in software development for years, and has now expanded that experience onto Udemy, authoring the highest rated React course. He teaches on Udemy to share the knowledge he has gained with other software engineers. Invest in yourself by learning from Stephen's published courses.

Ready to start learning?
Take This Course