React.jsNode.jsExpress.js+3 more
Refillia
A crowdsourced platform mapping free water refill stations to reduce plastic waste.
Role
Full Stack
Team
Solo
Technology Stack
React.js
Node.js
Express.js
Tailwind CSS
React Leaflet
Supabase
Key Challenges
- Map Integration
- Location Services
- Crowdsourced Data
- Real-time Updates
- Mobile Responsiveness
Key Learnings
- React Leaflet
- Geolocation APIs
- Crowdsourcing Systems
- Map Visualization
- Environmental Impact
Refillia: Sustainable Water Refill Station Platform
Overview
Refillia is a crowdsourced platform mapping free water refill stations to reduce plastic waste. Users can discover nearby stations, contribute locations, and earn rewards while promoting sustainable behavior.
Features
- Interactive Map: Discover nearby water refill stations
- Crowdsourced Submissions: Community-driven location data
- Reward System: Earn points for contributions
- Real-time Updates: Live map updates
- Mobile Responsive: Works on all devices
What Users Can Do
- Explore Stations: Find nearby water refill points
- Add Locations: Submit new refill stations
- Earn Rewards: Get points for contributions
- Track Impact: See environmental benefits
- Share Locations: Help others find stations
Why I Built This
I built this platform to address environmental concerns:
- Reducing plastic bottle waste
- Promoting sustainable behavior
- Creating community awareness
- Making refill stations easily discoverable
- Encouraging environmental responsibility
Tech Stack
- Frontend: React.js, Tailwind CSS, React Leaflet
- Backend: Node.js, Express.js
- Database: Supabase
- Maps: React Leaflet for interactive mapping
- Deployment: Vercel
Key Components
- MapView Component: Interactive map with station markers
- StationForm Component: Location submission interface
- Reward System: Points and gamification
- Location Services: Geolocation and mapping
Usage
- Explore nearby water refill stations on the interactive map
- Add new refill points to help the community
- Earn rewards for your contributions
- Track your environmental impact
Architecture
- Frontend: React with Leaflet for mapping
- Backend: Node.js/Express API
- Database: Supabase for location data
- Maps: React Leaflet for interactive features
Environmental Impact
- Promotes sustainable water consumption
- Reduces plastic bottle waste
- Encourages community participation
- Creates awareness about refill stations
