Skip to content

♻️ Raising awareness of recycling through web. Built by Next.js, Tailwind CSS and Firebase.

Notifications You must be signed in to change notification settings

eggsy/recycling-platform

Repository files navigation

♻️ Recycling Platform

We are trying to raise awareness to the importance of recycling. This is a Google Solution Challenge 2023 project that uses Firebase (authentication, analytics, firestore and storage) as well as latest technologies such as React.js, Next.js, Tailwind CSS and Framer Motion to ensure best user experience. Click here for the real-life app.

Watch the Trailer

Watch the Trailer

Features

  • Easy to use and simple UI.
  • Efficient data with Firestore.
  • User authentication with Firebase.
  • Admin dashboard.
  • Nearby recycling centers map with Google Maps API.
  • File upload with Filepond to Firebase Storage.
  • Smooth animations with Framer Motion and FormKit AutoAnimate.

Techstack

  • React.js & Next.js
  • Tailwind CSS
  • Google Analytics
  • Firebase (firestore, authentication, storage, analytics)
  • PWA (native apps, offline access)

Quick start

Make sure you have Node.js and Git installed on your system. Node.js comes with a package manager called npm but I suggest you use pnpm instead since it's faster and more efficient.

  1. Clone the repository:
    • git clone https://github.com/eggsy/recycling-platform
  2. Install dependencies:
    • pnpm install or npm install
  3. Create a Firestore account and get required fileds in .env.example file.
  4. Fill in the required fields and rename it to .env.local.
  5. Run the app:
    • pnpm run dev or npm run dev for development mode.
    • <pnpm/npm> run build and <pnpm/npm> start for production mode.

Team

image image image
eggsy merloss Semih Özdaş
🔗 - 💼 🔗 - 💼 🔗 - 💼

About

♻️ Raising awareness of recycling through web. Built by Next.js, Tailwind CSS and Firebase.

Topics

Resources

Stars

Watchers

Forks

Languages