Next.js / Vercel – AI開発実践ラボ https://creativecontentlabtokyo.com AIで、作る力を手に入れる。 Sat, 28 Mar 2026 06:04:29 +0000 ja hourly 1 https://wordpress.org/?v=6.9.4 WEALTH CLUB|会員制コンシェルジュサービス https://creativecontentlabtokyo.com/portfolio/wealth-club/ Sat, 28 Mar 2026 06:04:29 +0000 https://test.creativecontentlabtokyo.com/portfolio/wealth-club%e4%bc%9a%e5%93%a1%e5%88%b6%e3%82%b3%e3%83%b3%e3%82%b7%e3%82%a7%e3%83%ab%e3%82%b8%e3%83%a5%e3%82%b5%e3%83%bc%e3%83%93%e3%82%b9/ プロジェクト概要

富裕層向け会員制コンシェルジュサービス「WEALTH CLUB」のWebアプリケーション。Next.js（App Router）とVercelで構築し、レストラン予約・ラウンジ予約・イベント管理を一元化したポータルです。ダークテーマの高級感あるUI/UXで、会員体験の質を最大化しています。

システム構成図

WEALTH CLUB システム構成図
WEALTH CLUB — System Architecture

主な機能

ダッシュボード

会員情報・予約状況・ポイント残高を一画面に集約。リアルタイムデータ表示。

レストラン予約

提携レストランの検索・詳細・オンライン予約。カテゴリフィルタやお気に入り機能。

ラウンジ予約

会員専用ラウンジの空き状況確認と即時予約。時間帯選択やオプション追加。

イベント管理

会員限定イベントの一覧・詳細・参加申込。カレンダー連携対応。

会員プロフィール

会員情報の管理、予約履歴、ポイント履歴の確認。

セキュリティ

会員ID認証、セッション管理、セキュアなデータアクセス制御。

技術的なポイント

  • Next.js 14（App Router）によるサーバーコンポーネント活用
  • React 19 + TypeScript で型安全なフロントエンド
  • Tailwind CSS によるユーティリティファーストのダークテーマ
  • Vercel でのゼロコンフィグデプロイ + CI/CD
  • 会員ID認証 + セッション管理によるセキュアなアクセス制御

開発プロセス

AIとの対話でUI/UXの方向性を決定し、コンポーネント設計からデプロイまでVibe Codingアプローチで高速に構築。Vercelのプレビューデプロイで迅速なフィードバックサイクルを実現しました。

]]>