-
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
Course Curriculum
Dive Right In! | |||
Introduction – Course Roadmap | 00:00:00 | ||
Roadmap to the First App | 00:00:00 | ||
Official Course Github Repo | 00:00:00 | ||
Got OSX? Go Here. | |||
OSX Installation | 00:00:00 | ||
More on OSX Installation | 00:00:00 | ||
Running in the Simulator | 00:00:00 | ||
Got Windows? Go Here. | |||
Windows Setup of React Native | 00:00:00 | ||
Android Studio and React Native CLI Installation | 00:00:00 | ||
Emulator Creation and System Variables | 00:00:00 | ||
[Optional] ESLint Setup | |||
ESLint Setup and Overview | 00:00:00 | ||
ESLint Setup with Atom | 00:00:00 | ||
ESLint Setup with Sublime Text 3 | 00:00:00 | ||
ESLint Setup with VSCode | 00:00:00 | ||
Onwards! | |||
Troubleshooting React Native Installs | 00:00:00 | ||
Project Directory Walkthrough | 00:00:00 | ||
Getting Content on the Screen | 00:00:00 | ||
React vs React Native | 00:00:00 | ||
Creating a Component with JSX | 00:00:00 | ||
Registering a Component | 00:00:00 | ||
Destructuring Imports | 00:00:00 | ||
Application Outline | 00:00:00 | ||
The Header Component | 00:00:00 | ||
Consuming File Exports | 00:00:00 | ||
Making Great Looking Apps | |||
Styling with React Native | 00:00:00 | ||
More on Styling Components | 00:00:00 | ||
Introduction to Flexbox | 00:00:00 | ||
Header Styling | 00:00:00 | ||
Making the Header Reusable | 00:00:00 | ||
HTTP Requests with React Native | |||
Sourcing Album Data | 00:00:00 | ||
List Component Boilerplate | 00:00:00 | ||
Class Based Components | 00:00:00 | ||
Lifecycle Methods | 00:00:00 | ||
Quick Note On Axios | 00:00:00 | ||
Network Requests | 00:00:00 | ||
Component Level State | 00:00:00 | ||
More on Component Level State | 00:00:00 | ||
Rendering a List of Components | 00:00:00 | ||
Displaying Individual Albums | 00:00:00 | ||
Fantastic Reusable Components – The Card | 00:00:00 | ||
Styling a Card | 00:00:00 | ||
Passing Components as Props | 00:00:00 | ||
Dividing Cards into Sections | 00:00:00 | ||
Handling Component Layout | |||
Mastering Layout with Flexbox | 00:00:00 | ||
Positioning of Elements on Mobile | 00:00:00 | ||
More on Styling | 00:00:00 | ||
Images with React Native | 00:00:00 | ||
Displaying Album Artwork | 00:00:00 | ||
Making Content Scrollable | 00:00:00 | ||
Handling User Input with Buttons | 00:00:00 | ||
Styling of Buttons with UX Considerations | 00:00:00 | ||
Responding to User Input | 00:00:00 | ||
Linking Between Mobile Apps | 00:00:00 | ||
Setting Button Text by Props | 00:00:00 | ||
App Wrapup | 00:00:00 | ||
Authentication with Firebase | |||
Auth App Introduction | 00:00:00 | ||
A Common Root Component | 00:00:00 | ||
Copying Reusable Components | 00:00:00 | ||
What is Firebase? | 00:00:00 | ||
Firebase Client Setup | 00:00:00 | ||
Login Form Scaffolding | 00:00:00 | ||
Handling User Inputs | 00:00:00 | ||
More on Handling User Inputs | 00:00:00 | ||
How to Create Controlled Components | 00:00:00 | ||
Making Text Inputs From Scratch | 00:00:00 | ||
A Focus on Passing Props | 00:00:00 | ||
Making the Input Pretty | 00:00:00 | ||
Wrapping up Inputs | 00:00:00 | ||
Password Inputs | 00:00:00 | ||
Processing Authentication Credentials | |||
Logging a User In | 00:00:00 | ||
Error Handling | 00:00:00 | ||
More on Authentication Flow | 00:00:00 | ||
Creating an Activity Spinner | 00:00:00 | ||
Conditional Rendering of JSX | 00:00:00 | ||
Clearing the Form Spinner | 00:00:00 | ||
Handling Authentication Events | 00:00:00 | ||
More on Conditional Rendering | 00:00:00 | ||
Logging a User Out and Wrapup | 00:00:00 | ||
igging Deeper with Redux | |||
App Mockup and Approach | 00:00:00 | ||
The Basics of Redux | 00:00:00 | ||
More on Redux | 00:00:00 | ||
Redux is Hard! | 00:00:00 | ||
Application Boilerplate | 00:00:00 | ||
More on Redux Boilerplate | 00:00:00 | ||
Back to React | |||
Rendering the Header | 00:00:00 | ||
Reducer and State Design | 00:00:00 | ||
Library List of Data | 00:00:00 | ||
JSON CopyPaste | 00:00:00 | ||
The Connect Function | 00:00:00 | ||
MapStateToProps with Connect | 00:00:00 | ||
A Quick Review and Breather | 00:00:00 | ||
Rendering Lists the Right Way | |||
The Theory of ListView | 00:00:00 | ||
ListView in Practice | 00:00:00 | ||
Rendering a Single Row | 00:00:00 | ||
Styling the List | 00:00:00 | ||
Creating the Selection Reducer | 00:00:00 | ||
Introducing Action Creators | 00:00:00 | ||
Calling Action Creators | 00:00:00 | ||
Adding a Touchable | 00:00:00 | ||
Rules of Reducers | 00:00:00 | ||
Expanding a Row | 00:00:00 | ||
Moving Logic Out of Components | 00:00:00 | ||
Animations | 00:00:00 | ||
Wrapup | 00:00:00 | ||
Not Done Yet... | |||
Overview of Our Next App | 00:00:00 | ||
App Challenges | 00:00:00 | ||
Quick Note | 00:00:00 | ||
Just a Touch More Setup | 00:00:00 | ||
More on Boilerplate Setup | 00:00:00 | ||
Handling Data in React vs Redux | |||
Login Form in a Redux World | 00:00:00 | ||
Rebuilding the Login Form | 00:00:00 | ||
Handling Form Updates with Action Creators | 00:00:00 | ||
Wiring up Action Creators | 00:00:00 | ||
Typed Actions | 00:00:00 | ||
Don't Mutate that State | |||
Immutable State | 00:00:00 | ||
Creating Immutable State | 00:00:00 | ||
More on Creating Immutable State | 00:00:00 | ||
Synchronous vs Asynchronous Action Creators | 00:00:00 | ||
Introduction to Redux Thunk | 00:00:00 | ||
Redux Thunk in Practice | 00:00:00 | ||
Redux Thunk in Practice Continued | 00:00:00 | ||
Making LoginUser More Robust | 00:00:00 | ||
Creating User Accounts | 00:00:00 | ||
Showing Error Messages | 00:00:00 | ||
A Firebase Gotcha | 00:00:00 | ||
Showing a Spinner on Loading | 00:00:00 | ||
Navigating Users Around | |||
Dealing with Navigation | 00:00:00 | ||
Navigation in the Router | 00:00:00 | ||
Addressing Styling Issues | 00:00:00 | ||
Displaying Multiple Scenes | 00:00:00 | ||
Navigating Between Routes | 00:00:00 | ||
Grouping Scenes with Buckets | 00:00:00 | ||
Navigation Bar Buttons | 00:00:00 | ||
Navigating to the Employee Creation Form | 00:00:00 | ||
Building the Employee Creation Form | 00:00:00 | ||
Employee Form Actions | 00:00:00 | ||
Handling Form Updates at the Reducer Level | 00:00:00 | ||
Dynamic Property Updates | 00:00:00 | ||
The Picker Component | 00:00:00 | ||
Pickers and Style Overrides | 00:00:00 | ||
Firebase as a Data Store | |||
Firebase JSON Schema | 00:00:00 | ||
Data Security in Firebase | 00:00:00 | ||
Creating Records with Firebase | 00:00:00 | ||
Default Form Values | 00:00:00 | ||
Successful Data Save to Firebase | 00:00:00 | ||
Resetting Form Properties | 00:00:00 | ||
Fetching Data from Firebase | 00:00:00 | ||
Storing Data by ID | 00:00:00 | ||
Dynamic DataSource Building | 00:00:00 | ||
Transforming Objects to Arrays | 00:00:00 | ||
List Building in Employee List | 00:00:00 | ||
Code Reuse - Edit vs Create | |||
Reusing the Employee Form | 00:00:00 | ||
Create vs Edit Forms | 00:00:00 | ||
Reusable Forms | 00:00:00 | ||
A Standalone Employee Edit Form | 00:00:00 | ||
Initializing Forms from State | 00:00:00 | ||
Updating Firebase Records | 00:00:00 | ||
Clearing Form Attributes | 00:00:00 | ||
Texting Employees | 00:00:00 | ||
Modals as a Reusable Component | 00:00:00 | ||
The Modal Component Continued | 00:00:00 | ||
Styling the Modal | 00:00:00 | ||
Employee Delete Action Creator | 00:00:00 | ||
Wiring up Employee Delete | 00:00:00 | ||
Bonus! | |||
Bonus? Bonus! | 00:00:00 |
3 STUDENTS ENROLLED