Skip to content

Frogbyte-io/veerify

Folders and files

NameName
Last commit message
Last commit date

Latest commit

Β 

History

352 Commits
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 

Repository files navigation

Veerify

CI

A modern feedback management platform built with Nuxt 3, TypeScript, and shadcn-vue. Veerify helps you collect, organize, and prioritize user feedback to build better products - similar to Sleekplan, Canny, and Featurebase.

🌟 Features

  • Feedback Collection - Capture user feedback and feature requests
  • Voting System - Let users upvote their favorite features
  • Status Management - Track feedback from submission to completion
  • Team Collaboration - Role-based access with team management
  • Analytics Dashboard - Insights into user engagement and feedback trends
  • Public Roadmap - Share your product development timeline
  • User Management - Organize and segment your user base

🐸 Tech Stack (FrogStack)

  • Nuxt 3 - The Intuitive Vue Framework
  • TypeScript - Static type checking
  • shadcn-vue - Beautifully designed components built with Radix Vue and Tailwind CSS
  • Tailwind CSS - Utility-first CSS framework
  • Vue 3 - The Progressive JavaScript Framework
  • Reka UI - Vue port of Radix UI primitives
  • Lucide Vue - Beautiful hand-crafted SVG icons
  • VueUse - Collection of essential Vue composition utilities

πŸš€ Getting Started

Prerequisites

  • Node.js 18+
  • Yarn package manager

Installation

Install dependencies using yarn:

yarn install

Agent harness (Codex/Claude)

The repository includes an explicit AI harness so coding agents can bootstrap context and run deterministic checks.

# Print key context and git snapshot
yarn harness:context

# Validate agent docs map + run quality gates
yarn harness:verify

yarn harness:verify runs:

  • yarn typecheck
  • yarn test
  • yarn lint
  • yarn test:e2e:if-available (guarded Playwright runner)

Chrome DevTools MCP for Codex:

# One-time local setup
yarn codex:mcp:chrome:setup

# Deterministic per-worktree app URL/port
yarn worktree:env

# Run app bound to the worktree-specific port
yarn dev:worktree

Development

Start the development server on http://localhost:3000:

yarn dev

Start the development PostgreSQL database

docker compose -f docker-compose-dev.yml up -d

This starts:

  • PostgreSQL on localhost:5432
  • Mailpit SMTP/UI on localhost:1025 and localhost:8025
  • MinIO API/Console on localhost:9000 and localhost:9001

Email Testing with Mailpit

The development environment includes Mailpit, a local SMTP server and web interface for testing emails during development.

When you run the development docker compose, Mailpit will be available at:

  • Web Interface: http://localhost:8025 - View sent emails in a web UI
  • SMTP Server: localhost:1025 - Configure your app to send emails here

SMTP Configuration for Development:

Create a .env file in your project root with these settings:

# Email Configuration for Mailpit (Development)
MAIL_FROM="noreply@veerify.local"
SMTP_HOST=localhost
SMTP_PORT=1025
SMTP_SECURE=false
SMTP_USER=
SMTP_PASS=

All emails sent by your application during development will be captured by Mailpit and displayed in the web interface, making it easy to test email verification, password resets, and other email functionality without sending real emails.

Visualize the database using drizzle studio

yarn db:studio

Production

Build the application for production:

yarn build

The build automatically runs migrations and seeds test data via the postbuild script. Seed is skipped on production (VERCEL_ENV=production).

Configure the PostgreSQL database

You can connect to PostgreSQL in two ways:

Option A β€” single connection string (recommended for hosted databases like Neon):

DATABASE_URL=postgres://user:password@host:5432/dbname?sslmode=require

Option B β€” individual variables (used by local Docker setup):

PGHOST=localhost
PGPORT=5432
PGUSER=veerify
PGPASSWORD=veerifypassword
PGDATABASE=veerifydb

DATABASE_URL takes precedence when both are set.

Configure app and public-board domains

Use separate domains for the dashboard app and team public boards:

# Dashboard app host (main app)
BETTER_AUTH_URL=https://app.veerify.io
APP_DASHBOARD_DOMAIN=app.veerify.io

# Public board base host (team subdomains)
APP_DOMAIN=veerify.io

# Optional deployment mode override ("self-hosted" or "cloud")
# If omitted, Veerify auto-detects cloud platforms from env vars.
APP_DEPLOYMENT_MODE=self-hosted

To enable GitHub repository connection in product settings, set OAuth credentials:

GITHUB_CLIENT_ID=your-github-oauth-app-client-id
GITHUB_CLIENT_SECRET=your-github-oauth-app-client-secret

Configure the GitHub OAuth app callback URL as https://<your-dashboard-host>/api/auth/callback/github. Veerify uses that Better Auth callback for sign-in and a nested callback below it for product-level GitHub repository authorization.

To enable product logo/banner uploads, configure storage:

# Choose "local" or "s3"
STORAGE_DRIVER=local

# Local mode (self-host/dev default)
STORAGE_LOCAL_DIR=.data/storage

S3-compatible mode works with AWS S3, Cloudflare R2, and MinIO:

STORAGE_DRIVER=s3
STORAGE_BUCKET=veerify-assets
STORAGE_REGION=auto
STORAGE_ENDPOINT=
STORAGE_ACCESS_KEY_ID=
STORAGE_SECRET_ACCESS_KEY=
STORAGE_FORCE_PATH_STYLE=false
STORAGE_PUBLIC_BASE_URL=
UPLOAD_TOKEN_SECRET=replace-with-long-random-secret

Provider examples:

  • AWS S3: leave STORAGE_ENDPOINT empty, use region like us-east-1, optional STORAGE_PUBLIC_BASE_URL via CloudFront/custom domain.
  • Cloudflare R2: set STORAGE_ENDPOINT=https://<accountid>.r2.cloudflarestorage.com, STORAGE_REGION=auto.
  • MinIO (self-host): set STORAGE_ENDPOINT=http://127.0.0.1:9000, STORAGE_FORCE_PATH_STYLE=true.

For local dev with docker-compose-dev.yml, MinIO bootstraps bucket veerify-assets automatically. Use:

STORAGE_DRIVER=s3
STORAGE_BUCKET=veerify-assets
STORAGE_REGION=us-east-1
STORAGE_ENDPOINT=http://127.0.0.1:9000
STORAGE_ACCESS_KEY_ID=minioadmin
STORAGE_SECRET_ACCESS_KEY=minioadmin
STORAGE_FORCE_PATH_STYLE=true

For local development, start the database with Docker Compose:

docker compose up -d

Preview the production build locally:

yarn preview

Test credentials on preview deployments:

Two seed accounts are available β€” one with a full org/team/project setup, one standalone personal account with no org affiliation:

Account Email Password Has org?
Org user test@preview.local password123 Yes
Personal personal@preview.local password123 No

πŸ“ Project Structure

veerify/
β”œβ”€β”€ components/
β”‚   β”œβ”€β”€ sidebar/           # Navigation components
β”‚   └── ui/               # shadcn-vue UI components
β”œβ”€β”€ layouts/
β”‚   β”œβ”€β”€ clean.vue         # Clean layout for auth pages
β”‚   └── dashboard.vue     # Main dashboard layout
β”œβ”€β”€ pages/
β”‚   β”œβ”€β”€ dashboard/        # Main dashboard
β”‚   β”œβ”€β”€ feedback/         # Feedback management
β”‚   β”œβ”€β”€ team/            # Team management
β”‚   β”œβ”€β”€ reports/         # Analytics and reporting
β”‚   β”œβ”€β”€ help/            # Help center
β”‚   └── settings/        # Application settings
β”œβ”€β”€ scripts/
β”‚   └── seed.ts          # Preview database seed (org user + personal user)
└── assets/css/          # Global styles

🎨 UI Components (shadcn-vue)

This project uses shadcn-vue for UI components. shadcn-vue provides beautifully designed, accessible components that you can copy and paste into your apps.

How shadcn-vue Works

Unlike traditional component libraries, shadcn-vue components are not installed as dependencies. Instead, you copy the source code directly into your project. This gives you:

  • Full ownership of the code - modify components as needed
  • No vendor lock-in - components live in your codebase
  • Customizable - easily adapt components to your design system
  • Tree-shakable - only include what you use

Adding Components

To add a new shadcn-vue component to your project, use the CLI:

# Add a specific component
npx shadcn-vue@latest add button

# Add multiple components
npx shadcn-vue@latest add button card dialog

# List all available components
npx shadcn-vue@latest list

Components will be added to the components/ui/ directory and can be used like any other Vue component. There is no need to import them, as they are automatically imported by Nuxt.

<template>
  <div>
    <Button variant="default">Submit Feedback</Button>
    <Button variant="destructive">Delete</Button>
    <Button variant="outline" size="sm">Vote</Button>
  </div>
</template>

Component Configuration

The shadcn-vue configuration is stored in components.json:

  • Style: New York design system
  • TypeScript: Fully typed components
  • Tailwind: Custom CSS variables for theming
  • Icons: Lucide icon library integration

πŸ”§ Available Pages

  • Dashboard (/dashboard) - Overview of feedback metrics and activity
  • Feedback (/feedback) - Main feedback management interface
  • Analytics (/reports) - Detailed analytics and insights
  • Team (/team) - Team member management and permissions
  • Help Center (/help) - User documentation and support
  • Settings (/settings) - Application configuration
  • API Docs (/api-docs) - Interactive Scalar reference backed by /api/openapi.json

🀝 Contributing

  1. Fork the repository
  2. Create your feature branch (git checkout -b feature/amazing-feature)
  3. Commit your changes (git commit -m 'Add some amazing feature')
  4. Push to the branch (git push origin feature/amazing-feature)
  5. Open a Pull Request

License

This project is licensed under the GNU Affero General Public License v3.0 (AGPL-3.0-only).

  • Source code and derivatives must remain under the same license when distributed
  • Networked/hosted modified versions must also provide source to users
  • Commercial use is permitted under AGPL terms

See LICENSE for the full terms.

πŸ“š Learn More

Releases

No releases published

Packages

 
 
 

Contributors