index.mdx

title	Simple Stack
description	Simple Stack is a collection of lightweight tools for Astro and Vite — including a reactive store, scoped IDs, and DOM query helpers — built to simplify web development.
tableOfContents	false
head	tag content title Simple Stack — Reactive Store, Scoped IDs & DOM Queries for Astro tag attrs meta property content og:title Simple Stack — Reactive Store, Scoped IDs & DOM Queries for Astro tag attrs meta property content og:description Simple Stack is a collection of lightweight tools for Astro and Vite — including a reactive store, scoped IDs, and DOM query helpers. tag attrs meta property content og:type website tag attrs content script type application/ld+json { "@context": "https://schema.org", "@type": "WebSite", "name": "Simple Stack", "url": "https://simple-stack.dev", "description": "A collection of lightweight tools for Astro and Vite to simplify web development." } tag attrs content script type application/ld+json { "@context": "https://schema.org", "@type": "FAQPage", "mainEntity": [ { "@type": "Question", "name": "What is Simple Store?", "acceptedAnswer": { "@type": "Answer", "text": "Simple Store is a reactive state management library that combines the simplicity of signals with the power of selectors found in Zustand or Redux. It supports nested sub-stores, React hooks, middleware, and Next.js SSR." } }, { "@type": "Question", "name": "What is Simple Scope?", "acceptedAnswer": { "@type": "Answer", "text": "Simple Scope is a Vite plugin that generates scoped IDs for any file you are in, resolved at build time with zero client JavaScript. It is compatible with Astro, Nuxt, SvelteKit, and any Vite-based framework." } }, { "@type": "Question", "name": "What is Simple Query?", "acceptedAnswer": { "@type": "Answer", "text": "Simple Query is an Astro integration that provides a simple way to query the DOM from Astro components using scoped data-target attributes and a lightweight ready() API with optional signal-based state management." } } ] }

A collection of tools I've built to make web development simpler.

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.

import { CardGrid, Card, LinkCard } from '@astrojs/starlight/components';

A reactive store that combines the simplicity of signals with the power of "selectors" you'd find in Zustand.

	<LinkCard href="/store" title="Documentation" />
</Card>

<Card href="/scope" title="Simple Scope" icon="magnifier">
	A vite plugin that generates scoped IDs for any file you're in. Perfect for form label IDs and query selectors.

	<LinkCard href="/scope" title="Documentation" />
</Card>

<Card href="/query" title="Simple Query" icon="puzzle">
	A simple way to add JS scripts to Astro components.

	<LinkCard href="/query" title="Documentation" />
</Card>