@happyvertical/smrt-template-site-static-json

Template for static community news sites with JSON-based data storage. Generates a SvelteKit static site with weather integration (Caelus) and council meeting scraping (Praeco).

What This Template Provides

• SvelteKit with adapter-static for static site generation
• JSON file-based data storage in data/
• Config-driven site identity, navigation, categories, and theming via smrt.config.js
• Weather forecasts via Caelus (Environment Canada)
• Council meeting scraping and article generation via Praeco
• Typed site config helper (initSiteConfig()/getSite())
• Pre-built routes: home, about, contact
• Markdown utility for content rendering

Prerequisites

• Node.js 18+
• pnpm (recommended)
• Gemini API key (for Praeco article generation)

Usage

smrt gnode create my-town-site --template site-static-json \
  --location "My Town, AB" \
  --lat 53.5 --lon -113.5

cd my-town-site
pnpm install
cp .env.example .env      # Add your GEMINI_API_KEY
pnpm run init-data        # Initialize data directory
pnpm dev                  # Start dev server

Environment Variables

Defined in .env.example:

| Variable | Required | Description | |----------|----------|-------------| | GEMINI_API_KEY | Yes | Google Gemini API key for Praeco article generation | | PUBLIC_GTM_ID | No | Google Tag Manager container ID | | CUSTOM_DOMAIN | No | Custom domain for deployment |

Configuration

Edit smrt.config.js to customize. Key sections:

• site -- name, description, location, navigation links, theme colors
• categories -- content categories for routing (e.g., politics/local)
• modules.praeco -- council meeting sources and report configurations
• modules.caelus -- weather location (set automatically from --lat/--lon flags)

Available Scripts

| Script | Description | |--------|-------------| | pnpm dev | Start development server | | pnpm build | Build static site to ./build | | pnpm preview | Preview the built site | | pnpm run init-data | Initialize JSON data files | | pnpm run workflow:caelus | Fetch weather data | | pnpm run workflow:praeco | Scrape council meetings | | pnpm run validate:json | Validate JSON data files | | pnpm run validate:slugs | Validate content slugs |

Template Structure

template/
├── .env.example              # Environment variables
├── .gitignore
├── package.json              # Scripts and dependency placeholders
├── smrt.config.js            # Site identity, modules, theme
├── svelte.config.js          # SvelteKit with adapter-static
├── tsconfig.json
├── vite.config.ts
├── data/                     # JSON data storage directory
├── scripts/
│   └── init-data.ts          # Data initialization script
└── src/
    ├── app.css               # Global styles
    ├── app.d.ts              # SvelteKit type declarations
    ├── app.html              # HTML shell
    ├── site.config.ts        # Typed config helper (initSiteConfig/getSite)
    ├── lib/
    │   └── utils/
    │       └── markdown.ts   # Markdown rendering utility
    └── routes/
        ├── +layout.server.ts # Loads site config for all routes
        ├── +layout.svelte    # Root layout
        ├── +page.server.ts   # Home page data
        ├── +page.svelte      # Home page
        ├── about/            # About page
        └── contact/          # Contact page

Placeholder Substitution

During smrt gnode create, placeholders like {{SITE_NAME}}, {{LOCATION_NAME}}, {{LATITUDE}}, {{LONGITUDE}}, and {{TIMEZONE}} are replaced from CLI flags. See template.config.js for the full mapping.

Deployment

This template uses SvelteKit's static adapter. Build and deploy to any static host:

pnpm build
# Deploy ./build to S3, Netlify, Vercel, Cloudflare Pages, etc.

Related

• SMRT Framework
• SvelteKit