How to create a loading spinner in React

In react, animated spinners are often used to make web-pages more attractive. The steps are:

  1. Install the package using the command prompt.
npm install react-bootstrap bootstrap
  1. Import spinner module from the above package.
import { Spinner } from 'react-bootstrap';
  1. Use the <Spinner> tag for the spinner – you can apply CSS styles to it.

Remember to use the latest version of react and react-bootstrap.

Code

import React from 'react';
require('./style.css');

import ReactDOM from 'react-dom';
import App from './app.js';

ReactDOM.render(
  <App />, 
  document.getElementById('root')
);
Copyright ©2024 Educative, Inc. All rights reserved