Claude Code クラウドサーバー配置ガイド

このガイドはクラウドサーバーにVitePressプロジェクトを配置し、PM2を使用してプロセスを管理し、SSH接続が切断された後もサービスが継続実行されるようにする方法を詳しく説明します。

🛠 環境要件

オペレーティングシステム: Linux (Ubuntu/CentOS)
Node.js: v22.11.0 (/www/server/nodejs/v22.11.0/binにインストール)
PM2: プロセスマネージャー
メモリ: 最小512MB
ストレージ: 最小1GB利用可能領域

📋 配置手順

1. サーバー環境設定

1.1 Node.js環境変数設定

bash

# ~/.bashrcまたは~/.profileに追加
echo 'export PATH=$PATH:/www/server/nodejs/v22.11.0/bin' >> ~/.bashrc
source ~/.bashrc

# Node.jsバージョン確認
node --version
npm --version

1.2 プロジェクトディレクトリ作成

bash

# プロジェクトディレクトリ作成
mkdir -p /www/wwwroot/claudecode
cd /www/wwwroot/claudecode

2. プロジェクトファイルアップロード

2.1 SCPを使用したアップロード（推奨）

bash

# ローカルで実行（your-server-ipを実際のIPに置換）
scp -r /c:/Users/PC/Desktop/claudecode.blueshirtmap.com_eN7Pt/* root@your-server-ip:/www/wwwroot/claudecode/

2.2 Gitクローン使用（Gitリポジトリがある場合）

bash

# サーバーで実行
git clone https://github.com/your-username/claudecode.git .

3. プロジェクト依存関係インストール

bash

# プロジェクトディレクトリに移動
cd /www/wwwroot/claudecode

# プロジェクト依存関係インストール
npm install

# 権限問題が発生する場合、次のコマンドを使用
npm install --unsafe-perm

4. プロダクション版ビルド

bash

# プロジェクトビルド
npm run docs:build

# ビルド結果確認
ls -la .vitepress/dist/

5. PM2インストールと設定

5.1 PM2グローバルインストール

bash

npm install -g pm2

# インストール確認
pm2 --version

5.2 PM2設定ファイル作成

bash

# PM2設定ファイル作成
cat > ecosystem.config.js << 'EOF'
module.exports = {
  apps: [
    {
      name: 'claudecode-docs',
      script: 'npm',
      args: 'run docs:preview',
      cwd: '/www/wwwroot/claudecode',
      instances: 1,
      exec_mode: 'fork',
      env: {
        NODE_ENV: 'production',
        PORT: 4173
      },
      error_file: '/www/wwwroot/claudecode/logs/err.log',
      out_file: '/www/wwwroot/claudecode/logs/out.log',
      log_file: '/www/wwwroot/claudecode/logs/combined.log',
      time: true,
      restart_delay: 1000,
      max_restarts: 5,
      min_uptime: '10s',
      max_memory_restart: '1G',
      watch: false,
      ignore_watch: ['node_modules', 'logs', '.git']
    }
  ]
}
EOF

5.3 ログディレクトリ作成

bash

mkdir -p /www/wwwroot/claudecode/logs

6. サービス開始

6.1 PM2を使用してプロジェクト開始

bash

# サービス開始
pm2 start ecosystem.config.js

# サービス状態確認
pm2 status

# ログ確認
pm2 logs claudecode-docs

6.2 PM2自動開始設定

bash

# PM2設定保存
pm2 save

# 自動開始設定
pm2 startup
# 上記コマンドの出力コマンドを実行（通常sudoコマンド）

7. リバースプロキシ設定（オプション）

ドメインを使用してアクセスする必要がある場合、Nginxリバースプロキシを設定できます：

7.1 Nginx設定例

nginx

server {
    listen 80;
    server_name claudecode.blueshirtmap.com;
    
    location / {
        proxy_pass http://localhost:4173;
        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;
        
        # 静的ファイルキャッシュ
        location ~* \.(js|css|png|jpg|jpeg|gif|ico|svg|woff|woff2|ttf|eot)$ {
            expires 1y;
            add_header Cache-Control "public, immutable";
            proxy_pass http://localhost:4173;
        }
    }
}

8. 配置検証

8.1 サービス状態確認

bash

# PM2状態確認
pm2 status

# プロセス詳細確認
pm2 show claudecode-docs

# リアルタイムログ確認
pm2 logs claudecode-docs --lines 50

8.2 ウェブサイトアクセステスト

bash

# ローカルテスト
curl -I http://localhost:4173

# リモートテスト（実際のIPに置換）
curl -I http://your-server-ip:4173

🔧 一般的なPM2管理コマンド

基本コマンド

bash

# すべてのプロセス確認
pm2 list

# サービス再起動
pm2 restart claudecode-docs

# サービス停止
pm2 stop claudecode-docs

# サービス削除
pm2 delete claudecode-docs

# 設定再読み込み
pm2 reload claudecode-docs

ログ管理

bash

# ログ確認
pm2 logs claudecode-docs

# ログクリア
pm2 flush claudecode-docs

# リアルタイムログ
pm2 logs claudecode-docs --lines 100 -f

監視コマンド

bash

# リアルタイム監視
pm2 monit

# メモリ使用量確認
pm2 show claudecode-docs

🚀 パフォーマンス最適化提案

1. 静的ファイル配置（推奨）

bash

# Nginxを使用する場合、静的ファイルを直接配置可能
cp -r .vitepress/dist/* /www/wwwroot/claudecode-static/

2. Gzip圧縮有効化

nginx

# Nginx設定に追加
gzip on;
gzip_vary on;
gzip_min_length 1024;
gzip_proxied any;
gzip_comp_level 6;
gzip_types text/plain text/css text/xml text/javascript application/javascript application/xml+rss application/json;

3. PM2設定調整

javascript

// サーバーパフォーマンスに応じて調整
instances: 'max',  // すべてのCPUコアを使用
max_memory_restart: '500M',  // 利用可能メモリに応じて調整

🛡️ セキュリティ設定

1. ファイアウォール設定

bash

# 必要なポートを開放
ufw allow 22    # SSH
ufw allow 80    # HTTP
ufw allow 443   # HTTPS
ufw allow 4173  # VitePress（直接アクセスする場合）

2. プロセス権限

bash

# 専用ユーザー作成（オプション）
useradd -m -s /bin/bash claudecode
chown -R claudecode:claudecode /www/wwwroot/claudecode

📊 監視とメンテナンス

1. 定期バックアップ

bash

# バックアップスクリプト作成
cat > /root/backup-claudecode.sh << 'EOF'
#!/bin/bash
DATE=$(date +%Y%m%d_%H%M%S)
tar -czf /backup/claudecode_$DATE.tar.gz /www/wwwroot/claudecode
find /backup -name "claudecode_*.tar.gz" -mtime +7 -delete
EOF

chmod +x /root/backup-claudecode.sh

# スケジュールタスクに追加
crontab -e
# 追加: 0 2 * * * /root/backup-claudecode.sh

2. ログローテーション

bash

# logrotate設定
cat > /etc/logrotate.d/claudecode << 'EOF'
/www/wwwroot/claudecode/logs/*.log {
    daily
    rotate 7
    compress
    delaycompress
    missingok
    notifempty
    postrotate
        pm2 reloadLogs
    endscript
}
EOF

🐛 一般的な問題解決

1. ポート占有

bash

# ポート占有確認
netstat -tlnp | grep 4173
lsof -i :4173

# 占有プロセス終了
kill -9 <PID>

2. 権限問題

bash

# 権限修正
chown -R $USER:$USER /www/wwwroot/claudecode
chmod -R 755 /www/wwwroot/claudecode

3. メモリ不足

bash

# メモリ使用量確認
free -h
pm2 show claudecode-docs

# サービス再起動でメモリ解放
pm2 restart claudecode-docs

4. ビルド失敗

bash

# キャッシュクリア後再ビルド
rm -rf node_modules package-lock.json
npm cache clean --force
npm install
npm run docs:build

📞 配置後確認チェックリスト

[ ] ✅ Node.js環境が正しく設定された
[ ] ✅ プロジェクトファイルが正常にアップロードされた
[ ] ✅ 依存関係インストール完了
[ ] ✅ プロジェクトビルド成功
[ ] ✅ PM2が正常に実行している
[ ] ✅ サービスに正常にアクセス可能
[ ] ✅ ログ出力が正常
[ ] ✅ 自動開始設定完了
[ ] ✅ リバースプロキシ設定（必要な場合）
[ ] ✅ ファイアウォールとセキュリティ設定

上記手順を完了すると、Claude Codeドキュメントウェブサイトがクラウドサーバーで安定実行され、SSH接続が切断されてもサービスに影響しません。

Claude Code クラウドサーバー配置ガイド ​

🛠 環境要件 ​

📋 配置手順 ​

1. サーバー環境設定 ​

1.1 Node.js環境変数設定 ​

1.2 プロジェクトディレクトリ作成 ​

2. プロジェクトファイルアップロード ​

2.1 SCPを使用したアップロード（推奨） ​

2.2 Gitクローン使用（Gitリポジトリがある場合） ​

3. プロジェクト依存関係インストール ​

4. プロダクション版ビルド ​

5. PM2インストールと設定 ​

5.1 PM2グローバルインストール ​

5.2 PM2設定ファイル作成 ​

5.3 ログディレクトリ作成 ​

6. サービス開始 ​

6.1 PM2を使用してプロジェクト開始 ​

6.2 PM2自動開始設定 ​

7. リバースプロキシ設定（オプション） ​

7.1 Nginx設定例 ​

8. 配置検証 ​

8.1 サービス状態確認 ​

8.2 ウェブサイトアクセステスト ​

🔧 一般的なPM2管理コマンド ​

基本コマンド ​

ログ管理 ​

監視コマンド ​

🚀 パフォーマンス最適化提案 ​

1. 静的ファイル配置（推奨） ​

2. Gzip圧縮有効化 ​

3. PM2設定調整 ​

🛡️ セキュリティ設定 ​

1. ファイアウォール設定 ​

2. プロセス権限 ​

📊 監視とメンテナンス ​

1. 定期バックアップ ​

2. ログローテーション ​

🐛 一般的な問題解決 ​

1. ポート占有 ​

2. 権限問題 ​

3. メモリ不足 ​

4. ビルド失敗 ​

📞 配置後確認チェックリスト ​

Claude Code クラウドサーバー配置ガイド

🛠 環境要件

📋 配置手順

1. サーバー環境設定

1.1 Node.js環境変数設定

1.2 プロジェクトディレクトリ作成

2. プロジェクトファイルアップロード

2.1 SCPを使用したアップロード（推奨）

2.2 Gitクローン使用（Gitリポジトリがある場合）

3. プロジェクト依存関係インストール

4. プロダクション版ビルド

5. PM2インストールと設定

5.1 PM2グローバルインストール

5.2 PM2設定ファイル作成

5.3 ログディレクトリ作成

6. サービス開始

6.1 PM2を使用してプロジェクト開始

6.2 PM2自動開始設定

7. リバースプロキシ設定（オプション）

7.1 Nginx設定例

8. 配置検証

8.1 サービス状態確認

8.2 ウェブサイトアクセステスト

🔧 一般的なPM2管理コマンド

基本コマンド

ログ管理

監視コマンド

🚀 パフォーマンス最適化提案

1. 静的ファイル配置（推奨）

2. Gzip圧縮有効化

3. PM2設定調整

🛡️ セキュリティ設定

1. ファイアウォール設定

2. プロセス権限

📊 監視とメンテナンス

1. 定期バックアップ

2. ログローテーション

🐛 一般的な問題解決

1. ポート占有

2. 権限問題

3. メモリ不足

4. ビルド失敗

📞 配置後確認チェックリスト