This training will help you take your first steps in React web application development. You’ll learn about the tools you need to create and build React apps and then see how to create user interface components using various techniques. You’ll also learn how to aggregate components to create composite web pages and how to manage state as the user moves from one component to another.
Andy Olsen, experienced trainer and author, provides labs so you can follow along and get the experience you need. Andy will provide full source code and solutions on GitHub, plus bonus materials you can take away for additional exploration and added value.
What you'll learn-and how you can apply it
- React architectural concepts
- Creating components
- Using JSX
- Creating modular applications
- Managing properties and state
- Using component techniques
This training course is for you because...
- You’re a front-end developer and you want to start using React to create lean and mean web applications
- You have experience with another front-end frameworks such as Angular or Vue.js, and you want to learn how React is different
Prerequisites
- Familiarity with ECMAScript 6 or above
- Experience with HTML and CSS
Course Set-up
- Node.js, downloadable from https://nodejs.org/en/
Recommended Preparation
- (Live Training) Modern JavaScript Development by Andy Olsen (search the O'Reilly Learning Platform for upcoming dates)
- (Video) Modern JavaScript for the Impatient: https://learning.oreilly.com/videos/modern-javascript-for/9780135812778
Recommended Follow-up
- (Live Training) Full-Stack React: Build and Publish a Modern Web Application by Shaun Wassell (search the O'Reilly Learning Platform for upcoming dates)
- (Video) Fundamentals, 3rd Edition: https://learning.oreilly.com/videos/reactjs-fundamentals-3rd/9780136612117
About your instructor
-
Andy is a freelance consultant, instructor, and developer with more than 30 years of experience in IT. Andy began his professional career as a C/C++ developer and morphed into Java, C#, and other languages as the years and decades passed by. Andy is actively involved in a wide range of technologies including full stack development, cloud native applications, data science, and more. Andy is passionate about technology education and runs training courses around the world across diverse market sectors.
Schedule
The timeframes are only estimates and may vary according to how the class is progressing
Segment 1: Getting Started with React Length (10 min)
- What is React?
- Characteristics of React
- Tooling up
- React and ECMAScript 6++
Segment 2: Creating a React Web Application Length (50 min)
- Creating a simple React application
- Creating multiple React elements
- Creating multiple React elements from data
- Creating React elements using ReactDOMFactories
- Example: Creating a React baseline web application
Break Length (5min)
Segment 3: Creating Components Length (45 min)
- Overview of React components
- Creating components using inheritance
- Creating functional stateless components
- Creating components using factories
- Example: Adding components to the web application
Break Length (5 min)
Segment 4: Creating Elements using JSX Length (30 min)
- Overview of JSX
- Understanding JSX syntax
- Example: Using JSX in the web application
Segment 5: Creating Modular Applications Length (30 min)
- The need for modularity
- Understanding Webpack
- Example: Creating an application using Webpack
Break Length (5 min)
Segment 6: Properties and State Length (30 min)
- Specifying types for properties
- Working with ES6 classes
- Working with stateless functional components
- Example: Application with properties and state
Segment 7: Component Techniques Length (30 min)
- Component lifecycle methods
- Effect hooks
- Memoization
- Example: Applying component techniques effectively
Course wrap-up and next steps