https://github.com/ianfabs/jatrix-react

A matrix-like text thingy for react!
https://github.com/ianfabs/jatrix-react

animation animation-components animations javascript js matrix react react-components text text-animation text-manipulation

Last synced: about 1 month ago
JSON representation

A matrix-like text thingy for react!

• Host: GitHub
• URL: https://github.com/ianfabs/jatrix-react
• Owner: ianfabs
• Created: 2019-03-02T21:01:15.000Z (over 5 years ago)
• Default Branch: master
• Last Pushed: 2022-12-03T00:37:29.000Z (almost 2 years ago)
• Last Synced: 2024-10-03T06:08:16.221Z (about 2 months ago)
• Topics: animation, animation-components, animations, javascript, js, matrix, react, react-components, text, text-animation, text-manipulation
• Language: JavaScript
• Size: 164 KB
• Stars: 2
• Watchers: 1
• Forks: 0
• Open Issues: 9
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

        
# Enter the Jatrix

(pronounced Jay-tricks, like matrix)

Jatrix does this matrix like text thing, it's really cool!

[![Edit Jatrix](https://codesandbox.io/static/img/play-codesandbox.svg)](https://codesandbox.io/s/006zx206zv?fontsize=14&view=preview)

Long story short, jatrix-react is a react component, as such it needs props.

| Prop   |   Type   |  Description                                                  | Default |

|--------|----------|---------------------------------------------------------------|---------|

| `text` | String   | The words that you want to render                             | None    |

| `fps`  | Number   | Frames per second, A.K.A how fast you want your letters to go | `40`    |

| `caps` | Boolean  | If it should be rendered in caps or not                       | `false` |

| `done` | Function | A callback that executes when it completes                    | `()=>{}`|

The name attribute allows you to write it as a self closing tag, like this:

```jsx

```

versus writing it like this:

```js

  Ian Fabs

```

But *both of them* **do indeed work**.