GIF
Smooth Scroll Example of Landing Page to Main Page
GIF
Calculations on Main Page
Main Page of Emission Omission
Brainstorming process with Figma
Main logo

Inspiration

Climate change is one of the most talked about issues today. While there are many known large scale factors contributing to climate change, we were curious about how big our impact could be. So we created Emission Omission, an online calculator that can estimate carbon emissions caused by driving.

What it does

Emission Omission uses distance, car type, and fuel type to estimate a car trip's carbon footprint. The user provides an origin and destination to map out a trip, then provides their car and fuel type. Our web app then uses this information to calculate and display the total amount of carbon emitted in pounds.

How we built it

Our team created Emission Omission using the React Javascript framework, HTML, and CSS. We used the Google Maps API to embed a map that can display a trip given two locations. To work together, our team used Git and GitHub for version control, and used the Live Share extension in VSCode to edit files together. Prior to coding the app, we used the online tool Figma to create a mockup of Emission Omission's UI.

Challenges we ran into

One challenge we ran into was learning how to use the Google Maps API. We had never used anything like it before so it was definitely a learning experience. Additionally, our team members have only used React once, so we spent a lot of time stumbling through unfamiliar technology this hackathon.

What we learned

How to use the Google Maps API
Creating a web app using React
Web design using flexbox and CSS grid
Version control and working together in a small team
How to stay focused and complete a project under pressure

Built With

Submitted to

BoilerMake VIII

Created by

I worked on the back-end implementing Google Maps API. This was my first time working with this API which made it very fun to learn and experiment with. Overall, I learned a lot and the site turned out beautifully.

Neil Rathod
I worked on the front-end with using React.js, html, and css. I'm familiar with html and css, however, this is only my second time using React.js, so it was a bit difficult at the beginning. Once we got everything into React.js components, though, it made everything a lot easier. Me and my teammates learned a lot about Google Maps API and React.js while participating in this hackathon.

HunterCLcode Lee
Computer Science Major at University of Texas at Dallas, 2023
I worked on the front-end and designing the UI. This was my second time using React, so I spent a lot of time learning how to use the framework. I'm very happy with how the site turned out, and I learned a lot this hackathon.

Tim Tersigni
Sophomore UT Dallas Computer Science student. Interested in Web Development.
This hackathon was a fun and informative experience. I worked on back-end development using React. We integrated Google Maps API and created a very functional site.

Daniel Lee