Marko + Fastify

Quick Start

npm init marko -- --template vite-fastify

See the the fastify sample project for a working example.

From Scratch

First install Marko and the fastify related dependencies:

npm install marko @marko/fastify fastify --save

Usage

The @marko/fastify adds a reply.marko decorator to the reply object. This function allows us to pass in a Marko template and supports Marko's streaming and modular approach to templates.

By using reply.marko you'll automatically have access to app.locals, and reply.locals from within your Marko template and custom tags. These values are added to $global.

import fastify from "fastify";
import markoPlugin from "@marko/fastify";
import Template from "./template.marko";

const app = fastify();

app.register(markoPlugin);

app.get("/", (request, reply) => {
  // Streams Marko template into the response.
  // Forwards errors into fa error handler.
  reply.marko(Template, { hello: "world" });
});

await fastify.listen(3000);

Global Outputs

We can add global outputs from the server side using the reply object or fastify instance.

reply.locals.newProperty = "Your value";

To use this in marko components we just need to refer out.global

$ const { newProperty } = $global;

$ const { newProperty } = $global;

To know more about sending the data to the browser checkout:

Sending global data to browsers

BYOB (Bring your own bundler)

For the large portion of Marko's API a bundler is required. The example code above assumes that Marko templates can be loaded in your environment. Marko supports a number of bundlers, take a look through our supported bundlers and pick what works best for you.

EDIT