Skip to content

CONTRIBUTING.md

Latest commit

 

History

History
70 lines (53 loc) · 3.47 KB

CONTRIBUTING.md

File metadata and controls

70 lines (53 loc) · 3.47 KB

Contributing

Communication

Anyone who is actively contributing to this project can become of member of this github group, and join our slack channel. Please contact us at info@townhallproject.com

Development Process

  • If you have write permissions, assign the issue you intend to work on to yourself, if not, comment on it that you are working on it.
  • Check out a new branch for this feature from the repository's master branch, or from your own fork of this repo.
  • Do your work on that branch.
  • When your changes are ready to be merged, open a pull request from your feature branch to this repo's master branch.
  • In the comments of your Pull Request, reference the issue number and include screen shots of any visual changes.

Dev environment

Firebase is both a real-time database and hosting platform. This project is bundled using webpack. In order to get started in the development environment be sure to follow these steps in the command line:

  • npm i
  • npm run watch (will start webpack dev server)

By default it will run on port 8080.

Our production build is generated by using:

  • npm run build
  • npm run start

By default it will run on port 3000.

Style Changes

  • Make changes to /src/styles/customboot.less

Entry Point

Our map is made with mapbox which uses webGL. For those users who do not have webGL enabled we display a googleMap. Both of these files have a readData function, which reads through all the events at the townHalls endpoint, makes a marker for them, and then displays the marker on the map. These functions are found in view/mapView.js and view/noWebGlMapView.js.

More information on the Mapbox map.

Introduction to Firebase

Firebase is a readtime database; so you can add listeners for child_added or child_changed. These are very useful for our case where the data is being added and changed on a pretty constant basis. We use this to read in the event data.

Reading Data

var townHallsFB = firebase.database().ref('/townHalls/').orderByChild('dateObj');
townHallsFB.on('child_added', function (snapshot) {
  //child_added iterates over every child node at the endpoint /townHalls/
  //snapshot has a key, in our case snapshot.key is the event id.
  //calling .val() on snapshot will unpack the object at this endpoint.
  var newtownhall = new TownHall (snapshot.val());
})

Alternatively, sometimes it's important to be able to ensure a function is executed only after all the data is run. This is where once is useful. To read the data at an endpoint once, we chain .ref() with .once(). This returns a promise. We can do things with the data in the resolve function of the promise.

var townHallsFB = firebase.database().ref('/townHalls/').orderByChild('dateObj');
townHallsFB.once('child_added').then(function(snapshot) {
  //once returns the data at the endpoint /townHalls/ as an array like object
  snapshot.forEach(function(ele){
    //ele here is now like the snapshot returned in the 'child_added' call.
    var newtownhall = new TownHall (ele.val());
    })
  })

Writing Data

Writing data follows a similar pattern. We chain .ref() with .update([object]) or .set(value). We do not write data from the client side very often. For more information, check out the Firebase docs.

Help

If you need help on anything, or are unsure about how something is setup, please email meganrm@townhallproject.com.