How to create useScript hook in React.js? | JavaScript Interview Question | Frontend Problem Solving

React Hooks are a new addition in React 16.8. They let us use state and other React features without writing a class.

Many times we want to dynamically load an external script and know when it loaded. It is specially useful when working with 3rd party libraries like Google Analytics, Payment Gateways, Ads etc.

So, in this question, you need to build a custom hook useScript that provides the above discussed functionality.

const { status, error } = useScript(
  "https://yomeshgupta.com/use-script.js"
);

Parameters

• src: The source of the script we want dynamically load.

Return Values

• status: The current state of script loading. Could be either of the one: idle, ready, error, loading`.
• error (Optional): Error object received in case of any failure.

Submission

Start the timer and try to complete the solution within 45 mins and share it on LinkedIn & Twitter and tag @devtoolstech @yomeshgupta