diff --git a/.github/actions/notification/action.yml b/.github/actions/notification/action.yml
new file mode 100644
index 00000000..5d66378c
--- /dev/null
+++ b/.github/actions/notification/action.yml
@@ -0,0 +1,77 @@
+name: Discord Notification
+description: Send Discord Notification
+
+inputs:
+  TYPE:
+    description: "Embed Type"
+    required: false
+  TITLE:
+    description: "Title"
+    required: false
+  DESCRIPTION:
+    description: "Description"
+    required: false
+  AUTHOR_NAME:
+    description: "Author Name"
+    required: false
+  AUTHOR_URL:
+    description: "Author URL"
+    required: false
+  AUTHOR_ICON_URL:
+    description: "Author Icon URL"
+    required: false
+  DISCORD_WEBHOOK_URL:
+    description: "Discord Webhook URL"
+    required: true
+
+runs:
+  using: "composite"
+
+  steps:
+    - name: Send Discord Notification
+      shell: bash
+      run: |
+        if [ "${{ inputs.TYPE }}" == "success" ]; then
+          COLOR=5763207
+        elif [ "${{ inputs.TYPE }}" == "failure" ]; then
+          COLOR=15548997
+        elif [ "${{ inputs.TYPE }}" == "info" ]; then
+          COLOR=1752301
+        else
+          COLOR=9868950
+        fi
+
+        PAYLOAD=$(cat <<EOF
+        {
+          "avatar_url": "https://raw.githubusercontent.com/daodaoedu/daodao-f2e/main/public/daodao-logo.webp",
+          "username": "島島阿學",
+          "embeds": [
+            {
+              "author": {
+                "name": "${{ inputs.AUTHOR_NAME }}",
+                "url": "${{ inputs.AUTHOR_URL }}",
+                "icon_url": "${{ inputs.AUTHOR_ICON_URL }}"
+              },
+              "title": "${{ inputs.TITLE }}",
+              "description": "${{ inputs.DESCRIPTION }}",
+              "color": $COLOR
+            }
+          ]
+        }
+        EOF
+        )
+
+        response=$(curl -s -w "\n%{http_code}" -H "Content-Type: application/json" \
+          -X POST \
+          -d "$PAYLOAD" \
+          ${{ inputs.DISCORD_WEBHOOK_URL }})
+
+        status_code=$(echo "$response" | tail -n1)
+        response_body=$(echo "$response" | sed '$d')
+
+        if [ "$status_code" -ge 400 ]; then
+          echo "Error sending Discord notification"
+          echo "Status code: $status_code"
+          echo "Response: $response_body"
+          exit 1
+        fi
diff --git a/.github/workflows/ci-and-deploy.yml b/.github/workflows/ci-and-deploy.yml
index 2fe762f1..3226e8ae 100644
--- a/.github/workflows/ci-and-deploy.yml
+++ b/.github/workflows/ci-and-deploy.yml
@@ -6,11 +6,13 @@ concurrency:
 
 on:
   pull_request:
-    branches: "**"
+    branches: 
+      - "**"
+      - "!dependabot/**"
   workflow_dispatch:
 
 env:
-  DEPLOY_OUTPUT: null
+  PR_URL: ${{ github.server_url }}/${{ github.repository }}/pull/${{ github.event.number }}
 
 jobs:
   init:
@@ -81,53 +83,66 @@ jobs:
       - name: Git checkout
         uses: actions/checkout@v3
 
-      - name: Build and Deploy to Cloudflare
-        id: deploy
+      - name: Cache dependencies
+        id: cache
+        uses: actions/cache@v3
+        with:
+          path: |
+            node_modules
+            ~/.cache/Cypress
+          key: deps-node-modules-${{ hashFiles('**/yarn.lock') }}
+
+      - name: Install dependencies
+        if: steps.cache.outputs.cache-hit != 'true'
+        run: yarn install --frozen-lockfile
+
+      - name: Build
+        run: yarn pages:build
+
+      - name: Deploy to Cloudflare
         uses: cloudflare/wrangler-action@v3
         with:
           apiToken: ${{ secrets.CLOUDFLARE_API_TOKEN }}
           accountId: ${{ secrets.CLOUDFLARE_ACCOUNT_ID }}
           gitHubToken: ${{ secrets.GITHUB_TOKEN }}
-          command: pages deploy out
-
-      - name: Save Deploy Output
-        run: |
-          echo "DEPLOY_OUTPUT=$(${{ steps.deploy.outputs.command-output }})" >> $GITHUB_ENV
+          command: pages deploy --branch=${{ github.event.pull_request.head.ref }}
 
-  notify_discord:
-    name: Notify Discord
+  send_result:
+    name: Send Result
     runs-on: ubuntu-latest
     needs: [lint, build_and_deploy]
     if: always()
 
     steps:
