How to make wiggly div in React

Making Wiggly div is most interesting and at the same time a complex thing. It will be good for cases for like some cool portfolio, a landing page with some important text etc. Its more like making a div more funny. In this article we will gonna learn how we can create a wiggly div in React.

react-wiv

This package is a react version of wiv.js. It uses a library named wiv.js internally. It super simple and easy to create wiggly div using react-wiv. In just few lines of code we can accomplish our task without need to worry about the complexity.

Installation and Usage

Like any other npm package we can install it using npm command.

npm install --save react-wiv

Once this package is installed. You need to import this package using below code.

import Wiv from 'react-wiv'

and we are good to use it.

<Wiv color="#00FF00" height={4} tightness={6} thickness={2} speed={0.55}>
        Blogreact
      </Wiv>

We just provided few props like color, height, speed etc and got this output.

Checkout the live demo using below link.

More demos

Feel free to comment your thoughts.

How to send SMS using Bandwidth in Node