If you are looking for resources and tutorials to learn or get better on ReactJS, this article it is for you.
ReactJS is actually the JavaScript framework which grown up the much faster. It is used for the user interfaces in highly used services like Facebook, Instagram and many others.
The power of ReactJS comes from its ability to generate complexe and interactive user interfaces with a high level of performance thanks to the Virtual DOM technology.
Lot of developers around the world start to use ReactJS to develop complex applications and web sites. The web is plenty of articles and tutorials on the subject, and we decided to pick twenty of them which specially caught our attentions.
Good reading !
01 – Build a React.js Application with User Authentication
Learn how to build a React app with User Authentication
This post will show you how to build a React application from scratch, using the Stormpath React SDK to add features that allow people to sign up, login, and even view their own user profile.
You can find the tutorial at – http://tutlinks.com/out/tutorial-build-a-react-js-application-with-user-authentication/
02 – Creating a Simple Application Using React JS and Flux Architecture
This React.js tutorial will teach you how to create a simple todo application using React JS and the Flux architecture.
React JS is making some waves in the community recently due to its alleged performance increases over other heavy favourites (like Angular JS), especially when it comes to writing out lists.
You can find the tutorial at – http://tutlinks.com/out/react-tutorial-creating-a-simple-application-using-react-js-and-flux-architecture/
03 – Introduction to ReactJS JavaScript Framework
This is the ReactJS tutorial for beginners to understand the basics and fundamentals of ReactJS. Tutorial is written by app developer Aurelio De Rosa on Telerik.com. In this tutorial Aurelio talks about React fundamentals like virtual DOM, server side rendering, data binding, react components, props and state, JSX syntax and finally describes how to build a hello world application using ReactJS.
You can find the tutorial at – developer.telerik.com.
04 – ToDo Application Using React and Flux Architecture
This tutorial is for intermediate level users who are already familiar with the basics of ReactJS. In this tutorial Chris Harrington builds a simple todo application using ReactJS and Flux architecture. The tutorial covers two key aspects of application development i.e. user interface rendering and data access. You will learn how multiple views are rendered using ReactJS and how data access is accomplished using Flux Architecture with help of mocked out server API.
You can find the tutorial at – codementor.io.
05 – React Apps Using Flux and Backbone
This tutorial is written by Alex Rattray on toptal.com and is not for the weak hearted. In this tutorial, Alex talks about most powerful concepts and patterns for building ReactJS apps using Flux and backbone.
Backbone library is used to fill in the gaps of flux architecture, you can grasp quickly if you have already tried your hands building ReactJS apps with Flux.
You can find the tutorial at – toptal.com.
06 – 5 Practical Examples for Learning React
This tutorial is for you if you are the one who believes to fiddle around with the code and examples to learn rather than getting into too much of theory.
This ReactJS tutorial is written by Martin Angelov on tutorialzine.com and demonstrates five JSFiddle code examples – Timer, Navigation Menu, Real Time Search, Order Form and Image App with Ajax.
You can find the tutorial at – tutorialzine.com.
07 – Getting Started with ReactJS and Concepts
This is another good beginners tutorial to get quickly on boarded with ReactJS development. This tutorial is written by Ken Wheeler on Scotch.io, very well organized, readable and gets off to the mark straight away. In this tutorial you will learn, what is React? How does the virtual DOM work? ReactJS Starter Kit, JSX, Components, Props, Specs, Lifecycle and State, Events and Unidirectional data flow.
You can find the tutorial at – scotch.io.
08 – Twitter Stream with Node and React.js
This tutorial is for advanced users and here you can learn to build end to end application that fetches and displays twitter stream using node and ReactJS. Tutorial is written by Ken wheeler and definitely is one of the best free ReactJS tutorials you will find on the web today.
Ken uses isomorphic JavaScript (you will learn) for building live twitter stream app. The other libraries and used in the tutorial are Express, Handlebars, Browserify, Mongoose, Socket.io and nTwitter.
You can find the tutorial at – scotch.io.
09 – ReactJS in Depth with Shape Editor Component Example
This tutorial is written by Pavan Podila at tutsPlus.com and is for intermediate level users. Pavan talks about each aspect of ReactJS in depth by taking code example of shape editor component.
This is one of the most comprehensive tutorials and definitely clarifies the some of the deep rooted fundamentals of development using ReactJS.
You can find the tutorial at – code.tutsplus.com.
10 – ReactJS Tutorial and Guide to the Gotchas
In this tutorial Justin deal from Zapier.com attempts to clarify some of the confusing aspects and gotchas of ReactJS development. I would categorize this tutorial into the one that turns beginners into advanced developers. A must read for every ReactJS developer.
You can find the tutorial at – zapier.com.
11 – Employee Directory with ReactJS and Cordova
The best way to learn any new framework is by building an application. Christophe Coenraets has written a step by step tutorial to build Employees directory mobile application with ReactJS and runs it in Cordova.
Christophe starts this tutorial by building static version of the Employee directory app, incorporates data flow and inverse data flow, implements async service, codes for state maintenance, routing, styling and finally runs the application in Cordova.
This tutorial is good for you if you already have your concepts clarified and need some hands on coding to see how everything works in ReactJS.
You can find the tutorial at – coenraets.org.
12 – Create High Performance, Maintainable Components with ReactJS
Another must read article to understand the workings of a ReactJS application at architectural level. This one is from IBM developer works, written by Sing Li and focuses mostly on the concept of react components architecture, how to build custom components, and usage of third party ReactJS component libraries.
Li also touches upon Flux architecture, workings of JSX and gives a brief introduction of Relay and React Native, the future state ecosystem of ReactJS.
You can find the tutorial at – ibm.com/developerworks.
13 – Cabin – React & Redux Example App – Introduction – The Stream Blog
This is the 1st post for Cabin, the React & Redux Example App Tutorial series created by Stream. The final result of following this series is your own feature-rich, scalable social network app built with React and Redux!
You can find the tutorial at – http://tutlinks.com/out/cabin-%E2%80%93-react-redux-example-app-%E2%80%93-introduction-%E2%80%93-the-stream-blog/
14 – Cabin – React & Redux Example App – React – The Stream Blog
This is the 2nd post for Cabin, the React & Redux Example App Tutorial series created by Stream. The final result of following this series is your own feature-rich, scalable social network app built with React and Redux!
You can find the tutorial at – http://tutlinks.com/out/cabin-%E2%80%93-react-redux-example-app-%E2%80%93-react-%E2%80%93-the-stream-blog/
15 – Cabin – React & Redux Example App – Redux – The Stream Blog
This is the 3rd post for Cabin, the React & Redux Example App Tutorial series created by Stream. The final result of following this series is your own feature-rich, scalable social network app built with React and Redux!
You can find the tutorial at – http://tutlinks.com/out/cabin-%E2%80%93-react-redux-example-app-%E2%80%93-redux-%E2%80%93-the-stream-blog/
16 – React Native Tutorial: Building Apps with JavaScript – Tom Elliott
In this React Native Tutorial you’ll learn about a framework for building native iOS and Android applications from Facebook, based on the same principals behind their hugely popular React Javascript Framework for building declarative user interfaces.
You can find the tutorial at – http://tutlinks.com/out/react-native-tutorial-building-apps-with-javascript-tom-elliott/
17 – A Detailed Look at React Native for JavaScript Developers
This webinar provides detailed examples of React Native components that introduce a new way to write native mobile apps.
- Topics Covered:
- What is React Native
- How it is an extension of hybrid
- How to use polyfills to leverage the best of the web while getting native performance
- How to debug React Native apps
- How to use Flexbox and CSS for styling a React Native app
You can find the tutorial at – http://tutlinks.com/out/tutorial-a-detailed-look-at-react-native-for-javascript-developers/
18 – React.js Best Practices for 2016 | @RisingStack
Best practices for React.js based on our experience: how you should write a React.js application and recommended libraries for 2016.
2015 was the year of React with tons of new releases and developer conferences dedicated to the topic all over the world. For a detailed list of the most important milestones of last year, check out our React in 2015 wrap up.
The most interesting question for 2016: How should we write an application and what are the recommended libraries?
You can find the tutorial at – http://tutlinks.com/out/react-js-best-practices-for-2016-%7C-risingstack/
19 – The React.js Way: Flux Architecture with Immutable.js
How to write blazing fast component based React.js apps with Flux architecture, Immutable.js, and ES6.
This article is the second part of the “The React.js Way” blog series. If you are not familiar with the basics, I strongly recommend you to read the first article: The React.js Way: Getting Started Tutorial. http://www.tutlinks.com/out/getting-started-with-the-react-js-tutorial/
You can find the tutorial at – http://tutlinks.com/out/the-react-js-way-flux-architecture-with-immutable-js/
20 – Getting Started with the React.js Tutorial
This tutorial helps to jump in React.js with ES6 for newcomers and cover the basics like: components, virtual DOM, JSX, testing, Webpack and Babel.
In this two-part blog series React.js tutorial I am going to explain these concepts and give a recommendation on what to use and how. We will cover ideas and technologies like:
- ES6 React
- virtual DOM
- Component-driven development
- Immutability
- Top-down rendering
- Rendering path and optimization
- Common tools/libs for bundling, ES6, request making, debugging, routing, etc.
- Isomorphic React
You can find the tutorial at – http://tutlinks.com/out/getting-started-with-the-react-js-tutorial/
Sébastien, @js-republic
More articles about Resources and tutorials :
- REACT : http://blog.js-republic.com/20-resources-and-tutorials-about-reactjs-framework/ (? you are here)
- NODE : http://blog.js-republic.com/compilation-de-tutos-ressources-nodejs/
- GRAPHQL : http://blog.js-republic.com/compilation-ressources-graphql/
- METEOR : http://blog.js-republic.com/compilation-ressources-meteor/
- TYPESCRIPT : http://blog.js-republic.com/resources-range-about-typescript/
- REDUX : http://blog.js-republic.com/resources-range-about-redux/
- EmberJS : http://blog.js-republic.com/emberjs-resources-range/
- Angular : http://blog.js-republic.com/angular-resources-range/
