MuNeNiCK.me

Claude Codeを利用してスケジュール調整アプリを作った話

3 min read
AIWeb App

はじめに

シンプルなスケジュール調整アプリ「スケるん」を作ってみました。

スケるんの紹介

公式サイト: https://schedulen.munenick.me

「スケるん（ScheduleN）」は、グループでの日程調整を簡単にするWebアプリケーションです。

主な機能

  • アカウント登録不要
  • 複数の候補日から選択可能
  • カレンダーで参加率を可視化
  • パスワード保護対応
  • スマホ対応

使い方

1. イベント作成

https://schedulen.munenick.me にアクセスして「新しいイベントを作成」をクリック。

必要な情報を入力：

  • イベント名
  • 説明（任意）
  • パスワード（任意）
  • 候補日時

日付は個別追加も一括追加も可能です。

2. URL共有

作成後、自動的にイベントページへ遷移します。このURLを参加者に共有。

https://schedulen.munenick.me/event/abc123def456

3. 参加登録

参加者は「参加する」ボタンから回答：

  • ○：参加可能
  • ×：参加不可
  • △：未定

4. 結果確認

カレンダービューで最適な日程が一目瞭然：

  • 緑：70%以上が参加可能
  • 黄：40-69%が参加可能
  • 赤：40%未満

技術仕様

リポジトリ

https://github.com/MuNeNICK/ScheduleN

使用技術

  • Next.js 15 (App Router)
  • React 19
  • Tailwind CSS v4
  • PostgreSQL
  • shadcn/ui

セルフホスト

セルフホストしたい方向けにDockerイメージを用意しています。

services:
  postgres:
    image: postgres:16
    environment:
      POSTGRES_DB: schedulen
      POSTGRES_USER: schedulen
      POSTGRES_PASSWORD: schedulen_password
    ports:
      - "5432:5432"
    volumes:
      - postgres_data:/var/lib/postgresql/data
    healthcheck:
      test: ["CMD-SHELL", "pg_isready -U schedulen"]
      interval: 30s
      timeout: 10s
      retries: 3

  schedulen:
    image: ghcr.io/munenick/schedulen:latest
    ports:
      - "3000:3000"
    environment:
      DATABASE_URL: postgresql://schedulen:schedulen_password@postgres:5432/schedulen
      NEXT_PUBLIC_BASE_URL: http://localhost:3000
    depends_on:
      postgres:
        condition: service_healthy

volumes:
  postgres_data:
docker-compose up -d

おわりに

このアプリケーションはClaude Codeを使用して開発しました。細かい調整を含めて1時間ほどでアプリを作成することができました。 当初、前々から興味があったWASM版PostgresであるPGLiteを使用していましたが、適していなかったためPostgresへの移行を行いました。そういった要件であってもClaude Codeは問題なく動作しました。

また、code-serverと組み合わせて完全にブラウザのみで開発を行うことができました。 以下参考 https://www.munenick.me/blog/claude-code_on_code-server

つい1年前まではAIは参考程度にしかならなかった記憶がありますが、今では手放せないまでに生活に侵食しています。 技術進歩は恐ろしいですね…