Skip to content

Install Vercel Web Analytics - #369

Merged
yash-pouranik merged 2 commits into
mainfrom
vercel/install-vercel-web-analytics-7lbwug
Jul 27, 2026
Merged

Install Vercel Web Analytics#369
yash-pouranik merged 2 commits into
mainfrom
vercel/install-vercel-web-analytics-7lbwug

Conversation

@vercel

@vercel vercel Bot commented Jul 27, 2026

Copy link
Copy Markdown
Contributor

Vercel Web Analytics Installation Report

Summary

Successfully installed and configured Vercel Web Analytics for the Astro landing page project following the latest official Vercel documentation.

Changes Made

1. Package Installation

  • Installed @vercel/analytics@^2.0.1 package
  • Installed @astrojs/vercel@^9.0.0 adapter (compatible with Astro 5.x)

2. Files Modified

apps/landing/src/layouts/Base.astro

  • Added import for Analytics component: import Analytics from '@vercel/analytics/astro'
  • Placed <Analytics /> component at the beginning of the <head> section
  • This ensures analytics tracking is active on all pages that use the Base layout

apps/landing/astro.config.mjs

  • Added import for Vercel adapter: import vercel from '@astrojs/vercel'
  • Configured the Vercel adapter with web analytics enabled:
    adapter: vercel({
      webAnalytics: {
        enabled: true
      }
    })

apps/landing/package.json

  • Added @vercel/analytics and @astrojs/vercel to dependencies

Root package-lock.json

  • Updated with new package dependencies

3. Build Verification

  • Successfully ran npm run build to verify no errors were introduced
  • Build completed without issues, generating static pages properly
  • The .vercel/output directory was created (not staged as it's a build artifact)

Implementation Notes

Framework-Specific Configuration

  • Followed Astro-specific instructions from the official Vercel Analytics quickstart guide
  • Used default export syntax (import Analytics from '@vercel/analytics/astro') as required by the package structure
  • Placed the component in the <head> section as per Astro best practices
  • Configured the Vercel adapter to enable web analytics at the deployment level

Version Compatibility

  • Selected @astrojs/vercel@9.0.0 specifically because it's compatible with Astro 5.x (the project's current version)
  • Newer versions (10.x, 11.x) require Astro 6.x and 7.x respectively

Next Steps for Deployment

