From 93f382216dbf5ac9b1ea7242bfaa47b2578650bd Mon Sep 17 00:00:00 2001 From: Jayam Srivastava Date: Fri, 19 Jun 2026 13:43:04 +0000 Subject: [PATCH] Integrate Firebase Hosting for automated deployment - Add firebase.json with SPA rewrites and cache headers for Vite dist/ output - Add .firebaserc with default project configuration - Add GitHub Actions workflow for production deploy on main branch push - Add GitHub Actions workflow for PR preview deployments - Add deploy and deploy:preview npm scripts - Add .firebase/ to .gitignore - Update README with deployment instructions and required secrets Closes #45 Co-Authored-By: Devin AI <158243242+devin-ai-integration[bot]@users.noreply.github.com> --- .firebaserc | 5 ++ .github/workflows/firebase-deploy.yml | 50 +++++++++++++++++++ .github/workflows/firebase-preview.yml | 50 +++++++++++++++++++ .gitignore | 5 +- README.md | 67 ++++++++++++++++++++++++++ firebase.json | 36 ++++++++++++++ package.json | 4 +- 7 files changed, 215 insertions(+), 2 deletions(-) create mode 100644 .firebaserc create mode 100644 .github/workflows/firebase-deploy.yml create mode 100644 .github/workflows/firebase-preview.yml create mode 100644 firebase.json diff --git a/.firebaserc b/.firebaserc new file mode 100644 index 0000000..00e2bcf --- /dev/null +++ b/.firebaserc @@ -0,0 +1,5 @@ +{ + "projects": { + "default": "servio-app" + } +} diff --git a/.github/workflows/firebase-deploy.yml b/.github/workflows/firebase-deploy.yml new file mode 100644 index 0000000..15ed23f --- /dev/null +++ b/.github/workflows/firebase-deploy.yml @@ -0,0 +1,50 @@ +name: Deploy to Firebase Hosting + +on: + push: + branches: [main] + workflow_dispatch: + +permissions: + contents: read + +concurrency: + group: firebase-deploy-${{ github.ref }} + cancel-in-progress: true + +jobs: + build-and-deploy: + name: Build & Deploy + runs-on: ubuntu-latest + + steps: + - name: Checkout + uses: actions/checkout@v4 + + - name: Set up Node.js + uses: actions/setup-node@v4 + with: + node-version: 20 + cache: npm + + - name: Install dependencies + run: npm ci + + - name: Build + run: npm run build + env: + VITE_FIREBASE_API_KEY: ${{ secrets.VITE_FIREBASE_API_KEY }} + VITE_FIREBASE_AUTH_DOMAIN: ${{ secrets.VITE_FIREBASE_AUTH_DOMAIN }} + VITE_FIREBASE_PROJECT_ID: ${{ secrets.VITE_FIREBASE_PROJECT_ID }} + VITE_FIREBASE_STORAGE_BUCKET: ${{ secrets.VITE_FIREBASE_STORAGE_BUCKET }} + VITE_FIREBASE_MESSAGING_SENDER_ID: ${{ secrets.VITE_FIREBASE_MESSAGING_SENDER_ID }} + VITE_FIREBASE_APP_ID: ${{ secrets.VITE_FIREBASE_APP_ID }} + VITE_FIREBASE_MEASUREMENT_ID: ${{ secrets.VITE_FIREBASE_MEASUREMENT_ID }} + + - name: Deploy to Firebase Hosting + uses: FirebaseExtended/action-hosting-deploy@v0 + with: + repoToken: ${{ secrets.GITHUB_TOKEN }} + firebaseServiceAccount: ${{ secrets.FIREBASE_SERVICE_ACCOUNT }} + channelId: live + projectId: ${{ secrets.VITE_FIREBASE_PROJECT_ID }} diff --git a/.github/workflows/firebase-preview.yml b/.github/workflows/firebase-preview.yml new file mode 100644 index 0000000..7a5efbf --- /dev/null +++ b/.github/workflows/firebase-preview.yml @@ -0,0 +1,50 @@ +name: Firebase Hosting Preview + +on: + pull_request: + +permissions: + contents: read + checks: write + pull-requests: write + +concurrency: + group: firebase-preview-${{ github.event.pull_request.number }} + cancel-in-progress: true + +jobs: + preview: + if: ${{ github.event.pull_request.head.repo.full_name == github.repository }} + name: Build & Preview + runs-on: ubuntu-latest + + steps: + - name: Checkout + uses: actions/checkout@v4 + + - name: Set up Node.js + uses: actions/setup-node@v4 + with: + node-version: 20 + cache: npm + + - name: Install dependencies + run: npm ci + + - name: Build + run: npm run build + env: + VITE_FIREBASE_API_KEY: ${{ secrets.VITE_FIREBASE_API_KEY }} + VITE_FIREBASE_AUTH_DOMAIN: ${{ secrets.VITE_FIREBASE_AUTH_DOMAIN }} + VITE_FIREBASE_PROJECT_ID: ${{ secrets.VITE_FIREBASE_PROJECT_ID }} + VITE_FIREBASE_STORAGE_BUCKET: ${{ secrets.VITE_FIREBASE_STORAGE_BUCKET }} + VITE_FIREBASE_MESSAGING_SENDER_ID: ${{ secrets.VITE_FIREBASE_MESSAGING_SENDER_ID }} + VITE_FIREBASE_APP_ID: ${{ secrets.VITE_FIREBASE_APP_ID }} + VITE_FIREBASE_MEASUREMENT_ID: ${{ secrets.VITE_FIREBASE_MEASUREMENT_ID }} + + - name: Deploy Preview to Firebase Hosting + uses: FirebaseExtended/action-hosting-deploy@v0 + with: + repoToken: ${{ secrets.GITHUB_TOKEN }} + firebaseServiceAccount: ${{ secrets.FIREBASE_SERVICE_ACCOUNT }} + projectId: ${{ secrets.VITE_FIREBASE_PROJECT_ID }} diff --git a/.gitignore b/.gitignore index fa21675..aff8f93 100644 --- a/.gitignore +++ b/.gitignore @@ -25,4 +25,7 @@ Thumbs.db .env.local .env.development.local .env.test.local -.env.production.local \ No newline at end of file +.env.production.local + +# Firebase +.firebase/ \ No newline at end of file diff --git a/README.md b/README.md index ae6e7f4..6f4ed48 100644 --- a/README.md +++ b/README.md @@ -30,6 +30,73 @@ A modern SaaS website built with React, Vite, and Tailwind CSS. This project is npm run dev ``` +## 🚀 Deployment + +This project uses **Firebase Hosting** for production deployments. + +### Prerequisites + +- [Firebase CLI](https://firebase.google.com/docs/cli) installed globally: + ```bash + npm install -g firebase-tools + ``` +- A Firebase project with Hosting enabled +- Firebase authentication via `firebase login` + +### Environment Variables + +Create a `.env` file at the project root with your Firebase configuration: + +```env +VITE_FIREBASE_API_KEY=your_api_key +VITE_FIREBASE_AUTH_DOMAIN=your_project.firebaseapp.com +VITE_FIREBASE_PROJECT_ID=your_project_id +VITE_FIREBASE_STORAGE_BUCKET=your_project.firebasestorage.app +VITE_FIREBASE_MESSAGING_SENDER_ID=your_sender_id +VITE_FIREBASE_APP_ID=your_app_id +VITE_FIREBASE_MEASUREMENT_ID=your_measurement_id +``` + +### Manual Deployment + +1. Build and deploy to production: + ```bash + npm run deploy + ``` + +2. Deploy a preview channel: + ```bash + npm run deploy:preview + ``` + +### Automated Deployment (CI/CD) + +Deployments are automated via GitHub Actions: + +- **Production:** Merges to `main` trigger a build and deploy to the live Firebase Hosting channel. +- **Preview:** Pull requests automatically deploy to a temporary preview URL (posted as a PR comment). + +To enable automated deployments, add the following secrets to your GitHub repository (`Settings > Secrets and variables > Actions`): + +| Secret | Description | +|--------|-------------| +| `FIREBASE_SERVICE_ACCOUNT` | Firebase service account JSON key (see [setup guide](https://github.com/FirebaseExtended/action-hosting-deploy/blob/main/docs/service-account.md)) | +| `VITE_FIREBASE_API_KEY` | Firebase API key | +| `VITE_FIREBASE_AUTH_DOMAIN` | Firebase auth domain | +| `VITE_FIREBASE_PROJECT_ID` | Firebase project ID | +| `VITE_FIREBASE_STORAGE_BUCKET` | Firebase storage bucket | +| `VITE_FIREBASE_MESSAGING_SENDER_ID` | Firebase messaging sender ID | +| `VITE_FIREBASE_APP_ID` | Firebase app ID | +| `VITE_FIREBASE_MEASUREMENT_ID` | Firebase measurement ID | + +### Firebase Project Setup + +1. Update the project ID in `.firebaserc` to match your Firebase project. +2. The `firebase.json` configures: + - `dist/` as the public directory (Vite build output) + - SPA rewrites (all routes serve `index.html`) + - Cache headers for static assets + ## ✨ Key Features - **Web Development Services:** Professional development of high-performance landing pages, corporate websites, and custom SaaS applications tailored for business growth. diff --git a/firebase.json b/firebase.json new file mode 100644 index 0000000..eefa4f3 --- /dev/null +++ b/firebase.json @@ -0,0 +1,36 @@ +{ + "hosting": { + "public": "dist", + "ignore": [ + "firebase.json", + "**/.*", + "**/node_modules/**" + ], + "rewrites": [ + { + "source": "**", + "destination": "/index.html" + } + ], + "headers": [ + { + "source": "/assets/**", + "headers": [ + { + "key": "Cache-Control", + "value": "public, max-age=31536000, immutable" + } + ] + }, + { + "source": "**/*.@(js|css)", + "headers": [ + { + "key": "Cache-Control", + "value": "public, max-age=31536000, immutable" + } + ] + } + ] + } +} diff --git a/package.json b/package.json index f03b253..0a756f8 100644 --- a/package.json +++ b/package.json @@ -7,7 +7,9 @@ "dev": "vite --open", "build": "vite build", "typecheck": "tsc --noEmit", - "lint": "eslint ." + "lint": "eslint .", + "deploy": "npm run build && firebase deploy --only hosting", + "deploy:preview": "npm run build && firebase hosting:channel:deploy preview" }, "dependencies": { "@emotion/react": "11.14.0",