With a focus on simplicity and readability, this course will have you building real time applications and dynamic website components in no time!
Are you a React beginner? This React tutorial will explain everything in simple terms and plain English so you don’t feel overwhelmed or frustrated while learning React.
Together, we will build “Catch of the Day” — a real-time app for a trendy seafood market where price and quantity available are variable and can change at a moment's notice. We will build a menu, an order form, and an inventory management area where authorized users can immediately update product details.
React is a UI library developed at Facebook to facilitate the creation of interactive, stateful & reusable UI components. It is used at Facebook in production, and Instagram.com is written entirely in React.
One of it's unique selling points is that not only does it perform on the client side, but it can also be rendered server side, and they can work together inter-operably.
It also uses a concept called the Virtual DOM that selectively renders subtrees of nodes based upon state changes. It does the least amount of DOM manipulation possible in order to keep your components up to date.
How to build an entire App or Website Component in React.js from start to finish.
Working with create-react-app for Webpack Tooling
Understanding React Components and writing markup with JSX
Maintain your Application's State
Communication between components
Working with State and HTML5 LocalStorage
Real time web socket data with Firebase
URL routing with React Router 4
Taking advantage of new ES6 Features
Deploying React Applications
+ So much more — Check below for a full listing of videos
Angular, Ember or Backbone developers looking to grok how React works
PHP & WordPress Developers - React tends to jive well with those who are used to PHP as it was built for Facebook
Developers looking to add interactive or real time pieces to existing websites
As the React guide says ‘Thinking in React’ may be a little different than you used to since it brings a new approach to the table, but it will become much easier and natural as you gain experience with it.
Learning React comes with a bonus: React Native. React is not a ‘write once run anywhere library’, as the creators says, it’s a ‘learn once write anywhere’ library. Yes, you can write native apps for Android and iOS using React Native. Although you will not be able to use the exact same code you wrote for web, you will be able to use the same methodology and the same architecture.
Imagine you had an object that you modeled around a person. It had every relevant property a person could possibly have, and mirrored the persons current state. This is basically what React does with the DOM.
Now think about if you took that object and made some changes. Added a mustache, some sweet biceps and Steve Buscemi eyes. In React-land, when we apply these changes, two things take place. First, React runs a "diffing" algorithm, which identifies what has changed. The second step is reconciliation, where it updates the DOM with the results of diff.
The way React works, rather than taking the real person and rebuilding them from the ground up, it would only change the face and the arms. This means that if you had text in an input and a render took place, as long as the input's parent node wasn't scheduled for reconciliation, the text would stay undisturbed.
Because React is using a fake DOM and not a real one, it also opens up a fun new possibility. We can render that fake DOM on the server, and boom, server side React views.
Join our newsletter and get news in your inbox every week! We hate spam too, so no worries about this.