@geenius/blog

A full-featured, framework-agnostic blog engine for Geenius applications: MDX-first content authoring, CRUD-backed post storage, categories, tags, search, reading stats, RSS/Atom feeds, SEO metadata, admin pages, and polished UI across the active Geenius support matrix (react, react-css, solidjs, solidjs-css) plus the four launch provider subpaths.

The parent @geenius/blog package is the only npm publisher; the framework subpaths (/react, /react-css, /solidjs, etc.) and provider subpaths (/convex, /neon, /cloudflareKV, /memory) are exposed as public sub-paths off this single tarball.

Install

pnpm add @geenius/blog

30-second quickstart (React + Tailwind)

import { BlogIndexPage, BlogProvider } from "@geenius/blog/react";
import type { BlogPost } from "@geenius/blog";

const posts: BlogPost[] = [
  {
    slug: "hello-world",
    title: "Hello, world",
    description: "First post.",
    content: "Welcome to the blog.",
    author: { name: "Mehdi" },
    tags: ["intro"],
    publishedAt: "2026-04-30T09:00:00Z",
    readingTime: 1,
  },
];

export function BlogRoute() {
  return (
    <BlogProvider>
      <BlogIndexPage categories={[]} posts={posts} tags={[]} />
    </BlogProvider>
  );
}

Prefer no Tailwind? Swap @geenius/blog/react for @geenius/blog/react-css and add import "@geenius/blog/react-css/styles.css";.

Imports

import {
  DEFAULT_CONFIG,
  generateRSSFeed,
  getBlogConfig,
  type BlogPost,
} from "@geenius/blog";

import { BlogIndexPage, PostDetailPage } from "@geenius/blog/react";
import { BlogIndexPage as BlogIndexPageCss } from "@geenius/blog/react-css";
import "@geenius/blog/react-css/styles.css";

import { BlogIndexPage, PostDetailPage } from "@geenius/blog/solidjs";
import { BlogIndexPage as BlogIndexPageCss } from "@geenius/blog/solidjs-css";
import "@geenius/blog/solidjs-css/styles.css";

import { componentDefinition, listPosts, publishPost } from "@geenius/blog/convex";

Available subpaths:

• @geenius/blog for shared config, content helpers, feed helpers, errors, and types
• @geenius/blog/react for the Tailwind-based React component, hook, and page surface
• @geenius/blog/react-css for the vanilla-CSS React component and page surface
• @geenius/blog/solidjs for the Tailwind-based SolidJS component, primitive, and page surface
• @geenius/blog/solidjs-css for the vanilla-CSS SolidJS component, primitive, and page surface
• @geenius/blog/react-native for native screens, components, and hook-compatible surfaces
• @geenius/blog/convex for blog schema, tables, queries, and mutations
• @geenius/blog/neon for Postgres-backed repository helpers and migrations
• @geenius/blog/cloudflareKV for edge KV snapshots and taxonomy indexes
• @geenius/blog/memory for deterministic local, test, and Storybook stores

The remaining UI-library variants are declared in variants.json with inScope: false and are deferred from the current build, type-check, test, Storybook, Playwright, and coverage matrices. React Native is launch-scoped and tracked separately in scorecard.yaml while native-device verification matures.

Memory fixtures:

import {
  createMemoryBlogStore,
  DEFAULT_MEMORY_BLOG_POSTS,
  resetMemoryBlogStore,
  seedMemoryBlogStore,
} from "@geenius/blog/memory";

const store = createMemoryBlogStore(DEFAULT_MEMORY_BLOG_POSTS);
await seedMemoryBlogStore(store, [
  { ...DEFAULT_MEMORY_BLOG_POSTS[0], title: "Updated" },
]);
await resetMemoryBlogStore(store);

Usage

import type { BlogPost, Category, Tag } from "@geenius/blog";
import { BlogIndexPage } from "@geenius/blog/react";

const posts: BlogPost[] = [
  {
    slug: "shipping-golden-packages",
    title: "Shipping Golden Packages",
    description: "How Geenius standardizes package families.",
    content: "Story-driven package development matters.",
    author: { name: "Mehdi Nabhani" },
    category: "engineering",
    tags: ["packaging", "typescript"],
    publishedAt: "2026-04-12T09:00:00.000Z",
    readingTime: 6,
  },
];

const categories: Category[] = [
  {
    id: "engineering",
    name: "Engineering",
    slug: "engineering",
    postCount: 1,
  },
];

const tags: Tag[] = [
  {
    id: "packaging",
    name: "Packaging",
    slug: "packaging",
    postCount: 1,
  },
];

export function BlogScreen(): React.JSX.Element {
  return <BlogIndexPage categories={categories} posts={posts} tags={tags} />;
}

API Reference

The root @geenius/blog export contains shared post, taxonomy, validation, and memory-store utilities. Framework entrypoints provide matching page and component surfaces:

• BlogIndexPage renders the listing experience from posts, categories, and tags; pass pageSize when the listing should paginate non-featured posts instead of showing the default count.
• PostDetailPage renders a normalized BlogPost with generated metadata, reading progress, related posts, and share actions.
• BlogProvider wires a BlogStore implementation into framework consumers when the package is used with a custom persistence layer.

See .docs/DOCS/PACKAGES/BLOG.md for the package architecture, launch scope, and variant parity expectations.

Storybook

The package includes one stock Storybook v10 application per in-scope UI variant. Use the registry-driven runner for normal development:

• pnpm storybook -- --variant react
• pnpm storybook -- --variant solidjs-css
• pnpm storybook:build
• pnpm test:storybook

Each app consumes the public @geenius/blog/<variant> subpath and includes the V2 .storybook/{main,manager,preview}.ts shape with mandatory Welcome and Tokens stories.

Review variant app entrypoints:

• apps/storybook-react
• apps/storybook-react-css
• apps/storybook-solidjs
• apps/storybook-solidjs-css

Contributing tests

Add or change variants in variants.json first. Build, test, Storybook, size, coverage, and browser harness scripts read that file, so new variant coverage should be a registry change plus the variant source/app files. Do not add hardcoded variant arrays to scripts or configs.

Useful local gates:

• pnpm test:gauntlet
• pnpm test:all
• pnpm test:conventions
• pnpm test:exports
• pnpm test:db:conformance
• pnpm test:db:real (opt-in; requires a Docker-compatible container runtime for the Neon Testcontainers lane and GEENIUS_BLOG_CONVEX_URL pointing at a local convex dev backend — not part of pnpm test:all)
• pnpm test:e2e
• pnpm test:a11y
• pnpm test:visual
• pnpm test:perf
• pnpm size
• pnpm audit:supply-chain
• pnpm test:license
• pnpm test:coverage
• pnpm test:coverage:diff

License

Commercial. See LICENSE.