I wanted to share a project I’ve been working on during my spear time; it’s a Meteor - Apollo - Progressive Web App boilerplate fully working. I’ve been struggling quite a while with service workers, so I wanted to share the code in case some else is also interested in this topic.
The project can be found here:
This is a short video showing the app’s capabilities:
And this is the list of features/libraries included in the app:
GraphQL server running with Express bound to the Meteor (1.6.1) app
Hello, nice job. I have a similar project and maybe we can learn from each other.
(We’ll publish soon a more complete version of it, with push notification, better layout and stuff)
What are your problems with service worker? And I just did a quick overview in your code and saw that you have multiple React renders to divs (3 root divs), usually it’s a bad practice, any specific reason for doing this?
Hey Filipe, glad you like it! I’ll keep an eye on your project and see if we can exchange some ideas.
Concerning multiple mounting points, I was also concerned about that but couldn’t find any concrete reason why not to use it; I’ve seen other apps using the same approach and at the moment haven’t experienced any misbehaviour in my app. What you need to pay attention to though, is to share the same redux store and router history among those mounting points so that the different parts of your app work in sync.
In my particular case, I wanted to implement App Shell Architecture, meaning, I wanted to have a skeleton of the app that could be cached and displayed when offline but dynamically populated when the app is online. The skeleton is made out of three parts: the body, header and menu. All of these pieces are written in pure HTML + css and dynamically populated via the mounting points. This approach works well for me but would love to see other alternatives to tackle this problem.
