Multi-Tenant PWA
A multi-tenant PWA: one central application with less maintenance, offline support and good performance for every tenant.
Solution example: how we implement a project like this. It does not describe a single client project.
Why PWAs Work Well Here
Initial situation & goals
Progressive web apps are a good fit for multi-tenant applications. Typical starting point: several clients use the same application with their own requirements, and separate native apps drive maintenance costs up.
The problem
Challenges
Client requirements
Each client has different requirements.
Cross-platform use
Native apps bring high costs and complexity.
Offline support
Users expect the app to keep working without an internet connection.
Goals
Approach
Efficiency
Lower maintenance costs through one central PWA.
Flexibility
Per-client customization at runtime.
Reliability
Offline support and fast load times.
Our Approach: Building a PWA That Scales
Approach
How we approach it: we build the multi-tenant progressive web app in modules, so tenant-specific changes never touch the shared core.
Project management
Agile methods
Features are introduced step by step with continuous feedback.
Close client contact
Regular review meetings compare client requirements with the current iteration and feed them into the next one.
Technologies & tools
Angular
Frontend built as a modern single-page application.
Firebase
Hosting, authentication and cloud functions.
Service workers
Offline support and push notifications.
Team & roles
Frontend developers
Build the UI and service workers.
Backend developers
Integrate Firebase and Cloud Functions.
Project manager
Keeps stakeholders and developers working together smoothly.
Implementation: The PWA Architecture
Implementation
A modular architecture with frontend, service and data layers.
Core features
Frontend layer
Angular SPA with a service worker and web app manifest.
Service layer
Firebase Auth, Cloud Functions and push services.
Data layer
Firestore, IndexedDB for offline support and Cloud Storage.
Takeaways and Next Steps
Lessons learned
What it delivers: insights into the obstacles and opportunities of PWA development.
Client focus
A flexible architecture is what makes it work.
Offline-first approach
It improves the user experience considerably when the connection is weak or missing.
Next steps
Add more client features
Improve performance on less powerful devices
Bottom line
A PWA is a cost-effective, long-lasting choice for multi-tenant applications.
Related services
More case studies
Other projects
Accessible Web Applications
How we build accessible web applications to WCAG 2.1: inclusive design, screen readers, keyboard navigation, high-contrast colors and a better experience for every user.
Accessibility & ComplianceRead
Design System for User Interfaces
Shared UI components for faster development: how companies build a design system that grows with them.
Design & DevelopmentReadWhat are you working on?
On the first call, you tell us where things are stuck. We'll tell you honestly whether we're the right fit. 30 minutes, free.
Jens Bohl Founder and Managing Director