完整的 React Native + Hooks 课程
The Complete React Native + Hooks Course
- 1 - Getting Started
- 1 - How to Get Help
- 4 - Course Overview
- 7 - App Setup
- 8 - Making Changes
- 2 - Working with Content
- 11 - Overview of React Components
- 12 - Showing a Custom Component
- 13 - Common Questions and Answers
- 14 - Rules of JSX
- 15 - One Common Error
- 16 - JSX Exercise Overview
- 17 - JSX Solution
- 3 - List Building With Style
- 18 - Building Lists
- 19 - The FlatList Element
- 20 - Rendering a FlatList
- 21 - Why a Key Property
- 22 - Solving the Key Issue
- 23 - A Few Props Around FlatList
- 24 - Exercise Overview
- 25 - Exercise Solution
- 4 - Navigating Users Between Screens
- 26 - Button Types
- 27 - Buttons in Action
- 28 - Touchable Opacity in Action
- 29 - Navigating with React Navigation
- 30 - Destructuring Props
- 5 - Building Reusable Components
- 31 - Component Reuse with Props
- 32 - Exercise Solution
- 33 - ParentChild Relationships
- 34 - Communicating from Parent to Child
- 36 - Showing Images
- 37 - Passing Images as Props
- 38 - Exercise Outline
- 39 - Exercise Solution
- 6 - State Management in React Components
- 40 - State in Components
- 41 - Screen Boilerplate
- 42 - State in Action
- 43 - Notes on State
- 44 - App Overview
- 45 - Generating Random Colors
- 46 - Adding Random Colors
- 47 - Showing Colors with a FlatList
- 48 - App Overview
- 49 - Reusable Color Adjusters
- 50 - Coordinating State
- 51 - Passing Callbacks to Children
- 52 - Tying State Values Together
- 53 - Validating State Changes
- 54 - Reusable State Updates
- 55 - Introduction to Reducers
- 56 - Creating a Reducer
- 57 - Applying State with a Reducer
- 58 - Restoring Validation
- 59 - Community Convention in Reducers
- 60 - Exercise Outline
- 61 - Exercise Solution
- 62 - Handling Text Input
- 63 - Showing a Text Input
- 64 - Two Important Props
- 65 - Weird Things with Text and State
- 66 - Updating State
- 67 - Exercise Outline
- 68 - Exercise Solution
- 7 - How to Handle Screen Layout
- 69 - Layout with React Native
- 70 - Basics of Box Object Model
- 71 - AlignItems with Flex
- 72 - Flex Direction
- 73 - Justify Content
- 74 - Flex Values
- 75 - Align Self on Children
- 76 - The Position Property
- 77 - Top Bottom Left Right
- 78 - Absolute Fill Objects
- 79 - Applying Layout Systems
- 80 - Exercise Overview
- 81 - Exercise Solution
- 8 - Putting It All Together Restaurant Search App
- 82 - App Overview
- 84 - Project Generation
- 86 - Yelp Signup
- 87 - Yelp Walkthrough
- 88 - React Navigation
- 90 - Assembling a Navigator
- 91 - Architecture Approach
- 92 - Starting the SearchBar
- 93 - Displaying Icons
- 94 - Search Bar Styling
- 95 - A Touch More Styling
- 96 - Managing State
- 97 - Detecting Editing Completion
- 9 - Using Outside APIs
- 98 - Configuring Axios
- 99 - Making the Request
- 100 - Error Handling
- 101 - Running an Initial Search
- 10 - Making Hooks Reusable
- 103 - The UseEffect Hook
- 104 - Extracting Hook Logic
- 105 - Showing Search Results
- 106 - Grouping Results
- 107 - FlatList Rendering
- 11 - Navigation with Parameters
- 108 - Showing a Single Result
- 109 - Showing Additional Info
- 110 - A Few More Styling Issues
- 111 - Hiding Scroll Bars
- 112 - Constraining View Elements
- 113 - Empty Elements
- 114 - Spacing on the Search Bar
- 115 - Reminder on Navigation
- 116 - Navigating from a Child Component
- 117 - The WithNavigation Helper
- 118 - Communicating Between Screens
- 119 - Fetching a Single Restaurant
- 120 - Showing a List of Images
- 121 - One Last Fix
- 12 - Advanced State Management with Context
- 124 - App Overview
- 125 - Issues with Data
- 127 - Initial Setup
- 128 - Wrapping the Navigator
- 129 - Introduction to Context
- 130 - Adding Context
- 131 - Moving Data with Context
- 132 - Rendering a List of Posts
- 133 - Adding State in Context
- 134 - It Works
- 135 - Opportunity for Improvement
- 136 - Updating with UseReducer
- 137 - Automating Context Creation
- 138 - More Automatic Context Creation
- 139 - A Bit of Styling
- 140 - Deleting Posts
- 141 - Updating the Reducer
- 142 - Navigation on Tap
- 143 - Retrieving Single Posts
- 144 - Adding a Creation Screen
- 146 - Header Navigation
- 147 - Displaying a Form
- 148 - Saving a New Post
- 149 - Navigation on Save
- 151 - The Edit Icon Link
- 152 - Communicating Info to Edit
- 153 - Initializing State from Context
- 154 - Extracting Form Logic
- 155 - Customizing OnSubmit
- 156 - Initial Form Values
- 157 - Default Props
- 158 - Editing Action Function
- 159 - Editing in a Reducer
- 160 - Navigating Backwards
- 13 - Data API Sync
- 161 - Outside Data API
- 162 - Issues with Servers React Native
- 164 - JSON Server and Ngrok Setup
- 165 - JSON Server REST Conventions
- 166 - Making a Request
- 167 - Remote Fetch of Posts
- 168 - Creating Posts with Post Requests
- 169 - Refetching on Navigate
- 170 - Deleting a Post
- 171 - Editing Posts
- 172 - App Wrapup
- 14 - Building a Custom Express API
- 174 - App Overview
- 175 - Dependencies Setup
- 176 - The Basics of Express
- 177 - MongoDB Setup
- 178 - Connecting to MongoDB
- 179 - Nodemon for Automatic Restarts
- 180 - Understanding the Signup Process
- 181 - Using Postman
- 182 - Handling JSON Data
- 183 - Defining a User Schema
- 184 - Creating and Saving a User
- 185 - Error Handling
- 186 - JSON Web Tokens
- 187 - Creating a JWT
- 188 - Wiring Up JSON Web Tokens
- 189 - Understanding Password Hashing
- 190 - Salting and Hashing
- 191 - The Signin Route
- 192 - Testing Signup and Signin
- 193 - Defining Tracks
- 194 - Listing Tracks
- 195 - Creating Tracks
- 15 - InApp Authentication
- 197 - Server Setup
- 199 - Navigation Design
- 201 - A LOT of Boilerplate
- 202 - Navigator Hookup
- 203 - Testing the Navigation Flow
- 204 - React Native Elements
- 205 - Helper Styling Components
- 207 - Styling Odds and Ends
- 208 - Input Props
- 209 - The Auth Context
- 210 - Whats the Context Doing
- 211 - Axios Setup
- 212 - Making an API Request
- 213 - Handling Errored Requests
- 214 - Async Storage
- 216 - Storing the Token
- 217 - Navigation From Outside of React
- 218 - Oops Typo
- 219 - Navigation to Signin
- 220 - Extracting Form Logic
- 221 - Last Bit of Extracting
- 222 - Creating a NavLink
- 224 - Real Component Reuse
- 225 - Wiring Up Signin
- 227 - Clearing Error Messages
- 228 - Automatic Signin
- 229 - Empty Screens While Resolving Auth
- 230 - Signing Out a User
- 231 - Safe Area Views
- 232 - Working on Track Create
- 234 - Showing a Map
- 235 - Drawing a Series of Points
- 236 - Notes on Location
- 239 - Requesting Location Permissions
- 240 - Resetting Permissions
- 241 - How to Test Location
- 242 - Faking the Users Location
- 243 - Reading a Location
- 244 - Bugginess with Location
- 245 - Location Architecture
- 246 - Location Context
- 247 - Live Location Updates
- 249 - Drawing a Position Indicator
- 250 - Extracting Logic to a Hook
- 251 - Disabling Location Tracking
- 252 - Automatic Disables
- 253 - Building a Track Form
- 254 - Updates to Location Context
- 255 - Track Form Wire Up
- 256 - Buggy UseEffects
- 17 - Working with Old Versions of React Native
- 279 - OSX Installation
- 280 - More on OSX Installation
- 281 - Running in the Simulator
- 282 - Windows Setup of React Native
- 283 - Android Studio and React Native CLI Installation
- 284 - Emulator Creation and System Variables
- 285 - ESLint Setup with VSCode
- 287 - Project Directory Walkthrough
- 288 - Getting Content on the Screen
- 289 - React vs React Native
- 290 - Creating a Component with JSX
- 291 - Registering a Component
- 292 - Destructuring Imports
- 293 - Application Outline
- 294 - The Header Component
- 295 - Consuming File Exports
- 296 - Styling with React Native
- 297 - More on Styling Components
- 298 - Introduction to Flexbox
- 299 - Header Styling
- 300 - Making the Header Reusable
- 301 - Sourcing Album Data
- 302 - List Component Boilerplate
- 303 - Class Based Components
- 304 - Lifecycle Methods
- 306 - Network Requests
- 307 - Component Level State
- 308 - More on Component Level State
- 309 - Rendering a List of Components
- 310 - Displaying Individual Albums
- 311 - Fantastic Reusable Components The Card
- 312 - Styling a Card
- 313 - Passing Components as Props
- 314 - Dividing Cards into Sections
- 315 - Mastering Layout with Flexbox
- 316 - Positioning of Elements on Mobile
- 317 - More on Styling
- 318 - Images with React Native
- 319 - Displaying Album Artwork
- 320 - Making Content Scrollable
- 321 - Handling User Input with Buttons
- 322 - Styling of Buttons with UX Considerations
- 323 - Responding to User Input
- 324 - Linking Between Mobile Apps
- 325 - Setting Button Text by Props
- 326 - App Wrapup
- 327 - Auth App Introduction
- 328 - A Common Root Component
- 329 - Copying Reusable Components
- 330 - What is Firebase
- 331 - Firebase Client Setup
- 332 - Login Form Scaffolding
- 333 - Handling User Inputs
- 334 - More on Handling User Inputs
- 335 - How to Create Controlled Components
- 336 - Making Text Inputs From Scratch
- 337 - A Focus on Passing Props
- 338 - Making the Input Pretty
- 339 - Wrapping up Inputs
- 340 - Password Inputs
- 341 - Logging a User In
- 342 - Error Handling
- 343 - More on Authentication Flow
- 344 - Creating an Activity Spinner
- 345 - Conditional Rendering of JSX
- 346 - Clearing the Form Spinner
- 347 - Handling Authentication Events
- 348 - More on Conditional Rendering
- 349 - Logging a User Out and Wrapup
- 350 - App Mockup and Approach
- 351 - The Basics of Redux
- 352 - More on Redux
- 353 - Redux is Hard
- 354 - Application Boilerplate
- 355 - More on Redux Boilerplate
- 356 - Rendering the Header
- 357 - Reducer and State Design
- 358 - Library List of Data
- 360 - The Connect Function
- 361 - MapStateToProps with Connect
- 362 - A Quick Review and Breather
- 363 - The Theory of ListView
- 364 - ListView in Practice
- 365 - Rendering a Single Row
- 366 - Styling the List
- 367 - Creating the Selection Reducer
- 368 - Introducing Action Creators
- 369 - Calling Action Creators
- 370 - Adding a Touchable
- 371 - Rules of Reducers
- 372 - Expanding a Row
- 373 - Moving Logic Out of Components
- 374 - Animations
- 375 - Wrapup
- 376 - Overview of Our Next App
- 377 - App Challenges
- 379 - Just a Touch More Setup
- 380 - More on Boilerplate Setup
- 381 - Login Form in a Redux World
- 382 - Rebuilding the Login Form
- 383 - Handling Form Updates with Action Creators
- 384 - Wiring up Action Creators
- 385 - Typed Actions
- 386 - Immutable State
- 387 - Creating Immutable State
- 388 - More on Creating Immutable State
- 389 - Synchronous vs Asynchronous Action Creators
- 390 - Introduction to Redux Thunk
- 391 - Redux Thunk in Practice
- 392 - Redux Thunk in Practice Continued
- 393 - Making LoginUser More Robust
- 394 - Creating User Accounts
- 395 - Showing Error Messages
- 396 - A Firebase Gotcha
- 397 - Showing a Spinner on Loading
- 398 - Dealing with Navigation
- 399 - Navigation in the Router
- 400 - Addressing Styling Issues
- 401 - Displaying Multiple Scenes
- 402 - Navigating Between Routes
- 403 - Grouping Scenes with Buckets
- 404 - Navigation Bar Buttons
- 405 - Navigating to the Employee Creation Form
- 406 - Building the Employee Creation Form
- 407 - Employee Form Actions
- 408 - Handling Form Updates at the Reducer Level
- 409 - Dynamic Property Updates
- 410 - The Picker Component
- 411 - Pickers and Style Overrides
- 412 - Firebase JSON Schema
- 413 - Data Security in Firebase
- 414 - Creating Records with Firebase
- 415 - Default Form Values
- 416 - Successful Data Save to Firebase
- 417 - Resetting Form Properties
- 418 - Fetching Data from Firebase
- 419 - Storing Data by ID
- 420 - Dynamic DataSource Building
- 421 - Transforming Objects to Arrays
- 422 - List Building in Employee List
- 423 - Reusing the Employee Form
- 424 - Create vs Edit Forms
- 425 - Reusable Forms
- 426 - A Standalone Employee Edit Form
- 427 - Initializing Forms from State
- 428 - Updating Firebase Records
- 429 - Clearing Form Attributes
- 430 - Texting Employees
- 431 - Modals as a Reusable Component
- 432 - The Modal Component Continued
- 433 - Styling the Modal
- 434 - Employee Delete Action Creator
- 435 - Wiring up Employee Delete
- 18 - Extras
- 187 - Creating a JWT
- 188 - Wiring Up JSON Web Tokens
- 189 - Understanding Password Hashing
- 190 - Salting and Hashing
- 191 - The Signin Route
- 192 - Testing Signup and Signin
- 193 - Defining Tracks
- 194 - Listing Tracks
- 195 - Creating Tracks