[Phase-3] Distributed rich Single Page Application (SPA): Proof of Concept

Introduction

A proof of concept for a Distributed SPA, enabling separate teams to develop and manage UI components independently.

It is full-fledged development version that is bases on

Vite / ImportMaps / HTML / JS / CSS / Vue3 / Vuetify3 / Pinia.

It is distributed on few repositories:

• poc-mfe-vite-root
• poc-mfe-vite-header
• poc-mfe-vite-dashboard
• poc-mfe-vite-admin

Demo

Click to see Demo ( use admin/admin or any login with same password)

It proves that it works and demonstrate how all these parts are initialized and interacted together from different in-browser modules!

Installation

yarn

Starting in development (serve) mode with enabled HMR

yarn dev

Starting in production (build) mode

yarn build

yarn preview

References

• POC Distributed SPA : Phase-1 Pure implementation without any bundler.

• POC Distributed SPA : Phase 2 It is full-fledged development version.

• POC Distributed SPA : Phase-3 Using of multiple repositiories.

• Vite

• Vue 3

• Vue Router

• Pinia

• Vuetify 3

• Import Maps

• Single-SPA