From c02bf7b333596ca92861d58c9f629290cd82387d Mon Sep 17 00:00:00 2001 From: callumalpass Date: Sun, 26 Jul 2026 12:31:58 +1000 Subject: [PATCH] Improve first-time mdbase onboarding --- public/examples/sandbox-quickstart.mjs | 50 +++ src/components/DocsLayout.astro | 59 +++- src/components/SiteFooter.astro | 4 + src/components/SiteHeader.astro | 8 +- src/layouts/BaseLayout.astro | 2 +- src/layouts/HomeLayout.astro | 2 +- src/pages/connect/index.astro | 63 +++- src/pages/index.astro | 216 +++++++++++- src/pages/sdk/connect-quickstart/index.astro | 258 ++++++++++++++ src/pages/sdk/index.astro | 42 ++- src/pages/sdk/quickstart/index.astro | 272 +++++++-------- src/styles/global.css | 125 +++++++ src/styles/home.css | 339 +++++++++++++++++++ 13 files changed, 1240 insertions(+), 200 deletions(-) create mode 100644 public/examples/sandbox-quickstart.mjs create mode 100644 src/pages/sdk/connect-quickstart/index.astro diff --git a/public/examples/sandbox-quickstart.mjs b/public/examples/sandbox-quickstart.mjs new file mode 100644 index 0000000..f186ef4 --- /dev/null +++ b/public/examples/sandbox-quickstart.mjs @@ -0,0 +1,50 @@ +import { unwrapOperation } from "@mdbase/connect"; +import { createSandbox } from "@mdbase/connect-dev"; + +const { client, transport } = createSandbox({ + records: [ + { + path: "tasks/first.md", + types: ["task"], + frontmatter: { + type: "task", + title: "Read the collection", + completed: false + } + } + ] +}); + +const first = unwrapOperation(await client.read({ path: "tasks/first.md" })); + +const created = unwrapOperation( + await client.create({ + type: "task", + path: "tasks/second.md", + frontmatter: { + type: "task", + title: "Update one record", + completed: false + } + }) +); + +const updated = unwrapOperation( + await client.update({ + path: created.path, + patch: { completed: true }, + if_revision: created.revision + }) +); + +const tasks = unwrapOperation( + await client.query({ + types: ["task"], + limit: 20 + }) +); + +console.log(`Read: ${first.frontmatter.title}`); +console.log(`Updated: ${updated.path} (completed: ${updated.frontmatter.completed})`); +console.log(`Task records: ${tasks.results.length}`); +console.log(`Markdown paths: ${transport.snapshot().map((record) => record.path).join(", ")}`); diff --git a/src/components/DocsLayout.astro b/src/components/DocsLayout.astro index d7e0256..78c4687 100644 --- a/src/components/DocsLayout.astro +++ b/src/components/DocsLayout.astro @@ -9,20 +9,36 @@ interface Props { } const { title, description, active, headings = [] } = Astro.props; -const docs = [ - { href: "/sdk/", label: "Overview", key: "overview" }, - { href: "/sdk/quickstart/", label: "Quickstart", key: "quickstart" }, - { href: "/sdk/portable-apps/", label: "Portable HTML apps", key: "portable-apps" }, - { href: "/sdk/manifest/", label: "Application manifest", key: "manifest" }, - { href: "/sdk/contracts/", label: "Contracts and adapters", key: "contracts" }, - { href: "/sdk/authorization/", label: "Authorization", key: "authorization" }, - { href: "/sdk/operations/", label: "Records and operations", key: "operations" }, - { href: "/sdk/routing/", label: "Local and hosted routes", key: "routing" }, - { href: "/sdk/testing/", label: "Testing", key: "testing" }, - { href: "/sdk/notifications/", label: "Notifications and timers", key: "notifications" }, - { href: "/sdk/offline-sync/", label: "Offline sync", key: "offline-sync" }, - { href: "/sdk/security/", label: "Security model", key: "security" }, - { href: "/sdk/api/", label: "API reference", key: "api" } +const docGroups = [ + { + label: "Start", + docs: [ + { href: "/sdk/quickstart/", label: "Try the SDK locally", key: "quickstart" }, + { href: "/sdk/connect-quickstart/", label: "Connect a browser app", key: "connect-quickstart" }, + { href: "/sdk/", label: "SDK overview", key: "overview" } + ] + }, + { + label: "Build", + docs: [ + { href: "/sdk/portable-apps/", label: "Portable HTML apps", key: "portable-apps" }, + { href: "/sdk/manifest/", label: "Application manifest", key: "manifest" }, + { href: "/sdk/contracts/", label: "Contracts and adapters", key: "contracts" }, + { href: "/sdk/authorization/", label: "Authorization", key: "authorization" }, + { href: "/sdk/operations/", label: "Records and operations", key: "operations" }, + { href: "/sdk/routing/", label: "Local and hosted routes", key: "routing" }, + { href: "/sdk/testing/", label: "Testing", key: "testing" }, + { href: "/sdk/notifications/", label: "Notifications and timers", key: "notifications" }, + { href: "/sdk/offline-sync/", label: "Offline sync", key: "offline-sync" } + ] + }, + { + label: "Reference", + docs: [ + { href: "/sdk/security/", label: "Security model", key: "security" }, + { href: "/sdk/api/", label: "API reference", key: "api" } + ] + } ]; --- @@ -33,10 +49,17 @@ const docs = [ Connect SDK diff --git a/src/components/SiteFooter.astro b/src/components/SiteFooter.astro index f4fcbea..99b1950 100644 --- a/src/components/SiteFooter.astro +++ b/src/components/SiteFooter.astro @@ -5,7 +5,11 @@

Markdown collections with types, queries, and explicit app permissions.