Foc al Bosc

May 24, 2019 · View on GitHub

React based project to visualize the distribution and the territorial scope of fires in Catalonia from 1986 until now. You also can observe the subsequent evolution of the affected area.

Link to live project

visors.icgc.cat/focalbosc

Anual code updates

Anually, the last year is added to the project following these steps:

Update the PBF with the new fires and the layers name:

export const PBF_INCENDIS = "https://tilemaps.icgc.cat/tileserver/tileserver.php/incendis_v2/{z}/{x}/{y}.pbf";

export const VECTOR_LAYER_POL = "incendis_4326_poligons_v2";
export const VECTOR_LAYER_POINT = "incendis_4326_centroides_v2";

Add the new year in constants.js, in the following lists:

mappingAnyLayer
ortoLayersOptions

Copy the new CSV in the folder src/scripts and generate the new json of the fires executing the script:

npm run

and copy the result in constants.js:

incendisList

Available Scripts

In the project directory, you can run:

`npm start`

Runs the app in the development mode.
Open http://localhost:3000 to view it in the browser.

The page will reload if you make edits.
You will also see any lint errors in the console.

`npm test`

Launches the test runner in the interactive watch mode.
See the section about running tests for more information.

`npm run build`

Builds the app for production to the build folder.
It correctly bundles React in production mode and optimizes the build for the best performance.

The build is minified and the filenames include the hashes.
Your app is ready to be deployed!

`npm run test-flow`

Runs the static type checks.

Folder structure

build: Contains the built files generated by the scripts (dev package, minified package and map)

src: Contains an index file that requires all the modules that should be exported and all the source files that compound the package.

src/components: Contains all the components used in the project src/resources: Images and resources to use inside the project

src/scripts: Contains the files needed to update anually de data being used in the project

Deploy

El deploy automatic es fa en una màquina amb les següents dependencies:

Apache o nginx
Nodejs

mkdir build
npm install
npm build
mv ./* /var/www/html/