# Project Setup and Config — Firebase

Source: https://www.skillbyai.com/en/firebase/fo-setup

> The web config is not a secret.

## Config, API keys and App Check

You create a project in the Firebase console, register a web app, and receive a **config object** (`apiKey`, `authDomain`, `projectId`, `storageBucket`, `appId` and so on). This config identifies your project; it is **not a secret** and is expected to appear in client code. The Firebase API key is not an access credential for your data: rules and Auth control access. You can still restrict the key in Google Cloud (allowed referrers, allowed APIs) and enable **App Check**, which attaches attestation tokens (reCAPTCHA Enterprise on the web, Play Integrity or App Attest on mobile) so backends can reject requests from unverified clients. Real secrets, such as third-party API keys, never go in the client.

## Initialising the app and App Check

TypeScript; values are placeholders.

```typescript
import { initializeApp } from "firebase/app";
import { initializeAppCheck, ReCaptchaEnterpriseProvider } from "firebase/app-check";

const firebaseConfig = {
  apiKey: "AIza...",              // identifies the project, not a secret
  authDomain: "my-app.firebaseapp.com",
  projectId: "my-app",
  storageBucket: "my-app.appspot.com", // newer projects may use a different bucket domain; copy from the console
  appId: "1:1234:web:abcd",
};

export const app = initializeApp(firebaseConfig);

initializeAppCheck(app, {
  provider: new ReCaptchaEnterpriseProvider("RECAPTCHA_ENTERPRISE_SITE_KEY"),
  isTokenAutoRefreshEnabled: true,
});
```

## Use separate projects per environment

Create distinct Firebase projects for dev, staging and production, and switch with `firebase use <alias>`, so tests never touch production data.

**Quiz:** Which statement about the Firebase web config is correct?

- [ ] It contains the Admin SDK private key
- [ ] It must be stored only on the server
- [ ] Anyone with it can bypass Security Rules
- [x] It identifies the project and is safe to include in client code

*Answer:* It identifies the project and is safe to include in client code. Access is controlled by rules and Auth, not by hiding the config.