feat: adds deploy pipeline and addresses linting issues

.firebaserc

@@ -1,5 +1,17 @@
 {
   "projects": {
-    "default": "zksync-docs-staging"
+    "default": "zksync-docs"
+  },
+  "targets": {
+    "zksync-docs": {
+      "hosting": {
+        "prod": [
+          "zksync-docs"
+        ],
+        "staging": [
+          "zksync-docs-staging"
+        ]
+      }
+    }
   }
 }

.github/workflows/checks.yaml

@@ -3,39 +3,54 @@ name: clean 🧹
 on:
   pull_request:
     branches: [main, staging]
-
   workflow_dispatch:
 
 jobs:
-  format:
-    name: format
+  setup:
+    name: Setup Environment
     runs-on: ubuntu-latest
+    outputs:
+      cache-key: ${{ steps.cache-keys.outputs.key }}
     steps:
       - uses: actions/checkout@v4
       - uses: oven-sh/setup-bun@v1
-      - name: Runs prettier formatter
-        run: |
-          bun install
-          bun run lint:prettier
+      - name: Install Dependencies
+        run: bun install
+      - id: cache-keys
+        run: echo "::set-output name=key::$(bun hash **/*.lock)"
+
+  format:
+    name: Format Code
+    needs: setup
+    runs-on: ubuntu-latest
+    steps:
+      - uses: actions/checkout@v4
+      - name: Runs Prettier Formatter
+        run: bun run lint:prettier
 
   spelling:
-    name: spelling
+    name: Check Spelling
+    needs: setup
     runs-on: ubuntu-latest
     steps:
       - uses: actions/checkout@v4
-      - uses: oven-sh/setup-bun@v1
-      - name: Runs cspell spell checker 
-        run: |
-           bun install
-           bun run lint:spelling
+      - name: Runs cSpell Spell Checker
+        run: bun run lint:spelling
 
-  lint:
-    name: lint markdown
+  markdown-lint:
+    name: Lint Markdown
+    needs: setup
     runs-on: ubuntu-latest
     steps:
       - uses: actions/checkout@v4
-      - uses: oven-sh/setup-bun@v1
-      - name: Runs mdl markdown linter
-        run: |
-            bun install
-            bun run lint:markdown
+      - name: Runs Markdown Linter
+        run: bun run lint:markdown
+
+  eslint:
+    name: Lint Code
+    needs: setup
+    runs-on: ubuntu-latest
+    steps:
+      - uses: actions/checkout@v4
+      - name: Runs ESLint
+        run: bun run lint:eslint

.github/workflows/deploy-preview.yml

@@ -0,0 +1,30 @@
+name: "👀 Preview Builder"
+on:
+  pull_request:
+  workflow_dispatch:
+
+jobs:
+  build_and_preview:
+    env:
+      NUXT_UI_PRO_LICENSE: ${{ secrets.NUXT_UI_PRO_LICENSE }}
+    if: ${{ github.event_name == 'workflow_dispatch' || github.event.pull_request.head.repo.full_name == github.repository }}
+    runs-on: ubuntu-latest
+    outputs:
+      output_urls: "${{ steps.preview_deploy.outputs.urls }}"
+    steps:
+      - uses: actions/checkout@v4 # v4
+
+      - uses: oven-sh/setup-bun@v1
+
+      - name: "Install dependencies"
+        run: bun install
+      - name: "Deploy target: staging"
+        run: bun run docs:build
+
+      - name: "Deploy preview"
+        uses: matter-labs/action-hosting-deploy@main
+        with:
+          repoToken: '${{ secrets.GITHUB_TOKEN }}'
+          firebaseServiceAccount: "${{ secrets.FIREBASE_SERVICE_ACCOUNT_ZKSYNC_DOCS }}"
+          target: staging
+          projectId: zksync-docs

.github/workflows/deploy-prod.yml

