π₯ React + Typescript Boilerplate to develop your own react components and reuse in another projects
Components are cool! We should use them everywhere. So, you expent time developing a lot of components and now you want to reuse them in another awesome project & all your projects need your components updated when a new feature is released (and you also need typechecking, tests, hot module replacement & all the good stuff).
.
βββ src
| βββ components
| βββ MyComponent # Your component
| βββ MyComponent.story.tsx # Storybook of your component
| βββ MyComponent.test.tsx # Jest + Enzyme tests
| βββ MyComponent.tsx # Its JSX + Typescript file
| βββ MyComponent.types.ts # Types for props
| βββ index.ts # Export Component
| βββ MyComponentX # Another component X
| βββ MyComponentY # Another component Y
| βββ MyComponentZ # Another component Z
| βββ stories.tsx # Storybook config file
βββ dist
| βββ index.js # Exporting all Componentss
- Fork it!
- install dependencies:
yarn install
- Create your account in TravisCI & Code Coverage
- Configure TravisCI environment variables
DANGER_GITHUB_API_TOKEN
,GH_TOKEN
&NPM_TOKEN
with right permissions (you can find in their websites) for repo access to release new versions & intercept in pull requests - Make sure you have these options checked in TravisCI:
- Follow contributing
- in your project, run the following:
yarn add https://github.com/yourusername/react-ts-cdk
- import your components developed in this repo & use them!
- React
- Typescript
- Storybook
- Jest
- Enzyme
- Webpack
- Prettier
- Commitizen
- Fork it!
- install dependencies:
yarn install
- Maybe use storybook to test your component in its final UI version:
yarn run storybook
- If using storybook, then open
localhost:6006
to get a hot module replacement environment to visualize your component after every file saved - Create your feature branch:
git checkout -b my-new-feature
- Check our workflow (it will help you understand how you should develop your feature), if you haven't yet.
- Commit your changes:
yarn run commit
- Push to the branch:
git push origin my-new-feature
- Submit a pull request π