The web frontend for application
Branch: master
Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Type Name Latest commit message Commit time
Failed to load latest commit information.



An interactive web application that visualizes government financial reports.

This application is inspired by similar applications developed by the g0v community in Taiwan and Taipey

g0v is a decentralized civic tech community to advocate transparency of information and build tech solutions for citizens to participate in public affairs from the bottom up. The g0v community was born in Taiwan thanks to Audrey Tang, Chia-liang Kao and many others.

Who is using it

As we know, this code is used to:


run local docker image

The webapp requires to connect to a platform that provides the data. The reference platform is available in the data-budget repository.

git clone .sdmp
docker-compose -f .sdmp/docker-compose.yml up -d

Now you are ready to build and run webapp container:

docker build -t webapp .
docker run -d --name webapp -p 29323:8080 -e G0V_API_ENDPOINT=http://localhost:29322 webapp

Try it pointing your browser to http://localhost:29323

Free docker resources with:

docker rm -f webapp
docker-compose -f .sdmp/docker-compose.yml down

You can use the following environment variables with the container image:

  • G0V_STRING_URL -> is the URL to the application JSON strings you can use to customize or localize the webapp (if not passed the default /strings/default.json is used). It can be a web resource.
  • G0V_LOCALE -> locale (the application Locale)
  • G0V_AMOUNT_FORMAT -> amountFormat (the format for currency values)
  • G0V_RATE_FORMAT -> rateFormat (the format for percentages)
  • G0V_API_ENDPOINT -> apiEndpoint (the API base endpoint)
  • G0V_TWEETS_URL -> tweetsUrl (the google sheets URL for the tweets archive)
  • G0V_APP_HASHTAG -> appHashtag (the application hashtag)
  • G0V_APP_HASHTAG -> appHashtag (the application hashtag)
  • G0V_SHOW_MEF_LOGO -> showMefLogo (whether to show the MEF logo)
  • G0V_G0V_LOGO_URL -> g0vLogoUrl (where to link the g0v logo)

build docker image

the project contains a Dockerfile which uses a two-stages build process: it first creates an image with the full node.js environment where the npm build step is run and then it creates an image containing only the compiled application files and the nginx server to serv them.

The final docker image runs a script that at startup generates the config.js file from environment variables, this allows whoever runs the image to customize the application configuration simply by passing the right environment.

The docker directory contains the nginx configuration and the command run by the image.

To build the image a Makefile is provided that builds and tags the image:

make build

The NAME and VERSION variables in the Makefile set the docker image name and tag (look at the file to see the details).

The image exposes the web server on port 8080.

Project setup

npm install

Compiles and hot-reloads for development

npm run serve

Compiles and minifies for production

npm run build


To customize the settings add a config.js file in the public directory with this content:

(function(window) {
  window.__configurationUrl = "/config.json";
  window.__stringUrl = "/strings/inps.json";

And a config.json file to the public directory with this content and customize the parameters:

  "locale": "it",
  "amountFormat": "$ 0,0 ",
  "rateFormat": "0.0 %",
  "tweetsUrl": "",
  "appHashtag": "",
  "apiEndpoint": "",
  "showMefLogo": true,
  "g0vLogoUrl": ""

The configuration is read on page load and exposed in the object exported from utils/configuration.js

import Configuration from './utils/configuration'

let settings = Configuration;
let apiEndpoint = settings.current().apiEndpoint;

The configuration object is also exposed as the vue prototype attribute $settings


All visualized data are extracted and processed by a dedicated smart data management platform (DMP) compliant with the W3C Semantic Web standards. The reference platform is available in the data-budget repository.

You can also run a local instance of the platform (see data-budget repo for more info ).


For answers you may not find in here or in the Wiki, avoid posting issues. Feel free to ask for support on the Slack general room. Make sure to mention @enrico so he is notified.


Thanks to all project contributors, to the Copernicani community and to the g0v asia community for ideas and support.


The MIT License (MIT). Please see License File for more information.