It was during the mid of November, that I came across an internship opportunity while scrolling through my FB newsfeed. I casually applied and had completely forgotten about it. Around 15 days later , a day before my end-sems, I received a call and was informed that I was shortlisted for the role. After a few more calls, I was officially selected as an Intern at PregBuddy. It is a startup aimed at providing personal assistance for would-be-moms to stay informed and track changes during pregnancy. In the mean time, I was briefed about the work to be completed during the 5-6 weeks period. I had to build a Progressive Web App (PWAs) from scratch. The idea of a PWA is proposed by Google and could be the next big thing for the mobile web. I was excited about it, but at the same time nervous as I was completely unaware of the tech stack which was to be used. I went through a few tutorials on ReactJs and gained a bit of confidence and was able to make a simple app in a few days time.
The stack used was ReactJs as the front-end library, Material UI for the UI components and WebPack for asset management. The back-end had already been implemented for the company’s Android app, hence the same was used for the web app. It all started with a npm init and then began the roller-coaster ride of learning a variety of stuffs and most importantly making it production ready and presentable for the users.
A number of features were implemented in the app.
- Progressive features
- Fast, Reliable and Engaging user experience.
- Add to HomeScreen provision with a splash screen.
- Responsive Design with native app like feel.
- Offline support, never shows an error page.
- Push notifications using Firebase Cloud Messaging.
- Service worker implementation involving caching of app shell and assets.
- Lazy loading of images for enhanced browsing and optimized data bandwidth.
- Integrating analytics with custom events – used MixPanel Analytics.
- First Click Free policy of Google, which gives users the access to few articles without signing up.
The best and the most satisfactory part was getting a score of 95/100 by LightHouse, which is an open-source, automated tool for improving the quality of web apps. Just to give an idea, the Flipkart PWA scored 77/100
I faced many hindrances while implementing even the tiniest of the features, but eventually things turned out well. The main learning was figuring a way-out and finding workarounds for problems by going through various articles, documentations, blogs and mainly by ‘efficient googling’. I will talk in details about the problems faced and the technical aspects in my upcoming posts. The site is live on https://app.pregbuddy.com. Do have a look and leave your reviews, to help me improve. Stay tuned !