Files
chorus-services-website/README.md
anthonyrawlins f343f89d24 Initial commit: CHORUS Services marketing website
Complete Next.js website with Docker containerization:
- Next.js 14 with TypeScript and Tailwind CSS
- Responsive design with modern UI components
- Hero section, features showcase, testimonials
- FAQ section with comprehensive content
- Contact forms and newsletter signup
- Docker production build with Nginx
- Health checks and monitoring support
- SEO optimization and performance tuning

Ready for integration as git submodule in main CHORUS project.

Generated with Claude Code

Co-Authored-By: Claude <noreply@anthropic.com>
2025-08-01 22:45:06 +10:00

4.4 KiB

CHORUS Services Website

A modern, responsive marketing website for CHORUS Services - the distributed AI orchestration platform. Built with Next.js 13+, Ant Design 5+, and Framer Motion.

🚀 Features

  • Next.js 13+ with App Router - Latest React Server Components
  • Ant Design 5+ - Enterprise-class UI design language
  • Framer Motion - Production-ready motion library
  • TypeScript - Type-safe development
  • Tailwind CSS - Utility-first CSS framework
  • Custom CHORUS Theme - Dark theme with Apple-inspired design
  • Responsive Design - Mobile-first approach
  • Performance Optimized - Bundle splitting and optimization
  • SEO Ready - Meta tags, structured data, and sitemap

🎨 Design System

  • Primary Color: Electric Blue (#007aff)
  • Secondary Color: Emerald Green (#30d158)
  • Background: Deep Charcoal (#1a1a1a)
  • Typography: SF Pro Text / Inter
  • Border Radius: 8px
  • Animation: Smooth, Apple-inspired transitions

🏗️ Project Structure

website/
├── app/                    # Next.js 13+ App Router
│   ├── layout.tsx         # Root layout
│   ├── page.tsx           # Home page
│   └── globals.css        # Global styles
├── components/            # Reusable components
│   ├── ui/                # Base UI components
│   ├── sections/          # Page sections
│   └── layout/            # Layout components
├── theme/                 # Ant Design theme
├── types/                 # TypeScript definitions
├── utils/                 # Utility functions
└── public/               # Static assets

🛠️ Development

Prerequisites

  • Node.js 18+
  • npm 9+

Installation

# Install dependencies
npm install

# Start development server
npm run dev

# Build for production
npm run build

# Start production server
npm start

Available Scripts

  • npm run dev - Start development server
  • npm run build - Build for production
  • npm run start - Start production server
  • npm run lint - Run ESLint
  • npm run lint:fix - Fix ESLint issues
  • npm run type-check - Run TypeScript checks
  • npm run format - Format code with Prettier

🎯 Components

CHORUS Components

The website showcases four main CHORUS components:

  • WHOOSH - High-velocity data processing engine
  • BZZZ - Intelligent task scheduling and resource management
  • SLURP - Advanced data ingestion and real-time processing
  • COOEE + Monitoring - Comprehensive system monitoring and alerting

UI Components

  • Custom Button component with variants
  • Responsive Header with mobile navigation
  • Feature-rich Footer with social links
  • Animation utilities with Framer Motion
  • Theme-aware components

🎨 Theming

The project uses a custom Ant Design theme with CHORUS branding:

// CHORUS brand colors
const chorusTheme = {
  token: {
    colorPrimary: '#007aff',    // Electric blue
    colorSuccess: '#30d158',    // Emerald green
    colorBgContainer: '#1a1a1a', // Deep charcoal
    // ... more theme tokens
  }
};

📱 Responsive Design

  • Mobile-first approach
  • Breakpoints: xs(576px), sm(768px), md(992px), lg(1200px), xl(1600px)
  • Flexible grid system with Ant Design
  • Touch-friendly interactions

Performance

  • Bundle splitting for optimal loading
  • Image optimization with Next.js
  • Code splitting with dynamic imports
  • CSS-in-JS with minimal runtime overhead
  • Preconnect and prefetch for external resources

🔍 SEO

  • Structured data with JSON-LD
  • Open Graph and Twitter Card meta tags
  • Semantic HTML structure
  • Sitemap generation
  • Robot.txt configuration

🚀 Deployment

npm install -g vercel
vercel --prod

Docker

# Build Docker image
docker build -t chorus-website .

# Run container
docker run -p 3000:3000 chorus-website

Static Export

npm run build
npm run export

🤝 Contributing

  1. Fork the repository
  2. Create a feature branch
  3. Make your changes
  4. Run tests and linting
  5. Submit a pull request

📄 License

Copyright © 2024 CHORUS Services. All rights reserved.

🆘 Support

For support and questions: