How to use react-typed in our React app?

To use react-typed in our React app, we run

yarn add react-typed      

with yarn

or

npm install react-typed --save

with npm.

Then we write

import React, { Component } from "react";
import { render } from "react-dom";
import Typed from "react-typed";

class MyComponent extends Component {
  render() {
    return (
      <div>
        <Typed strings={["Here you can find anything"]} typeSpeed={40} />
        <br />

        <Typed
          strings={[
            "Search for products",
            "Search for categories",
            "Search for brands",
          ]}
          typeSpeed={40}
          backSpeed={50}
          attr="placeholder"
          loop
        >
          <input type="text" />
        </Typed>
      </div>
    );
  }
}

render(<MyComponent />, document.getElementById("app"));

to create a component that uses the Typed property from react-typed.

We add the strings that we want to type out into the strings prop array.

And we set the typeSpeed and backSpeed to set the typeing speed and backspace speed.

loop makes the typing effect loop.