-      - name: Send Discord Notification
-        run: |
-          if [ "${{ needs.lint.result }}" == "failure" ]; then
-            STATUS="❌ Lint Failed"
-            COLOR=15158332
-          elif [ "${{ needs.build_and_deploy.result }}" == "failure" ]; then
-            STATUS="❌ Build and Deploy Failed"
-            COLOR=15158332
-          else
-            STATUS="✅ Build Succeeded"
-            COLOR=3066993
-          fi
-
-          PAYLOAD=$(cat <<EOF
-          {
-            "embeds": [
-              {
-                "title": "$STATUS",
-                "description": "Repository: [${{ github.repository }}](https://github.com/${{ github.repository }})\nBranch: ${{ github.ref_name }}\nWorkflow: ${{ github.workflow }}\n\n${{ env.DEPLOY_OUTPUT }}",
-                "color": $COLOR
-              }
-            ]
-          }
-          EOF
-          )
-
-          curl -H "Content-Type: application/json" \
-            -X POST \
-            -d "$PAYLOAD" \
-            ${{ secrets.SANDBOX_DISCORD_WEBHOOK_URL }}
+      - uses: actions/checkout@v3
+
+      - name: Send Lint Failed Notification
+        if: ${{ needs.lint.result == 'failure' }}
+        uses: ./.github/actions/notification
+        with:
+          TYPE: failure
+          TITLE: "❌ Lint Failed"
+          DESCRIPTION: "PR Link: [PR #${{ github.event.number }}](${{ env.PR_URL }})"
+          DISCORD_WEBHOOK_URL: ${{ secrets.SANDBOX_DISCORD_WEBHOOK_URL }}
+
+      - name: Send Build and Deploy Failed Notification
+        if: ${{ needs.build_and_deploy.result == 'failure' }}
+        uses: ./.github/actions/notification
+        with:
+          TYPE: failure
+          TITLE: "❌ Build and Deploy Failed"
+          DESCRIPTION: "PR Link: [PR #${{ github.event.number }}](${{ env.PR_URL }})"
+          DISCORD_WEBHOOK_URL: ${{ secrets.SANDBOX_DISCORD_WEBHOOK_URL }}
+
+      - name: Send Build Succeeded Notification
+        if: ${{ needs.build_and_deploy.result == 'success' }}
+        uses: ./.github/actions/notification
+        with:
+          TYPE: success
+          TITLE: "✅ Build Succeeded"
+          DESCRIPTION: "Preview URL: ${{ needs.build_and_deploy.outputs.pages-deployment-alias-url }}"
+          DISCORD_WEBHOOK_URL: ${{ secrets.SANDBOX_DISCORD_WEBHOOK_URL }}
+      
+      - name: Echo
+        run:
+          echo "${{ needs.build_and_deploy.outputs }}"
diff --git a/.github/workflows/pr-notification.yml b/.github/workflows/pr-notification.yml
new file mode 100644
index 00000000..c92fe04f
--- /dev/null
+++ b/.github/workflows/pr-notification.yml
@@ -0,0 +1,28 @@
+name: PR Notification
+
+on:
+  pull_request:
+    branches: "**"
+
+env:
+  TITLE: "## ${{ github.event.pull_request.title }}"
+  PR_LINK: "PR Link: [PR #${{ github.event.number }}](${{ github.server_url }}/${{ github.repository }}/pull/${{ github.event.number }})"
+  DESCRIPTION: "${{ github.event.pull_request.body || 'No description' }}"
+
+jobs:
+  send_notification:
+    name: Send Notification
+    runs-on: ubuntu-latest
+
+    steps:
+      - uses: actions/checkout@v3
+
+      - name: Send PR Notification
+        uses: ./.github/actions/notification
+        with:
+          TYPE: info
+          TITLE: "🔔 PR Notification"
+          DESCRIPTION: "${{ env.TITLE }}\\n${{ env.PR_LINK }}\\n\\n${{ env.DESCRIPTION }}"
+          AUTHOR_NAME: ${{ github.event.pull_request.user.name || github.event.pull_request.user.login }}
+          AUTHOR_ICON_URL: ${{ github.event.pull_request.user.avatar_url }}
+          DISCORD_WEBHOOK_URL: ${{ secrets.SANDBOX_DISCORD_WEBHOOK_URL }}
diff --git a/public/daodao-logo.webp b/public/daodao-logo.webp
new file mode 100644
index 00000000..724cd043
Binary files /dev/null and b/public/daodao-logo.webp differ
diff --git a/wrangler.json b/wrangler.json
index 9e026a50..0a5f41c4 100644
--- a/wrangler.json
+++ b/wrangler.json
@@ -1,5 +1,5 @@
 {
-  "name": "daodao-test",
+  "name": "daodao-f2e",
   "compatibility_date": "2024-07-29",
   "compatibility_flags": ["nodejs_compat"],
   "pages_build_output_dir": ".vercel/output/static"