[ci] Add workflow for deploy storybook (#160)

* feat(ci): Create workflow for Storybook Signed-off-by: Sudhanshu Dasgupta <[email protected]> --------- Signed-off-by: Sudhanshu Dasgupta <[email protected]>
layer5io · Oct 11, 2023 · accd5ca · accd5ca
1 parent d4f389e
commit accd5ca
Show file tree

Hide file tree

Showing 2 changed files with 44 additions and 4 deletions.
diff --git a/.github/workflows/storybook-deploy.yml b/.github/workflows/storybook-deploy.yml
@@ -0,0 +1,39 @@
+name: Deploy Storybook
+
+on:
+  push:
+    branches:
+      - "*"
+  pull_request:
+    branches:
+      - "*"
+
+jobs:
+  build:
+    runs-on: ubuntu-latest
+    strategy:
+        matrix:
+          node-version: [16, 18, 20]
+
+    steps:
+      - name: Checkout code
+        uses: actions/checkout@v2
+
+      - name: Set up Node.js ${{ matrix.node-version }}
+        uses: actions/setup-node@v3
+        with:
+          node-version: ${{ matrix.node-version }}
+
+      - name: Install dependencies
+        run: yarn install
+
+      - name: Build Storybook
+        run: |
+          cd apps/design-system
+          yarn build-storybook
+
+      - name: Deploy Storybook
+        uses: peaceiris/actions-gh-pages@v3
+        with:
+          github_token: ${{ secrets.GITHUB_TOKEN }}
+          publish_dir: ./storybook-static
diff --git a/README.md b/README.md
@@ -2,7 +2,6 @@
 
 The Sistent Design System from Layer5 provides the open source building blocks to design and implement consistent, accessible, and delightful product experiences.
 
-
 ### Packages
 
 Design System components in React, usually built with Vite.
@@ -25,7 +24,7 @@ List of npm packages:
 
 Before you begin, ensure you have the following installed on your system:
 
-- Node.js 
+- Node.js
 - Yarn
 
 ### How to get started
@@ -37,7 +36,6 @@ Use `corepack enable` to go ahead and install yarn.
 
 <div>&nbsp;</div>
 
-
 ### Installation
 
 To set up the project, run the following command to install dependencies:
@@ -46,25 +44,28 @@ To set up the project, run the following command to install dependencies:
 setup:
 	yarn install
 ```
+
 To build the project, you can use the following command:
+
 ```
 build: install
 	yarn run build-all
 ```
 
 To check if your code meets the formatting standards, you can run:
+
 ```
 format-check:
 	yarn run format:check
 ```
 
 To automatically fix formatting issues, you can run
+
 ```
 format-fix:
 	yarn run format:write
 ```
 
-
 ## Join the Layer5 community!
 
 <a name="contributing"></a><a name="community"></a>