Storybook React Typescript Tailwind Styled screenshot

Storybook React Typescript Tailwind Styled

Author Avatar Theme by Danarocha br
Updated: 12 May 2020
13 Stars

A simple boilerplate for creating a Design System in Storybook using React, Styled Components, Tailwind, and Typescript

Categories

Overview

The “Boilerplate” project is a development tool that helps users set up a project on their local machine. It provides a straightforward process for installing the necessary prerequisites, such as NodeJS, Yarn or Npm, and guides users through the installation process. Once installed, the project offers several essential tasks, including building CSS from a tailwind.css file, watching for any changes made in CSS files, and starting Storybook.

Features

  • Installation: Guides users through the installation process of NodeJS, Yarn or Npm.
  • Build CSS: Allows users to build CSS from a tailwind.css file.
  • Watch CSS: Monitors CSS files for any changes made.
  • Start Storybook: Starts up Storybook, a tool for developing UI components in isolation.

Installation

To install the “Boilerplate” project, follow these steps:

  1. Make sure you have NodeJS and either Yarn or Npm installed on your computer.
  2. Clone the project repository onto your local machine.
  3. Run the following command to install the necessary dependencies:
$ yarn install

or

$ npm install
  1. Once the installation is complete, you can start using the “Boilerplate” project.

Summary

The “Boilerplate” project streamlines the process of setting up a project on a local machine for development purposes. It provides clear instructions for installing the required dependencies and offers various key features, such as building CSS, watching CSS files for changes, and starting Storybook. Whether you are a beginner or an experienced developer, the “Boilerplate” project can help you get started quickly and efficiently.