1.React: React is a JavaScript library user interfaces. It is used to build single page applications & allows to create UI components.
2.Create React App: If you have NPM and Node.js installed, you can create a React application by first installing the create-react-app.
Install create-react-app by running this command in your terminal:
1.npx create-react-app my-app
2.cd my-app
3.npm start
3.What You Should Already Know: Before starting with React.JS, you should have intermediate experience in:
1.HTML
2.CSS
3.JavaScript
4.Virtual DOM: React creates a VIRTUAL DOM in memory. React only changes what needs to be changed.
Understand how DOM is build:
5.React JSX: JSX stands for JavaScript XML. It allows us to write HTML in React & makes it easier to write HTML in React. Below is a JSX element.
const element = <h1>Hello World</h1>
6. Components and Props: Components mean similar in look and different in data. Sometimes you might get to code that have same style but different data. It quites gets annoying repeadly typing the same code over and over. React relieves you of this annoyance by introducing components. Component allow you to split UIs into independent reusable pieces and think about them in isolation .Components are just like JavaScript functions that provide inputs called props and show return React elements that describes what should appear on the screen.
7.React app performance optimization: Internally, React uses several clever techniques to minimize the number of costly DOM operations required to update the UI.
If your project is built with Create React App, run:
npm run build8.Handling Events: Handling events with react is similar to handling DOM events with some exceptions such as
1. React events are named using camelCase(eg: firstEvent) rather than lower case.
2. A function is passed as an event in React with JSX rather than a string.
9.Rendering Elements: Unlike browser DOM elements, React elements are very easy to create. React DOM takes care of updating the DOM to keep intact with react elements. Applications built with React have a single root DOM node.
10.Summary of React: React is a library for building user interfaces. It encourages the creation of reusable UI components, which present data that changes over time.
