> ## Documentation Index
> Fetch the complete documentation index at: https://docs.genie-app.de/llms.txt
> Use this file to discover all available pages before exploring further.

# Store API keys and secrets in your project

> Project secrets store API keys and other sensitive values securely. Your running app reads them automatically — they are never visible in your code or chat.

Many apps need to call external services — payment processors, mapping APIs, email providers, and others — and those services require an API key to authenticate your requests. Hardcoding a key directly into your app is risky because anyone who views the source could read it. Genie's **Secrets** feature gives you a secure place to store these keys: they are encrypted, never exposed in your chat history or generated code, and injected as environment variables when your app runs.

<Note>
  Secrets require **Genie Cloud** to be connected to your project. If Genie Cloud is not connected, the Secrets tab will show a message asking you to set it up first. See [Genie Cloud](/cloud/overview) to get started.
</Note>

## How secrets work

A secret has two parts:

* **Name** — the key your app uses to read the value (for example, `STRIPE_SECRET_KEY`). Use uppercase letters and underscores, following standard environment variable naming conventions.
* **Value** — the actual sensitive string (the API key, token, or password).

Once saved, the value is stored encrypted and is never shown in full in the Genie interface. The secrets list displays the name, a masked value (`••••••••`), and the date the secret was last updated.

When Genie runs your app, all of your project's secrets are automatically available as environment variables. Your generated app code can read them with the appropriate method for the language or framework in use.

## Opening the Secrets tab

<Steps>
  <Step title="Open your project">
    Navigate to the project you want to configure.
  </Step>

  <Step title="Click Settings">
    Click the **Settings** button (gear icon) in the project view.
  </Step>

  <Step title="Select Secrets">
    In the settings sidebar, click **Secrets**. The tab loads your existing secrets in a table with columns for **Name**, **Value**, **Updated**, and **Actions**.
  </Step>
</Steps>

## Adding a secret

<Steps>
  <Step title="Click the Add button">
    In the **Secrets** tab, click the **+ Add** button in the top-right area of the tab. A dialog opens.
  </Step>

  <Step title="Enter the name">
    Type the secret's name in the **Name** field. This is the environment variable key your app will use — for example, `OPENAI_API_KEY`.
  </Step>

  <Step title="Enter the value">
    Type or paste the secret's value in the **Value** field. This is the actual API key or password.
  </Step>

  <Step title="Save">
    Click the save button in the dialog. The secret is encrypted and added to your project's secrets list immediately.
  </Step>
</Steps>

<Warning>
  Both **Name** and **Value** are required. If either field is empty, the dialog will not allow you to save.
</Warning>

## Viewing a secret

The **Value** column always shows `••••••••` to protect the stored value. To see the actual value, click the **eye icon** (view action) next to the secret. A read-only dialog opens showing the name and value in plain text.

## Editing a secret

<Steps>
  <Step title="Click the edit icon">
    In the secrets table, click the **pencil icon** next to the secret you want to change.
  </Step>

  <Step title="Update the name or value">
    The edit dialog opens with the current name and value pre-filled. You can change either or both fields.
  </Step>

  <Step title="Save">
    Click the confirm button. The secret is updated immediately. The **Updated** column in the table reflects the new timestamp.
  </Step>
</Steps>

<Tip>
  If you rotate an API key with the external service, come back here to update the value. Your app will pick up the new value on its next run — no redeployment needed.
</Tip>

## Deleting a secret

<Steps>
  <Step title="Click the delete icon">
    Click the **trash icon** next to the secret you want to remove.
  </Step>

  <Step title="Confirm deletion">
    A confirmation dialog appears with the secret's name. Click **Delete** to confirm.
  </Step>
</Steps>

<Warning>
  Deleting a secret is permanent. If your app reads that environment variable at runtime and the secret is gone, the app will receive an empty or undefined value and may stop working correctly. Make sure you update your app's code before removing a secret it depends on.
</Warning>

## Searching and paginating secrets

If you have many secrets, use the **search bar** at the top of the tab to filter by name. Results update as you type. The table shows up to 10 secrets per page; use the **Previous** and **Next** buttons at the bottom to navigate between pages.

## Secrets vs. general settings

It is worth understanding the difference between secrets and the other fields in **Settings > General**:

|                                      | Secrets                       | General settings                      |
| ------------------------------------ | ----------------------------- | ------------------------------------- |
| **Stored encrypted**                 | Yes                           | No                                    |
| **Visible after saving**             | Masked (`••••••••`)           | Fully visible                         |
| **Available to your app at runtime** | Yes, as environment variables | No                                    |
| **Requires Genie Cloud**             | Yes                           | No                                    |
| **Example use**                      | API keys, passwords, tokens   | Project name, description, visibility |

Never put sensitive values — API keys, passwords, or tokens — in the **Name** or **Description** fields in General settings. Those values are stored in plain text and may be visible to anyone who can view your project details.