4.64 out of 5
4.64
34948 reviews on Udemy

React Native – The Practical Guide [2023]

Use React Native and your React knowledge to build native iOS and Android Apps - incl. Push Notifications, Hooks, Redux
Instructor:
Academind by Maximilian SchwarzmΓΌller
196,333 students enrolled
English [CC] More
Learn how to use ReactJS to build real native mobile apps for iOS and Android
Develop cross-platform (iOS and Android) mobile apps without knowing Swift, ObjectiveC or Java/ Android
Explore React Native basics and advanced features!
Learn how to use key mobile app features like Google maps or the device camera

This course was updated (completely re-recorded) in April 2022 – you learn the latest version of React Native with this course!

Mobile appsΒ are one of the best ways to engage with users – no wonder everyone wants to build one!

Wouldn’t it be great if you could use yourΒ web development knowledge, combined with yourΒ ReactΒ knowledge, toΒ build mobile appsΒ with that?

That’s exactly what React Native allows you to do!

No needΒ to learn Java, Android, Swift, ObjectiveC or anything of that –Β React and JavaScript is all you needΒ to create awesome native mobile apps that work on both Android and iOS. That’s probably the reason why Instagram, AirBnB,Β Skype and many other global companiesΒ are using it to build their mobile apps!

With this course, you can join this league. I’ll teach you all you need to create your own React Native apps, publish them to the Google Play Store and Apple App Store and dive really deep into the React Native ecosystem.

You’ll learn all about the theory behind React Native, its core concepts, how to build responsive designs that work on different device sizes, how to navigate around, use maps and the camera and so much more!

And which better way to learnΒ than byΒ building a real app?Β We’ll build the “Favorite Places”Β app in this course, an app where users can share amazing pictures and the location where they took them. This app will allow you to see things like using maps, the camera, user authentication, connecting to a server and much more in action.

By the end of the course, we’ll of course also go through all steps required to get it into an app store.

Here’s a detailed look at what you’ll get:

  • The core concepts and theory
  • How to use React, JavaScript and native components
  • Understand how to navigate in React Native apps
  • A closer look at styling and animating React Native apps
  • Instructions on how to use third-party libraries in your React Native app
  • Detailed examples on how to use maps or an image picker
  • A full user authentication flow
  • How to connect to a backend server from your app
  • Debugging instructions
  • And so much more!

What will you need to succeed in this course?

  • NOΒ Android, Java, Swift or ObjectiveC knowledge is required!
  • JavaScript and React (for the web) knowledge is required though – you don’t need to be an expert but the basics need to be set (though there are refresher sections in this course!)

I’d be very happy to welcome you in the course!

Max

Getting Started

1
Welcome To This Course & What To Expect!
2
What Is React Native?
3
Join our Online Learning Community
4
A Glance Under The Hood Of React Native
5
Creating React Native Projects: Expo CLI vs React Native CLI
6
Creating a New React Native Project
7
Analyzing The Created Project
8
Running Our First App On A Real Device!
9
Setting Up A Local Development Environment
10
About This Course
11
Course Resources, Code Snapshots & How To Use

React Native Basics [COURSE GOALS APP]

1
Module Introduction
2
Exploring Core Components & Component Styling
3
Working With Core Components
4
Styling React Native Apps
5
React Native: Core Components, Styling & Colors - More Information
6
Exploring Layouts & Flexbox
7
React Native & Flexbox
8
Using Flexbox To Create Layouts
9
Flexbox - A Deep Dive
10
Components, Styles, Layouts
11
Improving The Layout
12
Handling Events
13
Managing A List Of Course Goals (in our Demo App)
14
iOS & Android Styling Differences
15
Making Content Scrollable with ScrollView
16
Optimizing Lists with FlatList
17
More Components & Lists
18
Splitting Components Into Smaller Components
19
Utilizing Props
20
Working on the "Goal Input" Component
21
Handling Taps with the Pressable Component
22
Making Items Deletable & Using IDs
23
Adding an Android Ripple Effect & an iOS Alternative
24
Adding a Modal Screen
25
Styling the Modal Overlay
26
Opening & Closing the Modal
27
Working with Images & Changing Colors
28
App Finishing Touches
29
Module Summary

Debugging React Native Apps (Introduction)

1
Module Introduction
2
Handling Errors
3
Logging to the Console
4
Debugging JavaScript Remotely
5
Using the React DevTools
6
Using the Documentation

Diving Deeper into Components, Layouts & Styling - Building a Mini-Game App

1
Module Introduction & What We'll Build
2
Starting Setup & Analyzing the Target App
3
Setting Up our Screen Components
4
Creating Custom Buttons
5
Styling for Android & iOS
6
Styling the "Number Input" Element
7
Configuring the TextInput Field
8
Adding Visual Feedback to the Buttons
9
Improving the Buttons
10
Coloring the Components & The Overall App
11
Adding a Linear Gradient
12
Adding a Background Image
13
Getting Started with the Game Logic
14
Handling User Input & Showing an Alert Dialog
15
Switching Screens Programmatically
16
Starting Work on the Game Screen
17
Respecting Device Screen Restrictions with the SafeAreaView
18
Creating a Title Component
19
Managing Colors Globally
20
Creating, Using & Displaying Random Numbers
21
Adding Game Control Buttons ("+" & "-") to the App
22
Checking for "Game Over"
23
Improving the Game Screen Visuals
24
Using "Cascading Styles"
25
Working with Icons (Button Icons)
26
Adding & Using Custom Fonts with React Native Apps
27
Adding a (Foreground) Image
28
Using & Styling Nested Text
29
Adding Logic to (Re-)Start Games & Displaying a Summary Screen
30
Logging Game Rounds
31
Outputting Log Data with FlatList
32
Styling the Game Round Logs
33
Finishing Touches
34
Module Summary

Building Adaptive User Interfaces (Adapt to Platform & Device Sizes)

1
Module Introduction
2
Setting Dynamic Widths
3
Introducing the Dimensions API
4
Adjusting Image Sizes with the Dimensions API
5
Understanding Screen Orientation Problems
6
Setting Sizes Dynamically (for different Orientations)
7
Managing Screen Content with KeyboardAvoidingView
8
Improving the Landscape Mode UI
9
The Dimensions API & Responsive UIs
10
Further Improvements with useWindowDimensions
11
Writing Platform-specific Code with the Platform API
12
Styling the Status Bar

React Native Navigation with React Navigation [MEALS APP]

1
Module Introduction
2
What Is Navigation?
You can view and review the lecture materials indefinitely, like an on-demand channel.
Definitely! If you have an internet connection, courses on Udemy are available on any device at any time. If you don't have an internet connection, some instructors also let their students download course lectures. That's up to the instructor though, so make sure you get on their good side!
4.6
4.6 out of 5
34948 Ratings

Detailed Rating

Stars 5
23071
Stars 4
9475
Stars 3
1883
Stars 2
298
Stars 1
252
094571782aba1a83f178e41fe1f4573d
30-Day Money-Back Guarantee

Includes

28 hours on-demand video
14 articles
Full lifetime access
Access on mobile and TV
Certificate of Completion