Gatsby on Firebase Hosting
Explore how Gatsby Firebase Adapter serves static, SSR and DSG pages and API endpoints on Firebase Hosting’s global CDN and Cloud Functions.
What this demo highlights
Static-first builds
Gatsby pre-renders pages into Firebase Hosting. This home page and the blog are emitted as static assets ready for the CDN.
Routing
The adapter translates Gatsby redirects, headers, and page routes into firebase.json so Hosting mirrors your site map.
Server-Side Rendering (SSR)
Use getServerData() to run on-demand rendering in Cloud Functions when a request arrives. Perfect for dashboards or live data.
Deferred static generation (DSG)
Ship hundreds of pages without long build times. DSG content renders on the first request and is cached on Firebase Storage.
Gatsby Functions
Files under /src/api gets bundled as Firebase HTTPS functions ready for deploy.
Firebase Authentication
Use Firebase Auth to authenticate users to Cloud Functions, SSR, or API routes.
Get Started
Build and deploy checklist
Run through these steps to test the adapter locally.
- Inspect the Firebase build output. Run
gatsby buildand the adapter writes Hosting assets and Cloud Functions bundles. - Use the Firebase Emulator Suite. Run
firebase emulators:startto test your project locally before deploying. - Deploy with Firebase CLI. Run
firebase deployto publish static files, SSR/DSG functions, and API endpoints. - Preview changes. Firebase Hosting preview channels let you preview updates before production.
API endpoint status
This request runs in the browser against the deployed Cloud Function at /api/hello-world