Git Product home page Git Product logo

paste's Introduction

Paste - Twilio Design System

Component playground: TODO link and host

Getting started

yarn
yarn bootstrap
yarn build
yarn start:all

Build things ๐ŸŽ‰

Contributing

Before contributing, please make sure that you read our Contributing Guidelines and agree with our Code of Conduct.

Command List

Command Description
yarn bootstrap Symlinks all the local packages together so you can import package names and work with them locally.
yarn start Builds and starts storybook and the design tokens in dev mode
yarn start:all Builds and starts storybook,the design tokens and the website in dev mode
yarn start:storybook Builds and starts storybook, the dev playground
yarn start:tokens Builds and starts design tokens in dev mode. Loads a browsersync server and live reloads token changed in the token page
yarn clean Cleans the directories of node modules and built files
yarn prettier Checks for un-prettier'd files in the repo. For pre-push hook and CI.
yarn prettier-clean Automatically fixes all prettier issues in the repo.
yarn test Runs all the Jest tests, including snapshot testing.
yarn test:coverage Similar to yarn test, but with coverage reporting as specified in the root package.json
yarn lint Lints the codebase and spits out any errors.
yarn type-check Runs TS type-checker against the codebase and spits out any errors. Useful since we use babel at runtime with storybook.
yarn build:storybook Builds Storybook into static assets and places them in the /docs folder. For Github Pages hosting.
yarn build:tokens Builds the design tokens package under paste-tokens/
yarn build:dev Builds the compiled JS into /dist in dev mode
yarn build Builds the compiled JS into /dist
yarn pre-push A series of commands that are run as a pre-commit hook.
yarn release Releases the main library to NPM via lerna
yarn release:storybook Releases the latest storybook to github pages

Hosting Storybook

We use GitHub pages to host the Storybook instance. We use the gh-pages branch and the gh-pages package to manage this.

gh-pages branch

The gh-pages branch ignores everything other than the built storybook instance in the root of the directory. The package handles everything.

Updating

To update this we simply run the gh-pages package from yarn by using the release:storybook task.

yarn release:storybook

This task will build the storybook, switch to the gh-pages branch, commit the changes from the storybook build and push to GitHub.

License

MIT

paste's People

Contributors

sitaggart avatar thesisb avatar richbachman avatar aayushpi avatar serifluous avatar dependabot-preview[bot] avatar sidhyatikku avatar aaroncgoidel avatar giantrobots avatar dpeukert avatar two24studios avatar wyze avatar parammittal16 avatar itsmewiththeface avatar sgbj avatar cjcodes avatar

Watchers

James Cloos avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.