Nature Bridge

Logo | Nature Bridge
Chat Bot
VS Code
Submission form
Footer
DialogFlow API
manage auth0
DialogFlow API
Google Cloud
Home Page | Header
Shopping Section

Problem Statement

To create an e-Commerce store using different open-source API's The product should promote sustainability using gamification tactics

💡Inspiration

The inspiration for this project comes from the growing need for sustainable and eco-friendly practices in our daily lives. With the increasing concern about the impact of waste on the environment, more and more people are looking for ways to reduce their carbon footprint and support businesses that prioritize sustainability.

Our e-commerce website offers customers an opportunity to do just that by incentivizing them to recycle their materials and rewarding them with discounts and coupons for their efforts. Through this platform, we aim to encourage more people to adopt green practices while also making it easier and more affordable for them to do so. Basically using gamification tactics to encourage people to recycle items.

⚙What it does

The e-commerce website provides a platform for customers to return their recyclable materials and receive discounts and coupons in return. The process is simple - customers can browse our website, select the items they wish to purchase, and add them to their cart. At checkout, they can opt to return their recyclable materials instead of throwing them away. Once we receive their materials, we verify and process the return and credit their account with the corresponding discounts and coupons. Customers can then use these rewards to purchase more items from our website, creating a sustainable cycle of consumption and recycling.

The project aims to promote sustainable practices and encourage more people to take an active role in reducing waste and protecting the environment

🔧How it was built

The project was built using a variety of technologies and API tools to ensure efficient and effective development. Git and GitHub were used for version control and collaborative coding, while Auth0 was used to manage user sign-up and login. The application itself was created using React JS, Redux and Bootstrap, which helped speed up the development process. To add icons to the website, Fontawesome was used, which is a popular resource for high-quality icons.

For the helpdesk feature, DialogFlow API by Google was utilized, which was deployed on Google Cloud and then integrated into the website. The Chatbot feature was also developed using ReactJS inbuilt libraries, which allowed for seamless integration with the website. In order to collect responses for submitting recyclable products, Google Forms was used.

Finally, the coding was done using VSCode, which is a popular code editor known for its versatility and ease of use. Git and GitHub were used for version control, which helped keep track of changes to the codebase and ensure that multiple developers could work on the project simultaneously. Overall, the combination of these tools and technologies helped make the development process smoother and more efficient, resulting in a high-quality e-commerce website for customers to return recyclable materials and receive rewards in return.

💪Challenges faced during the creation of Project

Integrating multiple APIs can lead to technical difficulties, and we encountered problems during deployment due to bugs. When this happened, we stayed focused and carefully examined the code to identify any issues that could be causing the problem. We wanted to deploy chatbot on Kommunication but it’s server was down.

It was the first time for us using ReactJS and Redux, we found it challenging to get the hang of these technologies. To overcome these challenges, we turned to online tutorials and forums for assistance, and even sought guidance from more experienced developers as there was some time given before hackathon to team up. Through persistence and hard work, we are able to become proficient in these technologies and create a high-quality e-commerce website that met the needs of my customers.

📌Accomplishments

We are thrilled to say that our experience with React JS and Redux during my e-commerce project is a resounding success! Not only did we have a chance to flex my coding skills, but we also had the opportunity to experiment with different APIs and their unique features. It was a fantastic opportunity for us to learn and grow together.

During the project, we were able to implement some truly amazing APIs that helped take our website to the next level. These tools allowed us to create a more immersive and engaging experience for our customers. As a result, we gained a newfound appreciation for the power of APIs and the potential they hold for future projects.

Overall, this project has given us a professional and creative insight into the world of web development. It has shown us what it takes to create a high-quality website that meets the needs of users, and how to utilize different technologies and APIs to achieve that goal. We are excited to continue exploring new tools and approaches, and to keep refining my skills as developers.

📚What we learned

Throughout our project, we had the opportunity to explore and experiment with a wide variety of cutting-edge technologies and APIs. we were thrilled to discover how tools like ReactJS and Redux could be leveraged to create seamless, high-quality user experiences.

Moreover, we were blown away by the sheer number of amazing APIs that were available in the market. By incorporating these powerful tools into my project, we were able to achieve a level of functionality and sophistication that I had never thought possible.

Working with these technologies and APIs taught me invaluable lessons about the art and science of web development. I learned how to effectively balance form and function, streamline the user experience, and build highly scalable and adaptable systems.

Overall, our experience with ReactJS, Redux, and various other APIs has been nothing short of transformative. We are excited to continue exploring the many incredible tools and technologies available to developers, and to keep pushing the boundaries of what is possible in the world of web development.

⏭What's next for Nature Bridge

Looking to the future, we are excited to take Nature Bridge to the next level by integrating powerful new APIs and technologies. One of our primary goals is to incorporate Google Maps into the platform, allowing customers to track the location of their trees in real-time.

By harnessing the power of Google Maps, we will be able to provide an unparalleled level of transparency and engagement for our customers. They will be able to see exactly where their trees are planted and monitor their growth and development over time. This will create a deeper sense of connection between our customers and the natural world, fostering a greater appreciation for the value and beauty of the environment.