Skip to content

httpserver-node22-sveltekit

Directory actions

More options

Directory actions

More options

Latest commit

 

History

History

httpserver-node22-sveltekit

README.md

SvelteKit HTTP Server

This guide explains how to create and deploy a SvelteKit app. SvelteKit builds on Svelte, a UI framework that uses a compiler to let you write breathtakingly concise components that do minimal work in the browser.

To run this example, follow these steps:

  1. Install the CLI. Use the unikraft CLI or the legacy kraft CLI. You need a BuildKit builder. The easiest way to get one is via Docker. Alternatively, you can also directly set up and use BuildKit, see the quick start.

    Note: The unikraft CLI is the current standard, while kraft is the legacy version. Choose one of the CLIs below and only run the commands associated with it for the rest of this guide.

  2. Clone the examples repository and cd into the examples/httpserver-node22-sveltekit/ directory:

    git clone https://github.com/unikraft-cloud/examples
cd examples/httpserver-node22-sveltekit/

Make sure to log into Unikraft Cloud and pick a metro close to you. This guide uses fra (Frankfurt, 🇩🇪):

Using the unikraft CLI (Recommended)

unikraft login

or

Using the legacy kraft CLI

# Set Unikraft Cloud access token
export UKC_TOKEN=token
# Set metro to Frankfurt, DE
export UKC_METRO=fra

When done, invoke the following command to deploy this app on Unikraft Cloud:

Using the unikraft CLI (Recommended)

unikraft build . --output <my-org>/httpserver-node22-sveltekit:latest
unikraft run --metro fra \
  -m 512M \
  -p 443:3000/tls+http \
  --scale-to-zero policy=on,cooldown-time=1000 \
  --image <my-org>/httpserver-node22-sveltekit:latest

or

Using the legacy kraft CLI

kraft cloud deploy \
  -M 512Mi \
  -p 443:3000/tls+http \
  --scale-to-zero on \
  --scale-to-zero-cooldown 1s \
  .

The output shows the instance address and other details:

Using the unikraft CLI (Recommended)

metro:        fra
name:         httpserver-node22-sveltekit-zmt39
uuid:         cd5071b0-5605-4771-b75d-4789393e60de
state:        starting
image:        <my-org>/httpserver-node22-sveltekit
resources:
  memory:     512MiB
  vcpus:      1
service:
  uuid:       2cd097b5-795c-7184-2968-1508c630fb2b
  name:       dark-fog-z18n0ej1
  domains:
  - fqdn:     dark-fog-z18n0ej1.fra.unikraft.app
networks:
- uuid:       e715723d-4659-2006-bd7b-68a5a3c33cce
  private-ip: 10.0.3.3
  mac:        12:b0:a0:31:90:5a
timestamps:
  created:    just now

or

Using the legacy kraft CLI

[●] Deployed successfully!
 │
 ├───────── name: httpserver-node22-sveltekit-zmt39
 ├───────── uuid: cd5071b0-5605-4771-b75d-4789393e60de
 ├──────── metro: https://api.fra.unikraft.cloud/v1
 ├──────── state: starting
 ├─────── domain: https://dark-fog-z18n0ej1.fra.unikraft.app
 ├──────── image: oci://unikraft.io/<my-org>/httpserver-node22-sveltekit@sha256:4cea210aef3513bd68490640b511ebcff2b867e9222028b9938faccffc21cb83
 ├─────── memory: 512 MiB
 ├────── service: dark-fog-z18n0ej1
 ├─ private fqdn: httpserver-node22-sveltekit-zmt39.internal
 └─── private ip: 10.0.3.3

In this case, the instance name is httpserver-node22-sveltekit-zmt39 and the address is https://dark-fog-z18n0ej1.fra.unikraft.app. They're different for each run.

Use curl to query the Unikraft Cloud instance:

curl https://dark-fog-z18n0ej1.fra.unikraft.app
<!doctype html>
<html lang="en">
[...]
        <body data-sveltekit-preload-data="hover">
[...]

Or even better, point a browser at it 😀 This will get you to play with the SvelteKit demo app.

You can list information about the instance by running:

Using the unikraft CLI (Recommended)

