Module1: Getting Started
1.1 Welcome!
1.2 What is React Native?
1.3 Join our Online Learning Community
1.4 How React Native Works
1.5 Expo vs React Native CLI
1.6 Node.js Download
1.7 Creating Our First React Native App
1.8 Working on Our First App
1.9 React Native Apps Are Hard Work!
1.10 React Native Alternatives
1.11 Course Requirements
1.12 Course Requirement Refreshers
1.13 Running the App on an Android Emulator
1.14 Running the App on an iOS Simulator
1.15 Course Outline
1.16 How to get the Most out of This Course
Module2: Diving into the Basics
2.1 Module Introduction
2.2 How to work with React Native Components
2.3 Setting Up A New Project
2.4 Planning the App
2.5 Working with Core Components
2.6 Getting Started with Styles
2.7 Flexbox & Layouts (Intro)
2.8 React Native Flexbox Deep Dive
2.9 Inline Styles & StyleSheet Objects
2.10 Working with State & Events
2.11 Outputting a List of Items
2.12 Styling List Items
2.13 Making it Scrollable with ScrollView!
2.14 A Better List: FlatList
2.15 Splitting the App Into Components
2.16 Passing Data Between Components
2.17 Working with Touchable Components
2.18 Deleting Items
2.19 Adding a Modal Overlay
2.20 More Flexbox Styling
2.21 Closing the Modal & Clearing Input
2.22 Finishing the Modal Styling
Module 3: Debugging React Native Apps
3.1 Module Introduction
3.2 What To Debug & How To Debug?
3.3 Running the App on a Real Device & Debugging
3.4 Handling Error Messages
3.5 Understanding Code Flow with console.log()
3.6 Using the Remote Debugger & Breakpoints
3.7 Working with the Device DevTools Overlay
3.8 Debugging the UI & Using React Native Debugger
Module 4: Components, Styling, Layouts - Building Real Apps [GUESS A NUMBER APP]
4.1 Module Introduction
4.2 Setup & App Planning
4.3 Adding a Custom Header Component
4.4 Adding a Screen Component
4.5 Working on the Layout
4.6 Styling a View as a "Card" Container (with Drop Shadows & Rounded Corners)
4.7 React Native Styling vs CSS Styling
4.8 Extracting a Card Component (Presentational Component)
4.9 Color Theming with Constants
4.10 Configuring & Styling a TextInput
4.11 Cleaning User Input & Controlling the Soft Keyboard
4.12 Resetting & Confirming User Input
4.13 Showing an Alert
4.14 Time to Finish the "Confirmation Box"
4.15 Adding Random Number Generation
4.16 Switching Between Multiple "Screens"
4.17 Adding Game Features: Hints & Validation
4.18 Checking the "Win" Condition with useEffect()
4.19 Finishing the Game Logic
4.20 Adding AppLoading
4.21 Adding Custom Fonts
4.22 Installing expo-font
4.23 A Synthetic Style "Cascade": Custom Wrapper Components & Global Styles
4.24 Adding Local Images
4.25 Styling Images
4.26 Working with Network (Web) Images
4.27 A Closer Look at the "Text" Component (and what you can do with it)
4.28 <View> vs <Text> - A Summary
4.29 Building a Custom Button Component
4.30 Adding Icons
4.31 Exploring UI Libraries
4.32 Managing Past Guesses as a List
4.33 Styling List Items & Lists
4.34 ScrollView & Flexbox (Yes, that works!)
4.35 Using FlatList Instead of ScrollView
Module 5: Responsive & Adaptive User Interfaces and Apps
5.1 Module Introduction
5.2 Finding Improvement Opportunities
5.3 Working with More Flexible Styling Rules
5.4 Introducing the Dimensions API
5.5 Using Dimensions in "if" Checks
5.6 Calculating Sizes Dynamically
5.7 Problems with Different Device Orientations
5.8 Controlling Orientation & Using the KeyboardAvoidingView
5.9 Listening to Orientation Changes
5.10 Rendering Different Layouts
5.11 Fixing the GameOver Screen
5.12 Updating All Code to Update Dynamically
5.13 Expo's ScreenOrientation API
5.14 Introducing the Platform API
5.15 Working with Platform.select() and Platform in "if" Checks
5.16 Using Platform-specific Code Files
5.17 Using the SafeAreaView
|
Module 6: Navigation with React Navigation
6.1 Module Introduction
6.2 Planning the App
6.3 Adding Screens
6.4 Adding AppLoading
6.5 Adding Fonts
6.6 React Navigation Docs
6.7 Installing React Navigation & Adding Navigation to the App
6.8 Creating a StackNavigator
6.9 React Navigation & Code Attachments
6.10 Navigating Between Screens
6.11 Alternative Navigation Syntax
6.12 Navigation to the "Meal Details" Screen
6.13 Pushing, Popping & Replacing
6.14 Outputting a Grid of Categories
6.15 Configuring the Header with Navigation Options
6.16 Passing & Reading Params Upon Navigation
6.17 Setting Dynamic Navigation Options
6.18 Default Navigation Options & Config
6.19 Grid Styling & Some Refactoring
6.20 Adding Meal Models & Data
6.21 Loading Meals for Categories
6.22 Rendering a Meals List
6.23 Passing Data to the Meal Detail Screen
6.24 Header Buttons: Using the Correct Version
6.25 Adding Header Buttons
6.26 Fixing the Shadows
6.27 Adding Tabs-based Navigation
6.28 Setting Icons and Configuring Tabs
6.29 navigation options inside of a Navigator
6.30 Adding MaterialBottomTabs
6.31 Adding a Favorites Stack
6.32 Adding a Menu Button & Drawer Navigation
6.33 Configuring the Drawer
6.34 More Navigation Config & Styling
6.35 Adding a DefaultText Component
6.36 Adding the MealDetail Screen Content
6.37 Time for the "Filters" Screen Content!
6.38 Passing Data Between Component & Navigation Options (Header)
6.39 [React Refresher] useEffect() & useCallback()
Module 7: State Management & Redux
7.1 Module Introduction
7.2 What is State & What is Redux?
7.3 Redux & Store Setup
7.4 Selecting State Slices
7.5 Redux Data & Navigation Options
7.6 Dispatching Actions & Reducer Logic
7.7 Switching the Favorites Icon
7.8 Rendering a Fallback Text
7.9 Adding Filtering Logic
7.10 Dispatching Filter Actions
7.11 Debugging Redux in React Native Apps
7.12 Useful Resources & Links
Module 8: Time to Practice - THE SHOP APP
8.1 Module Introduction
8.2 Planning the App
8.3 Creating the Basic Project Setup
8.4 The Products Overview Screen
8.5 Setting Up a Navigator
8.6 Styling the Product Items
8.7 Adding Touchable Components
8.8 Working on the Product Details Screen
8.9 Using Custom Fonts
8.10 Adding Items to the Cart
8.11 Implementing Header Buttons
8.12 Outputting Cart Items
8.13 Adding Logic to Delete Items
8.14 Adding Redux Logic for Orders
8.15 SideDrawer & The Orders Screen
8.16 Clearing the Cart
8.17 Styling Order Items
8.18 Making the "Show Details" Button Work
8.19 Building the "User Products" Screen
8.20 Reorganizing the ProductItem Component
8.21 Deleting Items
8.22 Adding Basic Editing & Navigation Logic
8.23 Handling User Input
8.24 Using Params to Submit User Input
8.35 Dispatching Actions for Creating & Updating
8.26 Time to Improve the App!
Module 9: Handling User Input
9.1 Module Introduction
9.2 Configuring TextInputs
9.3 Adding Basic Validation
9.4 Getting Started with useReducer()
9.5 Finishing the Merged Form & Input Management
9.6 Moving Input Logic Into A Separate Component
9.7 Connecting Input Component & Form
9.8 Tweaking Styles & Handling the Soft Keyboard
9.9 Alternatives & Wrap Up
Module 10: Http Requests & Adding a Web Server + Database
10.1 Module Introduction
10.2 Setup & How To Send Requests
10.3 Installing Redux Thunk
10.4 Storing Products on a Server
10.5 Fetching Products from the Server
10.6 Displaying a Loading Spinner & Handling Errors
10.7 Setting Up a Navigation Listener
10.8 Updating & Deleting Products
10.9 Handling Additional Errors
10.10 Storing Orders
10.11 Displaying an ActivityIndicator
10.12 Fetching Stored Orders
10.13 Adding "Pull to Refresh"
Module 11: User Authentication
11.1 Module Introduction
11.2 How Authentication Works
11.3 Implementing a Basic Login Screen
11.4 Adding User Signup
11.5 Logging Users In
11.6 Managing the Loading State & Errors
11.7 Using the Token
11.8 Mapping Orders to Users
11.9 Improved Mapping (Scoping)
11.10 Using AsyncStorage
11.11 Implementing "Auto Login"
11.12 Adding Logout
11.13 Implementing "Auto Logout"
11.14 Auto-Logout & Android (Warning)
|
Module 12: Native Device Features (Camera, Maps, Location, SQLite, ...)
12.1 Module Introduction
12.2 Planning the App
12.3 Navigation Setup in Next Lecture
12.4 Screen & Navigation Setup
12.5 Getting Started with the Form
12.6 Redux & Adding Places
12.7 Outputting a List of Places
12.8 Accessing the Device Camera
12.9 Configuring the Camera Access
12.10 Using the Picked Image
12.11 Storing the Image on the Filesystem
12.12 Changed SQLite Import
12.13 Diving into SQLite for Permanent Data Storage
12.14 Storing Data in the Local Database
12.15 Fetching Data from the Local Database
12.16 Getting the User Location
12.17 Showing a Map Preview of the Location
12.18 More on Environment Variables
12.19 Displaying an Interactive Map
12.20 Adding a Marker
12.21 Making the Picked Location "Saveable"
12.22 Storing Picked Places
12.23 Updating the Location Screen When the Location Changes
12.24 Storing the Address
12.25 Displaying the "Details" Screen
12.26 Finishing the "Map" Screen
12.27 Running the App on iOS
12.28 Running the App on Android
Module 13: Building Apps Without Expo
13.1 Module Introduction
13.2 Alternatives to Expo
13.3 Building Apps with Just the React Native CLI
13.4 Live Reload and RN CLI Apps
13.5 Important: Using React Native Image Picker
13.6 Adding Native Modules to Non-Expo Apps
13.7 Understanding Expo's "Bare Workflow"
13.8 Ejecting from Expo's "Managed Workflow"
13.9 When To Use Which?
Module 14: Publishing React Native Apps
14.1 Module Introduction
14.2 Deployment Steps
14.3 Configuring the App & Publishing
14.4 Configuring Icons & The Splash Screen
14.5 Working with Offline Asset Bundles
14.6 Using "Over the Air Updates" (OTA Updates)
14.7 Building the Apps for Deployment (iOS & Android)
14.8 Publishing iOS Apps without Expo
14.9 Publishing Android Apps without Expo
14.10 Configuring Android Apps
Module 15: Updating to React Navigation 5+
15.1 Module Introduction
15.2 What Changed?
15.3 Preparing the Project
15.4 More Information & Updating the Project Dependencies
15.5 Moving from the "Registry-like" to the "Component-based" Navigation Config
15.6 First Migration Steps
15.7 Converting More Stack Navigators to the New Config
15.8 Migrating the Drawer Navigation
15.9 Replacing the "Switch" Navigator & Auth Flow
15.10 Logout & Further Fixes/ Adjustments
15.11 Extracting Screen Params
15.12 Setting Screen Options Dynamically
15.13 Remaining Migration Steps & Roundup
Module 16: Push Notifications
16.1 Module Introduction
16.2 Understanding Notifications
16.3 Sending Local Notifications
16.4 Getting Permissions
16.5 Controlling How Notifications Are Displayed
16.6 Reacting to Foreground Notifications
16.7 Reacting to Background Notifications
16.8 How Push Notifications Work
16.9 Expo & Push Notifications
16.10 Getting a Push Token
16.11 Sending Push Notifications
16.12 Using Expo's Push Server
16.13 More on Push Tokens
16.14 Adding Push Notifications to the Shop App (1/3)
16.15 Adding Push Notifications to the Shop App (2/3)
16.16 Adding Push Notifications to the Shop App (3/3)
16.17 Push Notifications in non-Expo Managed Apps
Module 18: Bonus: JavaScript Refresher
18.1 Module Introduction
18.2 JavaScript - A Summary
18.3 Project Setup
18.4 Core Syntax Refresher
18.5 let & const
18.6 Arrow Functions
18.7 Objects: Properties & Methods
18.8 Arrays & Array Methods
18.9 Arrays, Objects & Reference Types
18.10 Spread Operator & Rest Parameters
18.11 Destructuring
18.12 Async Code & Promises
Module 19: Bonus: React.js Refresher
19.1 Module Introduction
19.2 What is React
19.3 A Starting Project
19.4 Understanding JSX
19.5 Understanding Components
19.6 Working with Multiple Components
19.7 Working with Props
19.8 Rendering Lists of Data
19.9 Handling Events
19.10 Parent-Child Communication
19.11 Managing State
19.12 More on State
19.13 User Input & Two-Way Binding
|
