The Obvious Company Website

September 18, 2025 · View on GitHub

Strategic Intelligence Amplification website with hybrid static/dynamic architecture.

🚀 Quick Deploy

🚀 Quick Start

Local Development

# Install dependencies
npm run setup

# Start development server
npm run dev

# Test email configuration
npm run test:email

Railway Deployment

# Install Railway CLI
npm install -g @railway/cli

# Login and deploy
railway login
railway init
railway up

See RAILWAY_DEPLOYMENT.md for detailed deployment instructions.

📁 Project Structure

├── website/                 # Static website files
│   ├── css/                # Stylesheets
│   ├── js/                 # Client-side JavaScript
│   ├── images/             # Static images
│   ├── server/             # Node.js backend
│   └── *.html              # HTML pages
├── tests/                  # Test files
├── .vscode/                # VS Code configuration
└── config files            # Linting, formatting, etc.

🛠️ Development

Available Scripts

# Development
npm run dev              # Start dev server with watch
npm run dev:verbose      # Start with detailed logging

# Building
npm run build           # Build for production
npm run build:css       # Build CSS only

# Testing
npm test               # Run all tests
npm run test:email     # Test email configuration
npm run test:e2e       # Run E2E tests

# Code Quality
npm run lint           # Lint all files
npm run format         # Format all files
npm run validate       # Lint + test

# Deployment
./deploy.sh            # Deploy to Railway
npm run deploy:production  # Production deployment

🚀 Deployment Options

Vercel (Recommended)

# Install Vercel CLI
npm i -g vercel

# Deploy
vercel

Netlify

# Install Netlify CLI
npm i -g netlify-cli

# Deploy
netlify deploy --prod

Docker

# Build and run
docker-compose up -d

Environment Variables

Set these in your deployment platform:

SMTP_USER - Gmail email address
SMTP_PASS - Gmail app password
CONTACT_EMAIL - Contact form recipient
WEBSITE_URL - Your app URL

See DEPLOYMENT_OPTIONS.md for complete guide.

Development Workflow

Start Development: npm run dev
Make Changes: Edit files in website/
Test Changes: Visit http://localhost:3000
Run Tests: npm test
Commit: Git hooks will run linting automatically

📧 Email Configuration

Set up Gmail App Password:
- Enable 2FA on Gmail
- Generate App Password
- Update .env file
Test Configuration:
```
npm run test:email
```
See: EMAIL_SETUP.md for detailed instructions

🧪 Testing

Unit Tests (Jest)

npm run test:frontend    # Frontend JavaScript tests
npm run test:server      # Backend Node.js tests

E2E Tests (Playwright)

npm run test:e2e         # Full browser testing

Manual Testing

Contact form: http://localhost:3000/contact.html
Newsletter: http://localhost:3000/#newsletter
Assessment: http://localhost:3000/assessment/

🎨 Code Quality

Automatic Formatting

Prettier: Code formatting
ESLint: JavaScript linting
Stylelint: CSS linting
HTMLHint: HTML validation

Git Hooks

Pre-commit: Runs linting and formatting
Commit-msg: Validates commit message format

VS Code Integration

Install recommended extensions
Automatic formatting on save
Integrated linting

🏗️ Architecture

Hybrid Approach

Static Files: HTML, CSS, JS served directly
Dynamic API: Node.js backend for forms, email
Progressive Enhancement: Works without JavaScript

Key Features

📱 Responsive design
⚡ Performance optimized
🔒 Security headers
📧 Email integration
📊 Analytics ready
♿ Accessibility compliant

🚀 Deployment

Staging

npm run deploy:staging

Production

npm run deploy:production

📝 Environment Variables

Copy .env.example to .env and configure:

# Server
PORT=3000
NODE_ENV=development
WEBSITE_URL=http://localhost:3000

# Email
SMTP_HOST=smtp.gmail.com
SMTP_USER=your-email@gmail.com
SMTP_PASS=your-app-password
CONTACT_EMAIL=contact@theobviouscompany.com