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

1import TextTyper from 'text-type-animation-effect-react'

Render passing the props with the text to type, interval (optional) and HTML element to use (optional):

1<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