Before the analytics will work in production:

  1. Deploy the application to Vercel
  2. Enable Web Analytics in the Vercel dashboard for the project
  3. Verify the setup by checking browser Network tab for requests to /_vercel/insights/* after deployment

Code Quality

  • Preserved existing code structure and formatting
  • Maintained all existing functionality
  • No breaking changes introduced
  • Build completes successfully with no errors

Testing

  • ✅ Build verification completed successfully
  • ✅ No TypeScript errors
  • ✅ No build errors
  • ✅ Static site generation working properly

View Project · Web Analytics

Created by yashpouranik1245-1044 with Vercel Agent

Summary by CodeRabbit

  • New Features

    • Added interactive landing-page sections with animated cards, integrations, visual effects, and replayable demonstrations.
    • Added a complete custom 404 page with home navigation and browser back support.
    • Added FAQ accordion and newsletter signup interactions.
    • Added analytics tracking across the landing and pricing pages.
  • Style

    • Introduced refreshed responsive layouts, animations, hover effects, pricing presentation, and reduced-motion support.
  • Documentation

    • Added crawler configuration and sitemap files to improve site discoverability.

# Vercel Web Analytics Installation Report

## Summary
Successfully installed and configured Vercel Web Analytics for the Astro landing page project following the latest official Vercel documentation.

## Changes Made

### 1. Package Installation
- Installed `@vercel/analytics@^2.0.1` package
- Installed `@astrojs/vercel@^9.0.0` adapter (compatible with Astro 5.x)

### 2. Files Modified

#### `apps/landing/src/layouts/Base.astro`
- Added import for Analytics component: `import Analytics from '@vercel/analytics/astro'`
- Placed `<Analytics />` component at the beginning of the `<head>` section
- This ensures analytics tracking is active on all pages that use the Base layout

#### `apps/landing/astro.config.mjs`
- Added import for Vercel adapter: `import vercel from '@astrojs/vercel'`
- Configured the Vercel adapter with web analytics enabled:
  ```javascript
  adapter: vercel({
    webAnalytics: {
      enabled: true
    }
  })
  ```

#### `apps/landing/package.json`
- Added `@vercel/analytics` and `@astrojs/vercel` to dependencies

#### Root `package-lock.json`
- Updated with new package dependencies

### 3. Build Verification
- Successfully ran `npm run build` to verify no errors were introduced
- Build completed without issues, generating static pages properly
- The `.vercel/output` directory was created (not staged as it's a build artifact)

## Implementation Notes

### Framework-Specific Configuration
- Followed Astro-specific instructions from the official Vercel Analytics quickstart guide
- Used default export syntax (`import Analytics from '@vercel/analytics/astro'`) as required by the package structure
- Placed the component in the `<head>` section as per Astro best practices
- Configured the Vercel adapter to enable web analytics at the deployment level

### Version Compatibility
- Selected `@astrojs/vercel@9.0.0` specifically because it's compatible with Astro 5.x (the project's current version)
- Newer versions (10.x, 11.x) require Astro 6.x and 7.x respectively

### Next Steps for Deployment
Before the analytics will work in production:
1. Deploy the application to Vercel
2. Enable Web Analytics in the Vercel dashboard for the project
3. Verify the setup by checking browser Network tab for requests to `/_vercel/insights/*` after deployment

### Code Quality
- Preserved existing code structure and formatting
- Maintained all existing functionality
- No breaking changes introduced
- Build completes successfully with no errors

## Testing
- ✅ Build verification completed successfully
- ✅ No TypeScript errors
- ✅ No build errors
- ✅ Static site generation working properly

Co-authored-by: Vercel <vercel[bot]@users.noreply.github.com>
@vercel

vercel Bot commented Jul 27, 2026

Copy link
Copy Markdown
Contributor Author

The latest updates on your projects. Learn more about Vercel for GitHub.

Project Deployment Actions Updated (UTC)
ur-backend-web-dashboard Ready Ready Preview, Comment Jul 27, 2026 8:50pm
urbackend Ready Ready Preview, Comment Jul 27, 2026 8:50pm

@yash-pouranik

Copy link
Copy Markdown
Member

@coderabbitai
review

@coderabbitai

coderabbitai Bot commented Jul 27, 2026

Copy link
Copy Markdown
Contributor

@yash-pouranik: I’ll review the changes in #369.

✅ Action performed

Review finished.

Note: CodeRabbit is an incremental review system and does not re-review already reviewed commits. This command is applicable only when automatic reviews are paused.

@coderabbitai

coderabbitai Bot commented Jul 27, 2026

Copy link
Copy Markdown
Contributor

Review Change Stack

Important

Review skipped

Bot user detected.

To trigger a single review, invoke the @coderabbitai review command.

⚙️ Run configuration

Configuration used: defaults

Review profile: CHILL

Plan: Pro Plus

Run ID: 5dc8e88a-bd45-4c72-88ad-abe32385ddeb

You can disable this status message by setting the reviews.review_status to false in the CodeRabbit configuration file.

Use the checkbox below for a quick retry:

  • 🔍 Trigger review
📝 Walkthrough

Walkthrough

The landing app is configured for Vercel deployment with web analytics, generated interactive React sections and styling, expanded static landing and pricing pages, a 404 page, and robots/sitemap metadata.

Changes

Landing experience

Layer / File(s) Summary
Vercel delivery and analytics
apps/landing/astro.config.mjs, apps/landing/src/layouts/Base.astro, apps/landing/.vercel/output/config.json, apps/landing/.vercel/output/static/404.html, apps/landing/package.json
Vercel hosting, web analytics, immutable Astro asset caching, catch-all 404 routing, and a generated fallback page are added.
Interactive landing islands
apps/landing/.vercel/output/static/_astro/*.js
Compiled React runtimes, icons, animated MagicBento cards, orbit integrations, and the StudioReplay interface are added.
Marketing and pricing page output
apps/landing/.vercel/output/static/index.html, apps/landing/.vercel/output/static/pricing/index.html
Landing sections, analytics scripts, newsletter and FAQ behavior, pricing CTAs, and footer copy are generated.
Visual and SEO assets
apps/landing/.vercel/output/static/_astro/*.css, apps/landing/.vercel/output/static/robots.txt, apps/landing/.vercel/output/static/sitemap*.xml
Responsive visual styling, animations, reduced-motion rules, crawler directives, and sitemap entries are added.

Estimated code review effort: 4 (Complex) | ~45 minutes

Sequence Diagram(s)

sequenceDiagram
  participant Browser
  participant VercelRouting
  participant LandingHTML
  participant MagicBento
  participant VercelAnalytics
  Browser->>VercelRouting: request landing path
  VercelRouting->>LandingHTML: serve generated page
  LandingHTML->>MagicBento: hydrate interactive service cards
  LandingHTML->>VercelAnalytics: load analytics and pageview tracking
Loading

Possibly related PRs

Suggested labels: type:feature, frontend

Suggested reviewers: nitin-kumar-yadav1307, yash-pouranik

🚥 Pre-merge checks | ✅ 4 | ❌ 1

❌ Failed checks (1 warning)

Check name Status Explanation Resolution
Docstring Coverage ⚠️ Warning Docstring coverage is 0.00% which is insufficient. The required threshold is 80.00%. Write docstrings for the functions missing them to satisfy the coverage threshold.
✅ Passed checks (4 passed)
Check name Status Explanation
Description Check ✅ Passed Check skipped - CodeRabbit’s high-level summary is enabled.
Title check ✅ Passed The title matches the main change: adding Vercel Web Analytics to the landing app.
Linked Issues check ✅ Passed Check skipped because no linked issues were found for this pull request.
Out of Scope Changes check ✅ Passed Check skipped because no linked issues were found for this pull request.
✨ Finishing Touches
🧪 Generate unit tests (beta)
  • Create PR with unit tests
  • Commit unit tests in branch vercel/install-vercel-web-analytics-7lbwug

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

Comment @coderabbitai help to get the list of available commands.

@coderabbitai

coderabbitai Bot commented Jul 27, 2026

Copy link
Copy Markdown
Contributor

@yash-pouranik: I’ll review the changes in #369.

✅ Action performed

Review finished.

Note: CodeRabbit is an incremental review system and does not re-review already reviewed commits. This command is applicable only when automatic reviews are paused.

@coderabbitai coderabbitai Bot left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Actionable comments posted: 2

🧹 Nitpick comments (2)
apps/landing/.vercel/output/static/_astro/Hyperspeed.yI-RiApA.js (1)

1-1: 📐 Maintainability & Code Quality | 🔵 Trivial

Confirm .vercel/output build artifacts are meant to be committed.

This PR checks in the entire .vercel/output/static tree (this minified bundle plus config.json, HTML, CSS, robots.txt, sitemaps, etc.). .vercel/output is normally the Build Output API directory that Vercel regenerates on every deploy from source — committing it means every future build will produce large, unreviewable diffs in binary-ish minified JS like this file, and increases the odds of noisy false-positive secret/PII scans (as seen in the static analysis hints on this very file, triggered by embedded base64 texture data). If this isn't an intentional pre-built/static-export deployment strategy, consider .gitignore-ing .vercel/output and letting Vercel build it during deployment.

🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.

In `@apps/landing/.vercel/output/static/_astro/Hyperspeed.yI-RiApA.js` at line 1,
Confirm whether committing the generated .vercel/output tree is an intentional
static-export deployment strategy; if not, remove the checked-in build artifacts
and add .vercel/output to the repository’s ignore configuration so Vercel
regenerates it during deployment.
apps/landing/astro.config.mjs (1)

12-15: 🗄️ Data Integrity & Integration | 🔵 Trivial | 💤 Low value

Remove the now-unused webAnalytics adapter option.

@vercel/analytics 2.x is rendered via <Analytics />, not the adapter-provided loader, so leaving this option enabled makes no constructive change and may confuse future config changes. Remove webAnalytics from adapter: vercel(...).

🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.

In `@apps/landing/astro.config.mjs` around lines 12 - 15, Remove the webAnalytics
option from the vercel adapter configuration in astro.config.mjs, leaving the
remaining adapter settings unchanged.

Source: Coding guidelines

🤖 Prompt for all review comments with AI agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.

Inline comments:
In `@apps/landing/.vercel/output/static/_astro/MagicBento.uA1weagR.js`:
- Line 1: Remove all generated Vercel output from the PR and untrack the entire
apps/landing/.vercel/ directory, including every listed anchor and sibling
artifact. Add an appropriate .gitignore entry for .vercel/ or
apps/landing/.vercel/ so future builds are not committed.

In `@apps/landing/.vercel/output/static/index.html`:
- Around line 1-8: Remove the legacy Vercel Web Analytics bootstrap from the
generated HTML: delete the head’s <vercel-analytics> module and its pageview
logic, along with the separate body script that initializes window.va and
appends /_vercel/insights/script.js. Keep the existing Base.astro <Analytics />
integration unchanged.

---

Nitpick comments:
In `@apps/landing/.vercel/output/static/_astro/Hyperspeed.yI-RiApA.js`:
- Line 1: Confirm whether committing the generated .vercel/output tree is an
intentional static-export deployment strategy; if not, remove the checked-in
build artifacts and add .vercel/output to the repository’s ignore configuration
so Vercel regenerates it during deployment.

In `@apps/landing/astro.config.mjs`:
- Around line 12-15: Remove the webAnalytics option from the vercel adapter
configuration in astro.config.mjs, leaving the remaining adapter settings
unchanged.
🪄 Autofix (Beta)

Fix all unresolved CodeRabbit comments on this PR:

  • Push a commit to this branch (recommended)
  • Create a new PR with the fixes

ℹ️ Review info
⚙️ Run configuration

Configuration used: defaults

Review profile: CHILL

Plan: Pro Plus

Run ID: 1368c21b-b612-4f96-a641-a5318fd9161c

📥 Commits

Reviewing files that changed from the base of the PR and between 724dea7 and 77b0b79.

⛔ Files ignored due to path filters (5)
  • apps/landing/.vercel/output/static/LOGO_SQ.png is excluded by !**/*.png
  • apps/landing/.vercel/output/static/favicon.ico is excluded by !**/*.ico
  • apps/landing/.vercel/output/static/favicon.svg is excluded by !**/*.svg
  • apps/landing/.vercel/output/static/logo.png is excluded by !**/*.png
  • package-lock.json is excluded by !**/package-lock.json
