> ## Documentation Index
> Fetch the complete documentation index at: https://translations.mintlify.site/llms.txt
> Use this file to discover all available pages before exploring further.

> ACUL SDK を使用して Auth0 Advanced Customizations for Universal Login プロジェクトをローカルで開発し、デプロイ前にテナント上で画面を反復改善します。

# ACUL 開発ワークフロー

ACUL の画面開発には、主に 2 つの方法があります。ローカル開発と、ライブテナントでの連携テストです。

<div id="local-development">
  ## ローカル開発
</div>

[Auth0 CLI](https://github.com/auth0/auth0-cli/) の `auth0 acul dev` コマンドを使って、ACUL の画面をローカルでカスタマイズできます。[Universal Login Context Inspector](https://github.com/auth0/ul-context-inspector) を使えば、遅延やバックエンドの依存関係なしに、ACUL の画面をすばやく繰り返し調整できます。

Universal Login Context Inspector は、テナント固有の設定に合わせて認証画面をテストするためのモックコンテキストデータを提供します。

<Frame>
  <img src="https://mintcdn.com/translations/mMSz-RNYLuOm2GmQ/docs/images/cdy7uua7fh8z/ACUL/UniversalLoginContextInspector.png?fit=max&auto=format&n=mMSz-RNYLuOm2GmQ&q=85&s=0769d39e0db6a174c924dc4d45e6c0b1" alt="Universal Login Context Inspector" width="1404" height="1037" data-path="docs/images/cdy7uua7fh8z/ACUL/UniversalLoginContextInspector.png" />
</Frame>

* **画面** を選択すると、利用可能な ACUL 設定済み画面をデフォルトのモックコンテキストデータ付きで確認できます。
  * **データソース** を選択すると、**Auth0 CDN** から配信されるモックコンテキストデータ、または **Local Development** プロジェクトの `public/screens/{prompt}/{screen}` ディレクトリ内のモックコンテキストデータを選択できます。
  * **Download JSON** アイコンを選択すると、選択した画面のコンテキストデータをダウンロードできます。

<div id="live-tenant-integration-testing">
  ## ライブテナントでの連携テスト
</div>

Auth0 CLI コマンド `auth0 acul dev --connected` を使用してライブテナント連携を行うと、カスタム画面 UI のエンドツーエンドテストを実施し、Auth0 テナントとの連携を検証できます。
リロードするたびに認証フローが再開されるため、`--connected` モードは UI がほぼ完成した段階での連携テストに使用してください。

`auth0 acul dev --connected` を使用する場合

* ACUL プロジェクトのディレクトリを選択します。
  * `npm run build` を選択して、プロジェクトをビルドし、Auth0 テナントを設定します。
  * ローカルのアセットを配信する **ポート** を選択します。デフォルトは `55444` で、ローカルサーバーはバックグラウンドで起動します。
  * 必要に応じて、`--connected` モードでプロジェクトの `/dist/assets` ディレクトリへの変更を継続的に監視できます。

新しいターミナルを開き、`auth0 test login` を実行して、テナント上のログインフローをテストします。

<Callout icon="file-lines" color="#0EA5E9" iconType="regular">
  `--connected` モードでは、Auth0 CLI コマンドがファイルの変更を監視し、アセットを再ビルドして、テナントの設定を自動的に更新します。
</Callout>

詳しくは、GitHub の [Auth0 CLI](https://auth0.github.io/auth0-cli/auth0_acul_dev.html) を参照してください。