https://github.com/leandrooriente/react-ui-kit-boilerplate

A minimal React UI Kit boilerplate with Storybook, hot reloading, Styled Components, Typescript and Jest
https://github.com/leandrooriente/react-ui-kit-boilerplate

gh-pages hmr jest react-boilerplate reactjs storybook styled-components tslint typescript

Last synced: 2 months ago
JSON representation

A minimal React UI Kit boilerplate with Storybook, hot reloading, Styled Components, Typescript and Jest

• Host: GitHub
• URL: https://github.com/leandrooriente/react-ui-kit-boilerplate
• Owner: leandrooriente
• Created: 2018-09-22T08:28:27.000Z (over 6 years ago)
• Default Branch: master
• Last Pushed: 2019-03-13T13:52:39.000Z (almost 6 years ago)
• Last Synced: 2024-10-13T10:54:04.616Z (3 months ago)
• Topics: gh-pages, hmr, jest, react-boilerplate, reactjs, storybook, styled-components, tslint, typescript
• Language: TypeScript
• Homepage:
• Size: 1.37 MB
• Stars: 89
• Watchers: 3
• Forks: 11
• Open Issues: 3
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

        
# React UI Kit boilerplate

The perfect boilerplate to help you to create your own React UI Kit. 



  

  

    

  

  

  

    

  



## Live Example

[https://leandrooriente.github.io/react-ui-kit-boilerplate](https://leandrooriente.github.io/react-ui-kit-boilerplate/?selectedKind=Components%2FButton&selectedStory=default&full=0&addons=1&stories=1&panelRight=1&addonPanel=storybooks%2Fstorybook-addon-knobs&knob-Label=Default)

## Features

- [Typescript](https://www.typescriptlang.org)

- Components generators

- Development Environment: [Storybook](https://storybook.js.org/)

- Styles: [Styled Components](https://www.styled-components.com/) with theming configuration

- Lint: [TSLint](https://palantir.github.io/tslint/)

- Tests: [Jest](https://jestjs.io/)

## Quick start

Make sure that you have Node v8 or above installed.

1. Clone this repo using `git clone  [email protected]:leandrooriente/react-ui-kit-boilerplate.git`

2. Move to the appropriate directory: `cd react-ui-kit-boilerplate`.

3. Run `npm ci` in order to install dependencies.

4. At this point you can run `npm run storybook` to see the example Storybook at [http://localhost:6006](http://localhost:6006).

## Creating new components

To add a new component, just run `npm run generate`. This command will generate all the component (Stateless or not) files for you.

## Testing

To test your components run `npm test`.

By default we run tests and lint before any push.

## Deploying storybook

To deploy storybook to Github Pages run `npm run deploy-storybook`.

## License

MIT