firebase-platform
SKILL: Firebase Platform Master Guide
Consolidated reference for AngularFire SDK and Firebase Data Connect (GQL + PostgreSQL).
🔥 1. AngularFire Core (SDK)
Real-time Database & Firestore
- Reactive Pattern: Use
collectionData,docDataand convert to signals usingtoSignal(). - Dependency Injection: Use
inject(Firestore),inject(Auth), etc. - Security: Security rules are the primary defense. Never trust the client.
Authentication
- State management: Track
userstatus in anAuthStore. - Guards: Use functional
canActivateguards withAuthservice.
⚡ 2. Firebase Data Connect (GQL + PostgreSQL)
Schema Workflow
- Schema First: Define
@tableinschema.gql. - Generation: Run
firebase dataconnect:sdk:generateafter schema changes. - Strict Types: Use the generated SDK; never edit
dataconnect-generated/.
Directive Rules
@table: Required for all database entities.@auth: Required for all types (No public access allowed).@default: Use for UUIDs (uuidV4()) and timestamps (request.time).@col(name: "..."): Map JSON keys to DB columns if different.
🏗️ 3. Integration with NgRx Signals
- Query Wrapping:
export const MyStore = signalStore( withMethods((store, dc = inject(DataConnectService)) => ({ loadData: rxMethod<void>( pipe( switchMap(() => dc.myDataQuery()), tapResponse({ next: (res) => patchState(store, { data: res.data }), error: console.error, }), ), ), })), );
🔒 4. Security & Performance
- Secrets: Store Firebase API keys and config in
environment.ts. - Query Design: Fetch only required fields in GraphQL.
- Auth Pattern:
@auth(rules: [{ allow: OWNER, ownerField: "userId" }]). - No Hardcoded Secrets: Secrets must stay in environment variables or GCP Secret Manager.
Law: After any schema change, the SDK MUST be regenerated before editing application logic.
More from neversight/skills_feed
ai-image-generation
|
7react-best-practices
Provides React patterns for hooks, effects, refs, and component design. Covers escape hatches, anti-patterns, and correct effect usage. Must use when reading or writing React components (.tsx, .jsx files with React imports).
7ui-designer
Use when user needs visual UI design, interface creation, component systems, design systems, interaction patterns, or accessibility-focused user interfaces.
7python-env
Fast Python environment management with uv (10-100x faster than pip). Triggers on: uv, venv, pip, pyproject, python environment, install package, dependencies.
7typescript-best-practices
Provides TypeScript patterns for type-first development, making illegal states unrepresentable, exhaustive handling, and runtime validation. Must use when reading or writing TypeScript/JavaScript files.
6ai-marketing-videos
|
6