What are the popular React-specific linters?

Posted by Prem Tiwari | Updated on | ReactJS interview


What are the popular React-specific linters? ESLint is a popular JavaScript linter. There are plugins available that analyse specific code styles. One of the most common for React is an npm package called eslint-plugin-react. By …

How to define constants in React?

Posted by Prem Tiwari | Updated on | ReactJS interview


How to define constants in React? You can use ES7 static field to define constant.

Why is a component constructor called only once?

Posted by Prem Tiwari | Updated on | ReactJS interview


Why is a component constructor called only once? React’s reconciliation algorithm assumes that without any information to the contrary, if a custom component appears in the same place on subsequent renders, it’s the same component …

How to import and export components using React and ES6?

Posted by Prem Tiwari | Updated on | ReactJS interview


How to import and export components using React and ES6? You should use default for exporting the components: With the export specifier, the MyProfile is going to be the member and exported to this module …

How do you apply vendor prefixes to inline styles in React?

Posted by Prem Tiwari | Updated on | ReactJS interview


How do you apply vendor prefixes to inline styles in React? React does not apply vendor prefixes automatically. You need to add vendor prefixes manually.

How to update a component every second?

Posted by Prem Tiwari | Updated on | ReactJS interview


How to update a component every second? You need to use setInterval() to trigger the change, but you also need to clear the timer when the component unmounts to prevent errors and memory leaks.

How to add Google Analytics for React Router?

Posted by Prem Tiwari | Updated on | ReactJS interview


How to add Google Analytics for React Router? Add a listener on the history object to record each page view:

How to avoid using relative path imports in create-react-app?

Posted by Prem Tiwari | Updated on | ReactJS interview


How to avoid using relative path imports in create-react-app? Create a file called .env in the project root and write the import path: After that restart the development server. Now you should be able to …

How to use https instead of http in create-react-app?

Posted by Prem Tiwari | Updated on | ReactJS interview


How to use https instead of http in create-react-app? You just need to use HTTPS=true configuration. You can edit your package.json scripts section: or just run set HTTPS=true && npm start

How can we find the version of React at runtime in the browser?

Posted by Prem Tiwari | Updated on | ReactJS interview


How can we find the version of React at runtime in the browser? You can use React.version to get the version.

How to focus an input element on page load?

Posted by Prem Tiwari | Updated on | ReactJS interview


How to focus an input element on page load? You can do it by creating ref for input element and using it in componentDidMount():

Why you can’t update props in React?

Posted by Prem Tiwari | Updated on | ReactJS interview


Why you can’t update props in React? The React philosophy is that props should be immutable and top-down. This means that a parent can send any prop values to a child, but the child can’t …

What is the recommended approach of removing an array element in React state?

Posted by Prem Tiwari | Updated on | ReactJS interview


What is the recommended approach of removing an array element in React state? The better approach is to use Array.prototype.filter() method. For example, let’s create a removeItem() method for updating the state.

What is the difference between setState() and replaceState() methods?

Posted by Prem Tiwari | Updated on | ReactJS interview


What is the difference between setState() and replaceState() methods? When you use setState() the current and previous states are merged. replaceState() throws out the current state, and replaces it with only what you provide. Usually …

How to re-render the view when the browser is resized?

Posted by Prem Tiwari | Updated on | ReactJS interview


How to re-render the view when the browser is resized? You can listen to the resize event in componentDidMount() and then update the dimensions (width and height). You should remove the listener in componentWillUnmount() method.