- The data source tag/idis missing or it is invalid
Course overview:
This course teaches developers to build web applications using React. You will start from scratch and learn why React is so popular. See why many large companies like Facebook, Airbnb, Netflix as well as many others use React. Next you will learn how to create a new React application from scratch as well as understand the different tools used. You will learn the JSX syntax extension of ECMAScript, as well as the virtual DOM it produces, used to write React applications. You will use popular 3rd party tools like Redux and React-Router to build solid Single Page Applications. And of-course you will learn best practices for developing React components.
Duration: 2 days
Learning objectives:
- Learn how to create professional applications using React, React-Router and Redux.
- Understand the tooling used when building a React application.
- Understand proper usage of React components and component composition.
- Build solid data entry forms using React.
- Understand the pros and cons of building single page applications.
Prerequisites:
Six months of web development using HTML, ECMAScript 2015 and CSS.
Note: Prior experience with React is not required.
A basic knowledge of using NPM packages is beneficial but not required.
A basic knowledge WebPack with Babel is also beneficial but not required.
Modules:
- React Introduction
React is a popular framework for creating browser-based user interfaces. In this module you will learn how to get started with React. We will start with the basics of creating a React application and using the JSX syntax often used with React. Next you will learn different ways we can transpile our JSX code. You will use ECMAScript 2015 capabilities in the process. We will also take a closer look at the different ways of creating React components and their pros and cons. You will learn the different ways of working with properties, state and events. You will also learn how to work with raw DOM elements in the browser. Finally, you will learn how to unit test your React components. After this module you will be able to start building React applications.
- Tooling for Building React Applications
It is possible to write React applications without any extra tooling. This isn’t common though. There is a rich ecosystem out there with tools to help you. With these developer tools you can write your application faster and more reliable. In this module you will learn how to configure an efficient tool chain for building React applications.
- Authoring components
Components are the main building blocks of React applications. In this module you will learn the essentials of creating good React components. We will look at the different ways of authoring components. You will learn about efficient state management inside of React component. How to pass data and functions between components using props. And how to use the component lifecycle functions to your advantage.
- Redux
Redux is the most popular state container for JavaScript applications. It is similar in architecture to Flux and serves the same purpose. These days Redux is the most popular Flux implementation. In this module you will learn how to build applications using Redux.
- Data Entry Forms
There are few applications that do not need the user to enter data of some sort into the system. When building React components, there are some choices on how to create data entry forms. In this module you will learn how to create data entry forms with React. You will learn how to validate data. Finally, you will display validation messages when appropriate. In this module you will learn how to create excellent data entry forms.
- Single Page Applications using React-Router
Single Page Applications (SPA) are popular these days and for a good reason. Often SPAs provide a much nicer experience for the end user. In this module you will learn how to get started with the React-Router library. Using this library, you will turn your React applications into a SPA. We will also take a look at the pros and cons of single page applications. You will learn how to achieve the best result by using the Single Page Module or mini SPA pattern. After this module you will be able to build React Single Page Applications.