My GSoC Project

Hello Everyone,

I am writing this Post to make you aware about my GSoC project ‘Browser-Based Offline Access’

Project Information

My organisation Mifos has a web app(Community app) that works only online, So Community has a valuable request to make it work offline also. Idea is to make the app work offline also so that it works on flaky connections also.

Tech stack

Progressive Web apps - Github
Service-workers - To know more about it. We have a awesome list of service worker on Github
Sw-Toolbox - Service worker Library to cache the static files and api requests
Light house - for auditing and performance of progressive web apps.
Indexed DB - For Client-side storage

Current progress

First Week

Before the coding period, my mentor suggested me to have a proof of concept(POC) of what we are trying to do in our gsoc project. As a POC i made my personal space mohitbajoria.com offline, so we decided to go with the service-workers and its libraries to go offline for our main app.
POC link can be found here on Github - https://github.com/mbj36/My-Blog/tree/gh-pages

2nd-4th week

I made a seperate branch 'offline' in my forked repository on Github to continue all the work related to my project. First step was to register a service worker for community app which was registered succesfully after some blockers. Then i decided to cache all the static files which took almost 2 week to include every files of the community app in the cache options.

Fifth week

Mid term evaluations was going on and I passed it succesfully.This week i also made some changes to code base after testing the cached static files.

6th-7th week

Till now all static files were cached and tested. It was one of the milestone for the project. Then next milestone was to cache all the api requests which community app makes. Community app uses fineract-api. Here Comes the main use of service worker library 'sw-toolbox' which made very easy caching all the api requests. I spent two weeks on caching all the GET, POST, PUT, DELETE requests which comes from fineract.

Eight week

I started testing the community app and made some changes to code after testing. Now our community app has the offline features. All GET requests gets cached when u traversed through the community app. After traversing through the app, it's data get's cached and we can also access it offline.

Commits

As i discussed above i made a seperate branch for offline project. So all the work regarding project can be found here https://github.com/mbj36/community-app/commits/offline

Work to be done

Now in coming weeks i have to work on client side storage. Like community app should also have features like updating, creating new clients, groups etc. For this i will be using IndexedDB for client side storage. If a user wants to update the data or make post requests offline, then it should get stored in local database and gets fired when online.

If you have any doubt regarding the project or tech stack, feel free to shoot me a email at mohitbajo36@gmail.com

Thanks :)