Footprint

Footprint is a React application which easily calculates a user's eco-footprint based on the user's lifestyle. People can learn how to reduce their footprint by taking the quiz and seeing how they compare to the average.

Use the app:

Launch app

Inspiration

To run this source code:

Clone this repo
Make sure MongoDB server is running
Run 'yarn run build' & then 'yarn start'

Built With:

HTML5
CSS
React.js - Component based JavaScript library
Javascript
BootstrapCDN v3.3.7
MongoDB - Database to store and retreive user answers
Express js - Node application library
Node - Run JavaScript's backend loacally
Mongoose - Modeling for MongoDB
Heroku - Deployed on Heroku
Passport - login and register authentication
React Chartjs 2 - Creating graphs on the results page
Concurrently - Run server and front-end with yarn start
see package.json for additional packages

Code examples

Passport - User authentification:

![Code](client/src/components/Video/assets/passport_auth.jpg)

Session Storage - Creating User Session (using jQuery click event):

router.get('/logout', (req, res)=>{
  res.localStorage.removeItem('jwtToken');
  res.clearCookie("user", {path:"http://localhost:3000/"});
  res.set('user', {expires: Date.now()});
  res.json(true);
});

Future Features

In the future, we hope to incorporate the following features:

Carbon Footprint APIs to give users a number they can improve on
Stripe or Paypal for donations to non-profits focusing on the environment
D3 or Chartio to display data visualizations and infographs of user results
API or calculate ways users can alleviate high carbon footprint
Allow social media sharing of user results

References

Chartjs React

Authors 🖋

Hannah Lim Hannah Lim
Jessica Brush Jessica Brush

Acknowledgments 🗣

**A big thank you to our instructors and TA's at Berkeley's Coding bootcamp!! Thank you Jerome, Amber, Sasha, Ricky and Dani!

License

This project is licensed under the MIT License - see the LICENSE.md file for details

b0bbybaldi/Footprint