Lottie Animations in a React Js

In this article, we will learn how to use Lottie animations react js.

A Lottie is a high-resolution JSON animation that works with Android, iOS, web browsers, React, and other platforms.

Here’s more information about what a Lottie is.

Embedding a Lottie is the greatest method to learn how to use one.

Learn how to incorporate your favourite Lottie into a React App by following this tour.

Lottie is an open source animation file format that is compact, high-quality, interactive, and changed in real time.

Let’s look at how to make Lottie animation with React.js.

Typically, Lottie animations are utilised as a loader or start screen.

It is written and implemented in JSON format in our React projects.

Frist, install a react-lottie-player like this command,

npm i react-lottie-player

Then import react-lottie-player in your app

import Lottie from 'react-lottie-player'

Let’s see how to use react-lottie-player

 <Lottie
    animationData={lottieJson}
    play
    speed={1}
    class="success-lotties"
/>