Dad Joke Visualizer

# 🎭 Dad Joke Visualizer MCP Server - Quick Setup Guide ## ✅ What's Been Created Your Dad Joke Visualizer MCP Server is now complete! Here's what was built: ### 📁 Project Structure ``` DadJokeVisualizer/ ├── src/ │ ├── index.ts # Main MCP server │ └── tools/ │ ├── jokeGenerator.ts # OpenAI integration │ ├── imageGenerator.ts # Nano-banana integration │ └── webPageCreator.ts # Web server & page generation ├── web/ │ └── index.html # Beautiful web interface ├── dist/ # Compiled JavaScript ├── package.json # Dependencies & scripts ├── tsconfig.json # TypeScript config ├── .env.example # Environment variables template ├── cursor-mcp-config.json # Cursor MCP configuration ├── test.js # Test script └── README.md # Full documentation ``` ### 🚀 Next Steps 1. **Set up your API keys:** ```bash cp .env.example .env # Edit .env and add your OpenAI API key ``` 2. **Test the components:** ```bash npm run test ``` 3. **Configure Cursor:** - Copy the contents of `cursor-mcp-config.json` to your Cursor MCP settings - Update the API keys in the configuration 4. **Start using in Cursor:** - Use Auto feature with prompts like: - "Generate a Dad Joke about cats" - "Create a Dad Joke visualization" - "Make a Dad Joke about programming" ## 🎯 How It Works 1. **You prompt Cursor** → "Generate a Dad Joke about programming" 2. **MCP Server receives** → Calls OpenAI to generate PG-13 Dad Joke 3. **Image Generation** → Calls Nano-banana to visualize the joke 4. **Web Page Creation** → Creates beautiful page with joke + image 5. **Result Display** → Returns URL to view the complete result ## 🛠️ Available Commands - `npm run build` - Compile TypeScript - `npm run start` - Start MCP server - `npm run dev` - Development mode - `npm run test` - Test all components - `npm run type-check` - Check TypeScript ## 🌐 Web Interface The web server runs on `http://localhost:3000` and provides: - Beautiful, responsive design - Topic input for custom jokes - Real-time generation status - Direct links to generated joke pages ## 🎪 Ready to Generate Dad Jokes! Your MCP server is ready to create hilarious, PG-13 Dad Jokes with AI-powered visualizations. Just configure your API keys and start using it in Cursor! --- **Made with ❤️ for Dad Joke enthusiasts everywhere!** 🎭