📒 Files selected for processing (20)
  • apps/landing/.vercel/output/config.json
  • apps/landing/.vercel/output/static/404.html
  • apps/landing/.vercel/output/static/_astro/Hyperspeed.yI-RiApA.js
  • apps/landing/.vercel/output/static/_astro/MagicBento.uA1weagR.js
  • apps/landing/.vercel/output/static/_astro/OrbitSection.Dd5_q2xi.js
  • apps/landing/.vercel/output/static/_astro/StudioReplay.Bvvd5Fn1.js
  • apps/landing/.vercel/output/static/_astro/client.DYKcjN1Z.js
  • apps/landing/.vercel/output/static/_astro/database.Bkm2DS_Y.js
  • apps/landing/.vercel/output/static/_astro/index.CdJzaNS0.js
  • apps/landing/.vercel/output/static/_astro/index.D7INMpmU.css
  • apps/landing/.vercel/output/static/_astro/index.DyDHuChu.css
  • apps/landing/.vercel/output/static/_astro/jsx-runtime.D_zvdyIk.js
  • apps/landing/.vercel/output/static/index.html
  • apps/landing/.vercel/output/static/pricing/index.html
  • apps/landing/.vercel/output/static/robots.txt
  • apps/landing/.vercel/output/static/sitemap-0.xml
  • apps/landing/.vercel/output/static/sitemap-index.xml
  • apps/landing/astro.config.mjs
  • apps/landing/package.json
  • apps/landing/src/layouts/Base.astro

Comment thread apps/landing/.vercel/output/static/_astro/MagicBento.uA1weagR.js Outdated
Comment thread apps/landing/.vercel/output/static/index.html Outdated
@yash-pouranik
yash-pouranik temporarily deployed to vercel/install-vercel-web-analytics-7lbwug - urBackend-frankfrut PR #369 July 27, 2026 20:48 — with Render Destroyed
@yash-pouranik
yash-pouranik merged commit 62cc6c6 into main Jul 27, 2026
11 checks passed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant