Next.js業務アプリテンプレート|認証・CRUD・予約カレンダー実装済みソースコード TypeScript
- Digital4,980 JPY

Next.js 15(App Router)+TypeScript+Prisma+PostgreSQLで作った、業務アプリの雛形ソースコードです。 ログイン認証・権限管理・顧客管理CRUD・予約カレンダー・お知らせ通知・ユーザー管理を実装済み。Docker Composeで起動でき、PostgreSQL 16の実データベースでの動作確認済みです。 業務アプリで毎回必要になる土台は作り終えた状態から始められるので、あとは自社の業務モデル(テーブル)を追加していく開発に集中できます。 本商品は、Next.js(App Router)+TypeScript+Prisma+PostgreSQLで作った業務アプリケーションの雛形ソースコードです。「業務アプリで毎回必要になる機能」をひと通り実装済みなので、ダウンロード後は自社の業務モデル(テーブル)を追加していくところから開発を始められます。土台づくりにかかる時間を、本来の業務ロジックの開発に使えるようにするためのテンプレートです。 こんな方におすすめ 業務システムや社内ツールの開発を、認証や管理画面の土台から作る手間を省いて始めたい方 Next.js/TypeScriptでの実務レベルの構成(認証・権限・CRUD)を、動くコードで学びたい方 受託開発や副業案件で、案件ごとに使い回せる雛形を持っておきたい方 Prisma+PostgreSQLの構成で、Docker Composeですぐ試せるスターターがほしい方 収録機能 ログイン認証:メールアドレス+パスワードによるログイン。パスワードはbcryptでハッシュ化し、セッションはCookie+データベース(Sessionテーブル)で管理します(有効期限7日、ログアウト時はサーバー側セッションも破棄)。 権限管理:管理者(ADMIN)/一般(USER)の2ロール。メニューの出し分けに加えて、サーバー側でも権限チェックを行う実装です。一般ユーザーには管理メニュー自体が表示されません。 顧客管理CRUD(サンプル実装):一覧・キーワード検索・ページネーション(10件/ページ)、登録・編集・削除。必須チェックやメール形式・電話番号形式のバリデーション付きです。自社の業務モデルを追加するときの見本として使えます。 予約カレンダー:予約(顧客・開始/終了日時・ステータス)を月表示カレンダーに表示。登録・編集・削除に対応し、ステータス(確定/保留/キャンセル)は色分け表示されます。 お知らせ通知:ユーザーごとの既読管理つきお知らせ。ヘッダーとサイドバーに未読件数バッジを表示し、1件ずつ/一括の既読化に対応。管理者から全ユーザーへの一斉配信もできます。 ダッシュボード:顧客数・今後の予約件数・未読件数のサマリーと、直近の予約・未読お知らせの一覧を表示します。 ユーザー管理(管理者用):管理者向けのユーザー管理画面を収録しています。 その他:全画面日本語UI、Tailwind CSSによる画面デザイン。 技術構成・動作環境 Next.js 15(App Router)/React 19/TypeScript Prisma 6/PostgreSQL 16 Tailwind CSS 動作環境:Node.js 20以上。Docker Composeを使う場合はDockerのみで起動できます(PostgreSQLはComposeに同梱)。 ビルド検証済み(npm run build が成功することを確認しています)。また、PostgreSQL 16 の実データベースに接続し、ログイン・ダッシュボード・顧客一覧・予約カレンダー・お知らせ・権限管理の動作確認済みです(動作はDocker Composeでの起動を想定しています)。 セットアップの流れ 1. ZIPを展開し、プロジェクトフォルダで .env.example を .env にコピーします。 2. docker compose up --build を実行します(初回起動時にテーブル作成と初期データ投入が自動で実行されます)。 3. ブラウザで http://localhost:3000 を開き、初期アカウント(管理者:admin@example.com/admin1234、一般:user@example.com/user1234)でログインします。 4. 顧客・予約・お知らせのサンプルデータ(顧客5件・予約5件など)が入った状態で、各機能をそのまま確認できます。 5. 運用を始める前に、初期パスワードと環境変数(SESSION_SECRETなど)を必ず変更してください。変更方法は同梱のREADMEに記載しています。 Dockerを使わない場合は、Node.jsとPostgreSQLを用意して npm install → テーブル作成 → 初期データ投入 → 起動、という手順でも動かせます(詳細は同梱README参照)。 商品仕様 形式:ZIPファイル(ダウンロード販売) 内容:ソースコード一式+README(セットアップ手順・環境変数・初期アカウントの変更方法・ディレクトリ構成・カスタマイズの入口を記載) 価格:¥4,980(税込) ご購入前の注意事項 本商品はソースコードのテンプレートです。購入者様ご自身の開発、および受託開発などの商用案件での利用は可能です。ただし、ソースコードそのものの再配布・転売・公開(無料・有料を問わず)はご遠慮ください。 サポートは同梱READMEの範囲となります。個別の環境構築代行、カスタマイズの代行、業務要件に合わせた改修は本商品には含まれていません。 動作確認は PostgreSQL 16 環境で実施済みですが、お使いの環境(OS、Docker/Node.jsのバージョン等)によっては、追加の設定が必要になる場合があります。 ログイン認証や権限管理は実装済みですが、公開・運用する際は、初期パスワードの変更、環境変数の設定など、README記載の注意事項を必ずご確認ください。本商品は開発の効率化を支援するものであり、特定の成果やセキュリティ水準をお約束するものではありません。 デジタル商品のため、購入後の返品・返金は原則としてお受けできません。内容については本ページの説明をご確認のうえ、ご購入ください。 本商品に記載のライブラリ名・サービス名は、各開発元・権利者の商標です。
