Learn ReactJS with 20 Free Online Tutorials

by on

React.js is a Javascript library for building user interfaces which was developed by Facebook. It is known for its fast performance, it is one of the best choices for building mobile sites. The well-known applications build with React are Facebook and Instagram.

React, which is one of the most popular Javascript libraries and having strong React skills is a great way to get ahead with building modern web apps right now. It has a strong foundation and a large community behind it.

The following are the 20 free online tutorials available which could get you started with React.js.

React Logo

1) Official React.Js Tutorial

Official React.js tutorial

URL: facebook.github.io/react/docs/getting-started.html

The official tutorial will teach you how to build a real-time comment box with React.

  • Type: Intermediate
  • Pre-requisites: HTML, CSS, Javascript

2) Learning React.Js: Getting Started and Concepts

Learning React.js: Getting Started and Concepts

URL: scotch.io/tutorials/learning-react-getting-started-and-concepts

This is a tutorial series from scotch.io will first teach you the basic concepts of React.js to get started, teach you how to build a twitter stream with Node and React.js, introduce you to the Flux architecture, and finally finish off with walking you through how to create a simple shopping cart with React.js + Flux.

3) A Comprehensive Guide to Building Apps with React.Js

A Comprehensive Guide to Building Apps with React.js

URL: tylermcginnis.com/reactjs-tutorial-a-comprehensive-guide-to-building-apps-with-react/

An excellent tutorial when you want a better understanding of the concepts of React.js.

4) The React Quick Start Guide

The React Quick Start Guide

URL: codementor.io/reactjs/tutorial/the-reactjs-quick-start-guide

The post is from Jack Callister’s blog, who is the Co-organiser of Hack Pack and a full-stack developer. In this tutorial, he teaches to build a series of user interfaces, each adding a layer of functionality on the previous and will also build a photo stream similar to Instagram.

5) Build with React

Build with React

URL: buildwithreact.com/tutorial

An interactive guide to React.js with snippets to apply your code and run it.

6) The React.js Way: Getting Started Tutorial

The React.js Way: Getting Started Tutorial

URL: blog.risingstack.com/the-react-way-getting-started-tutorial/

This is a two-part blog series where it explains the concepts and gives a recommendation on what to use and how.

7) Building Robust Web Apps with React

Building robust web apps with React

URL: maketea.co.uk/2014/03/05/building-robust-web-apps-with-react-part-1.html

In this tutorial, Matt Hinchcliffe, explains React.js using an an applications which shows the departure boards of London underground using the TrackerNet API.

  • Type: Intermediate
  • Pre-requisites: HTML, CSS, Javascript
  • Related Articles:

8) Reactjs Tutorial from Tutorials Point

ReactJS Tutorial

URL: tutorialspoint.com/reactjs/

This is a complete beginner tutorial for React.js and explains each and everything related to it in the beginner style.

  • Type: Beginner
  • Pre-requisites: HTML, CSS, Javascript
  • Tutorial series

9) React.js Conf

React.js Conf

URL: youtube.com/playlist?list=PLb0IAmt7-GS1cbw4qonlQztYV1TAW0sCr

This contains the videos from the React.js conference held in 2015 and 2016, which will be helpful to know more about React.js.

  • Type: Intermediate
  • Pre-requisites: HTML, CSS, Javascript
  • Related videos:

10) React Js Video Tutorials

React JS Tutorials

URL: youtube.com/playlist?list=PLoYCgNOIyGABj2GQSlDRjgvXtqfDxKm5b

A series of video tutorials from LearnCode.academy.

  • Type: Intermediate
  • Pre-requisites: HTML, CSS, Javascript

11) React.Js Introduction for People Who Know Just Enough Jquery to Get By

React.js Introduction For People Who Know Just Enough jQuery To Get By

URL: reactfordesigners.com/labs/reactjs-introduction-for-people-who-know-just-enough-jquery-to-get-by/

This tutorial helps you build a tweet box, with the help of React and jQuery.

  • Type: Intermediate
  • Duration: 1-2 hours
  • Pre-requisites: HTML, CSS, Javascript, jQuery

12) React JS Tutorial for Beginners

React JS Tutorial for Beginners

URL: youtube.com/playlist?list=PL6gx4Cwl9DGBhLZx_5C-jqECBE4HIID_k

A series of video tutorials for complete beginners from the playlist of thenewBoston.

  • Type: Beginner
  • Prerequisites: HTML/CSS/JS

13) Comprehensive Beginner’s Guide To ReactJS

Comprehensive Beginner’s Guide To ReactJS

URL: antjanus.com/blog/web-development-tutorials/front-end-development/comprehensive-beginners-guide-to-reactjs/

A guide which goes through all the terms related to React.js and also compares with Angular.js.

  • Duration: 30 mins
  • Type: Beginner
  • Prerequisites: HTML/CSS/JS

14) Learn Webpack and React

Learn Webpack and React

URL: survivejs.com/react/introduction/

A book which comes in two parts which will help you go through the basics of React.

15) React.Js Program

React.js program

URL: reactjsprogram.com/

A project based, linear approach to learning React.js and the React.js ecosystem.

  • Type: Intermediate
  • Prerequisites: HTML/CSS/JS

16) Learn React

Learn React

URL: learnreact.com/lessons

Learn React.js from the set of video tutorials starting with using render and createElement.

  • Type: Intermediate
  • Prerequisites: HTML/CSS/JS

17) Learn React.js: The Basics

Learn React.js: The Basics

URL: lynda.com/React-js-tutorials/Learn-React-js-Basics/379264-2.html

This is a series of video tutorials with the transcript. You can login to start using their free trial to watch all the videos related to React.js.

  • Type: Intermediate
  • Prerequisites: HTML/CSS/JS

18) React Beginner Tutorial: Implementing the Board Game Go

React beginner tutorial: Implementing the board game Go

URL: cjlarose.com/2014/01/09/react-board-game-tutorial.html?utm_medium=referral&utm_source=zeef.com&utm_campaign=ZEEF

This is a beginner’s tutorial where you learn React by implementing the board game “Go”.

  • Type: Intermediate
  • Prerequisites: HTML/CSS/JS

19) Learn Raw React — No Jsx, No Flux, No Es6, No Webpack…

Learn Raw React — no JSX, no Flux, no ES6, no Webpack…]

URL: jamesknelson.com/learn-raw-react-no-jsx-flux-es6-webpack/

An exercise based tutorial to learn React step-by-step.

20) Beginner’s Guide to React.js, With Examples

Beginner’s Guide to React.js, With Examples

URL: html5hive.org/beginners-guide-to-react-js-with-examples/

A tutorial for beginners where they explain what React is and helps set up a basic interface.

Share the love

Learn ReactJS with these free beginner online courses

Posted by Icicle Technologies on Thursday, March 17, 2016

Published in web-development, tutorials | Tagged with reactjs, tutorials, web-development






Talk to us, that's always a good idea!