The Complete React Native + Hooks Course [2019 Edition] at UDEMY Overview
Duration | 38 hours |
Total fee | ₹6,080 |
Mode of learning | Online |
Difficulty level | Intermediate |
Official Website | Go to Website  |
Credential | Certificate |
The Complete React Native + Hooks Course [2019 Edition] at UDEMY Highlights
- Compatible on Mobile and TV
- Earn a Cerificate on successful completion
- Get Full Lifetime Access
- Course Instructor : Stephen Grider
The Complete React Native + Hooks Course [2019 Edition] at UDEMY Course details
- This course is for anyone looking to make native apps with React Native
- 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
- If you're tired of spinning your wheels learning Swift or Android, this is the course for you. Authentication? You will learn it. Hooks? Included. Navigation? 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. React Native is an excellent solution for developing apps on mobile in a fraction of the time it takes to make an equivalent iOS or Swift app. You'll love seeing your changes instantly appear on your own device, rather than waiting for Swift/Java code to recompile! This quick feedback loop, along with excellent cross platform support, is what has catapulted React Native to the top must-have skill for Javascript engineers. 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 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 Render interactive, media-rich components in beautifully styled apps 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.
The Complete React Native + Hooks Course [2019 Edition] at UDEMY Curriculum
Getting Started
How to Get Help
Course Overview
Boilerplate Download
Node Version Fix for all Windows Users
Trouble Installing?
App Setup
Making Changes
Using iOS and Android Simulators
Official Course Repo
Working with Content
Overview of React Components
Showing a Custom Component
Common Questions and Answers
Rules of JSX
One Common Error
JSX Exercise Overview
JSX Solution
List Building - With Style!
Building Lists
The FlatList Element
Rendering a FlatList
Why a Key Property?
Solving the Key Issue
A Few Props Around FlatList
Exercise Overview
Exercise Solution
Navigating Users Between Screens
Button Types
Buttons in Action
Touchable Opacity in Action
React Navigation Fix
Navigating with React Navigation
Destructuring Props
Building Reusable Components
Component Reuse with Props
Exercise Solution
Parent-Child Relationships
Communicating from Parent to Child
Images Download
Showing Images
Passing Images as Props
Exercise Outline
Exercise Solution
State Management in React Components
State in Components
Screen Boilerplate
State in Action
Notes on State
App Overview
Generating Random Colors
Adding Random Colors
Showing Colors with a FlatList
App Overview
Reusable Color Adjusters
Coordinating State
Passing Callbacks to Children
Tying State Values Together
Validating State Changes
Reusable State Updates
Introduction to Reducers
Creating a Reducer
Applying State with a Reducer
Restoring Validation
Community Convention in Reducers
Exercise Outline
Exercise Solution
Handling Text Input
Showing a Text Input
Two Important Props
Weird Things with Text and State
Updating State
Exercise Outline
Exercise Solution
How to Handle Screen Layout
Layout with React Native
Basics of Box Object Model
AlignItems with Flex
Flex Direction
Justify Content
Flex Values
Align Self on Children
The Position Property
Top, Bottom, Left, Right
Absolute Fill Objects
Applying Layout Systems
Exercise Overview
Exercise Solution
Putting It All Together - Restaurant Search App
App Overview
Project Generation
Yelp Signup
Yelp Walkthrough
React Navigation
React Navigation Fix
Assembling a Navigator
Architecture Approach
Starting the SearchBar
Displaying Icons
Search Bar Styling
A Touch More Styling
Managing State
Detecting Editing Completion
Using Outside API's
Configuring Axios
Making the Request
Error Handling
Running an Initial Search
Making Hooks Reusable
The UseEffect Hook
Extracting Hook Logic
Showing Search Results
Grouping Results
FlatList Rendering
Navigation with Parameters
Showing a Single Result
Showing Additional Info
A Few More Styling Issues
Hiding Scroll Bars
Constraining View Elements
Empty Elements
Spacing on the Search Bar
Reminder on Navigation
Navigating from a Child Component
The WithNavigation Helper
Communicating Between Screens
Fetching a Single Restaurant
Showing a List of Images
One Last Fix
Advanced State Management with Context
App Overview
Issues with Data
React Navigation Fix
Initial Setup
Wrapping the Navigator
Introduction to Context
Adding Context
Moving Data with Context
Rendering a List of Posts
Adding State in Context
It Works!
Opportunity for Improvement
Updating with UseReducer
Automating Context Creation
More Automatic Context Creation
A Bit of Styling
Deleting Posts
Updating the Reducer
Navigation on Tap
Retrieving Single Posts
Adding a Creation Screen
Header Navigation
Displaying a Form
Saving a New Post
Navigation on Save
The Edit Icon Link
Communicating Info to Edit
Initializing State from Context
Extracting Form Logic
Customizing OnSubmit
Initial Form Values
Default Props
Editing Action Function
Editing in a Reducer
Navigating Backwards
Data API Sync
Outside Data API
Issues with Servers + React Native
JSON Server and Ngrok Setup
JSON Server REST Conventions
Making a Request
Remote Fetch of Posts
Creating Posts with Post Requests
Refetching on Navigate
Deleting a Post
Editing Posts
App Wrapup
Building a Custom Express API
App Overview
Dependencies Setup
The Basics of Express
MongoDB Setup
Fix for " MongoError: not authorized on admin to execute command"
Connecting to MongoDB
Nodemon for Automatic Restarts
Understanding the Signup Process
Using Postman
Handling JSON Data
Defining a User Schema
Creating and Saving a User
Error Handling
JSON Web Tokens
Creating a JWT
Wiring Up JSON Web Tokens
Understanding Password Hashing
Salting and Hashing
The Signin Route
Testing Signup and Signin
Defining Tracks
Listing Tracks
Creating Tracks
In-App Authentication
Server Code
Server Setup
Navigation Design
React Navigation Fix
A LOT of Boilerplate
Navigator Hookup
Testing the Navigation Flow
React Native Elements
Helper Styling Components
Styling Odds and Ends
Input Props
The Auth Context
What's the Context Doing?
Axios Setup
Making an API Request
Handling Errored Requests
Async Storage
Storing the Token
Navigation From Outside of React
Oops, Typo
Navigation to Signin
Extracting Form Logic
Last Bit of Extractin
Creating a NavLink
Real Component Reuse!
Wiring Up Signin
Clearing Error Messages
Automatic Signin
Empty Screens While Resolving Auth
Signing Out a User
Safe Area Views
Working on Track Create
React Native Maps Fix
Showing a Map
Drawing a Series of Points
Notes on Location
Requesting Location Permissions
Resetting Permissions
How to Test Location?
Faking the Users Location
Reading a Location
Bugginess with Location
Location Architecture
Location Context
Live Location Updates
Drawing a Position Indicator
Extracting Logic to a Hook
Disabling Location Tracking
Automatic Disables
Building a Track Form
Updates to Location Context
Track Form Wire Up
Buggy UseEffects
Understanding Stale References
Kind of Fixed
The UseCallback Hook
Cleaning Up After Ourselves
Avoiding Stale References
Tracking While Recording
Bring Back the Polyline
What Manages Tracks
Coordination Between Contexts
Automatic Authentication
Form Reset and Navigation
Fetching Created Tracks
Listing All Tracks
Navigating to a Saved Track
Showing Track Details
Fixing Odds and Ends
[LEGACY] Dive Right In!
Introduction - Course Roadmap
Roadmap to the First App
Official Course Github Repo
[LEGACY] Got OSX? Go Here.
OSX Installation
More on OSX Installation
Running in the Simulator
[LEGACY] Got Windows? Go Here.
Windows Setup of React Native
Android Studio and React Native CLI Installation
Emulator Creation and System Variables
[LEGACY] [Optional] ESLint Setup
ESLint Setup and Overview
ESLint Setup with Atom
ESLint Setup with Sublime Text 3
ESLint Setup with VSCode
[LEGACY] Onwards!
Troubleshooting React Native Installs
Project Directory Walkthrough
Getting Content on the Screen
React vs React Native
Creating a Component with JSX
Registering a Component
Destructuring Imports
Application Outline
The Header Component
Consuming File Exports
[LEGACY] Making Great Looking Apps
Styling with React Native
More on Styling Components
Introduction to Flexbox
Header Styling
Making the Header Reusable
[LEGACY] HTTP Requests with React Native
Sourcing Album Data
List Component Boilerplate
Class Based Components
Lifecycle Methods
Quick Note On Axios
Network Requests
Component Level State
More on Component Level State
Rendering a List of Components
Displaying Individual Albums
Fantastic Reusable Components - The Card
Styling a Card
Passing Components as Props
Dividing Cards into Sections
[LEGACY] Handling Component Layout
Mastering Layout with Flexbox
Positioning of Elements on Mobile
More on Styling
Images with React Native
Displaying Album Artwork
Making Content Scrollable
Handling User Input with Buttons
Styling of Buttons with UX Considerations
Responding to User Input
Linking Between Mobile Apps
Setting Button Text by Props
App Wrapup
[LEGACY] Authentication with Firebase
Auth App Introduction
A Common Root Component
Copying Reusable Components
What is Firebase?
Firebase Client Setup
Login Form Scaffolding
Handling User Inputs
More on Handling User Inputs
How to Create Controlled Components
Making Text Inputs From Scratch
A Focus on Passing Props
Making the Input Pretty
Wrapping up Inputs
Password Inputs
[LEGACY] Processing Authentication Credentials
Logging a User In
Error Handling
More on Authentication Flow
Creating an Activity Spinner
Conditional Rendering of JSX
Clearing the Form Spinner
Handling Authentication Events
More on Conditional Rendering
Logging a User Out and Wrapup
[LEGACY] Digging Deeper with Redux
App Mockup and Approach
The Basics of Redux
More on Redux
Redux is Hard!
Application Boilerplate
More on Redux Boilerplate
[LEGACY] Back to React
Rendering the Header
Reducer and State Design
Library List of Data
JSON CopyPaste
The Connect Function
MapStateToProps with Connect
A Quick Review and Breather
[LEGACY] Rendering Lists the Right Way
The Theory of ListView
ListView in Practice
Rendering a Single Row
Styling the List
Creating the Selection Reducer
Introducing Action Creators
Calling Action Creators
Adding a Touchable
Rules of Reducers
Expanding a Row
Moving Logic Out of Components
Animations
Wrapup
[LEGACY] Not Done Yet...
Overview of Our Next App
App Challenges
Quick Note
Just a Touch More Setup
More on Boilerplate Setup
[LEGACY] Handling Data in React vs Redux
Login Form in a Redux World
Rebuilding the Login Form
Handling Form Updates with Action Creators
Wiring up Action Creators
Typed Actions
[LEGACY] Don't Mutate that State
Immutable State
Creating Immutable State
More on Creating Immutable State
Synchronous vs Asynchronous Action Creators
Introduction to Redux Thunk
Redux Thunk in Practice
Redux Thunk in Practice Continued
Making LoginUser More Robust
Creating User Accounts
Showing Error Messages
A Firebase Gotcha
Showing a Spinner on Loading
[LEGACY] Navigating Users Around
Dealing with Navigation
Navigation in the Router
Addressing Styling Issues
Displaying Multiple Scenes
Navigating Between Routes
Grouping Scenes with Buckets
Navigation Bar Buttons
Navigating to the Employee Creation Form
Building the Employee Creation Form
Employee Form Actions
Handling Form Updates at the Reducer Level
Dynamic Property Updates
The Picker Component
Pickers and Style Overrides
[LEGACY] Firebase as a Data Store
Firebase JSON Schema
Data Security in Firebase
Creating Records with Firebase
Default Form Values
Successful Data Save to Firebase
Resetting Form Properties
Fetching Data from Firebase
Storing Data by ID
Dynamic DataSource Building
Transforming Objects to Arrays
List Building in Employee List
[LEGACY] Code Reuse - Edit vs Create
Reusing the Employee Form
Create vs Edit Forms
Reusable Forms
A Standalone Employee Edit Form
Initializing Forms from State
Updating Firebase Records
Clearing Form Attributes
Texting Employees
Modals as a Reusable Component
The Modal Component Continued
Styling the Modal
Employee Delete Action Creator
Wiring up Employee Delete
Extras
Bonus!
Other courses offered by UDEMY
Student Forum
Anything you would want to ask experts?
The Complete React Native + Hooks Course [2019 Edition] at UDEMY News & Updates
