In the midst of the COVID-19 outbreak, panic shoppers are flooding towards grocery stores and supermarkets which is leading to a challenging situation to practice Social Distancing. In addition, as stores get crowded and there is no guarantee that essential items are available, people get more panicked and frustrated day by day during this pandemic situation.
What it does
This ‘Panic Shopping’ Progressive Web Application/Mobile App is designed carefully by considering the Social Distancing requirement which has become a very crucial measure taken by the world to flatten the curve/stop the spreading of COVID-19. This app will provide near real-time updates on Crowd Level and the Availability of the Essential Grocery and other Household Items at the Super markets and Grocery stores. The crowd level and the availability of essential items related information can be reported by shoppers who visit these stores to buy the items for their essential needs. This will help panic shoppers to ensure social distancing by avoiding crowded grocery stores or supermarkets by having alternative plans to shop at a different store location with less crowd or shop at a later time when the crowd level is low.
You can search based on your current location or using any address in your country to get to know the details of the crowd level and the availability of essential items in the stores near to that location.
Together we can help our community in every possible manner we can during this emergency situation by simply reporting the current store status and availability of essential items! Eventually this will help all the panic shoppers to practice social distancing and to avoid unnecessary store visits!
How we built it
We built the solution as a Progressive Web App and Mobile App that can run on any browser, iOS and Android devices so that users have the flexibility to use the app anywhere on any device. Ionic 5 and Angular 8 were used for the front-end with Firebase as the back-end. The nearby stores and supermarkets are downloaded using Google Maps API. Angular RXJS/reactive programming is used to report and display the latest store crowd level and the availability of essential items in near real-time.
Challenges we ran into
- Short deadline to finish the project was one of the challenges we faced.
- Another challenge is to choose the right combination of tech stack to develop the solution.
Accomplishments that we're proud of
- Proud of the ability to produce a solution for a problem that is faced by all the population around the world.
- We were able to complete the Production Ready Progressive Web App(PWA) and Mobile App on time in this short time duration. Mobile App works on both Android and iOS like native apps.
- Mobile App has been submitted to Apple App Store and Google Play Store. Reviews are in progress now.
- PWA has been hosted live at https://panic-shopping.com/.
- Used by communities across Canada.
What we learned
- Learnt about our potential on how much we can achieve during a short time period.
- Became more competent on the tech stack to create mobile Apps and PWAs.
What's next for Panic Shopping
- Successfully publishing to the App Store and Play Store. (Currently reviews are in progress)
- Marketing the app to reach more community across the globe and encourage them use the app for the benefit of all.
- Convincing the store owners across the globe to use the app and update their current store status.
- Scaling the app to handle more capacity.
- Increase the list of essential items to more granular level reporting.
Try It out
angular8, firebase, hybridapp, ionic5, pwa