⚠️ This repo is not in active use anymore. TRASE Frontend code has been merged with the API repo ⚠️
Source code for the TRASE front end.
Trase brings unprecedented transparency to commodity supply chains revealing new pathways towards achieving a deforestation-free economy.
About this project
This project consists of only the frontend application for the TRASE website. All data displayed is loaded through requests to the TRASE API.
This project mainly uses D3 and Leaflet, plus Redux for managing app state. More on the stack here
Besides the frontend code, the project also includes a standalone nodejs web server, which should be used only for development purposes
+-------+ +-------+ | | | | | | | | +-------+ ---\ | | | node | \-------+-------+ +-------+--\ link | node | | | \ | | | | \--------+-------+ | | | | +-------+ +-------+ column column
The project's main configuration values can be set using environment variables
- PORT: port used by the development web server. defaults to 8081
- NODE_ENV: environment used by the nodejs tasks
- AUTH_USER + AUTH_PASSWORD: if set, an auth wall is used by the nodejs development web server
- API_V1_URL: URL of the data API V1
- API_V2_URL: URL of the data API V2
- API_CMS_URL: URL of the homepage stories API
- API_STORY_CONTENT: URL of the deep dive stories API
- API_SOCIAL: URL of the tweets API
- GOOGLE_ANALYTICS_KEY: API key for Google Analytics
- DATA_FORM_ENABLED: enable contact form in Data page
- DATA_FORM_ENDPOINT: end point to send form values in Data page
If you are using the included development server, you can set those variables in the
.env file (use the included
.env.sample as an example)
Development set up
- Check out the code from github
- Install dependencies:
- Start the development server:
npm run dev
generate vector map layers
Vector layers are generated with one of the two workflows:
- CARTO (remote DB) -> geoJSON -> topoJSON
- local shapefiles -> geoJSON -> topoJSON
All can be generated by running:
All dependencies should be installed by npm install, except ogr2ogr (used for shapefile conversion), which you have to install globally with GDAL.
Generate municipalities by state TopoJSON files (only for Brazil for now) by running:
generate CARTO named maps (context layers)
- Copy CARTO credentials:
cp cp ./gis/cartodb/cartodb-config.sample.json ./gis/cartodb/cartodb-config.json
- Replace api_key value in
- To update or instantiate context layers run
This will use the layers configuration stored in
npm run build, it will create a production-ready version of the project in
Depending on the environment where you want to deploy, you need to have a
.env.staging or a
.env.production file set up.
npm run deploy:staging
npm run deploy:production
This will build using appropriate env file and upload to server usinc scp.