- Home
- Courses
- Mobile Apps Development
- Become an Expert Mobile Apps Developer and Start Freelancing Career to Earn Money Online
-
Learn React Js, Professional Training Course with Internship
-
Getting Started
-
Introduction
-
Join our Online Learning Community
-
Real-World SPAs & React Web Apps
-
Writing our First React Code
-
Why Should we Choose React?
-
React Alternatives
-
Understanding Single Page Applications and Multi Page Applications
-
Course Outline
-
How to get the Most out of This Course
-
Useful Resources & Links
-
Refreshing Next Generation JavaScript (Optional)
-
Module Introduction
-
Understanding “let” and “const”
-
Arrow Functions
-
Exports and Imports
-
Understanding Classes
-
Classes, Properties and Methods
-
The Spread & Rest Operator
-
Destructuring
-
Reference and Primitive Types Refresher
-
Refreshing Array Functions
-
Wrap Up
-
Next-Gen JavaScript – Summary
-
JS Array Functions
-
Understanding the Base Features & Syntax
-
Module Introduction
-
The Build Workflow
-
Using Create React App
-
Understanding the Folder Structure
-
Understanding Component Basics
-
Understanding JSX
-
JSX Restrictions
-
Creating a Functional Component
-
Components & JSX Cheat Sheet
-
Working with Components & Re-Using Them
-
Outputting Dynamic Content
-
Working with Props
-
Understanding the “children” Prop
-
Understanding & Using State
-
Props & State
-
Handling Events with Methods
-
To Which Events Can You Listen?
-
Manipulating the State
-
Function Components Naming
-
Using the useState() Hook for State Manipulation
-
Stateless vs Stateful Components
-
Passing Method References Between Components
-
Adding Two Way Binding
-
Adding Styling with Stylesheets
-
Working with Inline Styles
-
Time to Practice – The Base Syntax
-
[OPTIONAL] Assignment Solution
-
Useful Resources & Links
-
Working with Lists and Conditionals
-
Module Introduction
-
Rendering Content Conditionally
-
Handling Dynamic Content “The JavaScript Way”
-
Outputting Lists (Intro)
-
Outputting Lists
-
Lists & State
-
Updating State Immutably
-
Lists & Keys
-
Flexible Lists
-
Wrap Up
-
Time to Practice – Lists & Conditionals
-
[OPTIONAL] Assignment Solution
-
Useful Resources & Links
-
Styling React Components & Elements
-
Module Introduction
-
Outlining the Problem Set
-
Setting Styles Dynamically
-
Setting Class Names Dynamically
-
Adding and Using Radium
-
Using Radium for Media Queries
-
Introducing Styled Components
-
More on Styled Components
-
Styled Components & Dynamic Styles
-
Working with CSS Modules
-
CSS Modules & Media Queries
-
More on CSS Modules
-
Useful Resources & Links
-
Debugging React Apps
-
Module Introduction
-
Understanding Error Messages
-
Finding Logical Errors by using Dev Tools & Sourcemaps
-
Working with the React Developer Tools
-
Using Error Boundaries (React 16+)
-
Wrap Up
-
Useful Resources & Links
-
Diving Deeper into Components & React Internals
-
Module Introduction
-
A Better Project Structure
-
Splitting an App Into Components
-
Comparing Stateless and Stateful Components
-
Class-based vs Functional Components
-
class Component Lifecycle Overview
-
Component Creation Lifecycle in Action
-
Component Update Lifecycle (for props Changes)
-
Component Update Lifecycle (for state Changes)
-
Using useEffect() in Functional Components
-
Controlling the useEffect() Behavior
-
Cleaning up with Lifecycle Hooks & useEffect()
-
Cleanup Work with useEffect() – Example
-
Using should Component Update for Optimization
-
Optimizing Functional Components with React.memo()
-
When should you optimize?
-
PureComponents instead of should Component Update
-
How React Updates the DOM
-
Rendering Adjacent JSX Elements
-
Windows Users Must Read
-
Using React.Fragment
-
Higher Order Components (HOC) – Introduction
-
Another Form of HOCs
-
Passing Unknown Props
-
Setting State Correctly
-
Using PropTypes
-
Using Refs
-
Refs with React Hooks
-
Understanding Prop Chain Problems
-
Using the Context API
-
ContextType & useContext()
-
Wrap Up
-
Useful Resources & Links
-
A Real App: The Burger Builder (Basic Version)
-
About React Hooks
-
Module Introduction
-
Planning an App in React – Core Steps
-
Planning our App – Layout and Component Tree
-
Planning the State
-
MUST READ: Enabling CSS Modules
-
Setting up the Project
-
Creating a Layout Component
-
Starting Implementation of The Burger Builder Container
-
Adding a Dynamic Ingredient Component
-
Adding Prop Type Validation
-
Starting the Burger Component
-
Outputting Burger Ingredients Dynamically
-
Calculating the Ingredient Sum Dynamically
-
Adding the Build Control Component
-
Outputting Multiple Build Controls
-
Connecting State to Build Controls
-
Removing Ingredients Safely
-
Displaying and Updating the Burger Price
-
Adding the Order Button
-
Creating the Order Summary Modal
-
Showing & Hiding the Modal (with Animation!)
-
Implementing the Backdrop Component
-
Adding a Custom Button Component
-
Implementing the Button Component
-
Adding the Price to the Order Summary
-
Adding a Toolbar
-
Using a Logo in our Application
-
Adding Reusable Navigation Items
-
Creating a Responsive Sidedrawer
-
Working on Responsive Adjustments
-
More about Responsive Adjustments
-
Reusing the Backdrop
-
Adding a Sidedrawer Toggle Button
-
Adding a Hamburger Icon
-
Improving the App – Introduction
-
Prop Type Validation
-
Improving Performance
-
Using Component Lifecycle Methods
-
Changing the Folder Structure
-
Wrap Up
-
Useful Resources & Links
-
Reaching out to the Web (Http / Ajax)
-
Module Introduction
-
Understanding Http Requests in React
-
Understanding our Project and Introducing Axios
-
Creating a Http Request to GET Data
-
Rendering Fetched Data to the Screen
-
Transforming Data
-
Making a Post Selectable
-
Fetching Data on Update (without Creating Infinite Loops)
-
Posting Data to the Server
-
Sending a DELETE Request
-
Fixing a Bug
-
Handling Errors Locally
-
Adding Interceptors to Execute Code Globally
-
Removing Interceptors
-
Setting a Default Global Configuration for Axios
-
Creating and Using Axios Instances
-
Wrap Up
-
Useful Resources & Links
-
Burger Builder Project: Accessing a Server
-
Module Introduction
-
Firebase & The Right Database
-
Creating the Firebase Project
-
Creating the Axios Instance
-
Sending a POST Request
-
Displaying a Spinner while Sending a Request
-
Handling Errors
-
Retrieving Data from the Backend
-
Removing Old Interceptors
-
Useful Resources & Links
-
Multi-Page-Feeling in a Single-Page-App: Routing
-
Module Introduction
-
Routing and SPAs
-
Setting Up Links
-
Setting Up the Router Package
-
react-router vs react-router-dom
-
Preparing the Project For Routing
-
Setting Up and Rendering Routes
-
Rendering Components for Routes
-
Switching Between Pages
-
Using Links to Switch Pages
-
Using Routing-Related Props
-
The “withRouter” HOC & Route Props
-
Absolute vs Relative Paths
-
Absolute vs Relative Paths (Article)
-
Styling the Active Route
-
Passing Route Parameters
-
Extracting Route Parameters
-
Parsing Query Parameters & the Fragment
-
Using Switch to Load a Single Route
-
Navigating Programmatically
-
Additional Information Regarding Active Links
-
Understanding Nested Routes
-
Creating Dynamic Nested Routes
-
Redirecting Requests
-
Conditional Redirects
-
Using the History Prop to Redirect (Replace)
-
Working with Guards
-
Handling the 404 Case (Unknown Routes)
-
Loading Routes Lazily
-
Lazy Loading with React Suspense (16.6)
-
Routing and Server Deployment
-
Time to Practice – Routing
-
Wrap Up
-
Useful Resources & Links
-
Adding Routing to our Burger Project
-
Module Introduction
-
Building the Checkout Container
-
Setting Up Routing & Routes
-
Navigating to the Checkout Page
-
Navigating Back & To Next Page
-
Passing Ingredients via Query Params
-
Navigating to the Contact Data Component
-
Order Submission & Passing Data Between Pages
-
Adding an Orders Page
-
Implementing Navigation Links
-
Fetching Orders
-
Outputting the Orders
-
Wrap Up
-
Useful Resources & Links
-
Forms and Form Validation
-
Module Introduction
-
Analyzing the App
-
Creating a Custom Dynamic Input Component
-
Setting Up a JS Config for the Form
-
Dynamically Create Inputs based on JS Config
-
Adding a Dropdown Component
-
Handling User Input
-
Handling Form Submission
-
Adding Custom Form Validation
-
Fixing a Common Validation Gotcha
-
Adding Validation Feedback
-
Improving Visual Feedback
-
Showing Error Messages
-
Handling Overall Form Validity
-
Working on an Error
-
Fixing a Bug
-
Useful Resources & Links
-
Redux
-
Module Introduction
-
Understanding State
-
The Complexity of Managing State
-
Understanding the Redux Flow
-
Setting Up Reducer and Store
-
Dispatching Actions
-
Adding Subscriptions
-
Connecting React to Redux
-
Connecting the Store to React
-
Dispatching Actions from within the Component
-
Time to Practice – Dispatching Actions
-
Passing and Retrieving Data with Action
-
Switch-Case in the Reducer
-
Updating State Immutably
-
Updating Arrays Immutably
-
Immutable Update Patterns
-
Outsourcing Action Types
-
Combining Multiple Reducers
-
Understanding State Types
-
Time to Practice – Redux Basics
-
[OPTIONAL] Assignment Solution
-
Combining Local UI State and Redux
-
Wrap Up
-
Useful Resources & Links
-
Adding Redux to our Project
-
Module Introduction
-
Installing Redux and React Redux
-
Basic Redux Setup
-
Finishing the Reducer for Ingredients
-
Connecting the Burger Builder Container to our Store
-
Working on the Total Price Calculation
-
Redux & UI State
-
Adjusting Checkout and Contact Data
-
Wrap Up
-
Useful Resources & Links
-
Redux Advanced
-
Module Introduction
-
Adding Middleware
-
Using the Redux Devtools
-
Executing Asynchronous Code – Introduction
-
Introducing Action Creators
-
Action Creators & Async Code
-
Handling Asynchronous Code
-
Restructuring Actions
-
Where to Put Data Transforming Logic?
-
Using Action Creators and Get State
-
Using Utility Functions
-
A Leaner Switch Case Statement
-
An Alternative Folder Structure
-
Diving Much Deeper
-
Wrap Up
-
Useful Resources & Links
-
Redux Advanced: Burger Project
-
Module Introduction
-
Installing the Redux Devtools
-
Preparing the Folder Structure
-
Creating Action Creators
-
Executing Asynchronous Code
-
Fetching Ingredients Asynchronously
-
Initializing Ingredients in the BurgerBuilder
-
Changing the Order of our Ingredients Manually
-
Adding Order Actions
-
Connecting Contact Data Container & Actions
-
The Order Reducer
-
Working on Order Actions
-
Redirect to Improve UX
-
Combining Reducers
-
Handling Purchases & Updating the UI
-
Resetting the Price after Purchases
-
Fetching Orders (via Redux)
-
Refactoring Reducers
-
Checking our Implemented Functionalities
-
Refactoring Reducers Continued
-
Wrap Up
-
Useful Resources & Links
-
Adding Authentication to our Burger Project
-
Module Introduction
-
Understanding Authentication in Single Page Applications
-
Required App Adjustments
-
Adding Actions
-
Adding an Auth Form
-
Getting a Token from the Backend
-
Storing the Token
-
Adding Sign-In
-
Adding a Spinner
-
Updating the UI Depending on Auth State
-
Logging Users Out
-
Adding a Logout Link
-
Accessing Protected Resources
-
Fixing Connect + Routing Errors
-
Forwarding Unauthenticated Users
-
Ensuring App Security
-
Redirecting the User to the Checkout Page
-
Guarding Routes
-
Persistent Auth State with localStorage
-
Displaying User Specific Orders
-
Wrap Up
-
Useful Resources & Links
-
Improving our Burger Project
-
Module Introduction
-
Fixing the Redirect to the Frontpage
-
Using updateObject in the Entire App
-
Sharing the Validation Method
-
Removing console.log()s
-
Using Environment Variables
-
Adding Lazy Loading
-
Testing
-
Wrap Up
-
Useful Resources & Links
-
Required Testing Tools
-
Module Introduction
-
What To Test?
-
What is Testing?
-
Testing Components Correctly
-
Writing our First Test
-
Testing Containers
-
Testing Components Continued
-
How to Test Redux
-
Deploying the App to the Web
-
Jest and Enzyme Documentations
-
Wrap Up
-
Module Introduction
-
Deployment Steps
-
Wrap Up
-
Useful Resources & Links
-
Building the Project
-
Example: Deploying on Firebase
-
Useful Resources & Links
-
Introducing Webpack
-
Bonus: Working with Webpack
-
Module Introduction
-
How Webpack works
-
DON’T SKIP: Webpack Versions
-
Creating a Basic Folder & File Structure
-
Creating the Basic React Application
-
Basic Workflow Requirements
-
Project & npm Setup
-
Loading CSS Files
-
Installing Production Dependencies
-
Loading Images & Injecting into HTML Page
-
Setting Up the Basic Webpack Config
-
Adding File Rules & Babel
-
Bonus: Next.js
-
Production Workflow & Wrap Up
-
Module Introduction
-
Adding babel-polyfill
-
Useful Resources & Links
-
Understanding Server Side Rendering
-
Setting Up a Project
-
Handling (404) Errors
-
Understanding the Basics
-
A Special Lifecycle Hook
-
Next.js & Components & Pages
-
Styling our App in Next.js
-
Module Introduction
-
Deploying our App
-
Preparing the Demo Project
-
Useful Resources & Links
-
Bonus: Animations in React Apps
-
Using CSS Transitions
-
Using ReactTransitionGroup
-
Using the Transition Component
-
Using CSS Animations
-
Wrapping the Transition Component
-
CSS Transition & Animations Limitations
-
Customizing CSS Classnames
-
The CSSTransition Component
-
Transition Events
-
Animating Lists
-
Animation Timings
-
Useful Resources & Links
-
Bonus: A Brief Introduction to Redux Saga
-
Alternative Animation Packages
-
Module Introduction
-
Hooking the Saga Up (to the Store and Actions)
-
Wrap Up
-
Moving Logic from the Action Creator to a Saga
-
Installing Redux Saga
-
Handling Auto-Sign-In with a Saga
-
Moving More Logic Into Sagas
-
Moving the BurgerBuilder Side Effects into a Saga
-
Creating our First Saga
-
Moving the Orders Side Effects into Sagas
-
Useful Resources & Links
-
Handling Authentication with a Saga
-
React Hooks
-
Why Sagas can be Helpful
-
Introduction
-
Getting Started with useState()
-
Diving Deeper into Sagas
-
More on useState() & State Updating
-
What are “React Hooks”?
-
Array Destructuring
-
Rules of Hooks
-
Passing State Data Across Components
-
The Starting Project
-
Time to Practice: Hooks Basics
-
Multiple States
-
Understanding useEffect() Dependencies
-
More on useEffect()
-
Sending Http Requests
-
What’s useCallback()?
-
Deleting Ingredients
-
useEffect() & Loading Data
-
Loading Errors & State Batching
-
Working with Refs & useRef()
-
More on State Batching & State Updates
-
Working with useContext()
-
Cleaning Up with useEffect()
-
Performance Optimizations with useMemo()
-
Understanding useReducer()
-
Using useReducer() for the Http State
-
Wrap Up
-
Getting Started with Custom Hooks
-
Using Hooks in the Burger Builder
-
Sharing Data Between Custom Hooks & Components
-
Using the Custom Hook
-
Converting the Layout Component
-
Introduction
-
Converting withErrorHandler HOC
-
Converting <App>
-
Adjusting the Order & Checkout Containers
-
Adjusting Auth & Logout Components
-
Routing with React.lazy()
-
Using React.memo() & More!
-
Add Hooks to ContactData
-
Adding a Custom Error Handling Hook
-
Wrap Up
-
Converting the BurgerBuilder Container
-
Useful Resources & Links
-
Setting the right useEffect() Dependencies
-
Bonus: Replacing Redux with React Hooks
-
Alternative: Using the Context API
-
Working with useSelector() and useDispatch()
-
Toggling Favorites with the Context API
-
Module Introduction
-
Context API Summary (and why NOT to use it instead of Redux)
-
Creating a Concrete Store
-
Starting Project & Why You Would Replace Redux
-
Getting Started with a Custom Hook as a Store
-
Using the Custom Store
-
Custom Hook Store Summary
-
Wrap Up
-
Finishing the Store Hook
-
Optimizing the Custom Hook Store
-
Useful Resources & Links
-
Bonus: Building the Burger CSS
-
Module Introduction
-
Bonus: Managing Multiple State Slices with the Custom Store Hook
-
Building the Burger CSS Code
-
More Inspiration: Real-World Projects Built with React
-
Introducing React Native
-
React Rocks! Where to find more Examples
-
Component Libraries (Example: Material UI)
-
Next Steps and Course Roundup
-
Static React Apps with Gatsby.js
-
Smaller Apps with Preact
-
Comparing React with Preact
-
Congratulations
-
Bonus: More Content!
-
Getting Started
-
Learn React Native, Professional Training Course with Internship
-
Getting Started
-
What is React Native?
-
Join our Online Learning Community
-
How React Native Works
-
Expo vs React Native CLI
-
Node.js Download
-
Creating Our First React Native App
-
Working on Our First App
-
React Native Apps Are Hard Work!
-
React Native Alternatives
-
Course Requirements
-
Course Requirement Refreshers
-
Running the App on an Android Emulator
-
Running the App on an iOS Simulator
-
Course Outline
-
How to get the Most out of This Course
-
Useful Resources & Links
-
JavaScript Refresher
-
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
-
React.js Refresher
-
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
-
Diving into the Basics [COURSE GOALS APP]
-
Module Introduction
-
How to work with React Native Components
-
Setting Up A New Project
-
Planning the App
-
Working with Core Components
-
Getting Started with Styles
-
Flexbox & Layouts (Intro)
-
React Native Flexbox Deep Dive
-
Inline Styles & StyleSheet Objects
-
Components, Styles, Layouts
-
Working with State & Events
-
Outputting a List of Items
-
Styling List Items
-
Making it Scrollable with ScrollView!
-
A Better List: FlatList
-
More Components & Lists
-
Splitting the App Into Components
-
Passing Data Between Components
-
Working with Touchable Components
-
Deleting Items
-
Adding a Modal Overlay
-
More Flexbox Styling
-
Closing the Modal & Clearing Input
-
Finishing the Modal Styling
-
Wrap Up
-
Useful Resources & Links
-
Debugging React Native Apps
-
Module Introduction
-
What To Debug & How To Debug?
-
Running the App on a Real Device & Debugging
-
Handling Error Messages
-
Understanding Code Flow with console.log()
-
Using the Remote Debugger & Breakpoints
-
Working with the Device DevTools Overlay
-
Debugging the UI & Using React Native Debugger
-
Wrap Up
-
Useful Resources & Links
-
Components, Styling, Layouts – Building Real Apps [GUESS A NUMBER APP]
-
Module Introduction
-
Setup & App Planning
-
Adding a Custom Header Component
-
Adding a Screen Component
-
Working on the Layout
-
Styling a View as a “Card” Container (with Drop Shadows & Rounded Corners)
-
React Native Styling vs CSS Styling
-
Extracting a Card Component (Presentational Component)
-
Components & Styling
-
Color Theming with Constants
-
Configuring & Styling a TextInput
-
Cleaning User Input & Controlling the Soft Keyboard
-
Resetting & Confirming User Input
-
Configuring Components
-
Showing an Alert
-
Time to Finish the “Confirmation Box”
-
Adding Random Number Generation
-
Switching Between Multiple “Screens”
-
Adding Game Features: Hints & Validation
-
Checking the “Win” Condition with useEffect()
-
Finishing the Game Logic
-
Adding AppLoading
-
Adding Custom Fonts
-
Installing expo-font
-
A Synthetic Style “Cascade”: Custom Wrapper Components & Global Styles
-
Adding Local Images
-
Styling Images
-
Working with Network (Web) Images
-
A Closer Look at the “Text” Component (and what you can do with it)
-
<View> vs <Text> – A Summary
-
Building a Custom Button Component
-
Adding Icons
-
Exploring UI Libraries
-
Managing Past Guesses as a List
-
Styling List Items & Lists
-
ScrollView & Flexbox (Yes, that works!)
-
Using FlatList Instead of ScrollView
-
Wrap Up
-
Useful Resources & Links
-
Responsive & Adaptive User Interfaces and Apps
-
Module Introduction
-
Finding Improvement Opportunities
-
Working with More Flexible Styling Rules
-
Introducing the Dimensions API
-
Using Dimensions in “if” Checks
-
Calculating Sizes Dynamically
-
Problems with Different Device Orientations
-
Controlling Orientation & Using the KeyboardAvoidingView
-
Listening to Orientation Changes
-
Rendering Different Layouts
-
Fixing the GameOver Screen
-
Updating All Code to Update Dynamically
-
The Dimensions API & Responsive UIs
-
Expo’s ScreenOrientation API
-
Introducing the Platform API
-
Working with Platform.select() and Platform in “if” Checks
-
Using Platform-specific Code Files
-
The Platform API
-
Using the SafeAreaView
-
Wrap Up
-
Useful Resources & Links
-
Navigation with React Navigation [THE MEALS APP]
-
Module Introduction
-
Planning the App
-
Adding Screens
-
Adding AppLoading
-
Adding Fonts
-
React Navigation Docs
-
Installing React Navigation & Adding Navigation to the App
-
MUST READ: Installing Different Navigators
-
Creating a StackNavigator
-
React Navigation & Code Attachments
-
Navigating Between Screens
-
Alternative Navigation Syntax
-
Navigation Basics
-
Navigation to the “Meal Details” Screen
-
Pushing, Popping & Replacing
-
Outputting a Grid of Categories
-
Configuring the Header with Navigation Options
-
Passing & Reading Params Upon Navigation
-
Setting Dynamic Navigation Options
-
Default Navigation Options & Config
-
Navigation Params & Configuration
-
Grid Styling & Some Refactoring
-
Adding Meal Models & Data
-
Loading Meals for Categories
-
Rendering a Meals List
-
Passing Data to the Meal Detail Screen
-
Adding Header Buttons
-
Fixing the Shadows
-
Adding Tabs-based Navigation
-
Setting Icons and Configuring Tabs
-
NavigationOptions inside of a Navigator
-
Adding MaterialBottomTabs
-
Adding a Favorites Stack
-
Adding a Menu Button & Drawer Navigation
-
Configuring the Drawer
-
More Navigation Config & Styling
-
Adding a DefaultText Component
-
Adding the MealDetail Screen Content
-
Time for the “Filters” Screen Content!
-
Passing Data Between Component & Navigation Options (Header)
-
[React Refresher] useEffect() & useCallback()
-
Wrap Up
-
Useful Resources & Links
-
State Management & Redux
-
Module Introduction
-
What is State & What is Redux?
-
Redux & Store Setup
-
Selecting State Slices
-
Redux Data & Navigation Options
-
Dispatching Actions & Reducer Logic
-
Switching the Favorites Icon
-
Rendering a Fallback Text
-
Adding Filtering Logic
-
Dispatching Filter Actions
-
Debugging Redux in React Native Apps
-
Wrap Up
-
Useful Resources & Links
-
Time to Practice – THE SHOP APP
-
Module Introduction
-
Planning the App
-
Creating the Basic Project Setup
-
The Products Overview Screen
-
Setting Up a Navigator
-
Styling the Product Items
-
Adding Touchable Components
-
Working on the Product Details Screen
-
Using Custom Fonts
-
Adding Items to the Cart
-
Implementing Header Buttons
-
Outputting Cart Items
-
Adding Logic to Delete Items
-
Adding Redux Logic for Orders
-
SideDrawer & The Orders Screen
-
Clearing the Cart
-
Styling Order Items
-
Making the “Show Details” Button Work
-
Building the “User Products” Screen
-
Reorganizing the ProductItem Component
-
Deleting Items
-
Adding Basic Editing & Navigation Logic
-
Handling User Input
-
Using Params to Submit User Input
-
Time to Improve the App!
-
Dispatching Actions for Creating & Updating
-
Wrap Up
-
Useful Resources & Links
-
Handling User Input
-
Module Introduction
-
Configuring TextInputs
-
Adding Basic Validation
-
Getting Started with useReducer()
-
Finishing the Merged Form & Input Management
-
Moving Input Logic Into A Separate Component
-
Connecting Input Component & Form
-
Tweaking Styles & Handling the Soft Keyboard
-
Alternatives & Wrap Up
-
Useful Resources & Links
-
Http Requests & Adding a Web Server + Database
-
Module Introduction
-
Setup & How To Send Requests
-
Installing Redux Thunk
-
Storing Products on a Server
-
Fetching Products from the Server
-
Displaying a Loading Spinner & Handling Errors
-
Setting Up a Navigation Listener
-
Updating & Deleting Products
-
Storing Orders
-
Handling Additional Errors
-
Displaying an ActivityIndicator
-
Adding “Pull to Refresh”
-
Fetching Stored Orders
-
Wrap Up
-
Useful Resources & Links
-
User Authentication
-
Module Introduction
-
How Authentication Works
-
Implementing a Basic Login Screen
-
Adding User Signup
-
Logging Users In
-
Managing the Loading State & Errors
-
Using the Token
-
Mapping Orders to Users
-
Improved Mapping (Scoping)
-
Implementing “Auto Login”
-
Adding Logout
-
Implementing “Auto Logout”
-
Auto-Logout & Android (Warning)
-
Wrap Up
-
Useful Resources & Links
-
Native Device Features (Camera, Maps, Location, SQLite, …) [GREAT PLACES APP]
-
Module Introduction
-
Planning the App
-
Navigation Setup in Next Lecture
-
Screen & Navigation Setup
-
Getting Started with the Form
-
Redux & Adding Places
-
Outputting a List of Places
-
Accessing the Device Camera
-
Configuring the Camera Access
-
Using the Picked Image
-
Storing the Image on the Filesystem
-
Changed SQLite Import
-
Diving into SQLite for Permanent Data Storage
-
Storing Data in the Local Database
-
Fetching Data from the Local Database
-
Getting the User Location
-
Showing a Map Preview of the Location
-
More on Environment Variables
-
Displaying an Interactive Map
-
Adding a Marker
-
Making the Picked Location “Saveable”
-
Updating the Location Screen When the Location Changes
-
Storing the Address
-
Running the App on iOS
-
Storing Picked Places
-
Displaying the “Details” Screen
-
Finishing the “Map” Screen
-
Useful Resources & Links
-
Running the App on Android
-
Wrap Up
-
Building Apps Without Expo
-
Module Introduction
-
Alternatives to Expo
-
Building Apps with Just the React Native CLI
-
Adding Native Modules to Non-Expo Apps
-
Understanding Expo’s “Bare Workflow”
-
Live Reload and RN CLI Apps
-
Ejecting from Expo’s “Managed Workflow”
-
Important: Using React Native Image Picker
-
When To Use Which?
-
Useful Resources & Links
-
Push Notifications
-
Module Introduction
-
Understanding Notifications
-
Sending Local Notifications
-
Getting Permissions
-
Controlling How Notifications Are Displayed
-
Reacting to Background Notifications
-
Reacting to Foreground Notifications
-
Sending Push Notifications
-
How Push Notifications Work
-
Using Expo’s Push Server
-
Expo & Push Notifications
-
More on Push Tokens
-
Getting a Push Token
-
Adding Push Notifications to the Shop App (3/3)
-
Push Notifications in non-Expo Managed Apps
-
Adding Push Notifications to the Shop App (1/3)
-
Module Resources
-
Adding Push Notifications to the Shop App (2/3)
-
Course Roundup & Next Steps
-
Roundup & Next Steps
-
Bonus
-
Bonus: More Content!
-
Getting Started
This content is protected, please login and enroll in the course to view this content!
Bonus
Prev
