Skip to content
Open
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
46 changes: 46 additions & 0 deletions www/astro.config.mjs
Original file line number Diff line number Diff line change
Expand Up @@ -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",
Expand Down
4 changes: 4 additions & 0 deletions www/public/robots.txt
Original file line number Diff line number Diff line change
@@ -0,0 +1,4 @@
User-agent: *
Allow: /

Sitemap: https://simple-stack.dev/sitemap-index.xml
2 changes: 1 addition & 1 deletion www/src/content/docs/form/client.md
Original file line number Diff line number Diff line change
@@ -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
---
Expand Down
2 changes: 1 addition & 1 deletion www/src/content/docs/form/index.mdx
Original file line number Diff line number Diff line change
@@ -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
Expand Down
2 changes: 1 addition & 1 deletion www/src/content/docs/form/parse.md
Original file line number Diff line number Diff line change
@@ -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
---
Expand Down
10 changes: 5 additions & 5 deletions www/src/content/docs/index.mdx
Original file line number Diff line number Diff line change
@@ -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';

Expand Down
31 changes: 29 additions & 2 deletions www/src/content/docs/query.mdx
Original file line number Diff line number Diff line change
@@ -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';

<LinkCard href="https://github.com/bholmesdev/simplestack-query" title="Source code" />

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
<RootElement>
Expand Down
4 changes: 2 additions & 2 deletions www/src/content/docs/scope.mdx
Original file line number Diff line number Diff line change
@@ -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';

<LinkCard href="https://github.com/bholmesdev/simplestack-scope" title="Source code" />

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';
Expand Down
39 changes: 37 additions & 2 deletions www/src/content/docs/store.mdx
Original file line number Diff line number Diff line change
@@ -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';

<LinkCard href="https://github.com/bholmesdev/simplestack-store" title="Source code" />

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";
Expand Down
2 changes: 1 addition & 1 deletion www/src/content/docs/stream.md
Original file line number Diff line number Diff line change
@@ -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
Expand Down
Loading