Workshops

  1. Home
  2. Workshops

The React Academy One Day Workshop is $299.99 if bundled with a conference registration, or $399.99 standalone. More information on registration can be found on our registration page (Click here for the Registration page).

React Academy One Day Workshop

Facilitator: Eric Cote

Date: Monday, October 15th 2018

Time: 8:00 AM - 5:00 PM

Location: DoubleTree by Hilton

Food: Breakfast & Lunch Included

FAQ

What is React?

React is used on thousands of web sites (Facebook, Netflix, Instagram, NY Times) and mobile apps (Skype, Uber, Tesla). It is a JavaScript library originally built by Facebook. It allows developers to create large web apps using data that can change without reloading the page. It provides speed, simplicity, and scalability.

Who is the Workshop For?

You should have experience in building web applications with HTML5 and JavaScript. No previous experience with React library is required.

What Equipment is Required?

Bring your laptop! An important part of the training is dedicated to building apps together and testing things in real time (bootcamp style). You can use Windows, Mac, or Linux as operating systems for the workshop.

What do I need to have installed?

Please ensure you have the below configured prior to the workshop:

  • Permission to modify your laptop's wi-fi settings.
  • Have local admin rights on your laptop. This is to install and update programming tools and configure the firewall for React Native.
  • Have multiple browsers installed for testing (Chrome, Firefox, Edge, Opera, etc.)
  • Have a code editor installed. The trainer will be using Visual Studio Code (which is free) but feel free to use Atom, WebStorm, Sublime, PHPStorm, etc. if you're more comfortable in those.
  • Have Node.js version 8.12 or greater installed. Download Node.js
  • Once Node.js is installed, update NPM (a javascript package manager) to teh latest version. You can use your system command line tool (bash, powershell, cmd,etc.) and type> npm update -g npm
  • Install and update create-react-app. To install:
    • To install, enter > npm install -g create-react-app in your command line tool.
    • To update, enter > npm update -g create-react-app in your command line tool.
  • Create your first React app! On the command line, move to a folder that will store your web projects for the workshop (in the sample below we call the directory Demos)
    • Navigate to the folder: > cd \Demos
    • Create a test app: > create-react-app test-app
    • Move to the new fodler: > cd test-app
    • Start the web service and other dependencies (Webpack, Babel, etc.): > npm start
    • If your browser doesn't open, open one and navigate to http://localhost:3000/. Once you see the webpage you've completed the setup!

If you run into any issues setting up your environment or have questions please don't hesitate to contact us: darcy@prairiedevcon.com

Workshop Outline

Introduction to React

  • What is React? (previously known as ReactJS)
  • Specs and pros
  • Installation
  • React Hello World

JSX and Rendering

  • React API
  • SX Language
  • Virtual DOM and Reconciliation

Components

  • Component types (Functional, Class)
  • Property components (React Props)
  • State Components (React State)

Routing

  • History
  • Paths
  • Links

Lifecycle

  • Creation and Destruction of Components
  • Lifecyle hooks (componentDidMount(), componentWillUnmount())
  • How to use SetState()

Forms

  • Controlled components
  • Uncontrolled components
  • Refs
  • Validation