dss/STORYBOOK_DEPLOYMENT.md

Storybook Deployment Status

Date: 2025-12-09 Status: ⚠️ Partially Deployed (HTTP only)

Current Configuration

URLs

• HTTP: http://storybook.dss.overbits.luz.uy ✅ Working
• HTTPS: https://storybook.dss.overbits.luz.uy ❌ Not configured

Infrastructure

• Port: 6006
• Service: Storybook Dev Server (PID: 3546941)
• Nginx Config: /etc/nginx/sites-available/storybook.dss.overbits.luz.uy.conf ✅
• Enabled: Yes (symlinked in sites-enabled)
• SSL: ❌ Not configured

Nginx Configuration

server {
    server_name storybook.dss.overbits.luz.uy;

    location / {
        proxy_pass http://127.0.0.1:6006;
        proxy_http_version 1.1;
        proxy_set_header Host $host;
        proxy_set_header X-Real-IP $remote_addr;
        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
        proxy_set_header X-Forwarded-Proto $scheme;
        proxy_set_header Upgrade $http_upgrade;
        proxy_set_header Connection "upgrade";
    }

    listen 80;
}

What's Working

✅ Storybook server running on localhost:6006 ✅ Nginx reverse proxy configured ✅ HTTP access via http://storybook.dss.overbits.luz.uy ✅ WebSocket upgrade support (for HMR)

What's Needed

🔐 SSL Certificate Required

Sysadmin Action Needed:

# Run certbot to obtain SSL certificate
sudo certbot --nginx -d storybook.dss.overbits.luz.uy

# This will automatically:
# 1. Obtain Let's Encrypt certificate
# 2. Update nginx config with SSL settings
# 3. Add HTTPS redirect from HTTP
# 4. Set up auto-renewal

Why This is Needed:

• Modern browsers show warnings for HTTP sites
• WebSocket connections prefer HTTPS
• Consistent security with main DSS site (https://dss.overbits.luz.uy)
• Best practice for production documentation

Documentation Updates

✅ Updated Files

• docs/02_status/PROJECT_STATUS.md - Added Storybook URL to deployment status
• README.md - Added Storybook to production URLs
• STORYBOOK_DEPLOYMENT.md - This file

Production URLs Reference

Admin UI:   https://dss.overbits.luz.uy/              (Port 3456) ✅ HTTPS
Storybook:  http://storybook.dss.overbits.luz.uy     (Port 6006) ⚠️ HTTP only
DSS API:    http://localhost:3458                     (Internal)

Next Steps

For Sysadmin

1. Run certbot for storybook.dss.overbits.luz.uy
2. Verify HTTPS access works
3. Confirm auto-renewal is configured

After SSL is Configured

1. Update this document to mark SSL as ✅
2. Update PROJECT_STATUS.md to remove "Pending SSL" warning
3. Update README.md to use HTTPS URL
4. Test Storybook functionality over HTTPS

Design Token Integration

Storybook is configured with DSS design tokens:

• Token file: admin-ui/design-tokens.json (W3C DTCG format)
• CSS tokens: admin-ui/css/dss-tokens.css
• Theme config: dss-mvp1/.storybook/dss-theme.ts

Components documented in Storybook:

• 18 custom web components (ds-* prefix)
• Complete design token library
• Interactive component playground

Service Management

Check Status

ps aux | grep storybook | grep -v grep

View Logs

# Nginx access logs
tail -f /var/log/nginx/storybook_dss_overbits_luz_uy_access.log

# Nginx error logs
tail -f /var/log/nginx/storybook_dss_overbits_luz_uy_error.log

Restart Storybook

cd /home/overbits/dss/dss-mvp1
npm run storybook

Summary

Status: Storybook is running and accessible via HTTP. Only missing SSL certificate for production-ready HTTPS access.

Action Required: Sysadmin needs to run certbot --nginx -d storybook.dss.overbits.luz.uy

Priority: Medium - Site is functional but HTTP-only is not ideal for production documentation.