--- title: "プロジェクトの初期化" url: https://docs.catalyst.zoho.com/ja/tutorials/hosted-login-app/java/init-project/ description: "Catalyst Hosted Authenticationの機能を使用して、ユーザーサインアップ、アプリケーションログイン、パスワードリセットを提供し、主要なフェデレーテッドIDプロバイダーを使用したサインインを実装する、シンプルなBasicまたはReactアプリケーションを作成します。" last_updated: 2026-11-03T15:19:21Z service: All Services type: tutorial related_links: - name: "CLIリソースの初期化" url: /ja/cli/v1/initialize-resources/introduction - name: "プロジェクトディレクトリ構造" url: /ja/cli/v1/project-directory-structure/introduction --- # CLIからのプロジェクトの初期化 CLIからCatalystプロジェクトの作業を開始できます。最初のステップは、空のディレクトリでプロジェクトを初期化することです。これがプロジェクトのホームディレクトリとなり、すべてのプロジェクトファイルがここに保存されます。 詳細については、[プロジェクトディレクトリ構造ヘルプページ](https://docs.catalyst.zoho.com/ja/cli/v1/project-directory-structure/introduction/)をご覧ください。プロジェクトの初期化の詳細については、[CLIヘルプドキュメント](https://docs.catalyst.zoho.com/ja/cli/v1/initialize-resources/introduction)をご覧ください。 このアプリケーションでは、[Custom User Validation](https://docs.catalyst.zoho.com/ja/cloud-scale/help/authentication/whitelisting/custom-user-validation/introduction/)のロジックを含む[Basic I/O function](https://docs.catalyst.zoho.com/ja/serverless/help/functions/basic-io/)と、クライアントコンポーネントとして[Basic web app](https://docs.catalyst.zoho.com/ja/cli/v1/initialize-resources/initialize-client/#basic-client-applications)を初期化します。 > **Note:** アプリケーションのコードに同じ名前が含まれているため、関数のパッケージ名またはクラス名は指示どおりに正確に入力してください。 1. ローカルマシンにプロジェクト用のフォルダを作成し、ターミナルからそのフォルダに移動します。 2. そのディレクトリから以下のコマンドを実行してプロジェクトを初期化します： ```sh catalyst init ``` 3. **矢印キー**で移動し、希望するポータルを選択して**Enter**キーを押します。アカウントに他の組織が関連付けられていない場合、デフォルトのものが自動的に選択されます。 ![catalyst_authorization_portal_multiorg_choice](https://catalyst-docs-development.zohostratus.in/images/tutorials/hosted-login/catalyst_authorization_portal_multiorg_choice.webp) > **Note:** Catalystのマルチ組織ポータル機能の詳細については、この[ヘルプドキュメント](https://docs.catalyst.zoho.com/ja/getting-started/catalyst-organizations/#access-the-multi-org-portal)をご覧ください。 4. CLIがCatalystプロジェクトをディレクトリに関連付けるよう求めます。先ほどコンソールから作成したプロジェクトに関連付けます。リストから**Authorization Portal**を選択し、**Enter**を押します。 ![catalyst_authentication_hosted_project_select](https://catalyst-docs-development.zohostratus.in/images/tutorials/hosted-login/catalyst_authentication_hosted_project_select.webp) 5. 矢印キーで移動し、スペースバーで**Functions**、**Client**を選択します。**Enter**を押して初期化します。 ![catalyst_authentication_hosted_func_client_select](https://catalyst-docs-development.zohostratus.in/images/tutorials/hosted-login/catalyst_authentication_hosted_func_client_select.webp) 6. CLIが関数のセットアップを開始します。*Custom User Validation*関数の関数タイプとして**Basic IO**を選択します。 ![catalyst_authentication_hosted_func_type_select](https://catalyst-docs-development.zohostratus.in/images/tutorials/hosted-login/catalyst_authentication_hosted_func_type_select.webp) 7. 関数スタックとして*Java*の最新ランタイムを選択します。 ![catalyst_authentication_hosted_func_java_runtime_select](https://catalyst-docs-development.zohostratus.in/images/tutorials/hosted-login/catalyst_authentication_hosted_func_java_runtime_select.webp) 8. パッケージ名として「`authorized_portal_app`」、関数名として「`Custom_User_Validation_Java`」を入力し、**Enter**を押します。または、入力せずに**Enter**を押してデフォルト値を設定することもできます。CLIがJava依存関係の初期化を促します。 ![catalyst_authentication_hosted_java_func_setup_complete](https://catalyst-docs-development.zohostratus.in/images/tutorials/hosted-login/catalyst_authentication_hosted_java_func_setup_complete.webp) CLIがクライアントのセットアップを開始します。 **Basic Webアプリ** 9. **Basic web app**を選択し、**Enter**を押してクライアントを[Basic web app](https://docs.catalyst.zoho.com/ja/cli/v1/initialize-resources/initialize-client/#basic-client-applications)として初期化します。 ![catalyst_authentication_hosted_client_type_select](https://catalyst-docs-development.zohostratus.in/images/tutorials/hosted-login/catalyst_authentication_hosted_client_type_select.webp) 10. クライアントパッケージ名を入力し、**Enter**を押します。このチュートリアルでは、クライアントパッケージ名を「`ZylkerTechnologies`」としています。同じ名前を使用するか、お好みの名前を付けてください。 ![catalyst_authentication_hosted_client_choice_complete](https://catalyst-docs-development.zohostratus.in/images/tutorials/hosted-login/catalyst_authentication_hosted_client_choice_complete.webp) Catalystの初期化が完了しました。 プロジェクトディレクトリは、設定ファイルと依存関係とともに、clientディレクトリとfunctionsディレクトリで構成されています。プロジェクトディレクトリには、[`catalyst.json`](https://docs.catalyst.zoho.com/ja/cli/v1/project-directory-structure/catalyst-json/)設定ファイルと隠しファイル`.catalystrc`も含まれています。 プロジェクトディレクトリの構造は以下のようになります： ![catalyst_hosted_login_java_basic_directory](https://catalyst-docs-development.zohostratus.in/images/tutorials/hosted-login/catalyst_hosted_login_java_basic_directory.webp) **React Webアプリ** 9. **React web app**を選択し、**Enter**を押してクライアントを[React web app](https://docs.catalyst.zoho.com/ja/cli/v1/initialize-resources/initialize-client/#react-applications)として初期化します。 ![catalyst_authentication_hosted_client_react_type_select](https://catalyst-docs-development.zohostratus.in/images/tutorials/hosted-login/catalyst_authentication_hosted_client_react_type_select.webp) 10. Reactアプリタイプとして**JavaScript**を選択し、**Enter**を押します。 ![catalyst_authentication_hosted_client_react_type_javascript_select](https://catalyst-docs-development.zohostratus.in/images/tutorials/hosted-login/catalyst_authentication_hosted_client_react_type_javascript_select.webp) 11. クライアントパッケージ名として「`zylkertechnologies`」を入力し、**Enter**をクリックします。お好みの名前を使用することもできます。「`react`」、「`react-dom`」、「`react-scripts`」などの必要なReactパッケージは、Catalyst Reactプラグイン（[`zcatalyst-cli-plugin-react`](https://www.npmjs.com/package/zcatalyst-cli-plugin-react)）を通じてインストールされます。 ![catalyst_authentication_hosted_client_react_type_initing](https://catalyst-docs-development.zohostratus.in/images/tutorials/hosted-login/catalyst_authentication_hosted_client_react_type_initing.webp) クライアントがReact Webアプリケーションとして正常に初期化されました。 ![catalyst_authentication_hosted_client_react_type_init_complete](https://catalyst-docs-development.zohostratus.in/images/tutorials/hosted-login/catalyst_authentication_hosted_client_react_type_init_complete.webp) プロジェクトディレクトリに標準的な構造で[clientディレクトリ](https://docs.catalyst.zoho.com/ja/cli/v1/project-directory-structure/client-directory)が作成されます。 クライアントをReactアプリとして初期化した場合の*Authorization Portal*プロジェクトのディレクトリ構造は以下のとおりです。 ![catalyst_hosted_login_java_react_directory](https://catalyst-docs-development.zohostratus.in/images/tutorials/hosted-login/catalyst_hosted_login_java_react_directory.webp) Catalystの初期化が完了しました。 **Angular Webアプリ** 9. **Angular web app**を選択し、**Enter**を押してクライアントを[Angular web app](https://docs.catalyst.zoho.com/ja/cli/v1/initialize-resources/initialize-client/#angular-applications)として初期化します。 ![catalyst_authentication_hosted_client_angular_type_select](https://catalyst-docs-development.zohostratus.in/images/tutorials/hosted-login/catalyst_authentication_hosted_client_angular_type_select.webp) 10. Angularアプリ名を「`ZylkerTechnologies`」とし、**Enter**キーを押します。このアプリケーションではAngular Routingは不要なため、プロンプトで「`N`」を入力します。最後に、スタイルシート形式として`CSS`を選択し、**Enter**キーを押します。 ![catalyst_authentication_hosted_client_angular_type_init](https://catalyst-docs-development.zohostratus.in/images/tutorials/hosted-login/catalyst_authentication_hosted_client_angular_type_init.webp) Catalystが**Catalyst Angularプラグイン**（[`zcatalyst-cli-plugin-angular`](https://npm.io/package/zcatalyst-cli-plugin-angular)）を使用してクライアントを初期化します。 ![catalyst_authentication_hosted_client_angular_type_init_complete](https://catalyst-docs-development.zohostratus.in/images/tutorials/hosted-login/catalyst_authentication_hosted_client_angular_type_init_complete.webp) クライアントがAngular Webアプリケーションとして正常に初期化されました。 プロジェクトディレクトリは、設定ファイルと依存関係とともに、clientディレクトリとfunctionsディレクトリで構成されています。プロジェクトディレクトリには、[`catalyst.json`](https://docs.catalyst.zoho.com/ja/cli/v1/project-directory-structure/catalyst-json/)設定ファイルと隠しファイル`.catalystrc`も含まれています。 プロジェクトディレクトリの構造は以下のようになります： ![catalyst_authentication_hosted_java_client_angular_type_first_directory](https://catalyst-docs-development.zohostratus.in/images/tutorials/hosted-login/catalyst_authentication_hosted_java_client_angular_type_first_directory.webp)