Cloud|

Frontend

Keep server authority while adding the smallest useful browser interaction to a Cloud application.

2 min read Updated 2026-08-12 #frontend#ssr#solidjs

Cloud pages render on the server. Islands add browser behavior where a page needs it.

The server owns result sets, permissions, and durable view state. The browser owns user intent, transient interaction state, and keeping serialized snapshots current through application APIs.

This boundary lets an independently deployed app participate in Cloud's shared shell without becoming a client-only application or importing another app's frontend. A reload remains a complete, authorized rendering path; hydration, enhanced navigation, mutations, and realtime updates improve that path.

Choose the page shape

Boundary Owner Start here
Authorized route and initial result Application server SSR pages and routing
Cloud chrome, breadcrumbs, and registered navigation Shared layout and live app registry Layout and navigation
Content geometry inside the page Application using shared shells Application shells
Local browser interaction The smallest hydrated application island Islands and hydration

Use the URL for filters, sorting, pagination, selection, and the active view. See URL state and navigation.

Add browser behavior only where needed

Finish with Styling and accessibility and Frontend testing.

Choose shared components

Use the UI catalog to inspect supported components, props, and live examples. Shared components carry accessibility, responsive behavior, theming, and platform vocabulary.

Import public components from @k2b/ui and compose them in an application-owned island when the UI needs domain state or typed API calls. Keep domain-specific components in the application. A component belongs in the shared package only when several applications need the same behavior and contract.

If a recurring need is missing, improve the shared primitive and its catalog example instead of hiding a local lookalike or CSS override.

Do not use DockWorkspace for new work. It remains only for compatibility.

Connect a coding agent

The Cloud skill provides compact working instructions. MCP supplies exact current documentation when details matter.

CLI command
bunx skills add https://docs.example.com

This command installs the working instructions published by this website in the selected coding agent.

For exact, current details, also connect the MCP server through one of the agent tabs.

Installation uses the open-source Vercel Skills CLI.

The skill and MCP complement each other: the skill describes workflows, while MCP supplies current documentation.