React typing effect text animation component
A layout component to create a typewriter typing animation effect for text.
Installation
Run npm i text-type-animation-effect-react or yarn add text-type-animation-effect-react in the root of your React project
Usage
In the component where you want to see the animation of typing effect import TextTyper with
import TextTyper from 'text-type-animation-effect-react'
Render passing the props with the text to type, interval (optional) and HTML element to use (optional):
<TextTyper text={textToRender} interval={10} Markup={"code"} />
Props
| Name | Type | Default | Description |
|---|
| text | string | '' | String text value you want to print. The text which would be rendered with the typing animation effect |
| interval | number | 100 | Number in millisecond to control the speed of typing, delay between rendering each character in milliseconds |
| Markaup | string | span | Any valid HTML element to render your text within, like p, h1, span, code, etc... |
npm: https://www.npmjs.com/package/text-type-animation-effect-react
Done at Barcelona Code School
