how to create the react-reveal homepage text animation

Question

I was impressed with react reveal home page text animation where the letters in "React Reveal" word fly from left , right and meets in the middle. So i thought i want to implement the same animation for my project home page but unfortunately i did not find a way to do it. I struggled a lot by looking in to developer console to find a way how it works but i was unable to get that. So can some one help me how to do that. Here is the link of the home page https://www.react-reveal.com/ Thanks in Advance

Answer 1

I finally found answer to my question if any one is trying to find how this works please check below snippet

import React from 'react';
import Zoom from 'react-reveal/Zoom';

class ZoomExample extends React.Component {
  render() {
    return (
      <h1>
        <Zoom left cascade>
        <div style={{display:'inline-block'}}>React</div>

        </Zoom><Zoom right cascade> 
        <div style={{display:'inline-block'}}> Reveal</div>
        </Zoom>
      </h1>
    );
  }
}