@@ -0,0 +1,56 @@
+name: "🚀 Deploy Preview"
+on:
+  push:
+    branches: [main]
+
+jobs:
+  build_and_deploy:
+    env:
+      NUXT_UI_PRO_LICENSE: ${{ secrets.NUXT_UI_PRO_LICENSE }}
+    if: ${{ github.event.repository.full_name == github.repository }}
+    runs-on: ubuntu-latest
+    environment: prod
+    steps:
+      - uses: actions/checkout@v4 # v4
+        with:
+          fetch-depth: 0
+          # Whether to configure the token or SSH key with the local git config
+          # Default: true
+          persist-credentials: false # <--- checking this in commit context
+
+      - uses: oven-sh/setup-bun@v1
+
+      - name: "Install dependencies"
+        run: bun install
+      - name: "Deploy target: staging"
+        run: bun run docs:build
+        # TODO: ask about below
+        # env:
+        #   RUDDERSTACK_WRITE_KEY: "${{ secrets.RUDDERSTACK_WRITE_KEY }}"
+        #   RUDDERSTACK_DATA_PLANE_URL: "${{ secrets.RUDDERSTACK_DATA_PLANE_URL }}"
+
+      - uses: matter-labs/action-hosting-deploy@main
+        with:
+          repoToken: "${{ secrets.GITHUB_TOKEN }}"
+          firebaseServiceAccount: "${{ secrets.FIREBASE_SERVICE_ACCOUNT_ZKSYNC_DOCS }}"
+          target: prod
+          projectId: zksync-docs
+          channelId: live
+
+      # TODO: re-enable once we are closer to production deployment
+      # - name: Purge cf cache
+      #   uses: nathanvaughn/actions-cloudflare-purge@db8c58f61ba4c3ec77229c8fa14ddebb3b59932f # v3.1.0
+      #   with:
+      #     cf_zone: ${{ secrets.CLOUDFLARE_ZONE }}
+      #     cf_auth: ${{ secrets.CLOUDFLARE_AUTH_KEY }}
+      #     hosts: |
+      #       docs.zksync.io
+      #       era.zksync.io
+      #       v2-docs.zksync.io
+
+      # TODO: Implement reindex task tracking instead of blindly exiting on task submit
+      # - name: Trigger Algolia reindex
+      #   run: |
+      #     curl -X POST "${{ secrets.ALGOLIA_CRAWLER_BASE_URL }}/crawlers/${{ secrets.ALGOLIA_CRAWLER_ID }}/reindex" \
+      #       -H "Content-Type: application/json" \
+      #       --user "${{ secrets.ALGOLIA_CRAWLER_USER_ID }}:${{ secrets.ALGOLIA_CRAWLER_API_KEY }}"

.github/workflows/deploy-staging.yml

@@ -0,0 +1,30 @@
+name: "🏗️ Staging Builder"
+on:
+  push:
+    branches: [staging]
+
+jobs:
+  build_and_deploy:
+    env:
+      NUXT_UI_PRO_LICENSE: ${{ secrets.NUXT_UI_PRO_LICENSE }}
+    if: ${{ github.event.repository.full_name == github.repository }}
+    runs-on: ubuntu-latest
+    steps:
+      - uses: actions/checkout@v4 # v4
+        with:
+          ref: "${{ github.event.inputs.ref }}"
+
+      - uses: oven-sh/setup-bun@v1
+
+      - name: "Install dependencies"
+        run: bun install
+      - name: "Deploy target: staging"
+        run: bun run docs:build
+
+      - uses: matter-labs/action-hosting-deploy@main
+        with:
+          repoToken: "${{ secrets.GITHUB_TOKEN }}"
+          firebaseServiceAccount: "${{ secrets.FIREBASE_SERVICE_ACCOUNT_ZKSYNC_DOCS }}"
+          target: staging
+          projectId: zksync-docs
+          channelId: live

