- Trending Categories
- Data Structure
- Operating System
- C Programming
- Selected Reading
- UPSC IAS Exams Notes
- Developer's Best Practices
- Questions and Answers
- Effective Resume Writing
- HR Interview Questions
- Computer Glossary
- Who is Who
ReactJS Developer Tools
While building a React application, the most-used Chrome extension for debugging the React application or to solve the error is React Developer Tools which is a free-to-use and opensource chrome extension.
This extension is used to navigate through the nested component tree of the React Components. It takes a lookup into the stored state and the props values and also records the performance information.
Note: This extension also tells whether a page is using the technology stack of ReactJS or not.
How to install
Go to Chrome web store and install React Developer Tools.
When you tap on this extension, it will show if the webpage is using ReactJS or not.
To take a lookup of the component tree of a webpage, go to that webpage and Inspect the application or press Ctrl + Shift + I. It opens the Chrome DevTools and there you will find two tabs - Components and Profiler.
Components − It contains the tree structure of all the components used in the React application.
Profiler − It is used to record the performance information of the React application.
- Websites every Java developer should bookmark
- LocalStorage in ReactJS
- Optimizing ReactJS applications
- ReactJS – Fragments
- ReactJS componentDidCatch method
- RegEx in ReactJS
- Suspense in ReactJS
- Debugging ReactJS applications
- What are the best websites a developer should visit?
- Creating context for JNDI in SAP NetWeaver Developer Studio
- Lazy Loading in ReactJS
- ReactJS – Axios Interceptors
- ReactJS – bind() method
- ReactJS – componentDidMount Method
- ReactJS – componentDidUpdate() Method