Websites

1. System Context

Developers use Nitric to define required websites within their application.

• App code uses the Website resource defined in nitric.yaml to specify the websites and their configurations.
• Developers can configure base path, index pages, error pages, and other settings in their nitric.yaml file.
• When a website is defined, a single CDN endpoint is automatically created to serve the website content globally, including APIs as proxies.

Operations use default or overridden IaC (e.g., Terraform modules) to provision the necessary resources for their target cloud.

2. Sequence

Build Sequence

Below is the sequence of events that occur when a developer registers a website with Nitric:

3. Component

Website Module

• Deploys website assets to a cloud-based storage solution for flexible and scalable hosting.
• Configures a distribution layer to serve the site globally, rewriting API endpoints to /api/{apiName} for consistent routing.
• Automatically invalidates the cache based on file changes, ensuring users always receive the latest content.

4. Code

Developers write yaml configuration to define the website and implement logic to serve static files.

Nitric website configuration - nitric.yaml

name: service-name
services:
  - match: ./services/*.js
    start: npm run dev:services $SERVICE_PATH
    runtime: node
runtimes:
  node:
    dockerfile: ./node.dockerfile
    args: {}
# The website configuration
websites:
  - basedir: ./my-website
    index: index.html
    error: 404.html
    build:
      command: npm run build
      output: ./dist
    dev:
      command: npm run dev -- --port 4322
      url: http://localhost:4322

Access an API from the website frontend

async function fetchData() {
  // due to apis being served from the same domain thanks to rewrites, no CORS is required
  const response = await fetch('/api/main/hello')
  const data = await response.json()
  console.log(data)
}

Operations will use or extend the Nitric infrastructure modules, including both Terraform and Pulumi:

• Terraform Modules:
  • Not yet available
• Pulumi Modules:
  • AWS Website Pulumi Module
  • Azure Website Pulumi Module