Skip to content

プロジェクト構成

このドキュメントは、NuxSaaSプロジェクトの主なディレクトリとファイルの概要を提供します。コントリビューターやユーザーがコードベースの構成を素早く理解できるようにすることを目的としています。

トップレベルのレイアウト

NuxSaaS/
├── .env.example
├── .github/
├── .vscode/
├── app/
├── public/
├── server/
├── tests/
├── eslint.config.mjs
├── nuxt.config.ts
├── package.json
├── tsconfig.json
├── vitest.config.ts
└── wrangler.example.toml

ディレクトリおよびファイルの概要

.env.example

環境変数のテンプレート。ローカル環境用にコピーして.envにリネームしてください。

.github/

GitHubの設定ファイル(ファンディングやワークフロー定義など)。

.vscode/

VS Codeのワークスペース設定、推奨拡張機能、デバッグ構成。

app/

フロントエンドアプリケーションのコードを格納:

  • app.vue, app.config.ts: Nuxtアプリのメインエントリと設定。
  • assets/: 静的アセット(CSS、画像など)。
  • components/: Vueコンポーネント。
  • composables/: 再利用可能なComposition APIユーティリティ。
  • i18n/: 国際化リソース。
  • layouts/: ページ構造用のレイアウトコンポーネント。
  • middleware/: フロントエンドのルートミドルウェア。
  • pages/: Nuxtページ(ルートにマッピング)。
  • plugins/: アプリ機能拡張用のNuxtプラグイン。
  • utils/: ユーティリティ関数や型定義。

public/

ファビコン、ロゴ、スクリーンショットなど、サイトのルートで配信される静的ファイル。

server/

バックエンド/サーバーサイドのコード:

  • api/: APIルートハンドラー。
  • database/: データベース設定とスキーマ。
  • middleware/: サーバーミドルウェア。
  • utils/: サーバーサイドユーティリティ。

tests/

自動テストファイル(E2Eテストやセットアップスクリプトを含む)。

eslint.config.mjs

コードリントとスタイル強制のためのESLint設定。

nuxt.config.ts

モジュール、プラグイン、ランタイム設定などを定義するNuxtのメイン設定ファイル。

package.json

プロジェクトのメタデータ、スクリプト、依存関係。

tsconfig.json

プロジェクト全体のTypeScript設定。

vitest.config.ts

Vitestテストフレームワークの設定。

wrangler.example.toml

Wranglerを使ったCloudflare Workersへのデプロイ用サンプル設定。


開発ワークフロー、環境構築、推奨ツールの詳細については、このディレクトリ内の他のガイドを参照してください。