React Native Training

Our React Native training course will give you an intensive hands-on introduction to developing cross-platform mobile applications. The React Native framework is an ideal way for Web / JavaScript developers…

Created by

Stalwart Learning


Date & Time



3 Days



Course Description

Overview of React Native

Our React Native training course will give you an intensive hands-on introduction to developing cross-platform mobile applications.

The React Native framework is an ideal way for Web / JavaScript developers to get into developing mobile applications for iOS and Android devices, as well as reusing code for / from web apps too.


3 Days

Prerequisite for React Native

Participants must be experienced JavaScript developers with a fair advanced understanding of JavaScript, including prototypes and functions as first-class citizens.

Course Outline for React Native

  • Getting Content on the Screen
  • React vs React Native
  • Creating a Component with JSX
  • Registering a Component
  • DE structuring Imports
  • Application Outline
  • The Header Component
  • Consuming File Exports
Styling Apps with React
  • Styling with React Native
  • More on Styling Components
  • Intro to FlexBox
  • Header Styling
  • Making the Header Reusable
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
Handling Component Layout
  • Mastering Layout with Flexbox
  • Positioning of Elements on Mobile
  • More on Styling
  • App Wrapup
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
  • Creating an Activity Spinner
  • Conditional Rendering of JSX
  • Clearing the Form Spinner
  • Logging a User Out and Wrapup
Digging Deeper with Redux
  • App Mockup and Approach
  • The Basics of Redux
  • More on Redux
  • More on Redux Boilerplate
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
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
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
  • Making LoginUser More Robust
  • Creating User Accounts
  • Showing Error Messages
  • A Firebase Gotcha
  • Showing a Spinner on Loading
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
Firebase as a Data Store
  • Firebase JSON Schema
  • Data Security in Firebase
  • Creating Records with Firebase
  • Default Form Values
  • Resetting Form Properties
  • Fetching Data from Firebase
  • Dynamic DataSource Building
  • Transforming Objects to Arrays
  • List Building in List
Code Reuse – Edit vs Create
  • Reusing the Form
  • Create vs Edit Forms
  • A Standalone Edit Form
  • Initializing Forms from State
  • Updating Firebase Records
  • Clearing Form Attributes
Modals as a Reusable Component