You drank the SPA coolaid to develop with KEEP. While you can use the usual suspects, most cases Vanilla JS will do fine: one each of index.html, index.css and index.js

The preview problem

Since the files are static, throw them on the server a you are good - of course your regular operation gets disrupted. Throw them on a preview server and your calls to /api/... will fail. You could hack around by providing full URLs, you just enter CORS hell then.

viteJS to the rescue

viteJS brands itself as "Next Generation Frontend Tooling" with the catchy tagline "Get ready for a development environment that can finally catch up with you". Let's give it a spin:

npm create vite@latest

The result is simple

The package.json lists no runtime dependencies and you can run npm run dev to preview the sample page.

Adding the proxy

When starting vite, it looks for vite.config.js for settings. There you can specify all needed proxy settings.

import { defineConfig } from 'vite';

// https://vitejs.dev/config/
export default defineConfig({
  server: {
    proxy: {
      '/api': 'http://localhost:8880',
      '/.well-known': 'http://localhost:8880'
    }
  }
});

The vite.config.js allows for sophisticated configuration like conditional settings (think testing against dev, staging, production), which is up to you to evaluate.

Using npm run build vite works its magic to build a combined distributable app, SPA or otherwise.

As ususal YMMV

In a surprise move the Mozilla Foundation announced to join team spaces in the ongoing developer dispute Tabs vs. Spaces.

Rationale and Value proposition

In a recent statement Mozilla confirmed: "_We are seeing the errors of our way being team tabs for so long_". Mozilla sees an number of advantages in the switch from tabs to spaces:

• Differentiation: IE, Edge, Chrome, Safari, Brave and all the other browsers will look dated compared to the spaces based Firefox
• Freedom from patent US20070136665A1
• Value delivery: a tab only delivers a paltry HEX09, while a single space delivers already a HEX20 and gets delivered two to four times in the same visual space
• Upgradable: HEX20 can be upgraded to HEXA0 with no optical change (OK, your YAML will break, but it will break anyway)

Consequences

Mozilla will rollout "Firefox Spaces" in phases:

• In the first interation warnings will be generated if a site you visit uses tabs. The warnings are on the console only
• Phase 2 will feature warning banner overlays
• Phase 3 will see the replacment of tab navigation by "Firefox in Space"
• Finally sites using tabs will be blocked and reported to NIST's Cyber division

As usual YMMV