Duration: Hours

React Native is an open-source JavaScript framework, designed for building apps on multiple platforms like iOS, Android, and also web applications, utilizing the very same code base. It is based on React, and it brings all its glory to mobile app development.

Training Mode: Online

Enquiry

    Category:

    Description

    Dive Right In

    1. Introduction – Course Roadmap
    2. Roadmap to the First App
    3. Official Course Github Repo

    Got OSX? Go Here

    1. OSX Installation
    2. More on OSX Installation
    3. Running in the Simulator

    Got Windows? Go Here

    1. Windows Setup of React Native
    2. Android Studio and React Native CLI Installation
    3. Emulator Creation and System Variables

    Optional ESLint Setup

    1. ESLint Setup and Overview
    2. ESLint Setup with Atom
    3. ESLint Setup with Sublime Text 3
    4. ESLint Setup with VSCode

    Onwards 

    1. Project Directory Walkthrough
    2. Getting Content on the Screen
    3. React vs React Native
    4. Creating a Component with JSX
    5. Registering a Component
    6. Destructuring Imports
    7. Application Outline
    8. The Header Component
    9. Consuming File Exports

    Making Great Looking Apps

    1. Styling with React Native
    2. More on Styling Components
    3. Introduction to Flexbox
    4. Header Styling
    5. Making the Header Reusable

    HTT

    1. P Requests with React Native
    2. Sourcing Album Data
    3. List Component Boilerplate
    4. Class-Based Components
    5. Lifecycle Methods
    6. Quick Note On Axios
    7. Network Requests
    8. Component Level State
    9. More on Component Level State
    10. Rendering a List of Components
    11. Displaying Individual Albums
    12. Fantastic Reusable Components – The Card
    13. Styling a Card
    14. Passing Components as Props
    15. Dividing Cards into Sections

    Handling Component Layout

    1. Mastering Layout with Flexbox
    2. The positioning of Elements on Mobile
    3. More on Styling
    4. Images with React Native
    5. Displaying Album Artwork
    6. Making Content Scrollable
    7. Handling User Input with Buttons
    8. Styling of Buttons with UX
    9. Considerations
    10. Responding to User Input
    11. Linking Between Mobile Apps
    12. Setting Button Text by Props
    13. App Wrapup

    Authentication with firebase

    1. Auth App Introduction
    2. A Common Root Component
    3. Copying Reusable Components
    4. What is Firebase?
    5. Firebase Client Setup
    6. Login Form Scaffolding
    7. Handling User Inputs
    8. More on Handling User Inputs
    9. How to Create Controlled Components
    10. Making Text Inputs From Scratch
    11. A Focus on Passing Props
    12. Making the Input Pretty
    13. Wrapping up Inputs
    14. Password Inputs

    Processing Authentication Credentials

    1. Logging a User In
    2. Error Handling
    3. More on Authentication Flow
    4. Creating an Activity Spinner
    5. Conditional Rendering of JSX
    6. Clearing the Form Spinner
    7. Handling Authentication Events
    8. More on Conditional Rendering
    9. Logging a User Out and Wrapup

    Digging Deeper with Redux

    1. App Mockup and Approach
    2. The Basics of Redux
    3. More on Redux
    4. Redux is Hard
    5. Application Boilerplate
    6. More on Redux Boilerplate

    Back to React

    1. Rendering the Header
    2. Reducer and State Design
    3. Library List of Data
    4. JSON CopyPaste
    5. The Connect Function
    6. MapStateToProps with Connect
    7. A Quick Review and Breather

    Rendering Lists the Right Way

    1. The Theory of ListView
    2. ListView in Practice
    3. Rendering a Single Row
    4. Styling the List
    5. Creating the Selection Reducer
    6. Introducing Action Creators
    7. Calling Action Creators
    8. Adding a Touchable
    9. Rules of Reducers
    10. Expanding a Row
    11. Moving Logic Out of Components
    12. Animations
    13. Wrapup

    Not Done Yet.

    1. Overview of Our Next App
    2. App Challenges
    3. Just a Touch More Setup
    4. More on Boilerplate Setup

    Handling Data in React vs Redux

    1. Login Form in a Redux World
    2. Rebuilding the Login Form
    3. Handling Form Updates with Action Creators
    4. Wiring up Action Creators
    5. Typed Actions

    Don’t Mutate that State

    1. Immutable State
    2. Creating Immutable State
    3. Core on Creating Immutable State
    4. Synchronous vs Asynchronous Action Creators
    5. Introduction to Redux Thunk
    6. Redux Thunk in Practice
    7. Redux Thunk in Practice Continued
    8. Making LoginUser More Robust
    9. Creating User Accounts
    10. Showing Error Messages
    11. A Firebase Gotcha
    12. Showing a Spinner on Loading

    Navigating Users Around

    1. Dealing with Navigation
    2. Navigation in the Router
    3. Addressing Styling Issues
    4. Displaying Multiple Scenes
    5. Navigating Between Routes
    6. Grouping Scenes with Buckets
    7. Navigation Bar Buttons
    8. Navigating to the Employee Creation Form
    9. Building the Employee Creation Form
    10. Employee Form Actions
    11. Handling Form Updates at the Reducer Level
    12. Dynamic Property Updates
    13. The Picker Component
    14. Pickers and Style Overrides

    Firebase as a Data Store 

    1. Firebase JSON Schema
    2. Data Security in Firebase
    3. Creating Records with Firebase
    4. Default Form Values
    5. Successful Data Save to Firebase
    6. Resetting Form Properties
    7. Fetching Data from Firebase
    8. Storing Data by ID
    9. Dynamic DataSource Building
    10. Transforming Objects to Arrays
    11. List Building in Employee List

    Code Reuse – Edit vs Create

    1. Reusing the Employee Form
    2. Create vs Edit Forms
    3. Reusable Forms
    4. A Standalone Employee Edit Form
    5. Initializing Forms from State
    6. Updating Firebase Records
    7. Clearing Form Attributes
    8. Texting Employees
    9. Modals as a Reusable Component
    10. The Modal Component Continued
    11. Styling the Modal
    12. Employee Delete Action Creator
    13. Wiring up Employee Delete

     

    For more inputs on React you can connect here.
    Contact the L&D Specialist at Locus IT.

    Reviews

    There are no reviews yet.

    Be the first to review “React Native”

    Your email address will not be published.