diff --git a/www/astro.config.mjs b/www/astro.config.mjs index 0d7e4c1..7cf14a6 100644 --- a/www/astro.config.mjs +++ b/www/astro.config.mjs @@ -2,9 +2,55 @@ import starlight from "@astrojs/starlight"; import { defineConfig } from "astro/config"; export default defineConfig({ + site: "https://simple-stack.dev", integrations: [ starlight({ title: "Simple Stack 🌱", + head: [ + { + tag: "meta", + attrs: { property: "og:type", content: "website" }, + }, + { + tag: "meta", + attrs: { property: "og:site_name", content: "Simple Stack" }, + }, + { + tag: "meta", + attrs: { name: "twitter:card", content: "summary" }, + }, + { + tag: "script", + attrs: { type: "application/ld+json" }, + content: JSON.stringify({ + "@context": "https://schema.org", + "@type": "WebSite", + name: "Simple Stack", + url: "https://simple-stack.dev", + description: + "A collection of lightweight developer tools for Astro and Vite including a reactive store, scoped IDs, and DOM query utilities.", + author: { + "@type": "Person", + name: "Ben Holmes", + url: "https://bholmes.dev", + }, + }), + }, + { + tag: "script", + attrs: { type: "application/ld+json" }, + content: JSON.stringify({ + "@context": "https://schema.org", + "@type": "Organization", + name: "Simple Stack", + url: "https://simple-stack.dev", + sameAs: [ + "https://github.com/bholmesdev/simple-stack", + "https://wtw.dev/chat", + ], + }), + }, + ], social: [ { icon: "github", diff --git a/www/public/robots.txt b/www/public/robots.txt new file mode 100644 index 0000000..3214756 --- /dev/null +++ b/www/public/robots.txt @@ -0,0 +1,4 @@ +User-agent: * +Allow: / + +Sitemap: https://simple-stack.dev/sitemap-index.xml diff --git a/www/src/content/docs/form/client.md b/www/src/content/docs/form/client.md index 884c722..9a74e17 100644 --- a/www/src/content/docs/form/client.md +++ b/www/src/content/docs/form/client.md @@ -1,6 +1,6 @@ --- title: Add client validation -description: Add client validation to your forms +description: "Generate client-validated form components with Simple Form's CLI using the reward-early-punish-late pattern for accessible, framework-agnostic validation." sidebar: order: 3 --- diff --git a/www/src/content/docs/form/index.mdx b/www/src/content/docs/form/index.mdx index 3e1654e..1707c30 100644 --- a/www/src/content/docs/form/index.mdx +++ b/www/src/content/docs/form/index.mdx @@ -1,6 +1,6 @@ --- title: Simple form -description: The simple way to validate forms in your fullstack app. +description: "Simple Form (simple-stack-form) is a deprecated Astro integration for Zod-based form validation. Use Astro Form Actions instead for server-side form handling." sidebar: label: Get started order: 1 diff --git a/www/src/content/docs/form/parse.md b/www/src/content/docs/form/parse.md index 35116f9..244d884 100644 --- a/www/src/content/docs/form/parse.md +++ b/www/src/content/docs/form/parse.md @@ -1,6 +1,6 @@ --- title: Parse form requests -description: Validate forms server-side +description: "Server-side form validation with Simple Form using validateForm() and Astro.locals.form helpers. Parse and validate FormData with Zod schemas." sidebar: order: 2 --- diff --git a/www/src/content/docs/index.mdx b/www/src/content/docs/index.mdx index 1e6d15c..3d14a67 100644 --- a/www/src/content/docs/index.mdx +++ b/www/src/content/docs/index.mdx @@ -1,15 +1,15 @@ --- -title: Simple stack 🌱 -description: A suite of tools built for Astro to simplify your workflow. +title: Simple Stack +description: Simple Stack is a collection of lightweight, zero-config developer tools for Astro and Vite. Includes a reactive store, scoped IDs, and DOM query utilities. tableOfContents: false head: - tag: title - content: Simple stack 🌱 + content: Simple Stack — Lightweight Developer Tools for Astro & Vite --- -A collection of tools I've built to **make web development simpler.** +Simple Stack is a collection of lightweight developer tools for Astro and Vite. Each package solves a single, focused use case with minimal configuration and zero unnecessary features — a reactive store with selectors, build-time scoped IDs, and a DOM query library for Astro components. -To be honest, there isn't a "story" connecting these packages together (I'm no TanStack). But they follow a common theme: solve a simple use case without too many features. +They follow a common theme: solve a simple use case without too many features. import { CardGrid, Card, LinkCard } from '@astrojs/starlight/components'; diff --git a/www/src/content/docs/query.mdx b/www/src/content/docs/query.mdx index 5549582..4eeeea8 100644 --- a/www/src/content/docs/query.mdx +++ b/www/src/content/docs/query.mdx @@ -1,13 +1,40 @@ --- title: 💰 Simple Query -description: A simple library to query the DOM from your Astro components. +description: "Simple Query (@simplestack/query) is an Astro integration for querying DOM elements with scoped data-target selectors, signal-based reactivity, and server data passing." +head: + - tag: script + attrs: + type: application/ld+json + content: | + { + "@context": "https://schema.org", + "@type": "FAQPage", + "mainEntity": [ + { + "@type": "Question", + "name": "How do I install Simple Query in Astro?", + "acceptedAnswer": { + "@type": "Answer", + "text": "Run 'astro add @simplestack/query' to install and configure the integration automatically. It sets up RootElement, scoped data-target attributes, and TypeScript types." + } + }, + { + "@type": "Question", + "name": "How does Simple Query scope DOM selectors?", + "acceptedAnswer": { + "@type": "Answer", + "text": "Simple Query automatically scopes data-target attribute values to prevent conflicts between components. Use RootElement.ready() with the $() function to select elements by their data-target name." + } + } + ] + } --- import { Tabs, TabItem, LinkCard } from '@astrojs/starlight/components'; -A simple library to query the DOM from your Astro components. +Simple Query (`@simplestack/query`) is an Astro integration that provides a lightweight, scoped way to query DOM elements from Astro components. It uses `data-target` attributes with automatic scoping to prevent selector conflicts, and supports signal-based reactivity via the TC39 Signals proposal polyfill. ```astro diff --git a/www/src/content/docs/scope.mdx b/www/src/content/docs/scope.mdx index 93740de..aafd7c6 100644 --- a/www/src/content/docs/scope.mdx +++ b/www/src/content/docs/scope.mdx @@ -1,13 +1,13 @@ --- title: 🔎 Simple scope -description: Get a scoped ID for whatever file you're in. Resolved at build-time with zero client JS. +description: "Simple Scope (vite-plugin-simple-scope) is a Vite plugin that generates unique, deterministic scoped IDs per file at build time with zero client-side JavaScript." --- import { LinkCard } from '@astrojs/starlight/components'; -Get a scoped ID for whatever file you're in. Resolved at build-time with zero client JS. +Simple Scope (`vite-plugin-simple-scope`) is a Vite plugin that generates unique, deterministic scoped IDs for any file at build time — with zero client-side JavaScript. It works with any Vite-based framework (Astro, Nuxt, SvelteKit) and produces the same ID on both server and client, preventing hydration mismatches. ```jsx import { scope } from 'simple:scope'; diff --git a/www/src/content/docs/store.mdx b/www/src/content/docs/store.mdx index cda86d1..662b8c0 100644 --- a/www/src/content/docs/store.mdx +++ b/www/src/content/docs/store.mdx @@ -1,16 +1,51 @@ --- title: 💾 Simple store -description: A reactive store that combines the simplicity of signals with the power of "selectors" you'd find in Zustand or Redux. +description: "Simple Store (@simplestack/store) is a lightweight reactive state library for React, Next.js, and Vite. Combines signal-like simplicity with Zustand-style selectors and nested sub-stores." sidebar: label: Get started order: 1 +head: + - tag: script + attrs: + type: application/ld+json + content: | + { + "@context": "https://schema.org", + "@type": "FAQPage", + "mainEntity": [ + { + "@type": "Question", + "name": "How do I install Simple Store?", + "acceptedAnswer": { + "@type": "Answer", + "text": "Install from npm with: npm i @simplestack/store. Then import the store function: import { store } from '@simplestack/store'." + } + }, + { + "@type": "Question", + "name": "Does Simple Store work with Next.js?", + "acceptedAnswer": { + "@type": "Answer", + "text": "Yes. Simple Store is compatible with Next.js App Router. Stores initialize once per server request and client components hydrate with the initial value. Any component using useStoreValue must be a 'use client' component." + } + }, + { + "@type": "Question", + "name": "What are sub-stores in Simple Store?", + "acceptedAnswer": { + "@type": "Answer", + "text": "Sub-stores let you operate on specific parts of a nested store by calling select('key') on the parent. Changes to a sub-store automatically update the parent, and vice versa." + } + } + ] + } --- import { LinkCard, Tabs, TabItem } from '@astrojs/starlight/components'; -A reactive store that combines the simplicity of signals with the power of "selectors" you'd find in Zustand or Redux. +Simple Store (`@simplestack/store`) is a lightweight reactive state management library for React, Next.js, and Vite applications. It combines the simplicity of signals with the power of "selectors" you'd find in Zustand or Redux — letting you create stores, select nested values with `select()`, and subscribe to fine-grained updates. ```tsx import { store } from "@simplestack/store"; diff --git a/www/src/content/docs/stream.md b/www/src/content/docs/stream.md index 5c734fb..996b92f 100644 --- a/www/src/content/docs/stream.md +++ b/www/src/content/docs/stream.md @@ -1,6 +1,6 @@ --- title: Simple stream 🌊 -description: Suspend Astro components with fallback content. Like React Server Components, but Just HTML ™️ +description: "Simple Stream (simple-stack-stream) is a deprecated Astro integration for suspending components with fallback content. Use Astro Server Islands instead." --- :::caution