planejApe-UI

Planejape Ui

A Svelte library of @PlaneApe, with Chomatic and storybook integration

PlanejaApe - Lib


The planejape-ui-svelte is a library of design system components from the planejApe project.

In this file, you will find things about: How to run the project, publishing the package in npm, chromatic's CI/CD settings and a few other things, so let's get started

This lib uses technologies that promote the scalability and maintainability of the project:

🛠️ Tecnologies and tools

  • Svelte
  • Storybook
  • Chromatic

⚙️ CI/CD

  • GitHub actions

📦 Packing

  • NPM (to publish package)

📝 Tests

  • Vitest
  • Testing library (Svelte)

How to execute this project

  1. Clone this repo the follow example (or as you prefer):
git clone https://github.com/Rickson298/planejApe-UI.git
  1. Install the dependencies (only use NPM)
npm install
  1. Start storybook
npm run storybook

Publish to NPM

Only Rickson Oliveira (me) can publish on NPM, however, it's good to document it here.

To publish a new version of planejape-ui-svelte on NPM, follow the instructions below:

  1. Update the package version (read about semantic versioning here)
npm version patch
  1. Publish on NPM
npm publish

Chromatic and CI/CD

This app has an action configured for the chromatic CI/CD, it is in the file /.github/workflows/chromatic.yml

Snippet

When new stories are created, just write the snippet create-sb-file, this will create a template file for stories and avoid writing code that will always be the same

Top categories

Loading Svelte Themes