ARKlight logoARKlight
Getting startedTutorialReferenceExamplesWhyChangelog

Examples

Examples overview
Hello site
Counter
Todo list
Markdown authoring

Hello site

The example that ships in the ARKlight repository (examples/hello_site/site.py), trimmed to its first page.

# include <stdlib.ARKlight>

site = Site()


def nav():
    """A shared nav bar, reused across every page.

    Plain Python function composition like this is how ARKlight expects
    reusable pieces to work today -- no special "component" mechanism
    needed beyond calling other functions (that arrives officially in
    the v0.010 Components milestone, but nothing stops you starting now).
    The current page's nav link is highlighted automatically at runtime
    by the shipped JS -- no wiring needed here."""
    return Container(
        Link("Home", href="/"),
        Link("About", href="/about"),
        class_name="nav",
    )


@site.page("/")
def home():
    return Page(
        nav(),
        Heading("ARKlight"),
        Text("Build websites with Python.", class_name="muted"),
        Container(
            Text("No JavaScript ships to the browser except a tiny, fixed runtime."),
            Text("Just functions -- no templates, no build step."),
            Button(
                "Show details",
                on_click="toggle",
                behavior_target="#more-details",
                toggle_class="hidden",
            ),
            Container(
                Text(
                    "That button uses ARKlight's built-in `toggle` behavior "
                    "-- no JavaScript written by hand, just `on_click='toggle'` "
                    "and `behavior_target='#more-details'` on the button."
                ),
                id="more-details",
                class_name="hidden",
            ),
            class_name="card",
        ),
        title="ARKlight",
    )

What to notice

  • The first line is the include directive.
  • nav() is a plain Python function. Reusable pieces are just function composition.
  • The nav link for the current page is highlighted automatically by the shipped runtime.
  • The Show details button uses the toggle behavior with behavior_target, so it needs no JavaScript of your own.

The full file also defines an /about page. Find it at

examples/hello_site/site.py

in the

ARKlight repository

.

LicenseChangelogGitHubPyPI

ARKlight is GPLv3 with attribution terms; sites you build are yours. Your browser is still running JavaScript. We just made Python responsible for getting it there.