Skip to content

Commit

Permalink
docs: update README.md
Browse files Browse the repository at this point in the history
  • Loading branch information
paoloyx committed Jun 18, 2024
1 parent 996089a commit 3fde6a0
Showing 1 changed file with 4 additions and 34 deletions.
38 changes: 4 additions & 34 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -3,46 +3,16 @@
Building design system in dev mode
===============

* Clone the repo
* Install dependencies with ```$ yarn```
* Start dev server ```$ yarn start```
* Open the browser on ```http://localhost:3010```

* Start storybook server ```$ yarn storybook```
* Open the browser on ```http://localhost:6006```


Using local design system version on a local project
===============

* Install yalc globally ```$ yarn global add yalc```
* Publish locally with ```$ yarn yalc:publish``` you can use this command everytime you need to push some updates/changes to the projects that are using this library locally
* Inside the project you want to use the local version of rbit-design-system use ```$ yalc add "rbit-design-system"```
* To remove the local version of design system execute: ```$yalc remove my-package```

Use Radicalbit Design System
===============

- Install [antd design](https://ant.design/) (version 3.6.3)
- `$ npm set registry http://159.122.176.27:4873/`
- Install rbit-design-system `npm install rbit-design-system`
- Import style in `rbit-design-system/dist/index.css`

Creating a new component
===============

- Create a new folder under `src/lib/components`, dashed-name as your component's name
- Develop your component in a file named `index.js`
- Develop your component in a file named `index.tsx`
- Integrate the styles for your component in a file named `_styles.less`
- Create a demo version of your component in a file named `demo.js`
- In `src/lib/index.js` add a new export line for the component (follow alphabetic order) `export { default as XXX } from './components/XXX';`
- In `src/rbit-design-system.js` add a new export line for the component (follow alphabetic order) `export { default as XXX } from './lib/components/XXX';`
- In `src/styles/components.less` add a new import line for the component (follow alphabetic order) `@import 'XXX/_styles';`
- In `src/demo/partials/demo-components.js` add and export your demo component (respecting the alphabetical order)
- In `src/demo/partials/secondary-menu.js` add a new object (respecting the alphabetical order) to the `items` array containing:
* position: `<the latest available integer>`,
* key: `<Your demo component name>`,
* icon: `<empty string>`,
* title: `<A title of your choice for your component>`,
- In `src/demo/app.js` scroll to the bottom and add your component to the `<div className="main-content">` following the alphabetic order

- Create some Storybook stories in a file named `<component-name>.stories.ts`
- In `src/lib/index.ts` add a new export line for the component (follow alphabetic order) `export { default as XXX } from './components/XXX';`
- In `src/styles/components.less` add a new import line for the component (follow alphabetic order) `@import 'XXX/_styles';`

0 comments on commit 3fde6a0

Please sign in to comment.