How to Setup a CI/CD Pipeline for Storybook.js using Gitlab

I just spent a few hours setting up a Gitlab pipeline to deploy a Storybook.js site. Of course the end result ended up being much simpler than I made it out to be. Like everything else on my blog, I’m sharing in case anyone else can use the information to save time.

Just put this in your gitlab-ci.yml and it’ll take care of caching the node modules and building your static version of Storybook to deploy.

image: node:latest

cache:
  paths:
    - node_modules/

stages:
 - build
 - deploy

build:
  stage: build
  script:
    - npm install
    - npm run build-storybook -- -o storybook-static
  artifacts:
    paths:
    - storybook-static
  only:
  - qa
  - develop
  - master

deploy:
  stage: deploy_to_aws
  # add your deploy code here

2nd February 2020

Administration Bitbucket Development Pipelines Tips and Tricks Tools

How to execute SSH command with Bitbucket Pipelines

I inherited an old site that someone else setup that is just a basic static HTML, which was deployed using a git pull on the server. I wanted to automate the deployment, and instead of using rsync as the site will be re-built, I realized I could just configure the Bitbucket Pipeline to use SSH and run the pull command. This is probably a fringe case but here’s the bitbucket-pipelines.yml in case anyone finds it useful.

Add the repository variables for $USER, $SERVER, and $FOLDER with the appropriate values and then you should be able to run the deployment.

pipelines:
  default:
    - step:
        script:
          - pipe: atlassian/ssh-run:0.2.8
            variables:
              SSH_USER: '$USER'
              MODE: 'command'
              SERVER: '$SERVER'
              COMMAND: 'cd $FOLDER && git pull'