Spacerr
  • Features
  • Pricing
  • FAQ
  • Docs
Get Access
Spacerr
  • Introduction
  • Features
  • Tech Stack
  • Setup
  • Configuration
  • Agents
  • Database
  • Jobs
  • Admin
  • Settings
  • Billing
  • Storage
  • Email
  • Support
  • Localization
  • SEO
  • Analytics
  • UI And Navigation
  • Deploying To Production
  • Testing And QA
  • Troubleshooting

Search documentation

Search documentation pages.

Documentation/Configuration

Configuration

Spacerr keeps configuration close to the part of the app that owns it. This page is about the files you edit when you rename the product, change landing page copy, update SEO, add routes, adjust content, or customize product behavior.

Config Files

The most important places to know are:

  • src/lib/site.config.ts for product identity, default description, author details, and social metadata.
  • src/lib/web.routes.ts for page routes, labels, navigation paths, and absolute URL helpers.
  • src/lib/api.routes.ts for API endpoint paths.
  • src/i18n/en/product.json for landing page and product page copy.
  • src/i18n/en/seo.json for route titles, meta descriptions, and keywords.
  • src/i18n/en/legal.json for Terms of Service and Privacy Policy copy.
  • src/i18n/en/routes.json for route labels used in navigation.
  • src/features/seo for metadata helpers, structured data, llms.txt, and noindex behavior.
  • src/features/*/constants for feature owned limits, options, and UI behavior.

Configuration should stay close to the code that owns the behavior. For example, AI model options belong in the AI chat feature, while landing page copy belongs in the product translation file.

Site Configuration

Site level configuration lives in src/lib/site.config.ts. Change this file when you rename the product, update the default product description, change author details, or update social handles.

typescript
export const SiteName = "Spacerr"

export const SiteConfig = {
  name: SiteName,
  copyrightYear: 2026,
  description: `${SiteName} is a production-ready AI SaaS starter kit with chat, auth, billing, admin, files, blog, SEO, and a polished dashboard.`,
  ogTitle: `${SiteName} — AI SaaS Starter Kit`,
  ogDescription: `Launch AI SaaS products faster with a complete Next.js foundation for AI chat, auth, billing, admin, files, blog, SEO, and dashboard workflows.`,
  author: "Irakli Kverenchkhiladze",
  authorUrl: "https://x.com/TheSpacerr",
  creator: "TheSpacerr",
  twitterCreator: "@TheSpacerr",
  twitterSite: "@TheSpacerr",
}

SiteConfig is used by metadata, structured data, email templates, legal placeholders, and public page defaults.

Product Page Copy

The main landing page copy lives in src/i18n/en/product.json. This file controls the public product surface, including the hero, navigation labels, feature sections, integration copy, pricing section copy, FAQs, and CTA text.

json
{
  "hero": {
    "titleLine1": "Your competitors spent months",
    "titleLine2": "shipping what you get today.",
    "description": "A working <workspace>AI workspace</workspace>, not a template. Chat, projects, auth, billing, admin. All connected. All tested. Add your keys and ship."
  },
  "featuresSection": {
    "title": "The rest of the product your AI workspace needs."
  }
}

Use product.json when changing product positioning, landing page messaging, section titles, product feature copy, pricing page copy, or FAQ answers that appear on the marketing surface.

Product page components live under src/components/product. The translation file owns the words. The components own layout, visuals, media, and interaction.

SEO Configuration

Route metadata copy lives in src/i18n/en/seo.json. This is where you change the title, description, and keywords for public routes.

json
{
  "routes": {
    "root": {
      "title": "AI SaaS Starter Kit for Next.js",
      "description": "Ship your AI SaaS in days, not months. {siteName} includes AI chat workspace, auth, Stripe billing, admin, files, blog, SEO, and dashboard.",
      "keywords": "AI SaaS starter kit, Next.js AI template, Vercel AI SDK starter"
    }
  }
}

The SEO implementation lives in src/features/seo:

  • src/features/seo/get-route-metadata.ts builds route metadata from seo.json.
  • src/features/seo/metadata.ts creates the global metadata object.
  • src/features/seo/structured-data.tsx contains reusable JSON LD helpers.
  • src/features/seo/home-page-json-ld.tsx and src/features/seo/route-seo-json-ld.tsx render page specific structured data.
  • src/features/seo/llms-txt.ts controls the generated LLM readable product summary.
  • src/features/seo/noindex-metadata.ts is used for private or non indexable routes.

Use the page route files only to wire metadata into a route. Keep shared SEO behavior inside src/features/seo.

Route Configuration

Page routes are centralized in src/lib/web.routes.ts. Use WebRoutes for navigation, redirects, links, tests, canonical URLs, and absolute URLs.

typescript
import { WebRoutes } from "@/lib/web.routes"

WebRoutes.product.path
WebRoutes.pricing.path
WebRoutes.dashboard.path
WebRoutes.chat(chatId)
WebRoutes.project(projectId)
WebRoutes.pricing.withBaseUrl()

Route labels live in src/i18n/en/routes.json. Change the route helper when the path changes. Change routes.json when only the visible label changes.

API endpoints are centralized in src/lib/api.routes.ts. Use ApiRoutes from API clients, hooks, helpers, route tests, and shared utilities instead of duplicating endpoint strings.

typescript
import { ApiRoutes } from "@/lib/api.routes"

ApiRoutes.billing.checkoutSession
ApiRoutes.chats.attachments.upload
ApiRoutes.projects.sources(projectId)

Content Pages

Blog routes live under src/app/(app)/(content)/blog. Blog editing and rendering helpers live under src/features/blog.

The important files are:

  • src/features/blog/schemas/create-blog-post.schema.ts for blog creation validation.
  • src/features/blog/schemas/update-blog-post.schema.ts for blog update validation.
  • src/features/blog/utils/blog-post-seo.ts for blog post metadata.
  • src/features/blog/utils/blog-content-html.ts for rendered blog HTML.
  • src/features/blog/components/blog-content-editor.tsx for the editor surface.

Use blog feature files when changing how blog content is validated, edited, rendered, sanitized, or prepared for SEO.

Legal Pages

Legal pages use message copy and a shared legal renderer.

  • src/i18n/en/legal.json contains Terms of Service and Privacy Policy copy.
  • src/features/legal/constants/legal-content.constants.ts contains fixed legal constants such as the last updated date.
  • src/components/legal contains the legal page UI components.
  • src/app/(app)/(legal)/privacy-policy/page.tsx and src/app/(app)/(legal)/terms-of-service/page.tsx wire the default English legal routes.

Change legal.json for policy copy. Change legal-content.constants.ts for shared legal constants. Change the legal route files only when route level metadata or page wiring changes.

Authentication

Auth behavior lives in src/features/auth. Use these files when changing flows, validation, or account behavior:

  • src/features/auth/lib/auth.ts for Better Auth wiring.
  • src/features/auth/lib/auth.schema.ts for auth related validation schemas.
  • src/features/auth/constants.ts for auth owned constants.
  • src/features/auth/account-deactivation for account deactivation flow constants and schemas.

Use the auth feature files when changing code behavior, account flows, validation, or Better Auth wiring.

Billing

Billing behavior lives in src/features/billing. Stripe is the pricing source of truth, and server code fetches Stripe Price objects instead of hardcoding display amounts. The starter is set up around monthly subscriptions, yearly subscriptions, and one time payment examples, but you can reshape those products to match your own pricing model.

The important files are:

  • src/features/billing/schemas/create-checkout-session.schema.ts for allowed checkout products.
  • src/features/billing/utils/get-stripe-price-id.utils.ts for mapping product choices to Stripe price IDs.
  • src/features/billing/repositories/billing-products.repository.ts for loading Stripe product snapshots.
  • src/features/billing/utils/create-checkout-session-url.server.ts for checkout URL creation.
  • src/features/billing/utils/get-kit-access.server.ts for server side paid access checks.
  • src/components/product/pricing.section.tsx for the public pricing section UI.

Change the schema and mapping when you change the purchase options. Change the pricing section when you change how pricing is displayed.

AI Workspace

AI chat configuration is feature owned under src/features/ai/chat/constants.

typescript
export const CHAT_MODEL_OPTIONS = [
  {
    id: "openai/gpt-5.4-nano",
    label: "GPT 5.4 Nano",
    provider: "openai",
    providerLabel: "OpenAI",
  },
]

export const DEFAULT_CHAT_MODEL_ID = "openai/gpt-5.4-nano"

Use these files when changing AI workspace behavior:

  • src/features/ai/chat/constants/chat-model.constants.ts for models and the default model.
  • src/features/ai/chat/constants/chat-attachment.constants.ts for attachment count and file size limits.
  • src/features/ai/chat/constants/chat-project.constants.ts for project behavior.
  • src/features/ai/chat/constants/chat-stream.constants.ts for stream behavior.
  • src/features/ai/chat/constants/chat-cache.constants.ts for cache behavior.
  • src/features/ai/chat/constants/chat-realtime.constants.ts for realtime event names.
  • src/features/ai/chat/constants/ai-shared-context.constants.ts for shared assistant context.

Use constants instead of scattering limits, model IDs, cache timings, or realtime event names across UI and server code.

Realtime, Mail, Analytics, And Storage

Shared provider clients and feature surfaces are split by responsibility:

  • Realtime server publishing starts from src/lib/pusher.server.ts, while chat realtime browser behavior lives in src/features/ai/chat/hooks/use-chat-realtime-events.ts.
  • Transactional emails live in src/features/emails/templates, with send helpers in src/features/emails/lib/emails.lib.ts.
  • PostHog provider wiring lives in src/providers/posthog.provider.tsx.
  • File upload and read routes are centralized through ApiRoutes and the AI chat attachment flow.

Use these files when changing product behavior, UI events, email templates, analytics wiring, or file access patterns.

Use Cases

Marketing Site

Use src/i18n/en/product.json, src/lib/site.config.ts, src/lib/web.routes.ts, src/features/seo, public page components, pricing components, and product media constants to configure the public website.

SEO And Content

Use src/i18n/en/seo.json, src/features/seo, blog SEO helpers, legal copy, sitemap routes, robots routes, Open Graph images, and llms.txt helpers to configure discoverability.

SaaS Application

Use dashboard routes, auth feature files, billing feature files, AI chat constants, settings constants, storage routes, admin modules, and shared API routes to configure the protected product app.

Production Launch

Before launch, review site identity, product copy, SEO copy, legal copy, route labels, pricing behavior, AI model options, email templates, analytics wiring, and public assets.

Setup

Learn how to set up your Spacerr application.

Agents

Understand the repository instructions, rules, and skills that guide coding agents.

On this page
Config FilesSite ConfigurationProduct Page CopySEO ConfigurationRoute ConfigurationContent PagesLegal PagesAuthenticationBillingAI WorkspaceRealtime, Mail, Analytics, And StorageUse CasesMarketing SiteSEO And ContentSaaS ApplicationProduction Launch