Sign inDemoInstall


Package Overview
File Explorer

Advanced tools

Install Socket

Detect and block malicious and high-risk dependencies



Chart Builder is a proof-of-concept app to understand the feasibility of using a CSV file (or SPARQL query) to generate and customise a chart or data visualisation.

Version published
Weekly downloads
Weekly downloads



Chart Builder

Chart Builder is a proof-of-concept app to understand the feasibility of using a CSV file (or SPARQL query) to generate and customise a chart or data visualisation.


Chart Builder is an HTML-JavaScript app built with the React-TypeScript stack.

Ensure you have Node installed on your system. Chart Builder has been built against Node v16.13

Ensure you have yarn installed

npm install --global yarn

We use yarn to manage packages. To install the project packages


Then, to launch a local development instance of Chart Builder, run:

yarn start


To build the app locally:

yarn build

The output directory is build. You can copy the build assets from there to the wwwroot of your webserver

Automated build

A CI/CD pipeline is configured using Google Cloud Build and deploys the containerised app to this URL:

Build trigger

Automated build is triggered by changes to the main branch of the chart-builder source code

The automated build configuration is managed in two places:
  1. Dockerfile and nginx.conf files in the chart-builder repo

    These files are both located in the root of the chart-builder repository.

    The Dockerfile specifies a multistage docker image build. The first stage builds the source code and the second stage copies this build output (without the source code and node modules) into a new container image. The resultant image (approx. 45Mb) is then deployed.

    The nginx.conf file is used to configure the nginx web server that runs inside the container.

  2. **In the GCP Cloud Run web console **

    The GCP console can be used to configure the build trigger and container specification

    1. Browse to the GSSCOGS/idpd-platform project
    2. Open the chart-builder service
    3. Go to Edit and Deploy New Revision
    4. Adjust the configurations for: Container Port, CPU allocation, Capacity (memory and CPU), Request timeout, Max requests per container and Auto-Scaling
    5. To adjust the build trigger follow the link under the General section to Cloud Build trigger
    6. Click Deploy to finalise the changes

Library Build

The chart builder can be built as a reusable NPM package. Start by choosing a version number, then run:

# set version
export VERSION=<next version> 
# use webpack.library.config.js to build the dist/ dir
yarn library
# publish it to NPM
cd dist
yarn publish
# tag it and push the tag to origin
git tag $VERSION
git push --tags 


Last updated on 06 Apr 2022

Did you know?

Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.


Related posts

SocketSocket SOC 2 Logo


  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap

Stay in touch

Get open source security insights delivered straight into your inbox.

  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc