mirror of
https://github.com/jakejarvis/stanza.git
synced 2026-07-16 19:16:00 -04:00
bdf2f1f028afbee2e3a4ab5922f776c4bdca1959
bdf2f1f028
Install and configure Vercel Web Analytics (#1)
## Vercel Web Analytics Installation
Successfully installed and configured Vercel Web Analytics for the stanza-web project following the official Vercel documentation.
### Changes Made
#### 1. Package Installation
- Installed `@vercel/analytics` version 2.0.1 using pnpm
- Package added to `apps/web/package.json` dependencies
#### 2. Analytics Component Integration
Modified `apps/web/src/routes/__root.tsx`:
- Added import: `import { Analytics } from "@vercel/analytics/react";`
- Added `<Analytics />` component to the RootComponent's JSX, placed just before the `<Scripts />` component
- This ensures analytics tracking is enabled across all pages of the application
#### 3. Framework-Specific Implementation
The project uses TanStack Start (React-based framework) with Nitro as the server. According to the Vercel documentation, the correct integration approach for React applications is:
- Import `Analytics` from `@vercel/analytics/react`
- Add the `<Analytics />` component to the root layout component
- This integration automatically handles page view tracking for client-side route transitions
### Files Modified
- `apps/web/package.json` - Added @vercel/analytics dependency
- `apps/web/src/routes/__root.tsx` - Added Analytics component import and usage
- `package.json` - Added tsx as a dev dependency for build tooling
- `pnpm-lock.yaml` - Updated with new dependencies
### Verification
✅ Type checking passed (tsc --noEmit)
✅ Linting passed (oxlint) - 0 warnings, 0 errors
✅ Tests passed (vitest) - All 10 tests passing
✅ No breaking changes introduced
✅ Existing code structure preserved
### Next Steps for Activation
To enable analytics tracking in production:
1. Deploy the application to Vercel
2. Enable Web Analytics in the Vercel dashboard (Analytics section)
3. Analytics data will start appearing after user visits
### Notes
- The Analytics component is lightweight and only tracks page views by default
- Custom event tracking is available with Pro/Enterprise plans
- The component automatically detects the environment (development vs production)
- Integration follows React best practices by placing the component at the root level
Co-authored-by: Vercel <vercel[bot]@users.noreply.github.com>
Stanza
Modular monorepo template CLI — shadcn for full-stack TypeScript stacks.
pnpm create stanza my-app
Pick a framework, ORM, database, auth provider, styling — get a clean monorepo with idiomatic code, vendored into your repo. Add modules later with stanza add.
Generated projects keep slot boundaries explicit: auth, db, and orm install into their own internal workspace packages (packages/auth/, packages/db/, named @<your-app>/auth, @<your-app>/db), and your app consumes them via workspace:* deps. Swapping an auth provider replaces the contents of packages/auth/ without touching your app's imports.
What's inside
apps/
cli/ # @stanza/cli — the CLI binary
web/ # https://stanza.tools (TanStack Start)
packages/
registry/ # shared schema, slot/peer/capability resolver
codemods/ # ts-morph helpers for region-aware patching
create-stanza/ # `pnpm create stanza` shim
registry/
modules/ # first-party modules (framework, orm, db, auth, styling)
Status
Work in progress. See CLAUDE.md, TODO.md, and REGISTRY.md for current state.
License
MIT — see LICENSE.
Languages
TypeScript
91.5%
MDX
6.1%
CSS
2.2%
JavaScript
0.2%