Skip to content
The nostalgic WordArt we know just in react
JavaScript HTML CSS
Branch: master
Clone or download

Latest commit

Fetching latest commit…
Cannot retrieve the latest commit at this time.

Files

Permalink
Type Name Latest commit message Commit time
Failed to load latest commit information.
.github/workflows
example
src
.babelrc
.editorconfig
.eslintrc
.gitignore
.npmignore
.travis.yml
CONTRIBUTING.md
README.md
package-lock.json
package.json
rollup.config.js

README.md

react-wordart (demo)

The nostalgic WordArt we know just in react - Hackernoon Post

NPM JavaScript Style Guide Build Status

css-wordart

Based on my css-wordart repo

Install

npm install --save react-wordart

Usage

import React, { Component } from 'react'

import WordArt from 'react-wordart'

class Example extends Component {
  render () {
    return (
      <WordArt text='I Love WordArt' theme={`rainbow`} fontSize={100} />
    )
  }
}

Properties

Property Type Required Default value Description
text string yes
theme string no rainbow WordArt theme.
fontSize number no 50

Available Themes

Theme Output
rainbow screen shot 2019-01-31 at 18 19 05
blues screen shot 2019-01-31 at 18 19 09
superhero screen shot 2019-01-31 at 18 19 14
radial screen shot 2019-01-31 at 18 19 18
tilt screen shot 2019-01-31 at 18 19 21
purple screen shot 2019-01-31 at 18 19 24
horizon screen shot 2019-01-31 at 18 19 27
italicOutline screen shot 2019-01-31 at 18 19 31
slate screen shot 2019-01-31 at 18 19 34

Development

Local development is broken into two parts (ideally using two tabs).

First, run rollup to watch your src/ module and automatically recompile it into dist/ whenever you make changes.

npm start # runs rollup with watch flag

The second part will be running the example/ create-react-app that's linked to the local version of your module.

# (in another tab)
cd example
npm start # runs create-react-app dev server

Now, anytime you make a change to your library in src/ or to the example app's example/src, create-react-app will live-reload your local dev server so you can iterate on your component in real-time.

License

MIT © yershalom

This module was bootstrapped with create-react-library.

You can’t perform that action at this time.