next-bugtracker
v1.0.0
Published
Next.js Bug Tracker Integration Package
Readme
next-bugtracker
A lightweight, developer-first Next.js bug reporting package that captures screenshots and environment metadata, processes reports using AI, and posts them directly to your GitHub repository as structured issues.
🚀 Installation & Local Usage
To use this local package in another project on your system, you can use any of the following methods. First, make sure you build the package in this directory:
npm run buildMethod 1: Local Path Installation (Recommended)
In your destination Next.js project directory, install the package using its local file path:
npm install /home/pskth/projects/group2-bugtrackerMethod 2: NPM Link
- In this package directory (
/home/pskth/projects/group2-bugtracker), link the package:npm link - In your destination Next.js project directory, connect to the link:
npm link next-bugtracker
🛠️ Setup Wizard
Once installed in your destination project, run the setup wizard:
npx next-bugtracker initThe wizard will:
- Detect whether your project uses App Router or Pages Router (and if you use a
src/directory layout). - Ask for your GitHub Owner/Repository.
- Ask for your AI Provider choice (OpenAI or Anthropic) and credentials.
- Automatically write
next-bugtracker.config.tsto your project root. - Populate
.env.localwith API keys and access tokens. - Generate the
/bug-reportform route and its backend API endpoint.
📝 API Keys & Env Variables
The wizard writes the following to your destination project's .env.local:
BUGTRACKER_GITHUB_TOKEN: Your Personal Access Token or OAuth Token.BUGTRACKER_AI_KEY: Your OpenAI or Anthropic API key.
Make sure .env.local is listed in your project's .gitignore to protect these tokens.
🎨 Neo Brutalist Bug Report Form
The form is accessible at /bug-report and has a premium Neo Brutalist theme using non-harsh colors.
- Client Metadata Capture: Automatically captures OS, browser version, screen dimensions, current pathname, and submission timestamp on form submit.
- Fail-Safe Processing: If your AI provider API key is not configured or the AI API call fails, the package will automatically fallback to generating a clean, unstructured issue on GitHub using raw input fields, ensuring you never lose a bug report.
