Course 489:
Building Web Applications with ReactJS

(3 days)

 

Course Description

This course shows how to use Facebook’s ReactJS framework to build fast, modern, scalable single page web applications (SPAs). It covers the principles of SPA development, and then takes the students through the process of building a ReactJS user interface. The course introduces JSX, the pseudo-HTML used in building ReactJS components, and moves on to create composite components and controller views using props and state. The students will build and validate Web forms and use Facebook’s unidirectional design pattern Flux, combining stores and actions to communicate with Web services and manage state. By the end of the class, students will have walked through the process of building a Single Page Application (SPA) with ReactJS and be ready to apply that knowledge to applications they need to build at work.

Learning Objectives

  • Creating components using JSX
  • Building composite components
  • Props, state, and controller views
  • Working with controlled forms
  • Routing with react-router
  • Unit Testing ReactJS components
  • Implementing the Flux design pattern
  • Leveraging stores and actions

Who Should Attend

This course is designed for JavaScript developers who are looking to build Single Page Applications using ReactJS.

Prerequisites

Attendees must be comfortable working with JavaScript to take this class. A minimum of six months of hands-on JavaScript experience is recommended to get the most out of the course. Knowledge of ES6 is helpful but not essential.


Course Outline

Chapter 1: Getting Started witth ReactJS

  • What Are Single Page Applications?
  • Introducing React
  • ReactJS vs. Other Frameworks
  • Introducing JSX
  • React Components

Chapter 2: ReactJS Components

  • Passing Data with Props and State
  • Create ECMA2015 Modules
  • Repeating Elements and Unique Keys
  • Working with Controller Views
  • Transpile and Bundle React Components
  • Understanding the Component Lifecycle

Chapter 3: Unit Testing with Jest

  • Principles of Unit Testing
  • Testing ReactJS using Facebook’s Jest Framework
  • Using the test-utils Add-on

Chapter 4: Introducing Flux

  • Working with Unidirectional Data Flow
  • Understanding Actions, Action Types, and the Dispatcher
  • Implementing Stores and Actions

 Chapter 5: React and REST

  • Introduce REST
  • Integrate the isomorphic-rest Module
  • Make GET Requests to Retrieve Data
  • POST Data to the Server for Updates

Chapter 6: Routing

  • Explore the react-router Module
  • Adding Routes to the Application
  • Creating Parameterized Routes
  • Programmatic Navigation

Chapter 7: Alternatives and Add-ons

  • Options for Extending React
  • Alternative Tools and Design Patterns
  • Using Add-ons and Third-party Tools
  • Building a Wrapper Component
  • The ref Attribute and DOM Access

Please Contact Your ROI Representative to Discuss Course Tailoring!