Skip to content

h5i-nextjs-starter: a Next.js starter that runs from box create through export #498

Description

@Koukyosyumei

Part of #496.

A starter repository for Next.js, where the full loop works end to end: create a box, start the dev server, check it in the sandboxed browser, and export the result.

Estimated effort: 1 to 2 hours.

What to build

  • A minimal Next.js app (npx create-next-app@latest is fine as a base).

  • A checked-in .h5i/env.toml with the profile and the dev server declared, for example:

    [service.web]
    command = "npm run dev"
    port = 3000
  • A README with copy-pasteable commands for the whole loop:

    h5i box create demo --profile agent-claude
    h5i box shell demo          # npm install && npm run dev inside the box
    h5i box view demo           # watch the page the box is serving
    h5i box share demo --port 3000   # optional: show it to someone else
    h5i box export demo         # patch.diff, report.md, receipt.json
  • An open-source license.

Notes for whoever picks this up

  • The point of this one is that every step works, not just create. If export or view needed a workaround, put the workaround in the README.
  • [service.*] is supported at the workspace and process tiers. At supervised and container, run the dev server inside the same h5i box shell as everything else. State which tier you tested on.
  • Next.js writes a lot into .next/ and node_modules/. Worth a line in the README about what that means for the exported patch, and a .gitignore that keeps the diff readable.
  • Document the egress the build actually needs instead of telling people to open up the allowlist.
  • Never ask users to copy credentials into the sandbox.

When you are done

  1. Publish it as your own GitHub repository.
  2. Open a PR adding it to SHOWCASE.md here.
  3. A screenshot or terminal recording is welcome.

Please comment before starting so we can avoid duplicate work.

Metadata

Metadata

Assignees

No one assigned

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions