Skip to main content

Website Development Setup

Purpose: For contributors, shows how to run and develop both the openCenter marketing website and this documentation site.

Marketing Website (opencenter-website)

The marketing website communicates product value, features, pricing, and provides contact/support mechanisms.

Tech Stack

  • Framework: Next.js 16.2.0 (with Turbopack for dev)
  • Language: TypeScript 5.9
  • Runtime/Package Manager: Bun 1.3.11
  • UI: React 19, Radix UI, Tailwind CSS v4, lucide-react icons
  • Forms: react-hook-form + zod v4 validation
  • Email: Mailgun (contact form delivery)
  • Analytics: PostHog
  • Theming: next-themes (dark/light mode)
  • Container runtime: Distroless Node.js 24 (production)

Prerequisites

  • Bun 1.3.11+
  • Mise (manages tool versions)
  • Git

Setup

cd opencenter-website
bun install

Development

bun run dev

The dev server starts at http://localhost:9002 with Turbopack hot reload.

Environment Variables

Create a .env file (see .env.example):

# Network binding
HOST=0.0.0.0
PORT=9002

# Mailgun (contact form)
MAILGUN_API_KEY=key-xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx
MAILGUN_DOMAIN=mg.example.com
MAILGUN_TO_EMAIL=contact@opencenter.cloud
MAILGUN_FROM_EMAIL=no-reply@mg.example.com
MAILGUN_FROM_NAME="openCenter Website"
MAILGUN_REGION=us # or "eu" for EU-hosted accounts

# PostHog analytics
NEXT_PUBLIC_POSTHOG_KEY=phc_xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx
NEXT_PUBLIC_POSTHOG_HOST=https://us.i.posthog.com

Build & Deploy

# Production build
bun run build

# Start production server
bun run start

# Build container image
podman build -t opencenter-dev-app:distroless .

The Containerfile uses a multi-stage build:

  1. Install production dependencies
  2. Build Next.js standalone output
  3. Run on gcr.io/distroless/nodejs24-debian12:nonroot (port 3000)

Available Scripts

CommandDescription
bun run devDev server with Turbopack on :9002
bun run buildProduction build
bun run startProduction server on :9002
bun run lintESLint
bun run typecheckTypeScript type checking

Documentation Site (opencenter-docs)

This documentation site uses Docusaurus and lives in the opencenter-docs repository.

Prerequisites

  • Node.js >=24.8.0
  • Bun (latest)

Setup

cd opencenter-docs
bun install

Development

bun run start

The site runs at http://localhost:9000 with hot reload.

Site Structure

opencenter-docs/
├── docs/ # Documentation content (Markdown)
├── blog/ # Blog posts
├── src/ # React components and custom pages
├── static/ # Static assets
├── docusaurus.config.ts # Site configuration
├── sidebars.js # Sidebar structure
└── Makefile # Development shortcuts

Adding Content

Pages use Markdown with YAML frontmatter:

---
id: my-new-page
title: "My New Page"
description: Short summary for search and previews.
doc_type: tutorial
audience: "contributors"
tags: [example]
---

Page content here.

Update sidebars.js or the relevant _category_.json if the page should appear in navigation.

Verify Before Pushing

bun run prettier:check
bun run build

The build fails on broken links and anchors — fix all references before pushing.

Troubleshooting

SymptomFix
bun: command not foundInstall: curl -fsSL https://bun.sh/install | bash
Website dev server fails to startCheck .env exists with required Mailgun variables
Docs build fails on broken linksFix the referenced path or anchor
Config changes not reflectedRestart the dev server