10 Things to Know about React.js
- It’s a Library: React.js isn’t a framework like Angular or Vue. It’s a library focused on User Interfaces. It’s basically based on components. Currently, React.js is the most popular library used in modern Front End Development.
- JSX: JSX means JavaScript XML. It is used to write HTML code in React.js syntax. It makes the thing easier to write HTML in React.js. You can just use curly braces to use JSX in React code.
3. It’s JavaScript: You can use JavaScript inside a react component easily. You can just declare the variable and go forward. Some other frameworks needed templating language to use JavaScript inside them. But React is completely different and easy to use in this case.
4. All in One Place: You can use everything in one place in React component. You can use CSS in an HTML tag, even you can use JavaScript at the same time. That makes React.js developer-friendly. Even if you want you can use them separately too. So, it’s really comfortable for everyone who loves to keep things together or separately.
5. Data Flows from Top to Bottom: In React component, data flows from top to bottom. That means it flows from parent to child component. And if you want to pass data from parent to child component then you’ve to use props. Props are considered as HTML attributes in JSX.
6. Using State: State is one of the most important things in dynamic data loading. And state makes the work easier for a developer. First, the state is used to keep the existing value of a variable and then it can be changed based on input. And to use state, we have to call the useState method. And that should have an initial value.
7. Rendering: Every state change needs rendering. When someone changes the state, it calls the render method and that changes in Virtual DOM to show it in the browser. And child components also need to re-render because their props changed in the parent component.
8. Use Linting: Using ESLint to code in React makes so many things developer-friendly. It makes words of different colors that can easily detect and troubleshoot. Linting makes code much cleaner.
9. Use Hooks: Using hooks is another masterpiece in react. Someone can easily use hooks and avoid using class. It makes coding easier and someone can make hooks by himself.
10. Conditional Rendering: Conditional rendering is one of the top-notch features of React. And the Ternary operator made it more easier. Sometimes we want to render one part of the markup conditionally and we use conditional rendering. The ternary operator is one of the most used conditional rendering systems nowadays. Ternary expressions are ?(if) :(else)
Happy Coding!!