unikraft instances list
METRO  NAME                               STATE    IMAGE                                 ARGS  MEMORY  VCPUS  FQDN                                CREATED
fra    httpserver-node22-sveltekit-zmt39  running  <my-org>/httpserver-node22-sveltekit        512MiB  1      dark-fog-z18n0ej1.fra.unikraft.app  2 minutes ago

or

Using the legacy kraft CLI

kraft cloud instance list
NAME                               FQDN                                STATE    STATUS         IMAGE                                                              MEMORY   VCPUS  ARGS  BOOT TIME
httpserver-node22-sveltekit-zmt39  dark-fog-z18n0ej1.fra.unikraft.app  running  5 minutes ago  oci://unikraft.io/<my-org>/httpserver-node22-sveltekit@sha256:...  512 MiB  1            72.86 ms

When done, you can remove the instance:

Using the unikraft CLI (Recommended)

unikraft instances delete httpserver-node22-sveltekit-zmt39

or

Using the legacy kraft CLI

kraft cloud instance remove httpserver-node22-sveltekit-zmt39

Customize your app

To customize the app, update the files in the repository. That is, you update the SvelteKit / Node / npm-specific files, or the Unikraft Cloud-specific files. This section details each below.

Updating the app

Updating the SvelteKit app is reliant on making npm-related updates.

npm is a package manager for Node. It's used to install dependencies for Node apps. npm uses a package.json file to list required dependencies (with versions).

npm create svelte@latest generated the app files, using the @sveltejs/adapter-node adapter.

The src/routes/sverdle/ directory contains the core implementation. Detailed information on updating the implementation is part of the official SvelteKit documentation.

Updates to the implementation will probably require updates to the package.json file. The package.json file lists npm app dependencies.

Deploying locally

Before deploying the SvelteKit app on Unikraft Cloud, you can deploy locally. Assuming npm is installed, use the following commands:

npm install
npm run dev
  VITE v5.2.6  ready in 807 ms

  ➜  Local:   http://localhost:5173/
  ➜  Network: use --host to expose
  ➜  press h + enter to show help

You can test the app locally by pointing your browser to http://localhost:5173/.

Sample specification

Lines in the Kraftfile have the following roles:

  • spec: v0.7: The current Kraftfile specification version is 0.7.

  • runtime: base-compat:latest: The runtime kernel to use is the base compatibility kernel.

  • rootfs: Build the app root filesystem. source: ./Dockerfile means the filesystem is built using the Dockerfile. format: erofs means the filesystem type is EROFS.

  • cmd: [["/usr/bin/node", "/app/build/index.js"]]: Use /usr/bin/node /app/build/index.js as the starting command of the instance.

Lines in the Dockerfile have the following roles:

  • FROM node:21-alpine AS deps: Use the base image of the node:21-alpine container. This provides the npm binary and other Node-related components. Name the current image deps.

  • WORKDIR /app: Use /app as working directory. All other commands in the Dockerfile run inside this directory.

  • COPY package.json /app: Copy the npm configuration file to be able to install dependencies.

  • RUN npm install: Install npm components listed in packages.json.

  • FROM deps AS build: Create a fresh checkpoint of the base image for the build phase.

  • COPY . /app: Copy contents of the current directory (the actual app files) in the Docker filesystem. Note that paths in the .dockerignore file aren't copied.

  • RUN npm run build; ...: Build the files required for running the app standalone. The app entry point is the resulting /app/build/index.js file that's used as the start command in the Kraftfile. To run the app, configure it as a module.

  • FROM scratch as prod: Use the scratch empty filesystem` as the actual runtime environment. It will only contain the required files from the build.

  • COPY --from=build ...: Copy existing files from new build image to the scratch-based image. This means the app build directory (/app/build) and the required dependencies (/app/node_modules).

Customization options

It's unlikely you will have to update the Kraftfile. The only potential update is the cmd option. But since SvelteKit / npm generates the /app/build/index.js file, you're unlikely to update it.

You also don't need to change the Dockerfile. Updates to the app would be part of the package.json file or the src/ directory. And updating these won't affect the contents of the Dockerfile. Still, if required, apps may require extending the Dockerfile with extra Dockerfile commands.

Learn more

Use the --help option for detailed information on using Unikraft Cloud:

Using the unikraft CLI (Recommended)

unikraft --help

or

Using the legacy kraft CLI

kraft cloud --help

Or visit the CLI Reference or the legacy CLI Reference.