IIRF Online > Development > Mobile Development > React Native > React Native - The Practical Guide [2024]
React Native - The Practical Guide [2024] by Udemy
Use React Native and your React knowledge to build native iOS and Android Apps - incl. Push Notifications, Hooks, Redux
Course Highlights
- 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
Skills you will learn!
Curriculum
12 Topics
Welcome To This Course & What To Expect!
What Is React Native?
Join our Online Learning Community
A Glance Under The Hood Of React Native
Creating React Native Projects: Expo CLI vs React Native CLI
Creating React Native Projects
Creating a New React Native Project
Analyzing The Created Project
Running Our First App On A Real Device!
Setting Up A Local Development Environment
About This Course
Course Resources Code Snapshots & How To Use
29 Topics
Module Introduction
Exploring Core Components & Component Styling
Working With Core Components
Styling React Native Apps
React Native: Core Components Styling & Colors - More Information
Exploring Layouts & Flexbox
React Native & Flexbox
Using Flexbox To Create Layouts
Flexbox - A Deep Dive
Components Styles Layouts
Improving The Layout
Handling Events
Managing A List Of Course Goals (in our Demo App)
iOS & Android Styling Differences
Making Content Scrollable with ScrollView
Optimizing Lists with FlatList
More Components & Lists
Splitting Components Into Smaller Components
Utilizing Props
Working on the "Goal Input" Component
Handling Taps with the Pressable Component
Making Items Deletable & Using IDs
Adding an Android Ripple Effect & an iOS Alternative
Adding a Modal Screen
Styling the Modal Overlay
Opening & Closing the Modal
Working with Images & Changing Colors
App Finishing Touches
Module Summary
6 Topics
Module Introduction
Handling Errors
Logging to the Console
Debugging JavaScript Remotely
Using the React DevTools
Using the Documentation
34 Topics
Module Introduction & What We'll Build
Starting Setup & Analyzing the Target App
Setting Up our Screen Components
Creating Custom Buttons
Styling for Android & iOS
Styling the "Number Input" Element
Configuring the TextInput Field
Adding Visual Feedback to the Buttons
Improving the Buttons
Coloring the Components & The Overall App
Adding a Linear Gradient
Adding a Background Image
Getting Started with the Game Logic
Handling User Input & Showing an Alert Dialog
Switching Screens Programmatically
Starting Work on the Game Screen
Respecting Device Screen Restrictions with the SafeAreaView
Creating a Title Component
Managing Colors Globally
Creating Using & Displaying Random Numbers
Adding Game Control Buttons ("+" & "-") to the App
Checking for "Game Over"
Improving the Game Screen Visuals
Using "Cascading Styles"
Working with Icons (Button Icons)
Adding & Using Custom Fonts with React Native Apps
Adding a (Foreground) Image
Using & Styling Nested Text
Adding Logic to (Re-)Start Games & Displaying a Summary Screen
Logging Game Rounds
Outputting Log Data with FlatList
Styling the Game Round Logs
Finishing Touches
Module Summary
12 Topics
Module Introduction
Setting Dynamic Widths
Introducing the Dimensions API
Adjusting Image Sizes with the Dimensions API
Understanding Screen Orientation Problems
Setting Sizes Dynamically (for different Orientations)
Managing Screen Content with KeyboardAvoidingView
Improving the Landscape Mode UI
The Dimensions API & Responsive UIs
Further Improvements with useWindowDimensions
Writing Platform-specific Code with the Platform API
Styling the Status Bar
24 Topics
Module Introduction
What Is Navigation?
Getting Started with the App & Outputting Meal Categories
Displaying Items in a Grid
Getting Started with the React Navigation Package
Implementing Navigation Between Two Screens
Setting the Default Screen
Understanding the useNavigation Hook
Working with Route Parameters To Pass Data Between Screens
Displaying Meals
Adding Images & Styling
Styling Screen Headers & Backgrounds
Setting Navigation Options Dynamically
Adding & Configuring the Meal Details Screen
Outputting Content in the Meal Detail Screen
Finishing the Meal Detail Screen
Adding Header Buttons
Adding an Icon Button to a Header
Adding Drawer Navigation & Creating a Drawer
Configuring the Drawer Navigator & The Drawer
Adding Configuring & Using Bottom Tabs
Nesting Navigators
Bottom Tabs & App Finishing Touches
Module Summary
10 Topics
Module Introduction
Getting Started with React's Context API
Managing App-wide State with Context
Using the Created Context with useContext
Managing Favorite Meals with the Context API
Getting Started with Redux & Redux Toolkit
Working with Redux Slices
Managing Redux State & Dispatching Actions
Using Redux State in Components
Module Summary
22 Topics
Module Introduction & What We'll Build
The Starting Setup
Adding Navigation (with React Navigation) & Configuring Navigation
Adding Global Colors & Editing Navigation Configuration
Creating Key App Components to Display Expenses
Continuing Work on the Expense-related Components
Adding Dummy Expense Data
Outputting a List of Expenses
Improving App Layout & Styling
Working on Expense List Items
Formatting Dates
Adding a Header Button & Making Expense Items Tappable
Navigating Programmatically Between Screens
Styling The Expense Management Screen
Supporting Different Editing Modes & Using Route Parameters
Adding a "Delete" Button
Adding Custom Buttons
Closing A Modal Programmatically
Managing App-wide State With Context
Using Context From Inside Components
Deleting & Updating Expenses
Finishing Touches
14 Topics
Module Introduction
Building a Custom Input Component
Creating an Overall Form
Configuring the Form Input Elements
Adding Styling
Setting the Form Layout
Handling User Input in a Generic Way
Managing Form State & Submission
Working with Entered Data
Setting & Using Default Values
Adding Validation
Providing Visual Validation Feedback
Adding Error Styling
Module Summary
11 Topics
Module Introduction
Backend Setup (Firebase)
Installing Axios
Sending POST Http Requests
Fetching Backend Data (GET Requests)
Transforming & Using Fetched Data
Using Response Data from POST Requests
Updating & Deleting Backend Data (UPDATE & DELETE Requests)
Managing the Loading State
Handling Request Errors
Module Summary
17 Topics
Module Introduction
Demo App Walkthrough
How Does Authentication Work?
Backend Setup
Controlling Signup & Login Screens
Sending Authentication Requests to the Backend
Creating New Users
Logging Users In
Authentication Error Handling
Storing & Managing the User Authentication State (with Context)
Extracting the Authentication Token
Protecting Screens
Adding a Logout Functionality
Accessing Protected Resources
Storing Auth Tokens on the Device & Logging Users In Automatically
A Note About Token Expiration
Module Summary
33 Topics
Module Introduction
Adding a "Favorite Places" List
Editing the Favorite Place Items
Adding an "Add Place" Screen + Navigation
Adding a Header Button
Global Colors & Styling
Getting Started with a Custom Form
Adding & Configuring the Camera Package (for Native Camera Access)
Taking Photos on Android
Taking Photos on iOS + Managing Permissions
Showing an Image Preview
Creating a Custom Button
Getting Started with the Location Picker
Locating Users
Adding a Location Preview Map
Adding an Interactive Map (Google Maps & Apple Maps)
Allowing Map Interaction & Adding Markers
Confirming Picked Locations
Previewing Picked Locations
Adding a Form Submit Button
Managing Location & Image State in the Form
Converting Picked Locations to Human-Readable Addresses
Passing Entered Data to the "AllPlaces" Screen
Outputting a List Of Places
Styling Place Items
SQLite: Getting Started & Initialization
Preparing Code to Insert Data into the SQLite Database
Inserting Places into the Database
Fetching Places from the Database
Adding the Place Details Screen
Fetching Place Detail Data from the Database
Showing a Readonly Map
Module Summary
10 Topics
Module Introduction
How Exactly Does Expo Work?
Expo Alternatives
Setting Up Our System
Using Expo's Bare Workflow
Using Native Device Features with the Bare Workflow
Ejecting To The Bare Workflow
Creating Projects with the React Native CLI (no Expo)
Non-Expo Apps & Native Device Features
Module Summary
11 Topics
Module Introduction
Publishing Apps: An Overview
Key Configuration Items & Considerations
Configuring App Names & Versions
A Quick Note About Environment Variables
Adding Icons & A Splash Screen
Building Expo Apps with EAS
EAS for iOS (even on Windows Devices)
Building for iOS Without Expo
Building for Android Without Expo
Configuring Android Apps
14 Topics
Module Introduction
What are (Local) Notifications?
Adding the Expo Notification Package
Scheduling Notifications
Configuring Scheduled Notifications
Handling Incoming Notifications
Local Notifications - Permissions
Reacting To Incoming Notifications
Reacting To User Interaction With Incoming Notifications
Understanding Push Notifications
Push Notifications Setup
Using the Push Token
Sending Push Notifications
Module Summary
1 Topic
Course Roundup
14 Topics
Module Introduction
JavaScript - A Summary
Project Setup
Core Syntax Refresher
let & const
Arrow Functions
Objects: Properties & Methods
Arrays & Array Methods
Arrays Objects & Reference Types
Spread Operator & Rest Parameters
Destructuring
Async Code & Promises
Wrap Up
Module Resources
15 Topics
Module Introduction
What is React
A Starting Project
Understanding JSX
Understanding Components
Working with Multiple Components
Working with Props
Rendering Lists of Data
Handling Events
Parent-Child Communication
Managing State
More on State
User Input & Two-Way Binding
Wrap Up
Module Resources
4 Topics
Legacy Course Content
This Course Was Updated | Update Information
Course Update Information & FAQs
Bonus: More Content!
React Native - The Practical Guide [2024]
Related React Native Courses
Thank You!
Your review has been submitted successfully.