Get Started # The ZITADEL Quick Start Guide In this guide, you’ll set up a Zitadel account and configure it to work with our pre-built example applications. You can simply clone the repository, follow the console setup, and have a working authentication flow in minutes. ## [Get Started with ZITADEL Cloud](/content/docs/guides/start/quickstart\#get-started-with-zitadel-cloud/index.html) Set up your ZITADEL account and organization to begin managing identities for your applications. ### [1\. Create your Account and Organization](/content/docs/guides/start/quickstart\#1-create-your-account-and-organization/index.html) You first need access to the ZITADEL Cloud Customer Portal. This is the administrative hub for managing your billing, teams, and instances. 1. **Sign Up**: Go to [zitadel.com](/content/site-root.html) and select Sign Up. 2. **Onboarding**: Follow the prompts to verify your email and set up your Portal Team. - Tip: We recommend using Passkeys for a secure, passwordless login experience. 3. **Access**: Once authenticated, you will be redirected to the Customer Portal dashboard. ### [2\. Quick Onboarding](/content/docs/guides/start/quickstart\#2-quick-onboarding/index.html) Complete the brief onboarding questions. This data helps us prioritize the development of new features, SDKs, and integrations that matter most to our community. ### [3\. Create your ZITADEL instance](/content/docs/guides/start/quickstart\#3-create-your-zitadel-instance/index.html) An [Instance](/content/docs/concepts/structure/instance/index.html) is a fully isolated identity environment with its own users, policies, and data. Most developers use separate instances to isolate Development, Test, and Production workflows. Follow these steps to deploy your first instance: 1. **Start**: Click Create Instance on your dashboard. 2. **Identity**: Provide an Instance Name (e.g., dev-environment). This will be used to generate your default domain (e.g., dev-environment-xxxx.zitadel.cloud). 3. **Locality**: Select your Region. - Note: Choosing a region close to your users minimizes latency and helps with data residency compliance. 4. **Admin Setup**: Create your Instance Administrator. This user has "root" permissions to manage all organizations, policies, and settings within this specific instance. 5. **Deploy**: Review your settings and click Create Instance. ### [4\. Create your Project and Application](/content/docs/guides/start/quickstart\#4-create-your-project-and-application/index.html) In ZITADEL, [**Applications**](/content/docs/guides/manage/console/applications-overview/index.html) are grouped into [**Projects**](/content/docs/guides/manage/console/projects-overview/index.html). This allows multiple applications (like a React frontend and a Go backend) to share the same roles and role assignments. #### [Launch the Management Console](/content/docs/guides/start/quickstart\#launch-the-management-console/index.html) Click **Create your app**. This opens the Management Console for your instance in a new tab. Log in using the Admin credentials you just created. #### [Step 1: Define your Project](/content/docs/guides/start/quickstart\#step-1-define-your-project/index.html) - **Name**: Enter a name (e.g., Project1). - **Framework**: Select your preferred framework - **Continue**: Click the Continue button. #### [Step 2: Review Default Settings](/content/docs/guides/start/quickstart\#step-2-review-default-settings/index.html) ZITADEL automatically configures the best security settings for your selected framework. AngularASP.NET CoreAstroDjangoExpress.jsFastAPIFastifyFlaskFlutterGoHonoLaravelNestJSNext.jsNuxtQwikReactSolidStartSpringSymfonySvelteVue.js - **Auth Strategy**: [Authorization Code Flow (PKCE)](/content/docs/apis/openidoauth/grant-types#authorization-code/index.html). This modern standard ensures tokens are exchanged securely without needing a client secret in your frontend. - **Redirect URIs**: These define where users return after authentication: - Redirect URI: http://localhost:3000/auth/callback (Landing page after login) - Post Logout URI: http://localhost:3000/auth/logout/callback (Landing page after logout) - **Auth Strategy**: [Authorization Code Flow (PKCE)](/content/docs/apis/openidoauth/grant-types#authorization-code/index.html). This modern standard ensures tokens are exchanged securely without needing a client secret in your frontend. - **Redirect URIs**: These define where users return after authentication: - Redirect URI: http://localhost:3000/api/auth/callback/zitadel (Landing page after login) - Post Logout URI: http://localhost:3000/api/auth/logout/callback (Landing page after logout) - **Auth Strategy**: [Authorization Code Flow (PKCE)](/content/docs/apis/openidoauth/grant-types#authorization-code/index.html). This modern standard ensures tokens are exchanged securely without needing a client secret in your frontend. - **Redirect URIs**: These define where users return after authentication: - Redirect URI: http://localhost:3000/auth/callback/zitadel (Landing page after login) - Post Logout URI: http://localhost:3000/auth/logout/callback (Landing page after logout) - **Auth Strategy**: [Authorization Code Flow (PKCE)](/content/docs/apis/openidoauth/grant-types#authorization-code/index.html). This modern standard ensures tokens are exchanged securely without needing a client secret in your frontend. - **Redirect URIs**: These define where users return after authentication: - Redirect URI: http://localhost:4444/auth.html, com.example.zitadelflutter (Landing page after login) - Post Logout URI: http://localhost:4444, com.example.zitadelflutter (Landing page after logout) - **Auth Strategy**: [Authorization Code Flow (PKCE)](/content/docs/apis/openidoauth/grant-types#authorization-code/index.html). This modern standard ensures tokens are exchanged securely without needing a client secret in your frontend. - **Redirect URIs**: These define where users return after authentication: - Redirect URI: http://localhost:8089/auth/callback (Landing page after login) - Post Logout URI: http://localhost:8089 (Landing page after logout) - **Auth Strategy**: [Authorization Code Flow (PKCE)](/content/docs/apis/openidoauth/grant-types#authorization-code/index.html). This modern standard ensures tokens are exchanged securely without needing a client secret in your frontend. - **Redirect URIs**: These define where users return after authentication: - Redirect URI: http://localhost:3000/api/auth/callback/zitadel (Landing page after login) - Post Logout URI: http://localhost:3000 (Landing page after logout) - **Auth Strategy**: [Authorization Code Flow (PKCE)](/content/docs/apis/openidoauth/grant-types#authorization-code/index.html). This modern standard ensures tokens are exchanged securely without needing a client secret in your frontend. - **Redirect URIs**: These define where users return after authentication: - Redirect URI: http://localhost:3000/auth/callback/zitadel (Landing page after login) - Post Logout URI: http://localhost:3000/api/auth/logout/callback (Landing page after logout) - **Auth Strategy**: [Authorization Code Flow (PKCE)](/content/docs/apis/openidoauth/grant-types#authorization-code/index.html). This modern standard ensures tokens are exchanged securely without needing a client secret in your frontend. - **Redirect URIs**: These define where users return after authentication: - Redirect URI: http://localhost:3000/auth/callback (Landing page after login) - Post Logout URI: http://localhost:3000 (Landing page after logout) ### [5\. Collect your Integration Keys](/content/docs/guides/start/quickstart\#5-collect-your-integration-keys/index.html) AngularASP.NET CoreAstroDjangoExpress.jsFastAPIFastifyFlaskFlutterGoHonoLaravelNestJSNext.jsNuxtQwikReactSolidStartSpringSymfonySvelteVue.js To connect your application to ZITADEL, you need two primary settings. These are typically stored as environment variables in your project. 1. **Client ID** Navigate to Settings in the left sidebar. This is the unique public identifier for your React application. 2. **Issuer URL** Click on URLs in the left sidebar to find your **Discovery Endpoint**. \- The Value: Copy the issuer URL (e.g., https://your-instance.zitadel.cloud). - Why it matters: ZITADEL supports OIDC Discovery. By providing just the Issuer URL to your SDK, the library automatically finds the login, logout, and token endpoints for you. To connect your application to ZITADEL, you need three primary settings. These are typically stored as environment variables in your project. 1. **Client ID & Client Secret** Copy the client id and secret from the modal. The client id is the unique public identifier for your application. Note: If you missed copy the secret, you can generate a new one in the Actions dropdown. 2. **Issuer URL** Click on URLs in the left sidebar to find your **Discovery Endpoint**. \- The Value: Copy the issuer URL (e.g., https://your-instance.zitadel.cloud). - Why it matters: ZITADEL supports OIDC Discovery. By providing just the Issuer URL to your SDK, the library automatically finds the login, logout, and token endpoints for you. To connect your application to ZITADEL, you need three primary settings. These are typically stored as environment variables in your project. To connect your application to ZITADEL, you need two primary settings. These are typically stored as environment variables in your project. To connect your application to ZITADEL, you need three primary settings. These are typically stored as environment variables in your project. To connect your application to ZITADEL, you need three primary settings. These are typically stored as environment variables in your project. To connect your application to ZITADEL, you need three primary settings. These are typically stored as environment variables in your project. To connect your application to ZITADEL, you need three primary settings. These are typically stored as environment variables in your project. To connect your application to ZITADEL, you need two primary settings. These are typically stored as environment variables in your project. To connect your application to ZITADEL, you need two primary settings. These are typically stored as environment variables in your project. To connect your application to ZITADEL, you need three primary settings. These are typically stored as environment variables in your project. To connect your application to ZITADEL, you need three primary settings. These are typically stored as environment variables in your project. To connect your application to ZITADEL, you need three primary settings. These are typically stored as environment variables in your project. To connect your application to ZITADEL, you need three primary settings. These are typically stored as environment variables in your project. To connect your application to ZITADEL, you need three primary settings. These are typically stored as environment variables in your project. To connect your application to ZITADEL, you need three primary settings. These are typically stored as environment variables in your project. To connect your application to ZITADEL, you need two primary settings. These are typically stored as environment variables in your project. To connect your application to ZITADEL, you need three primary settings. These are typically stored as environment variables in your project. To connect your application to ZITADEL, you need three primary settings. These are typically stored as environment variables in your project. To connect your application to ZITADEL, you need three primary settings. These are typically stored as environment variables in your project. To connect your application to ZITADEL, you need three primary settings. These are typically stored as environment variables in your project. To connect your application to ZITADEL, you need two primary settings. These are typically stored as environment variables in your project. ## [Integrate ZITADEL into your App](/content/docs/guides/start/quickstart\#integrate-zitadel-into-your-app/index.html) ### [How the Authentication Flow Works](/content/docs/guides/start/quickstart\#how-the-authentication-flow-works/index.html) ZITADEL handles the complexity of the OIDC handshake so your app stays secure without manual token management. 1. **Login**: App redirects the user to ZITADEL with a PKCE challenge. 2. **Auth**: User authenticates on the ZITADEL hosted login page. 3. **Exchange**: ZITADEL returns an Auth Code, which the app exchanges for an Access Token. 4. **Tokens**: The app shows the Access and ID Token 5. **Logout**: The app clears local tokens and terminates the ZITADEL session. ### [1\. Prerequisites](/content/docs/guides/start/quickstart\#1-prerequisites/index.html) AngularASP.NET CoreAstroDjangoExpress.jsFastAPIFastifyFlaskFlutterGoHonoLaravelNestJSNext.jsNuxtQwikReactSolidStartSpringSymfonySvelteVue.js - [Node.js](https://nodejs.org/) - [npm](https://www.npmjs.com/) - [Node.js](https://nodejs.org/) - [npm](https://www.npmjs.com/) - [.NET SDK 8 or later](https://dotnet.microsoft.com/download) - [Python](https://www.python.org/) - [Poetry](https://python-poetry.org/) - [Node.js](https://nodejs.org/) - [npm](https://www.npmjs.com/) - [Python](https://www.python.org/) - [Poetry](https://python-poetry.org/) - [Node.js](https://nodejs.org/) - [npm](https://www.npmjs.com/) - [Python](https://www.python.org/) - [Poetry](https://python-poetry.org/) - [Flutter](https://docs.flutter.dev/install) - [Go](https://go.dev/) - [Node.js](https://nodejs.org/) - [npm](https://www.npmjs.com/) - [PHP](https://www.php.net/) - [Composer](https://getcomposer.org/) - [Node.js](https://nodejs.org/) - [npm](https://www.npmjs.com/) - [Node.js](https://nodejs.org/) - [npm](https://www.npmjs.com/) - [Node.js](https://nodejs.org/) - [npm](https://www.npmjs.com/) - [Node.js](https://nodejs.org/) - [npm](https://www.npmjs.com/) - [Node.js](https://nodejs.org/) - [npm](https://www.npmjs.com/) - [Node.js](https://nodejs.org/) - [npm](https://www.npmjs.com/) - [Java Development Kit (JDK)](https://www.java.com/en/) - [Maven](https://maven.apache.org/) - [PHP](https://www.php.net/) - [Composer](https://getcomposer.org/) - [Node.js](https://nodejs.org/) - [npm](https://www.npmjs.com/) - [Node.js](https://nodejs.org/) - [npm](https://www.npmjs.com/) ### [2\. Get the Example Project](/content/docs/guides/start/quickstart\#2-get-the-example-project/index.html) AngularASP.NET CoreAstroDjangoExpress.jsFastAPIFastifyFlaskFlutterGoHonoLaravelNestJSNext.jsNuxtQwikReactSolidStartSpringSymfonySvelteVue.js ``` git clone https://github.com/zitadel/example-auth-angular.git cd example-auth-angular ``` ``` git clone https://github.com/zitadel/example-auth-astro.git cd example-auth-astro ``` ``` git clone https://github.com/zitadel/example-auth-dotnet.git cd example-auth-dotnet ``` ``` git clone https://github.com/zitadel/example-auth-django.git cd example-auth-django ``` ``` git clone https://github.com/zitadel/example-auth-expressjs.git cd example-auth-expressjs ``` ``` git clone https://github.com/zitadel/example-auth-fastapi.git cd example-auth-fastapi ``` ``` git clone https://github.com/zitadel/example-auth-fastify.git cd example-auth-fastify ``` ``` git clone https://github.com/zitadel/example-auth-flask.git cd example-auth-flask ``` ``` git clone https://github.com/zitadel/zitadel_flutter.git cd zitadel_flutter ``` ``` git clone https://github.com/zitadel/zitadel-go.git cd zitadel-go ``` ``` git clone https://github.com/zitadel/zitadel-auth-hono.git cd zitadel-auth-hono ``` ``` git clone https://github.com/zitadel/example-auth-laravel.git cd example-auth-laravel ``` ``` git clone https://github.com/zitadel/example-auth-nestjs.git cd example-auth-nestjs ``` ``` git clone https://github.com/zitadel/example-auth-nextjs.git cd example-auth-nextjs ``` ``` git clone https://github.com/zitadel/example-auth-nuxtjs.git cd example-auth-nuxtjs ``` ``` git clone https://github.com/zitadel/example-auth-qwik.git cd example-auth-qwik ``` ``` git clone https://github.com/zitadel/example-auth-react.git cd example-auth-react ``` ``` git clone https://github.com/zitadel/example-auth-solidstart.git cd example-auth-solidstart ``` ``` git clone https://github.com/zitadel/example-auth-spring.git cd example-auth-spring ``` ``` git clone https://github.com/zitadel/example-auth-symfony.git cd example-auth-symfony ``` ``` git clone https://github.com/zitadel/example-auth-sveltekit.git cd example-auth-sveltekit ``` ``` git clone https://github.com/zitadel/example-auth-vue.git cd example-auth-vue ``` ### [3\. Configure your Credentials](/content/docs/guides/start/quickstart\#3-configure-your-credentials/index.html) AngularASP.NET CoreAstroDjangoExpress.jsFastAPIFastifyFlaskFlutterGoHonoLaravelNestJSNext.jsNuxtQwikReactSolidStartSpringSymfonySvelteVue.js 1. Copy+paste the .env.example to .env 2. Update the ZITADEL\_CLIENT\_ID and ZITADEL\_DOMAIN with the client id and issuer you collected in Step 5. ``` PORT=3000 NG_APP_ZITADEL_DOMAIN="https://your-zitadel-domain" NG_APP_ZITADEL_CLIENT_ID="your-client-id" NG_APP_ZITADEL_CALLBACK_URL="http://localhost:3000/auth/callback" NG_APP_ZITADEL_POST_LOGOUT_URL="http://localhost:3000/auth/logout/callback" NG_APP_ZITADEL_POST_LOGIN_URL="/profile" ``` 1. Copy+paste the .env.example to .env 2. Update the ZITADEL\_CLIENT\_ID, ZITADEL\_CLIENT\_SECRET and ZITADEL\_DOMAIN with the client id and issuer you collected in Step 5. ``` NODE_ENV=development PORT=3000 SESSION_SECRET="your-very-secret-and-strong-session-key" SESSION_DURATION=3600 ZITADEL_DOMAIN="https://your-zitadel-domain" ZITADEL_CLIENT_ID="your-zitadel-application-client-id" ZITADEL_CLIENT_SECRET="your-zitadel-application-client-secret" ZITADEL_CALLBACK_URL="http://localhost:3000/api/auth/callback/zitadel" ZITADEL_POST_LOGIN_URL="/profile" ZITADEL_POST_LOGOUT_URL="http://localhost:3000/api/auth/logout/callback" NEXTAUTH_URL="http://localhost:3000" ``` ``` PORT=3000 SESSION_DURATION=3600 ZITADEL_DOMAIN="https://your-zitadel-domain" ZITADEL_CLIENT_ID="your-zitadel-application-client-id" ZITADEL_CLIENT_SECRET="your-randomly-generated-client-secret" ZITADEL_POST_LOGOUT_URL="http://localhost:3000/auth/logout/callback" ``` 1. Copy+paste the .env.example to .env 2. Update the ZITADEL\_CLIENT\_ID and ZITADEL\_DOMAIN with the client id and issuer you collected in Step 5. ``` PY_ENV=development PORT=3000 SESSION_SECRET="your-very-secret-and-strong-session-key" SESSION_DURATION=3600 ZITADEL_DOMAIN="https://your-zitadel-domain" ZITADEL_CLIENT_ID="your-zitadel-application-client-id" ZITADEL_CLIENT_SECRET="your-randomly-generated-client-secret" ZITADEL_CALLBACK_URL="http://localhost:3000/auth/callback" ZITADEL_POST_LOGIN_URL="/profile" ZITADEL_POST_LOGOUT_URL="http://localhost:3000/auth/logout/callback" ``` ``` NODE_ENV=development PORT=3000 SESSION_SECRET="your-very-secret-and-strong-session-key" SESSION_DURATION=3600 ZITADEL_DOMAIN="https://your-zitadel-domain" ZITADEL_CLIENT_ID="your-zitadel-application-client-id" ZITADEL_CLIENT_SECRET="your-zitadel-application-client-secret" ZITADEL_CALLBACK_URL="http://localhost:3000/auth/callback/zitadel" ZITADEL_POST_LOGIN_URL="/profile" ZITADEL_POST_LOGOUT_URL="http://localhost:3000/auth/logout/callback" ``` ``` PY_ENV=development PORT=3000 SESSION_SECRET="your-very-secret-and-strong-session-key" SESSION_DURATION=3600 ZITADEL_DOMAIN="https://your-zitadel-domain" ZITADEL_CLIENT_ID="your-zitadel-application-client-id" ZITADEL_CLIENT_SECRET="your-zitadel-application-client-secret" ZITADEL_CALLBACK_URL="http://localhost:3000/auth/callback" ZITADEL_POST_LOGIN_URL="/profile" ZITADEL_POST_LOGOUT_URL="http://localhost:3000/auth/logout/callback" ``` No action required for this step. The issuer and client Id will be passed directly when running the app (next step) No action required for this step. The issuer and client Id will be passed directly when running the app (next step) 1. Copy+paste the .env.example to .env 2. Update the ZITADEL\_CLIENT\_ID, ZITADEL\_CLIENT\_SECRET and ZITADEL\_DOMAIN with the client id and issuer you collected in Step 5. 3. Generate app key, this will update the APP\_KEY variable in the .env file ``` php artisan key:generate ``` ``` APP_KEY="your-app-key" APP_ENV=local APP_DEBUG=true SERVER_URL="http://localhost:3000" SERVER_PORT=3000 DB_CONNECTION=sqlite ZITADEL_DOMAIN="https://your-zitadel-domain" ZITADEL_CLIENT_ID="your-zitadel-application-client-id" ZITADEL_CLIENT_SECRET="your-randomly-generated-client-secret" ZITADEL_POST_LOGOUT_URL="http://localhost:3000/auth/logout/callback" ``` 1. Copy+paste the .env.example to .env.local 2. Update the ZITADEL\_CLIENT\_ID, ZITADEL\_CLIENT\_SECRET and ZITADEL\_DOMAIN with the client id and issuer you collected in Step 5. ``` NODE_ENV=development PORT=3000 SESSION_SECRET="your-very-secret-and-strong-session-key" SESSION_SALT="your-very-secret-and-strong-session-salt" SESSION_DURATION=3600 ZITADEL_DOMAIN="https://your-zitadel-domain" ZITADEL_CLIENT_ID="your-zitadel-application-client-id" ZITADEL_CLIENT_SECRET="your-zitadel-application-client-secret" ZITADEL_CALLBACK_URL="http://localhost:3000/auth/callback/zitadel" ZITADEL_POST_LOGIN_URL="/profile" ZITADEL_POST_LOGOUT_URL="http://localhost:3000/auth/logout/callback" ``` ``` NODE_ENV=development PORT=3000 SESSION_SECRET="your-very-secret-and-strong-session-key" SESSION_DURATION=3600 ZITADEL_DOMAIN="[https://your-instance.zitadel.cloud/](https://your-instance.zitadel.cloud/)" ZITADEL_CLIENT_ID="zitadel-client-id" ZITADEL_CLIENT_SECRET="zitadel-client-secret" ZITADEL_CALLBACK_URL="http://localhost:3000/api/auth/callback/zitadel" ZITADEL_POST_LOGIN_URL="/profile" ZITADEL_POST_LOGOUT_URL="http://localhost:3000/api/auth/logout/callback" NEXTAUTH_URL="http://localhost:3000" ``` ``` NODE_ENV=development PORT=3000 SESSION_SECRET="your-very-secret-and-strong-session-key" SESSION_DURATION=3600 ZITADEL_DOMAIN="https://your-zitadel-domain" ZITADEL_CLIENT_ID="your-zitadel-application-client-id" ZITADEL_CLIENT_SECRET="your-zitadel-application-client-secret" ZITADEL_CALLBACK_URL="http://localhost:3000/api/auth/callback/zitadel" ZITADEL_POST_LOGIN_URL="/profile" ZITADEL_POST_LOGOUT_URL="http://localhost:3000" NEXTAUTH_URL="http://localhost:3000" ``` ``` NODE_ENV=development VITE_PORT=3000 VITE_SESSION_SECRET="your-very-secret-and-strong-session-key" VITE_SESSION_DURATION=3600 VITE_ZITADEL_DOMAIN="https://your-zitadel-domain" VITE_ZITADEL_CLIENT_ID="your-zitadel-application-client-id" VITE_ZITADEL_CLIENT_SECRET="your-zitadel-application-client-secret" VITE_ZITADEL_CALLBACK_URL="http://localhost:3000/auth/callback/zitadel" VITE_ZITADEL_POST_LOGOUT_URL="http://localhost:3000/api/auth/logout/callback" ``` 1. Copy+paste the .env.example to .env 2. Update the ZITADEL\_CLIENT\_ID and ZITADEL\_DOMAIN with the client id and issuer you collected in Step 5. ``` NODE_ENV=development PORT=3000 VITE_ZITADEL_DOMAIN="https://your-zitadel-domain" VITE_ZITADEL_CLIENT_ID="your-client-id" VITE_ZITADEL_CALLBACK_URL="http://localhost:3000/auth/callback" VITE_ZITADEL_POST_LOGIN_URL="/profile" VITE_ZITADEL_POST_LOGOUT_URL="http://localhost:3000" ``` ``` SPRING_PROFILES_ACTIVE=development PORT=3000 SESSION_SECRET="your-very-secret-and-strong-session-key" SESSION_DURATION=3600 ZITADEL_DOMAIN="https://your-zitadel-domain" ZITADEL_CLIENT_ID="your-zitadel-application-client-id" ZITADEL_CLIENT_SECRET="your-randomly-generated-client-secret" ZITADEL_CALLBACK_URL="http://localhost:3000/auth/callback" ZITADEL_POST_LOGOUT_URL="http://localhost:3000/auth/logout/callback" ``` ``` APP_SECRET="your-app-secret-key" SERVER_URL="http://localhost:3000" SERVER_PORT=3000 ZITADEL_DOMAIN="https://your-zitadel-domain" ZITADEL_CLIENT_ID="your-zitadel-application-client-id" ZITADEL_CLIENT_SECRET="your-randomly-generated-client-secret" ZITADEL_POST_LOGOUT_URL="http://localhost:3000/auth/logout/callback" ``` ``` SESSION_SECRET="your-very-secret-and-strong-session-key" SESSION_DURATION=3600 # Example: https://my-org-a1b2c3.zitadel.cloud ZITADEL_DOMAIN="https://your-zitadel-domain" ZITADEL_CLIENT_ID="your-zitadel-application-client-id" ZITADEL_CLIENT_SECRET="your-zitadel-application-client-secret" ZITADEL_CALLBACK_URL="http://localhost:3000/auth/callback/zitadel" ZITADEL_POST_LOGIN_URL="/profile" ZITADEL_POST_LOGOUT_URL="http://localhost:3000/auth/logout/callback" NEXTAUTH_URL="http://localhost:3000" ``` 1. Copy+paste the .env.example to .env 2. Update the ZITADEL\_CLIENT\_ID and ZITADEL\_DOMAIN with the client id and issuer you collected in Step 5. ### [4\. Build and Run](/content/docs/guides/start/quickstart\#4-build-and-run/index.html) AngularASP.NET CoreAstroDjangoExpress.jsFastAPIFastifyFlaskFlutterGoHonoLaravelNestJSNext.jsNuxtQwikReactSolidStartSpringSymfonySvelteVue.js ``` make start ``` Your app will be live at `http://localhost:3000`. ``` make start ``` Your app will be live at `http://localhost:3000`. ``` make start ``` Your app will be live at `http://localhost:3000`. ``` make start ``` Your app will be live at `http://localhost:3000`. ``` make start ``` Your app will be live at `http://localhost:3000`. ``` make start ``` Your app will be live at `http://localhost:3000`. ``` make start ``` Your app will be live at `http://localhost:3000`. ``` make start ``` Your app will be live at `http://localhost:3000`. Make sure to replace the \[zitadel\_issuer\] and \[zitadel\_client\_id\] with your own value before running the command ``` flutter run -d chrome --web-port=4444 --dart-define zitadel_url=[zitadel_issuer] --dart-define zitadel_client_id=[zitadel_client_id] ``` Your app will be live at `http://localhost:4444`. Make sure to replace the \[zitadel\_domain\] (use the domain from the issuer without the https://) and \[zitadel\_client\_id\] with your own value before running the command ``` go run example/app/app.go --domain [zitadel_domain] --key XKv2Lqd7YAq13NUZVUWZEWZeruqyzViM --clientID [zitadel_client_id] --redirectURI http://localhost:8089/auth/callback ``` Your app will be live at `http://localhost:8089`. ``` make start ``` Your app will be live at `http://localhost:3000`. ``` make start ``` Your app will be live at `http://localhost:3000`. ``` make start ``` Your app will be live at `http://localhost:3000`. ``` make start ``` Your app will be live at `http://localhost:3000`. ``` make start ``` Your app will be live at `http://localhost:3000`. ``` make start ``` Your app will be live at `http://localhost:3000`. ``` make start ``` Your app will be live at `http://localhost:3000`. ``` make start ``` Your app will be live at `http://localhost:3000`. ``` make start ``` Your app will be live at `http://localhost:3000`. ``` make start ``` Your app will be live at `http://localhost:3000`. ``` make start ``` Your app will be live at `http://localhost:3000`. ``` make start ``` Your app will be live at `http://localhost:3000`. ## [Success! 🚀](/content/docs/guides/start/quickstart\#success-%F0%9F%9A%80/index.html) You’ve successfully integrated ZITADEL into an application. Prevent Settings Misconfiguration Lockouts Login policy settings misconfigurations that occur during the testing phase can easily lead to a [lockout](/content/docs/legal/policies/account-lockout-policy/index.html). To ensure you don't lose access to your instance: 1. **Generate a backup PAT:** Create a [Service Account Personal Access Token](/content/docs/guides/integrate/service-accounts/personal-access-token/index.html) with the [`IAM_OWNER`](/content/docs/guides/manage/console/administrators/index.html) role to revert any login UI misconfigurations using the API. 2. **Add a second Instance Administrator:** Always designate at least one [**second instance administrator**](/content/docs/guides/manage/console/administrators/index.html). ### [What’s next?](/content/docs/guides/start/quickstart\#whats-next/index.html) - [**Example Applications**](/content/docs/examples/introduction/index.html): Find more comprehensive guides and examples for the different frameworks - [**SSO**](/content/docs/guides/integrate/services/index.html): Learn how to add SSO to your services - [**Customize the UI**](/content/docs/guides/manage/customize/branding/index.html): Make the login page your own with Branding. - [**Explore the API**](/content/docs/apis/introduction/index.html): Check out the ZITADEL API Reference for advanced integrations. Need help? Join our [Discord community](/content/chat/index.html) or explore the full Documentation. Happy coding! Prefer watching over reading? Check out our [video walkthrough of this quickstart](https://www.youtube.com/watch?v=POxkxGdDJyo). Was this page helpful? [Instances\\ \\ Overview of ZITADEL Instances—the virtual tenants providing full data isolation and independent settings.](/content/docs/concepts/structure/instance/index.html) ### On this page [Get Started with ZITADEL Cloud](/content/docs/guides/start/quickstart#get-started-with-zitadel-cloud/index.html) [1\. Create your Account and Organization](/content/docs/guides/start/quickstart#1-create-your-account-and-organization/index.html) [2\. Quick Onboarding](/content/docs/guides/start/quickstart#2-quick-onboarding/index.html) [3\. Create your ZITADEL instance](/content/docs/guides/start/quickstart#3-create-your-zitadel-instance/index.html) [4\. Create your Project and Application](/content/docs/guides/start/quickstart#4-create-your-project-and-application/index.html) [Launch the Management Console](/content/docs/guides/start/quickstart#launch-the-management-console/index.html) [Step 1: Define your Project](/content/docs/guides/start/quickstart#step-1-define-your-project/index.html) [Step 2: Review Default Settings](/content/docs/guides/start/quickstart#step-2-review-default-settings/index.html) [5\. Collect your Integration Keys](/content/docs/guides/start/quickstart#5-collect-your-integration-keys/index.html) [Integrate ZITADEL into your App](/content/docs/guides/start/quickstart#integrate-zitadel-into-your-app/index.html) [How the Authentication Flow Works](/content/docs/guides/start/quickstart#how-the-authentication-flow-works/index.html) [1\. Prerequisites](/content/docs/guides/start/quickstart#1-prerequisites/index.html) [2\. Get the Example Project](/content/docs/guides/start/quickstart#2-get-the-example-project/index.html) [3\. Configure your Credentials](/content/docs/guides/start/quickstart#3-configure-your-credentials/index.html) [4\. Build and Run](/content/docs/guides/start/quickstart#4-build-and-run/index.html) [Success! 🚀](/content/docs/guides/start/quickstart#success-%F0%9F%9A%80/index.html) [What’s next?](/content/docs/guides/start/quickstart#whats-next/index.html) Zitadel AI Assistant Hey there, I’m the Zitadel AI assistant 🤖 — throw your questions my way! AI answers can be wrong. Please don't share secrets, credentials or personal data. Need Help?