Skip to content

Bonus Website (VitePress + Express)

概要

このサービスは、プロジェクトのドキュメントをホストするためのWebアプリケーションです。 単なる静的ホスティングではなく、Node.js (Express) サーバー上で動作し、OAuth API を使用した OAuth2 認証機能を提供します。

構成

技術スタック

  • Framework: Node.js (v20+), Express
  • Documentation: VitePress (Static Site Generator)
  • Authentication: Passport.js (passport-42)
  • Base Image: Alpine Linux (alpine:3.20)

Dockerfile 解析

(srcs/requirements/bonus/website/Dockerfile)

dockerfile
FROM alpine:3.20

# 必要なパッケージ: Node.js, npm
RUN apk add --no-cache nodejs npm openssl curl

WORKDIR /app

# 依存関係のインストール
COPY package*.json ./
RUN npm install

# アプリケーションコードとドキュメントソースのコピー
COPY . .

# エントリーポイント設定
COPY tools/entrypoint.sh /usr/local/bin/entrypoint.sh
RUN chmod +x /usr/local/bin/entrypoint.sh

ENV DOMAIN_NAME=localhost
EXPOSE 4443

ENTRYPOINT ["/usr/local/bin/entrypoint.sh"]
CMD ["npm", "start"]

実装詳細

サーバー実装 (server.js)

Expressサーバーは以下の役割を担います。

  1. 静的ファイルの配信: VitePress でビルドされた dist ディレクトリを配信します。
  2. 認証の強制: 全てのリクエストに対してミドルウェア ensureAuthenticated を適用し、未ログインユーザーをログインページへリダイレクトします。
  3. プロキシ対応: Nginx の背後で動作するため、trust proxy 設定や BASE_URL (/website) の調整を行っています。

認証フロー

Passport-42 ストラテジーを使用し、以下のエンドポイントを実装しています。

  • GET /website/auth/42: 認証開始
  • GET /website/auth/42/callback: コールバック処理

Nginx との連携

docker-compose.yml ではポートをホストに公開していません。 代わりに、Nginx コンテナが内部ネットワーク inception を通じて website:4443 へアクセスします。

nginx
# nginx.conf (抜粋)
location ^~ /website/ {
    proxy_pass http://website:4443/website/;
    proxy_set_header Host $host;
    proxy_set_header X-Forwarded-Proto $scheme;
}

開発・ビルド

ドキュメントのソースはホスト側の docs/ ディレクトリにあり、ボリュームマウントによってコンテナ内の /app/docs と同期されています。

  • ホットリロード: 開発モード (npm run dev) では、Markdownファイルを編集すると即座にブラウザに反映されます。
  • ビルド: entrypoint.sh の中で npm run docs:build が実行され、静的ファイルが生成されます。

参考資料 (References)

Released under the MIT License.