Static HTML Page

html() wraps content with the correct content-type for browsers. Use single quotes for HTML attributes (double quotes delimit Soma strings). Serve: soma serve 051_html_page.cell Test: open http://localhost:8080

Example 051 of the basic Soma programs: a small, commented program that teaches one thing. Every output below was printed by soma 3.2.4 when this page was built.

How it is built

The cell StaticPage declares 1 signal in its face: request(method: String, path: String, body: String) -> String. Handlers: request (line 18).

Generated from soma describe on this file.

The source

051_html_page.cell

// ============================================================================
// 051 — Static HTML Page
// ============================================================================
// html() wraps content with the correct content-type for browsers.
// Use single quotes for HTML attributes (double quotes delimit Soma strings).
//
// Serve: soma serve 051_html_page.cell
// Test:  open http://localhost:8080
//
// Run:   soma run 051_html_page.cell request GET / ""
// Expect: (HTML output)

cell StaticPage {
    face {
        signal request(method: String, path: String, body: String) -> String
    }

    on request(method: String, path: String, body: String) {
        // html() tells Soma to serve this as text/html
        // Note: use single quotes for HTML attributes inside Soma strings
        return html("<!DOCTYPE html>
<html lang='en'>
<head>
    <meta charset='utf-8'>
    <title>Hello Soma</title>
    <style>
        body {
            font-family: system-ui, sans-serif;
            max-width: 600px;
            margin: 50px auto;
            padding: 20px;
            background: #f5f5f5;
        }
        h1 { color: #333; }
        p { color: #666; line-height: 1.6; }
        .card {
            background: white;
            padding: 24px;
            border-radius: 8px;
            box-shadow: 0 2px 8px rgba(0,0,0,0.1);
        }
    </style>
</head>
<body>
    <div class='card'>
        <h1>Hello from Soma!</h1>
        <p>This page is served by a Soma cell. The entire app is one file.</p>
        <p>Soma turns cells into web servers automatically.</p>
    </div>
</body>
</html>")
    }
}

What the toolchain says

$ soma check 051_html_page.cell
✓ All checks passed.

$ soma run 051_html_page.cell request GET / ""
{"_status": 200, "_body": "<!DOCTYPE html>\n<html lang='en'>\n<head>\n    <meta charset='utf-8'>\n    <title>Hello Soma<\/title>\n    <style>\n        body {\n            font-family: system-ui, sans-serif;\n            max-width: 600px;\n            margin: 50px auto;\n            padding: 20px;\n            background: #f5f5f5;\n        }\n        h1 { color: #333; }\n        p { color: #666; line-height: 1.6; }\n        .card {\n            background: white;\n            padding: 24px;\n            border-radius: 8px;\n            box-shadow: 0 2px 8px rgba(0,0,0,0.1);\n        }\n    <\/style>\n<\/head>\n<body>\n    <div class='card'>\n        <h1>Hello from Soma!<\/h1>\n        <p>This page is served by a Soma cell. The entire app is one file.<\/p>\n        <p>Soma turns cells into web servers automatically.<\/p>\n    <\/div>\n<\/body>\n<\/html>", "_content_type": "text/html; charset=utf-8"}