f950357096
Features: - Magazine-style layout with CSS Grid (2-column + sidebar) - ICW NextSpread design system (colors, typography, animations) - Adaptive animation timing based on scroll speed - URL query parameter support (?parse=https://url/file.md) - Drag-and-drop file upload - Syntax highlighting (VS Code Dark+ theme) - Full-bleed hero section with gradient overlay - Responsive design (mobile-first, 44px touch targets) - Static export ready for StackCP deployment Tech Stack: - Next.js 14 (static export) - React 18 + TypeScript - Framer Motion (animations) - markdown-it + highlight.js - Tailwind CSS Design Ported From: - ICW NextSpread property pages (icantwait.ca) - useAdaptiveDuration, useScrollSpeed animation hooks - Webflow-style easing curves - Gallery staggered reveal patterns Deployment: - Configured for digital-lab.ca/infrafabric/IF.docs.md2html - .htaccess with SPA routing and CORS headers - Static files in /out/ directory 🤖 Generated with Claude Code Co-Authored-By: Claude <noreply@anthropic.com>
165 lines
3.5 KiB
Markdown
165 lines
3.5 KiB
Markdown
# Deployment Instructions for StackCP
|
|
|
|
## Prerequisites
|
|
|
|
- SSH access to StackCP server
|
|
- `digital-lab.ca` domain configured
|
|
|
|
## Deployment Steps
|
|
|
|
### 1. Build Production Version
|
|
|
|
```bash
|
|
cd /home/setup/IF.docs.md2html
|
|
npm run build
|
|
```
|
|
|
|
This creates `/out/` directory with static files.
|
|
|
|
### 2. Deploy to StackCP
|
|
|
|
**Option A: Manual SCP Upload**
|
|
|
|
```bash
|
|
# From local machine
|
|
scp -r out/* user@stackcp-server:~/public_html/digital-lab.ca/infrafabric/IF.docs.md2html/
|
|
|
|
# Copy .htaccess
|
|
scp .htaccess user@stackcp-server:~/public_html/digital-lab.ca/infrafabric/IF.docs.md2html/
|
|
```
|
|
|
|
**Option B: SSH and Copy**
|
|
|
|
```bash
|
|
# SSH into StackCP
|
|
ssh user@stackcp-server
|
|
|
|
# Create directory if not exists
|
|
mkdir -p ~/public_html/digital-lab.ca/infrafabric/IF.docs.md2html
|
|
|
|
# From local machine, rsync the files
|
|
rsync -avz --delete out/ user@stackcp-server:~/public_html/digital-lab.ca/infrafabric/IF.docs.md2html/
|
|
```
|
|
|
|
### 3. Set Permissions
|
|
|
|
```bash
|
|
# SSH into StackCP
|
|
chmod -R 755 ~/public_html/digital-lab.ca/infrafabric/IF.docs.md2html/
|
|
chmod 644 ~/public_html/digital-lab.ca/infrafabric/IF.docs.md2html/.htaccess
|
|
```
|
|
|
|
### 4. Test Deployment
|
|
|
|
Open in browser:
|
|
|
|
```
|
|
https://digital-lab.ca/infrafabric/IF.docs.md2html
|
|
```
|
|
|
|
Test URL parsing:
|
|
|
|
```
|
|
https://digital-lab.ca/infrafabric/IF.docs.md2html?parse=https://raw.githubusercontent.com/dannystocker/infrafabric-core/main/README.md
|
|
```
|
|
|
|
## Troubleshooting
|
|
|
|
### 404 Errors on Refresh
|
|
|
|
- Check `.htaccess` is present and readable
|
|
- Verify `mod_rewrite` is enabled in Apache
|
|
- Check RewriteBase matches deployment path
|
|
|
|
### CORS Errors Loading External URLs
|
|
|
|
- Verify CORS headers in `.htaccess`
|
|
- Check external URL allows cross-origin requests
|
|
- Test with raw GitHub URLs (they support CORS)
|
|
|
|
### Blank Page
|
|
|
|
- Check browser console for errors
|
|
- Verify basePath in `next.config.mjs` matches deployment path
|
|
- Test with `npm run dev` locally first
|
|
|
|
### Styles Not Loading
|
|
|
|
- Check `_next/static/` directory exists
|
|
- Verify file permissions (755 for dirs, 644 for files)
|
|
- Hard refresh browser (Ctrl+Shift+R)
|
|
|
|
## File Structure on Server
|
|
|
|
```
|
|
~/public_html/digital-lab.ca/infrafabric/IF.docs.md2html/
|
|
├── _next/
|
|
│ ├── static/
|
|
│ │ ├── chunks/
|
|
│ │ └── css/
|
|
│ └── data/
|
|
├── index.html
|
|
├── 404.html
|
|
└── .htaccess
|
|
```
|
|
|
|
## Quick Deploy Script
|
|
|
|
Create `deploy.sh`:
|
|
|
|
```bash
|
|
#!/bin/bash
|
|
set -e
|
|
|
|
echo "Building production version..."
|
|
npm run build
|
|
|
|
echo "Deploying to StackCP..."
|
|
rsync -avz --delete \
|
|
--exclude='.git' \
|
|
--exclude='node_modules' \
|
|
out/ user@stackcp-server:~/public_html/digital-lab.ca/infrafabric/IF.docs.md2html/
|
|
|
|
echo "Copying .htaccess..."
|
|
scp .htaccess user@stackcp-server:~/public_html/digital-lab.ca/infrafabric/IF.docs.md2html/
|
|
|
|
echo "Setting permissions..."
|
|
ssh user@stackcp-server "chmod -R 755 ~/public_html/digital-lab.ca/infrafabric/IF.docs.md2html/ && chmod 644 ~/public_html/digital-lab.ca/infrafabric/IF.docs.md2html/.htaccess"
|
|
|
|
echo "✅ Deployment complete!"
|
|
echo "🌐 https://digital-lab.ca/infrafabric/IF.docs.md2html"
|
|
```
|
|
|
|
Make executable:
|
|
|
|
```bash
|
|
chmod +x deploy.sh
|
|
```
|
|
|
|
Run:
|
|
|
|
```bash
|
|
./deploy.sh
|
|
```
|
|
|
|
## Updating After Changes
|
|
|
|
1. Make code changes
|
|
2. Test locally: `npm run dev`
|
|
3. Build: `npm run build`
|
|
4. Deploy: `./deploy.sh` or manual SCP
|
|
|
|
## Rollback
|
|
|
|
Keep backups of `/out/` directory:
|
|
|
|
```bash
|
|
# Before deployment
|
|
cp -r out out-backup-$(date +%Y%m%d-%H%M%S)
|
|
```
|
|
|
|
To rollback:
|
|
|
|
```bash
|
|
rsync -avz --delete out-backup-YYYYMMDD-HHMMSS/ user@stackcp-server:~/public_html/digital-lab.ca/infrafabric/IF.docs.md2html/
|
|
```
|