jwi-hth-patterns

This project has been created following these instructions. The library is currently published to npm.

Quick start

If you want to add a new component just create an appropriate subdirectory in /src and start hacking. Do not forget to add an export statement to /src/index.js. Otherwise your new component won't be available for the patternlib users.

After your work is finished add one or more examples to /examples/src/index.js to show how your component should be used. (TODO: change this step to Storybook!)

Before you publish your changes to npm you have to follow these steps:

0. Create an npm account if you haven't done this already in the past
1. Increase the the library version in package.json semantically
2. run npm run build to create minified distribution artifacts
3. run npm publish

View patterns using Storybook

Run npm run storybook and your browser will open http://localhost:6006 automatically.

Add jwi-hth-patterns to a React app

Just run npm install jwi-hth-patterns@latest and use the library components like this:

import React, { Component } from "react";
import {Button, InputReverser} from "jwi-hth-patterns";

class App extends Component {
  render() {
    return (
      <div className="App">
        <InputReverser input="This text will be reversed!" />
        <Button primary>Test</Button>
        <Button>Another Test</Button>
      </div>
    );
  }
}

Your app will look like this:

Open Tasks

• Add scss support ✅
• Minify webpack output ✅
• Add React Storybook ✅
• Include spectre.css ✅
• Publish to Artifactory or Nexus instead of npm
• Remove package from npm (?)