Skip to content

Repository files navigation

TrainLCD Website Monorepo

Billboard

Node.js >= 18npm v10Turbo

This repository hosts the official TrainLCD landing page and system status page in a single monorepo. The LP is built with Astro, while the real-time status dashboard runs on Next.js 16 and React 19.

Table of Contents

  1. Project Overview
  2. Key Features
  3. Repository Structure
  4. Tech Stack
  5. Getting Started
  6. Environment Variables
  7. Available Scripts
  8. Development Workflow
  9. Architecture Notes
  10. Database & Seeding
  11. Contributing
  12. License

Project Overview

  • apps/lp (Landing Page): Astro + Preact site optimized for static delivery. Used for the public product introduction and announcements.
  • apps/status (Status Page): Next.js App Router app. Prisma + PostgreSQL store service snapshots, while Redis cache + SSE stream real-time updates to the UI.
  • Shared Tooling: Turbo Repo orchestrates tasks, and shared ESLint/TypeScript settings live under packages/.

Key Features

  • 🚆 Real-time monitoring: apps/status automatically refreshes via Redis Pub/Sub + Server-Sent Events.
  • 🌏 Localization: detectLocale() inspects Accept-Language headers and switches between Japanese and English (apps/status/app/server/lib/locale.ts).
  • 🧠 Static + dynamic hybrid: The LP ships as static assets, while the status app serves fresh data via SSR/ISR.
  • 🧰 Centralized lint/TS config: packages/eslint-config and packages/typescript-config keep code quality consistent.
  • 🧪 Vitest coverage: Snapshot and event APIs include dedicated unit/integration tests inside __tests__ folders.

Repository Structure

Website/
├── apps/
│ ├── lp/ # Astro landing page
│ └── status/ # Next.js status app (SSR + SSE)
├── packages/
│ ├── eslint-config/ # Shared ESLint rules
│ └── typescript-config/ # Shared TS config
├── prisma/ # Prisma schema & seed
├── .github/workflows/ # CI (code-quality, etc.)
├── turbo.json # Turbo pipeline definition
└── README.md

Tech Stack

LayerTools
Monorepo managementTurbo Repo, npm Workspaces
Landing pageAstro 5, Preact 10, Sharp
Status appNext.js 16 (App Router), React 19, Tailwind CSS
DataPrisma 6, PostgreSQL, Redis (ioredis)
Real-timeServer-Sent Events, Redis Pub/Sub
Testing & lintingVitest 4, ESLint 9

Getting Started

npm install # Install all workspace dependencies
npm run lint # Run ESLint across the repo via Turbocd apps/status && npm run test# Execute status app tests (Vitest)

Use Node.js 18+ and npm 10.x in local environments. npm run dev launches the dev servers defined in turbo.json, so multiple apps can run in parallel.

Environment Variables

NamePurposeExample
DATABASE_URLPostgreSQL connection for Prismapostgres://trainlcd:password@localhost:5432/trainlcd
REDIS_URLRedis cache + pub/sub endpoint for status updatesredis://localhost:6379
ALLOWED_SNAPSHOT_ORIGINSComma-separated list (or *) for /api/status/snapshot CORShttps://status.trainlcd.app,https://app.trainlcd.com
STATUS_UPDATE_API_KEYShared secret for /api/status/events mutationssuper-secret-key

Store secrets in .env.local under each app and load them via dotenv where needed.

Available Scripts

ScriptDescription
npm run devStart all app dev servers through Turbo
npm run buildBuild every app/package in the workspace
npm run lintRun ESLint with --max-warnings=0
npm run db:seedExecute prisma/seed.ts to load sample data
apps/lp: npm run devLaunch the Astro server (default port 3000)
apps/status: npm run devLaunch the Next.js server (SSE enabled)
apps/status: npm run testRun Vitest suites for APIs and server logic

Development Workflow

  1. Run npm install, npm run lint, and cd apps/status && npm run test to ensure a clean baseline.
  2. Implement changes and add/extend tests under __tests__ (e.g., apps/status/app/server/lib/__tests__).
  3. Before opening a PR, run npm run lint, cd apps/status && npm run test, and npm run build.
  4. Confirm the checklist: zero lint errors, all tests green, new functionality covered by tests.

Architecture Notes

  • SSE stream: apps/status/app/api/status/stream/route.ts merges Redis pub/sub events with PostgreSQL seed data and emits a heartbeat every 30 seconds. Details live in apps/status/SSE_IMPLEMENTATION.md.
  • Middleware guard: apps/status/middleware.ts enforces strict Origin checks, allowing only status.trainlcd.app in production.
  • i18n: See apps/status/I18N_IMPLEMENTATION.md for locale detection and the LocaleText pattern used across services/incidents.
  • Caching: Redis keys encode the locale, caching service and incident payloads for ~60 seconds before falling back to Prisma queries.

Database & Seeding

Prisma schema files live in prisma/schema.prisma. Seed data can be loaded with:

npm run db:seed

The postinstall script inside apps/status runs prisma generate --schema=../../prisma/schema.prisma, so Prisma Client is ready right after installing dependencies.

Contributing

  • Discuss ideas via Issues/Discussions before large changes.
  • Create feature branches such as feat/<topic>.
  • Ensure lint/tests/build all succeed before opening a PR.
  • Include a summary, screenshots (if applicable), and test results in the PR description.

Refer to AGENTS.md and the implementation memos for deeper contributor guidelines.

License

Distributed under the MIT License. See LICENSE for details.

About

📣 Offical website for TrainLCD.

Topics

Resources

Stars

1 star

Watchers

1 watching

Forks

Releases

Packages

Used by

Contributors

Languages