OVERVIEW

Cleanuminati is a PWA (Progressive Web App) for organizing and joining cleaning parties for clearing garbage. It is part of the global initiative to clean Earth via EarthSquad Global.

TECHNOLOGOY

Cleanuminati PWA is a webapp built using Angular which works and behaves like a native App. The frontend is written using Angular and Typescript with angular-bootstrap for Bootstrap based frontend. The backend is written using multiple services. For Authentication, an OIDC service built with Django and Django-OpenID is used. The REST api for the PWA is implemented using Django Rest Framework. The User's Contacts, Friend and Places were being fetched from other services which built using a PHP Framework.

Since the architecture was oriented towards separate services for different parts as the features were being developed independently of each other, the biggest challenge was keeping all services working together, and the API for different Services working without breaking existing functionality. To this end, we adopted Test Driven Development and container based development and deployment. Developers working on a Angular frontend were not very well versed with Django based OpenID implementation or Django based REST api service. A few services pre-existed in other PHP based frameworks. Setting them up for accessing locally for other developers would have been a challenge, if we had not adopted Container Based Development methodology.

LOGIN SCREEN

SIGNUP SCREEN

PASSWORD RESET SCREEN

WELCOME SCREEN

The users would login via this screen to other Users called EarthSquaders. The PWA would login a User via OpenID service over a REST api.

CLEANING PARTY / EVENT LIST

Cleaning Party can be Organized via this screen. The Map being rendered, uses Open Street Map (OSM) instead of using Google Maps.

CREATE CLEANING PARTY / EVENT

Cleaning Party can be created via this screen.

JOIN CLEANING PARTY / EVENT

Cleaning Party could be Joined via this screen.