はじめに：開発チームの認証統合課題
現代の開発チームにおいて、複数のツールやサービス間での認証管理は重要な課題となっています。特に、自己ホスト型のGitサービスであるForgejoを採用した場合、開発に関連するツールやアプリケーションをどのように統合し、シームレスな開発体験を提供するかが鍵となります。
今回紹介する「Forgejo認証TODOアプリ」は、この課題に対する一つの解決策として、Forgejo APIを活用した認証機能付きタスク管理アプリケーションを提供します。
Forgejoとは：コーディングエージェント時代の理想的な選択肢
Forgejoは、GitHub Actions互換の「Forgejo Actions」を内蔵した自己ホスト型のGitサービスです。2025年現在、AIコーディングエージェントがソフトウェア開発に革命をもたらしている中で、Forgejoは特に注目すべき特徴を持っています：
- GitHub Actions完全互換: 既存のGitHub Actionsワークフローをそのまま移植可能
- セルフホスト: 企業のセキュリティ要件に対応した自社管理可能な環境
- 軽量: GitLabと比較して軽量で高速な動作
- コミュニティ主導: オープンソースコミュニティによる活発な開発
特に、Claude CodeやOpenHands GitHub Actionなどのコーディングエージェントは、GitHub Actions形式のワークフローを前提としているため、Forgejoは理想的な選択肢となります。
アプリケーションの特徴
🔐 簡単で柔軟な認証システム
- 簡単ログイン: Forgejoのユーザー名・パスワードでそのままログイン
- APIトークン対応: 高度なユーザー向けAPIトークン認証
- 複数ユーザー対応: 各ユーザーが自分のアカウントでログイン可能
📋 高機能なTODO管理
- タスクの追加、編集、削除、完了管理
- 優先度設定: タスクに優先度（高・中・低）を設定可能
- フィルタリング: ステータス（全て・未完了・完了済み）と優先度でフィルタリング
- 統計表示: TODO数、完了率などのリアルタイム統計情報
🌐 モダンなUI/UX
- レスポンシブデザイン: モバイルデバイスにも完全対応
- モダンUI: 直感的で使いやすいインターフェース
- ローカル保存: ブラウザのローカルストレージにデータを安全に保存
動かし方
1. リポジトリのクローン
git clone https://github.com/Sunwood-ai-labs/forgejo-auth-todo-app.git
cd forgejo-auth-todo-app
2. ローカルサーバーの起動
# Python 3を使用する場合
python3 -m http.server 8888
# Node.jsのhttp-serverを使用する場合
npx http-server -p 8888
# PHP開発サーバーを使用する場合
php -S localhost:8888
3. ブラウザでアクセス
http://localhost:8888
4. Forgejo設定（CORS対応）
CORSエラーが発生する場合、Forgejoの設定ファイル（app.ini）に以下を追加：
[cors]
ENABLED = true
ALLOW_DOMAIN = localhost:8888,127.0.0.1:8888
ALLOW_SUBDOMAIN = false
METHODS = GET,HEAD,POST,PUT,PATCH,DELETE,OPTIONS
MAX_AGE = 86400
ALLOW_CREDENTIALS = true
設定後、Forgejoサーバーを再起動してください。
使用方法
簡単ログイン（推奨）
-
Forgejo URL:
http://192.168.0.131:3000/（デフォルト設定、必要に応じて変更） - ユーザー名: あなたのForgejoユーザー名を入力
- パスワード: あなたのForgejoパスワードを入力
- **「ログイン」**ボタンをクリック
APIトークンでのログイン
- **「APIトークンでログイン」**をクリック
- Forgejoでアクセストークンを生成：
- Forgejoにログイン → 右上のアバター → 設定
- アプリケーション → アクセストークンの管理
-
新しいトークンを生成（
read:user権限を選択）
- 生成したトークンを入力してログイン
TODO管理
- 新しいTODO追加: タイトル、説明、優先度を設定して追加
- TODO編集: 編集ボタンで既存TODOを修正
- 完了/未完了切り替え: チェックボタンでステータス変更
- TODO削除: 削除ボタンで不要なTODOを削除
- フィルタリング: ステータスや優先度でTODOを絞り込み
技術スタック
- フロントエンド: HTML5, CSS3, Vanilla JavaScript
- 認証: Forgejo Basic認証 + REST API
- データ保存: Browser LocalStorage
- スタイリング: CSS Grid, Flexbox, CSS Animations
- アイコン: Font Awesome 6
プロジェクト構造
forgejo-auth-todo-app/
├── index.html # メインHTMLファイル
├── style.css # スタイルシート
├── forgejo-auth.js # Forgejo API認証クラス
├── todo-app.js # TODOアプリケーション管理クラス
├── app.js # メインアプリケーションファイル
├── forgejo-cors-config.ini # Forgejo CORS設定ファイル
├── cors-solution.md # CORSエラー解決ガイド
└── README.md # ドキュメント
対応環境
Forgejoインスタンス
-
ローカルForgejo:
http://192.168.0.131:3000/ - Codeberg
- Disroot Git
- Chapril Forge
ブラウザ
- Chrome 80+
- Firefox 75+
- Safari 13+
- Edge 80+
トラブルシューティング
よくある問題
Q: ログインできません
A: 以下を確認してください：
- Forgejo URLが正しいか
- ユーザー名・パスワードが正しいか
- ForgejoサーバーにCORS設定が追加されているか
Q: TODOが保存されません
A: ブラウザのローカルストレージが有効になっているか確認してください。
Q: モバイルで表示が崩れます
A: 最新のブラウザを使用し、JavaScriptが有効になっているか確認してください。
セキュリティ機能
- Basic認証: ユーザー名・パスワードを安全にエンコード
- 認証情報: ローカルストレージに暗号化して保存（7日間有効）
- 最小権限: 必要最小限の権限のみ要求
- セッション管理: 安全なログアウト機能
リポジトリ: Forgejo認証TODOアプリ
ライセンス: MIT License