RecycleRoute ♻️

Our planet is slowly dying and is about to enter an irreversible stage. Take action and make a difference with RecycleRoute! RecycleRoute is an app that lets you upload a photo of any item and discover where to recycle, sell, donate, or dispose of it responsibly. RecycleRoute also offers valuable tips and tracks your environmental impact. Let's safeguard our planet together—before it's too late—by using RecycleRoute!

MVP 🛠️

• User account with user authentication
  • Recycled Statistics are tracked and accessible in user profile
• Allows users to take photos of objects in the app
  • Uses Google Cloud Vision API to identify objects and decipher what category of trash they belongs to
• Have a bag feature so you can put multiple items into a bag and find tips for everything (instead of one at a time)
• Shows nearest facilities to dispose of items
  • (Chemical Collection Center for Batteries, Recycling center for recyclables, Selling/donation center for clothes and Electronic Recycling Centers for old electronics)
• Provides waste guides and helpful tips depending on the category of object
  • Do NOT throw away batteries, instead dispose at a designated battery recycling center
• Chatbot for answering recycling-related questions
  • Where should I throw it away?
  • Is it safe to recycle this?
    
    

Stretch Goals 🚀

• Crowdsourcing feature to add/verify location of recycling bins and other disposal locations
• Community post page to feature events to volunteer to pick up trash/clean environments
• Social tab/ Leaderboard to compare points with friends and other users
  • Also implement feature to associate with university, organization, or etc to compete against others
• Garbage & Recycling Schedules
• DIY Recycling Projects (crafts, gardening, etc)
• Gamification with points, levels, streaks, goals, quests, and rewards

Milestones 📆

Week 1: Set Up 09/4 - 09/11 🌱

General:

• Discuss who’s frontend/backend and the overall project/tech stack
• Set up communication, environments, and when2meet
• Go over GitHub basics
• Start working on UI designs with Figma
  • Low Fidelity to High Fidelity

Frontend

• Look into React Native and CSS

Backend

• Start looking into Tech Stack (MongoDB, Express, Node.js)
• Play around with the APIs (use Postman)
• Look into LLM for chatbot and start playing around with it

Week 2: Planning 09/11 - 09/18 ☘️

Frontend:

• Go over some UI design basics
• Flesh out the collective vision for the app
• Figma Design due by the end of week 2

Backend:

• Plan out database design schema
• Start setting up the User Authentication and the Database. Have a working prototype by the end of the 2nd week
• Keep doing research with the tech stack and APIs
• Look into LLM for chatbot and start playing around with it

Weeks 3/4: Coding 09/18 - 10/02 🪴

Frontend:

• Code initial screens
  • Login/SignUp Pages
  • Picture Page
    • Should be able to take/upload pictures of an object
    • Identifies what the item is and provides a helpful guide and tips on how to recycle it (image a Pokedex )
      • Access to the Recycle Page
    • Have a bag to add uploaded multiple objects
      • Shows quantity, item, and ability to remove
  • Recyle Page
    • Google Maps with custom icons for recycling areas
    • Google Map integration that shows the nearest available disposal facilities

Backend:

• Set up the APIs for object detection and categorizing the type of recycling
• Start training the LLM and setting up the chatbot
• Start working on adding guides and tips that appear when trash items are received

Weeks 5/6: Middle Ground 10/02 - 10/16 🌵

Frontend:

• Profile Page

  • Has user’s information and their statistic
  • History of what has been recycled

• Home page

  • Has user statistic
    • Number of ___ recycled
    • Reduced Carbon footprint
    • How long the world could last if everyone recycled like you
  • Helpful guides and tips for recycling

• Chatbot Page

  • Should allow the user to input any text they want

Backend:

• Connect the login/create page with the backend database
• Home Page
  • List the user’s stats and their impact on the planet
  • Provides courses/links/videos to tips on how to recycle
• User Database
  • Each object the user recycles is stored in history and the statistics are tracked and updated
• Chatbot Implementation
  • Have it work with some basic questions like: - Where should I throw it away? - Is it safe to recycle this?
  
  

Weeks 7/8: Finishing Touches 10/16 - 10/30 🌳

• Backend and Frontend communicate to finish integration to connect and test
• Have the entire app working
• If possible work on stretch goals:
  • Community post page to feature events to volunteer to pick up trash/clean environments
  • Social tab/ Leaderboard to compare points with friends and other users
  • DIY Recycling Projects (crafts, gardening, etc)
• Begin working on the script

Frontend:

• Polish up MVP features and help the backend if needed

Backend:

• Finish everything

Weeks 9/10: Preparations 10/30 - 11/13 🌲

General:

• NO MORE CODING unless for bug fixes!
• Prepare for Presentation Night! (Make hats from paper for coolness effect)
• Polish app and slides so they are ready to go

Tech Stack & Resources 🖥️

• Wireframing: Figma
• IDE: VSC
• Frontend: React Native with Expo
  • Resources:
    • What is React?
    • React Native #1: Setup Visual Studio Code
    • Setting up the Environment
    • Learn the Basics
    • React Native Tutorial for Beginners
    • React Native Tutorial for Beginners - Getting Started
• Backend:
  • Frameworks:
    • Node.js
    • Express.js
  • MongdoDB:
    • Complete MongoDB Tutorial #1 - What is MongoDB?
    • How to Start With Node & Express From Zero - Node Authentication API Part-1
  • APIs:
    • Fetching Data from An API in React Native
    • Searching for APIs
    • Suggestions
      • Recycle API
      • Google
        • Google Vision API
          • Integrating Google Cloud Vision API with React Native
        • Google Places API
        • Javascript Google Places API to Display Nearby Places Info
    • Build A REST API With Node.js, Express, & MongoDB - Quick
  • LLM
    • 5 min vid: How Large Language Models Work
    • Chatbot Fine Tuning
      • Fine-tuning Large Language Models (LLMs) | w/ Example Code
    • Langchain
      • Langchain JS | How to Use GPT-3, GPT-4 to Reference your own Data | OpenAI Embeddings Intro
    • ChatGPT
    • Write A ChatGPT Chatbot With Node.js

Software to Install

• VS Code or Android Studio
• React Native & Expo
• Node.Js
• Git
• GitHub - Docs - Tutorial
• MongoDB

Roadblocks and Possible Solutions 🚧 💡

• Fetching all the available disposal facilities nearby
  • If the online APIs or databases don’t contain the correct disposal facilities nearby then we would have to create our own database containing the locations near UTD OR have a crowdsourcing method where users can verify/check if a location is a disposal center.
• The image upload and object detection not working accurately
  • Use other software such as Detectron2/ YOLOv8/ AWS Rekognition
• Either the Frontend or Backend team falling behind
  • If this happens the best course would be to get some assistance from the other side until caught up

Competition 🥊

• Waste Connect (No image scanner)
• Recycle Coach (No image scanner)
• Scrapp (Does not show nearby locations)
• Bower (No community Feature and image scanner)
  

Git Commands 📓

Command	What it does
git branch	lists all the branches
git branch "branch name"	makes a new branch
git checkout "branch name"	switches to speicified branch
git checkout -b "branch name"	combines the previous 2 commands
git add .	finds all changed files
git commit -m "Testing123"	commit with a message
git push origin "branch"	push to branch
git pull origin "branch"	pull updates from a specific branch

RecycleRoute TEAM!! 🎉

• Hishita Shah
• Arin Sood
• Pranav Gehlot
• Ayro Escobar
• Jason Luu - Project Manager
• Anjelica Avorque - Industry Mentor