๐Ÿ’ญ Inspiration

Environmental sustainability has become increasingly difficult to achieve in the modern world due to factors such as exponential growth in population, consumerism, and the need for natural resources (overexploitation). Through these detrimental effects, our planet has fallen victim to unprecedented changes, including habitat loss, degradation, and climate change.

EcoTogether attempts to address the issue of environmental sustainability through human responsibility. It provides users a social platform where they are able to share resources in order to enact change in their community, and features a tool that helps users find eco-friendly alternatives to commercial products. Through EcoTogether, we aim to bring people together in the environmental movement, and instill hope that it is never too late to save our planet.

โš™ What it does

Our project, EcoTogether, is made up of four main components:

  1. Home: A little introduction on the problem we are trying to solve, our goal/aim, and our roles within this project.
  2. Social: Users can share their contribution to environmental preservation with others. They can post upcoming campaigns and events and can collaborate with each other.
  3. Campaigns/Events: They also have the ability to start campaigns and events. Other users can join these campaigns by donating in order to support the specified cause or meeting up at scheduled clean up sites. As for events, users are able to organize hackathons, seminars, and contests to spread environmental awareness.
  4. Eco-finder: This page helps users to find eco-friendly products instead of commercial ones. For example, if the user wants to find a toothbrush, then it will give search results of environment friendly toothbrush substitutes.

๐Ÿ›  How we built it

  • Frontend: We built out frontend on the ReactJS library and used styled-components for styling and smooth animations. We also used some ready-built components from the Material UI library. In addition to this, react-toastify was used for error handling and Axios was used for handling HTTP requests. We also used a Google Search API for our EcoFinder section.
  • Backend: Our backend was built on Node.js. We used Express.js, which is a Node.js framework, for middleware features. We used MongoDB as our database and mongoose as an ORM. Socket.io was also used to implement the bidirectional data transfer in the chat box inside the campaign section.

Best Domain from domain.com


๐Ÿ˜ต Challenges we ran into

In terms of project management, finding a time to sync posed a challenge as our team lived in different time zones. This made overall development and debugging quite difficult because most problems had to be resolved through text, which can be inefficient when under a time constraint.

Technicality-wise, our team came from various levels of programming knowledgeโ€”while some of us were experienced in the MERN stack, others were used to programming completely with DHTML. We collectively decided to code using MERN, but this meant some of our members had to download new software and adjust their usual coding-style.

๐Ÿ˜ค Accomplishments that we're proud of

  • Completing the project within the given time frame
  • Deploying our idea into a fully functional website with both frontend and backend
  • Building a full stack project
  • Collaborating with other teammates despite time zone differences

๐Ÿ™†โ€โ™‚๏ธ๐Ÿ“– What we learned

We learned many things while doing this project. We learnt to efficiently collaborate with other developers, while helping each other out when needed. Some our teammates used React for the first time, so they had to learn more about it, before getting started. Moreover, we improved our existing technical skills by deploying them, and also learned new ways of building things.

๐Ÿš€ What's next for EcoTogether

  • Improving the UI
  • Adding fully functional features like donations, group chats in the Campaign Section, so that people joining a campaign can interact in the application only and can support the event by donating.
  • Incorporate ML to help users to quickly find eco-friendly products
Share this project: