retro-ui

!Tests

NES-style (8bit-like) react & styled-components UI

Usage

1. Install with:

``sh
yarn add retro-ui
`

2. Add the font via CDN on index.html head:

`html




rel="stylesheet"
href="https://fonts.googleapis.com/css?family=Press+Start+2P"
/>



`

3. Use like:

`jsx
import React from 'react'
import { Button, ThemeWrapper } from 'retro-ui'

const App = () => (

{'Rawr!'}

)
`

Detailed docs here

Development

This react library is made with styled-components.
Uses react-styleguidist for docs.

$3

`sh
yarn # install deps :)
yarn start # runs a styleguidist dev server with hot reload
yarn lint # lint rules
yarn test # run unit/integration tests
`

To try out the library from a local build:

`sh
yarn build # builds for distributing as npm package
cd ../react-test-app # navigate to a test project
yarn add file:../retro-ui/build # install the library from local version
`

$3

Styling and linting rules are enforced on local env. Requires prettier and eslint, as well as editor/IDE integration.
Commit message format is enforced to adhere to conventional commits.
Don't worry, there's feedback from the tools when trying to commit 🤖📟

$3

- DeepScan & CodeClimate keep an eye on tech debt and give automated PR reviews
- On every push (master or PR), CI runs linting and unit/integration tests.
- On every push to master branch, CI will create a release, build library and docs, and publish to NPM.
- On every push to master branch, Github pages will publish the website in docs/ folder.

Contribute

Yes please!

$3

- Dump all my components from other projects here :)
- eject crapp`
- Global resets & fonts via styled-components

---

- is styleguidist making sense, or switch to storybook?
- Is it possible to source docs from tests?

---

- Write meaningful e2e tests (wdio?)

Big thanks to NES.css

Heavily inspired by NES.css, an awesome NES-style CSS Framework 💖🎮🌟