House Of Skills> Computer Programming > Web Development
Front End Development with React JS
Developed by Facebook, React JS is one of the top frontend skill in the world right now. It has more than 200K stars on Github. Lets cover this skill here
What is React Js
- React Js is a JavaScript library used for building User Interface in web apps and mobile apps
- React can still integrate very well with technologies like Angular, enabling developers to use a combination of libraries.
- It is a client side UI library developed and maintained by Facebook. Currently Facebook uses React for many parts of its website.
- It helps in creating interactive rich web application with multiple reusable components.
- It is efficient in handling data and maintaining data flow in one direction which help creating high performing Apps.
- React creates Single page application and creates virtual domwhich makes the maintainablity easier than usual.
Why React JS is required?
High Performance and Optimization
React is very lightweight and easy to use, it gives high performance UI application, as data passed around is immutable. In application created on React, user has liberty to see what they want to see.
Virtual DOM
DOM is originally the tree representation of the various elememnts in an HTML page. In normal scenario, whenever DOM element changes, the browser recollect the position of that element and repaints them again, which is a costly process. React simplifies it by creating Virtual DOM.
RoadMap for Frontend Development
- HTML and CSS -Building Structure>
- BootStrap - Enhance the styling
- JavaScript -Enable Business logic
-
React Js - Develop your UI
You are here
Become Professional React JS Developer
React Masters
Download the EBook covering all the commands and notes regarding React Js
Test your Knowledge
Test your knowledge of React Js by solving the below free skill quizes. Get certified on reaching Advanced level.
Topics in React JS
- Introduction To React and Why it Required
- How to start with React App
- Components in React JS
- Functional Component
- Class Component
- JSX in React JS
- Props in React JS
- State in React JS
- setState and How it works
- De-Structuring of Props and State
- Fragments in React JS
- Event Handling in React JS
- Event Binding in React JS
- Props as a method
- Conditional Rendering in React JS
- HTTP request/Call to Backend, GET request using AXIOS
- List Rendering in React JS
- Form Handling in React JS
- Component Lifecycle Method
- Component Mounting in Life cycle method
- Component Updating Life Cycle Method
- Routing in React JS
- Styling in React JS using Material UI