@pietrop/digital-paper-edit-storybook NPM

Digital Paper Edit - React Components Catalogue

---> Work in progress <--

! What is published in the Storybook may be different to what is being actively used in Digital-Paper-Edit-Client, as the components are currently being migrated. !

This repository uses storybook to gather the components of the React front end. You can read about the "why" in this ADR.

See here for the overall project architecture.

Setup

git clone git@github.com:pietrop/digital-paper-edit-storybook.git

cd digital-paper-edit-storybook

Optional step to setup nvm to use node version 10, otherwise just use node version 10

nvm use || nvm install

in root of project

npm install

Usage - development

Start the storybook

npm start

Storybook is at http://localhost:6006/

Usage - production

npm install @pietrop/digital-paper-edit-storybook

System Architecture

uses storybook with the setup as explained in their docs to develop this React.
.storybook/webpack.config.js changes the storybook webpack config to add support for css modules.

Development env

npm > 6.1.0
Node 10 - dubnium

Node version is set in node version manager .nvmrc

Build

To transpile ./src and create a build in the ./dist folder, run:

npm run build

Demo & storybook

Storybook can bew viewed at https://bbc.github.io/digital-paper-edit-storybook/
Demo can be viewed at https://bbc.github.io/digital-paper-edit-client

Build - storybook

To build the storybook as a static site

npm run build-storybook

Publish storybook & demo to github pages

This github repository uses github pages to host the storybook and the demo of the component. Make sure to commit and push any changes to MASTER before deploying to github pages.