Improve your front-end development skills by learning one of the most popular front-end frameworks, React, using ES6 in this hands-on course. This course is for you if you want to take the next step in your front-end development journey.

In this course, you will build rich front-end applications with React and ES6 JavaScript specifications. You will learn JSX, a JavaScript extension that allows you to write HTML-like code embedded into your JavaScript code, easily allowing you to create React elements. You create these elements with React components and learn how to manipulate the components using the props (properties) and event handling. Then, you explore ways to pass data and states between components by understanding the lifecycle.

You will investigate advanced topics like “hooks,” allowing you to write readable, testable, and maintainable code more efficiently. You round out this class learning about the “Redux” library, which helps you write applications in different environments, allowing you to build complex, interactive React applications more easily.

Throughout the course, you will build your portfolio by completing numerous hands-on labs to gain practical experience. At the end of the course, you pull together what you’ve learned with a final project by building a budgeting allocation application.

This course will help you succeed as a front-end or full-stack developer. It suits those in IT looking to step up in their careers or new graduates seeking to establish their client-side skills. To be successful in this course, you will need basic HTML, CSS, JavaScript, and Git skills.

What You'll Learn

Write interactive applications using the React web framework.
Build React elements using JSX and React components.
Communicate and exchange data with external services using GET, POST, UPDATE, and DELETE requests.
Use props, states, and hooks to pass data and manipulate the states of React components.

Prerequisites

Basic knowledge of HTML, CSS, JavaScript, and Git

Course Syllabus

Module 1: Building Rich Front-End Applications with React and ES6

Introduction to Front-End Frameworks and React
Insiders Viewpoints: Front-end Frameworks
Introduction to ES6
Introduction to JSX
Hands-on Lab: Hello World with React
Introduction to Components
React Components - Props and Event Handling

Module 2: React Components

Introduction to States
Passing data and states between components
Components Lifecycle
Testing React Components
Hands-on Lab: React Todo List Application

Module 3: Advanced React

Hooks
Implementing Forms
Introduction to Redux
Essential Concepts of Redux
Async with Redux
Binding Redux and Flow
Hands-on Lab: React Redux

Module 4: Final Project

Hands-on Lab: Budget Allocation Application
Optional Sample Project: The Shopping Application
Final Project: Budgeting Allocation Application

React for Front-End Development

Language

Topic

Industries

Skills You Will Learn

Offered By

Estimated Effort

Platform

Last Update