Mastro

A minimal take on an Astro-like MPA web framework. Currently, there are three parts to it:

• The Mastro Guide and accompanying Visual Studio Code for the Web extension that teach you how to build and publish your first webside – using only a browser and a GitHub account.
• The Mastro web framework (server and static site generator) – work-in-progress, currently focusing on getting it running in Deno.
• Reactive Mastro – a tiny reactive GUI library for your existing MPA.

Philosophy

• No magic. Nothing is auto-injected into your page.

• Zero client-side JavaScript by default: extremely fast page loads by leveraging native browser functionality instead of reinventing the wheel in JavaScript. See Reactive Mastro's motivation for more info.

• Minimal dependencies (see deno.json)

• No build step or bundler by default (meaning changes during development are instant, and you can debug in the browser).

• While some frameworks try to erase the boundary between client and server (by putting a leaky abstraction on top), Mastro makes it explicit which parts of your app run where and when.

• File-based routing: routes/ contains files that are served verbatim, as well .server.js files that export route handlers. A handler always takes a Request object (and no props, and hopefully no context) and returns a Response object.

• Server components are simple JS functions that by convention take a props object.

• For client-side components, see Reactive Mastro.

• Easy to understand codebase using simple JS functions wherever possible. Favour small, composable functions.

How to run

Visual Studio Code for the Web extension

• Follow The Mastro Guide's Setup section to install the Visual Studio Code for the Web extension that teach you how to build and publish your first webside – using only a browser and a GitHub account.

Deno

For example cd examples/blog/, then:

Start the development server:

deno task start

Generate the static site:

deno task generate

TODOs

• Asset handling (on server startup / static site generation?)
  • support something like CSS Modules? Then again, read this great article by Heydon Pickering if you want to be convinced otherwise.
  • image resizing