How to vibe codeTradingWizard

Prerequisites

• Node.jsfree

  Required runtime for the Next.js framework and backend workers.

• GitHubfree

  Source control and deployment pipeline integration.

AI coding tools

• Claude Code

  Best-in-class agentic coding tool for scaffolding full-stack Next.js architectures, MCP servers, and background cron workers.

• Cursor

  Ideal editor for fine-tuning complex React dashboard components, charting UI, and real-time state hooks.

Build guide

1. 01Project Scaffolding & Database Schema

   Initialize the Next.js project with Tailwind CSS, configure better-auth with Neon PostgreSQL, and set up database schemas for users, bots, watchlists, paper trades, and market snapshots.

   Scaffold a new Next.js project using App Router, TypeScript, and Tailwind CSS. Integrate better-auth with a Neon PostgreSQL connection using Drizzle ORM or Prisma. Define database tables for users, bot_configurations (storing symbol, strategy, risk limits), bot_scans (logging timestamps, plain-language reasoning, score), and paper_trades (side, entry price, stop-loss, take-profit, P&L status). Ensure environment variables are cleanly structured and include error boundaries for database connection failures.

   ⧉copy promptopen in Claude CodeCopen in Codexopen in Cursor

2. 02Live Market Ingestion & Watchlist Dashboard

   Build the core dashboard UI displaying global markets, watchlists, and live price tickers with polling or WebSocket mechanisms.

   Build a responsive trading dashboard UI using Tailwind CSS and Lucide icons that mimics a pro terminal layout. Implement a watchlist sidebar supporting stocks, crypto, and forex assets. Create API routes that fetch live price feeds from public financial APIs (or mocked data endpoints for personal use if rate-limited), displaying current prices, 24h change, and pre-market status. Build client components that poll or update prices cleanly every 8 seconds.

   ⧉copy promptopen in Claude CodeCopen in Codexopen in Cursor

3. 03Autonomous Paper-Trading Bot Engine

   Develop the automated background worker loop that periodically evaluates active bot strategies against incoming market candles and executes simulated paper trades.

   Implement a backend background worker or scheduled serverless cron job in Next.js that iterates through active user bot configurations. For each bot, fetch recent candlestick and technical indicator data, invoke the Google Gemini API using the Vercel AI SDK to score the setup, generate a plain-language rationale, and calculate entry, stop-loss, and take-profit targets. If setup criteria are met and no position is open, insert a simulated paper trade record into the database and log the scan receipt to the bot timeline.

   ⧉copy promptopen in Claude CodeCopen in Codexopen in Cursor

4. 04Wiz AI Assistant & Chat Terminal

   Create the conversational assistant interface with tool-calling capabilities to query market conditions, portfolio risk, and bot status.

   Build an AI chat interface component ('Wiz') using the Vercel AI SDK on the frontend and backend. Implement server-side tools that allow the AI model to query user bot statuses, check current portfolio risk, fetch live market prices, and summarize recent SEC Form 4 insider filings. Ensure the UI supports markdown rendering, streaming responses, and displays tool-call execution steps clearly.

   ⧉copy promptopen in Claude CodeCopen in Codexopen in Cursor

5. 05Model Context Protocol (MCP) Server Endpoint

   Expose a Model Context Protocol (MCP) server endpoint enabling external LLM clients like Claude Code and ChatGPT to query market tools and manage bot sessions.

   Implement a Model Context Protocol (MCP) server endpoint at `/api/mcp` using a standard TypeScript MCP adapter. Structure the endpoint to support mixed authentication: public read-only tools (fear & greed, market movers, global bot reads) accessible without authentication, and private account tools (user bots, paper positions, portfolio risk) protected via OAuth token verification. Register at least 10 core tools matching the spec and verify they respond correctly to external MCP client requests.

   ⧉copy promptopen in Claude CodeCopen in Codexopen in Cursor

6. 06SEC Form 4 Insider Tracker & Deep Research Desk

   Add macro intelligence feeds including SEC Form 4 insider trading logs and an AI-driven research report generator.

   Build a dedicated 'Who's Moving Markets' panel that ingests and displays recent SEC Form 4 insider trading filings, mapping executive buy/sell activities to tickers in the user's watchlist. Implement a 'Deep Research' generator page where users can request institutional-style markdown reports on any ticker or crypto asset, utilizing the Gemini API with search grounding to synthesize thesis, key numbers, risks, and verified citations.

   ⧉copy promptopen in Claude CodeCopen in Codexopen in Cursor

7. 07Portfolio Sync & Polish

   Add read-only portfolio integration for exchange accounts, comprehensive trade log history, and final UI polish.

   Implement a portfolio sync settings page allowing users to securely input read-only API keys for simulated or real exchange tracking (e.g., Binance/Bybit). Build a comprehensive trade log table with win-rate calculations, P&L percentages, and filterable history by bot and symbol. Refine mobile responsiveness and ensure clean error handling across all API routes.

   ⧉copy promptopen in Claude CodeCopen in Codexopen in Cursor

Cost vs paying for TradingWizard