.github/workflows/secrets_scanner.yaml

@@ -1,9 +1,9 @@
-name: Leaked Secrets Scan
+name: secret 🔍
 on:
   pull_request:
   merge_group:
 jobs:
-  TruffleHog:
+  scan:
     runs-on: ubuntu-latest
     steps:
       - name: Checkout code

app.vue

@@ -1,5 +1,7 @@
 <script setup lang="ts">
 import type { ParsedContent } from '@nuxt/content/dist/runtime/types';
+import FooterComponent from './components/FooterComponent.vue';
+import HeaderComponent from './components/HeaderComponent.vue';
 
 const { seo } = useAppConfig();
 
@@ -52,15 +54,15 @@ provide('navigation', navigation);
   <div>
     <NuxtLoadingIndicator />
 
-    <Header />
+    <HeaderComponent />
 
     <UMain>
       <NuxtLayout>
         <NuxtPage />
       </NuxtLayout>
     </UMain>
 
-    <Footer />
+    <FooterComponent />
 
     <ClientOnly>
       <LazyUContentSearch

firebase.json

@@ -1,10 +1,33 @@
 {
   "hosting": {
     "public": "public",
-    "ignore": [
-      "firebase.json",
-      "**/.*",
-      "**/node_modules/**"
+    "ignore": ["firebase.json", "**/.*", "**/node_modules/**"],
+    "headers": [
+      {
+        "source": "**",
+        "headers": [
+          {
+            "key": "Cache-Control",
+            "value": "no-cache, no-store, must-revalidate"
+          },
+          {
+            "key": "Referrer-Policy",
+            "value": "no-referrer, strict-origin-when-cross-origin"
+          },
+          {
+            "key": "X-Content-Type-Options",
+            "value": "nosniff"
+          },
+          {
+            "key": "X-Frame-Options",
+            "value": "DENY"
+          },
+          {
+            "key": "X-XSS-Protection",
+            "value": "1; mode=block"
+          }
+        ]
+      }
     ]
   }
 }

nuxt.config.ts

@@ -54,10 +54,4 @@ export default defineNuxtConfig({
       },
     },
   },
-  // deployment settings for Firebase
-  nitro: {
-    firebase: {
-      gen: 2,
-    },
-  },
 });

package.json

@@ -21,6 +21,7 @@
     "husky": "^9.0.11",
     "markdownlint": "^0.33.0",
     "markdownlint-cli2": "^0.12.1",
+    "particles.vue3": "^2.12.0",
     "prettier": "^3.1.0",
     "prettier-eslint": "^16.1.2",
     "prettier-plugin-tailwindcss": "^0.5.12",
@@ -50,7 +51,9 @@
     "lint:markdown": "markdownlint-cli2 \"content/**/*.md\" --config \".markdownlint.json\"",
     "lint:eslint": "eslint .",
     "lint:prettier": "prettier --check .",
+    "fix:prettier": "prettier --write .",
     "prepare": "husky",
-    "postinstall": "nuxt prepare"
+    "postinstall": "nuxt prepare",
+    "ci:check": "bun run lint:eslint && bun run lint:prettier && bun run lint:spelling && bun run lint:markdown"
   }
 }

pages/about-us.vue

@@ -1,3 +1,3 @@
 <script setup lang="ts"></script>
 
-<template>This is the about page.</template>
+<template><div>This is the about page.</div></template>

pages/index.vue

@@ -19,7 +19,6 @@ const particlesLoaded = async (container: unknown) => {
     <div>
       <vue-particles
         id="tsparticles"
-        @particles-loaded="particlesLoaded"
         :options="{
           fpsLimit: 120,
           interactivity: {
@@ -86,6 +85,7 @@ const particlesLoaded = async (container: unknown) => {
           },
           detectRetina: true,
         }"
+        @particles-loaded="particlesLoaded"
       />
       <ULandingHero
         v-if="page.hero"