# Inside of Keycloak

Testing your theme in Storybook is helpful, but eventually, you'll need to test it in a real Keycloak instance before deploying it to production.

## Prerequisites

1. **Install Docker**: Ensure [Docker Desktop](https://www.docker.com/products/docker-desktop/) (or just Docker) is installed and running on your computer.
2. **Install Maven**: Maven is required to build `.jar` files locally. Check if it's already installed by running: `mvn --version`

   If not, follow the instructions below to install Maven.

{% tabs %}
{% tab title="MacOS" %}
Using [Homebrew](https://formulae.brew.sh/formula/maven):

```bash
brew install maven
```

{% endtab %}

{% tab title="Windows" %}
On Windows, use the [Chocolatey](https://chocolatey.org/) package manager:

```bash
choco install openjdk
choco install maven
```

Or follow the [manual installation guide](https://chocolatey.org/).
{% endtab %}

{% tab title="Ubuntu/Debian" %}

```bash
sudo apt-get install maven
```

{% endtab %}

{% tab title="Fedora" %}

```bash
sudo dnf install maven
```

{% endtab %}
{% endtabs %}

## Running Keycloak in Docker

Once the prerequisites are set up, you're ready to start Keycloak. Run the following command in your Keycloakify project:

```bash
npx keycloakify start-keycloak
```

You will be prompted to select the Keycloak version to spin up:

<figure><img src="https://2643300760-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F4Ls5iTdfTS2xECgBfw90%2Fuploads%2Fgit-blob-8543be7f091dd4e5f0525d450936c327305f0c09%2Fimage%20(198).png?alt=media" alt=""><figcaption></figcaption></figure>

Keycloakify will launch the selected Keycloak version in a Docker container.

Once the container is running, you’ll see two links:

<figure><img src="https://2643300760-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F4Ls5iTdfTS2xECgBfw90%2Fuploads%2Fgit-blob-5910a3b94c281df55bfbed0053cf62581d389d8d%2Fimage%20(199).png?alt=media" alt=""><figcaption></figcaption></figure>

1. **Keycloak Admin Console**: <http://localhost:8080>\
   The Keycloak instance is preconfigured with your theme, a custom realm named `myrealm`, and a test user (`testuser/password123`) for quick testing.\
   Changes to the configuration are saved in the `.keycloakify` directory so that they persist across restarts.
2. **Test Web App**: <https://my-theme.keycloakify.dev>\
   This app redirects to your login theme. Edits to your theme are auto-rebuilt and updated in the Keycloak container. Simply refresh the page to see changes live.

<figure><img src="https://2643300760-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F4Ls5iTdfTS2xECgBfw90%2Fuploads%2Fgit-blob-3775e94e1b6714123f5ee9f228cef44343561883%2Fimage%20(183).png?alt=media" alt=""><figcaption><p>Accessing the test web app and signing in with testuser/password123</p></figcaption></figure>

<details>

<summary>Inspecting `window.kcContext`</summary>

You can open your browser’s developer tools to inspect the `kcContext` object on the page. This allows you to create new stories for pages with specific configurations.

<img src="https://2643300760-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F4Ls5iTdfTS2xECgBfw90%2Fuploads%2Fgit-blob-24b732c324409634efef30dcc7b093951b155ea2%2Fimage%20(135).png?alt=media" alt="" data-size="original">

</details>

Logging in with the test user redirects you to a page where you can inspect the decoded ID token (JWT) and access your custom [Account](https://docs.keycloakify.dev/theme-types/account-theme) and [Admin](https://docs.keycloakify.dev/theme-types/admin-theme) themes (if you implement them).

<figure><img src="https://2643300760-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F4Ls5iTdfTS2xECgBfw90%2Fuploads%2Fgit-blob-c2d66d5614acf2c3d906853da5754105b1a0d4d6%2Fimage%20(200).png?alt=media" alt=""><figcaption></figcaption></figure>

## More Options

Want to use a custom Keycloak image? Load some extentions? Import a realm configuration?\
No problem! The start-keycloak command support many options!

{% content-ref url="../features/compiler-options/startkeycloakoptions" %}
[startkeycloakoptions](https://docs.keycloakify.dev/features/compiler-options/startkeycloakoptions)
{% endcontent-ref %}