A brief snapshot of React and Redux functional web development: Chapter 1. Welcome to React
To begin, I will introduce myself, my name is Edward , I am Full Stack Web Developer. The main directions of Laravel & React.js, Vue.js. I study GoLang and Swift.
Although there are already many other sources of information, the books remain one of the most common, but there is a lot of water in them and I decided not to invent another crutch, but just take notes.
To structure the data information will be presented in the form of a series of articles divided into chapters .
I write these notes for myself and decided to share them with the world. So don't be harsh. And so, let's go!
Chapter 1. Welcome to React
React is a popular library used to create user interfaces . It was created in Facebook to solve a number of problems associated with large-scale sites.
React as a library
It is worth noting that the library is not large in size and is used for only one part of the entire work. The main decisions about which ecosystem tools to use are made by developers. React is only “V” in the MVC world .
New ECMAScript syntax
React uses ECMAScript new features . If you are not familiar with the latest specification, then viewing the React code may cause self-doubt.
Before you start working with React, I recommend that you familiarize yourself with the basics of the functional programming paradigm.
To work with React you need to master the basics of Webpack . Webpack will allow testing the code, breaking it into modules, compressing it for production, etc.
Future React Library
The next version of the library will include Fiber, a new implementation of the basic React algorithm, the aim of which is to increase the speed at which an image is displayed on the screen . Many changes are related to target devices. Do not forget that React is still used in React Native.
Work with files
React Developer Tools
There are several tools that can be installed as extensions or additional modules of the browser and are of particular interest to us:
react-detector - Chrome browser extension, allows you to find out which sites are using React .
show-me-the-react is another React detection tool .
React Developer Tools is an add- on that extends the functionality of the browser toolkit . He creates a new tab in the developer’s tools where he can view React elements in detail .
React Developer Tools is a great tool that saves a lot of time when debugging. If you want to write professionally using React, this module will be very useful for you.
Installation details can be found on the official Node.js website .
To use React, Node is not needed. But when working with React to install the dependencies will need to use the package manager called NPM. It is installed automatically with Node.
To check whether Node is installed in the terminal type
node -v. You should see a version of your Node.
$ node -v v.10.13.0
An additional alternative to NPM is Yarn . This tool was released by Facebook in collaboration with Exponent, Google & Tilde. It helps to more reliably manage application dependencies . When working with Yarn, you can see that it is faster than NPM.
Install Yarn is very easy. After installing Node, enter:
$ npm install -g yarn
Installation details can be found on the official Yarn website .
And after that, everything will be ready to install packages. When installing dependencies from packege.json,
npm installyou can run the command instead
Adding a package with Yarn:
$ yarn add [имя_пакета]
Removing a package with Yarn:
$ yarn remove [имя_пакета]