Introduction to React.js

Name: Introduction to React.js
Rating: 4.6 (112 reviews)

An introductory guide to help you understand the core concepts that underpin the React.js JavaScript framework

Created byRob Tweed

Last updated 2/2016

English

English [Auto],

What you'll learn

understand the core concepts behind React.js
begin to develop simple React.js applications
have the confidence to move on to more advanced React.js courses

Course content

3 sections • 12 lectures • 1h 14m total length

Introduction2:42
Explore the basics of React.js in this hands-on introduction, learning key concepts, project structure, and simple app building to understand why React.js is a popular browser-based JavaScript framework.
Overview of React's Core Concepts3:02
This lecture summarises the background to React.js and outlines its 4 underlying core concepts
React's Core Concepts in Detail13:31
This lecture explains the main core concepts that underpin React.js, showing how they are used to create and control the behaviour of a browser-based JavaScript application

Step 1: Getting Started5:56
In this lecture we'll get a simple "Hello World" application up and running. We'll examine all the pieces needed to get started developing with React.js
Step 2: Defining a Component4:35
In this lecture we'll see how to define a React.js component.
Step 3: Creating a Simple Hierarchy of Components4:14
In this lecture, we'll begin to create a simple hierarchy of components
Step 4: Using Props4:47
In this lecture, we'll examine how props are used to control the behaviour of components
Step 5: Passing a Handler Function as a Prop4:11
In this lecture, we'll extend the application by invoking a function in the parent component via a button click handler in a child component.
Step 6: Using State Variables9:04
In this lecture, we'll complete our simple application by introducing and applying a state variable.
Step 7: Modularising the Application9:07
In this lecture, we'll examine the techniques and options available for breaking down our application into separate standalone modules.
Step 8: Installing and Using Browserify7:51
In this final practical lesson, we'll install Browserify and its associated modules, and run it to create a bundled JavaScript file that will invoke our modularised React.js application in a browser.

Requirements

You should be familiar with HTML, CSS and JavaScript
You should have available a development system that includes a working Web Server
Familiarity with Node.js will also be an advantage

Description

This course provides a beginner's introduction to the powerful and ever-more popular React.js JavaScript framework. It has been designed for anyone who is already familiar with HTML and JavaScript, and perhaps already using another JavaScript framework, but wanting to understand the basics of React.js. React.js is quite a significant departure from most other JavaScript frameworks and it can be tricky to "get it". Key to "getting" React.js is understanding its key underlying concepts, so that's what this short course will focus on, through a mixture of diagrams and the creation of a simple working application.

Who this course is for:

This course is designed for anyone who wants to get a basic understanding of the React.js JavaScript framework
It is not designed for people who already understand the underlying concepts of React.js
It is also not designed for anyone wanting to learn advanced React.js development techniques

Introduction to React.js

What you'll learn

Explore related topics

Course content