🚀 AI Task Prompt Optimizer

Transform raw, natural language tasks into high-fidelity engineering prompts, collaborative refinement loopers, and rigorous quality checklists optimized for ChatGPT, Claude, DeepSeek, Grok, Qoder, and Perplexity. Features a dual-engine architecture supporting both Offline (Heuristic Templates) and Online (Live Gemini 3.5 Flash AI).

A modern, robust full-stack application built with React 19 + Tailwind CSS v4 + TypeScript + Express + Google Gen AI SDK. Packaged perfectly with standard structures to be shared or uploaded to GitHub instantly!

---

🌟 Core Features

• 🔌 Intelligent Hybrid Dual-Mode:
  • Offline Mode (Heuristic Template Engine): Runs purely client-side without any API Key configurations. It automatically maps key-phrases to proven, battle-tested engineering structures.
  • Online Mode (Gemini 3.5 Flash AI Engine): Connects to a secure, server-side Google Gemini client to deeply analyze raw tasks, extract target variables, and compile tailor-made, precise prompt blueprints.
• 🎯 Targeted Optimizations for 6 Major Models:
  • ChatGPT: Concise, direct-to-the-point layout with explicit boundaries.
  • Claude: Features rich context sections wrapped in semantic XML brackets (<context>, <instructions>).
  • DeepSeek: Structures reasoning flows explicitly leveraging DeepSeek's Thinking Chain architecture.
  • Grok: Imbued with highly practical reasoning instructions and up-to-date factual requirements.
  • Qoder: Specializes in programming architecture, clean code metrics, SOLID principles, and error handling.
  • Perplexity: Calibrated for comparative evaluation, academic research, and factual web metrics.
• 🤖 Semantic Auto-Detect Engine:
  • Dynamically classifies task categories (Coding, Writing, Research, Analysis, Planning, Learning) based on text heuristics.
  • Suggests the most suitable AI engine model if set to "Auto Detect".
• 🔄 Collaborative Refinement Looper Protocol:
  • Generates custom iterative guides to help users and AI collaborate seamlessly across version drafts (the "Create-Refine-Evaluate" cycle).
• 🧪 Self-Contained Diagnostics Panel:
  • Run real-time automated diagnostics checkups on server configs, keyword classifiers, compilation stability, and live API roundtrip latencies directly from the browser UI.
• 💾 Instant Asset Exporting:
  • Copy specific sections or JSON payloads with a single click.
  • Download the complete set of compiled assets as structured Markdown .md documents.

---

📁 Repository Structure

/
├── server.ts               # Express.js Server (Proxying Gemini API requests securely)
├── vite.config.ts          # Vite & Express Server Middleware integrations
├── tsconfig.json           # Type configurations for TypeScript
├── package.json            # Scripts and NPM package definitions
├── metadata.json           # Application frame permission manifests
├── .env.example            # Environment variables placeholder blueprint
├── .gitignore              # Standard paths to omit during Git commits
│
├── src/                    # React Frontend Codebase
│   ├── main.tsx            # Application entry hook
│   ├── App.tsx             # Interactive dashboard (Heuristics, UX & self-tests)
│   ├── index.css           # Global stylesheets utilizing Tailwind CSS v4
│   ├── types.ts            # Common Type Declarations
│   │
│   └── utils/
│       └── templates.ts    # Keyword parsing rules and static markdown compilers

---

⚙️ Quick Installation & Setup

1. Prerequisites

• Node.js (v18.0.0 or later recommended)
• NPM (pre-packaged with Node.js)

2. Download and Enter Directory

git clone https://github.com/your-username/ai-task-prompt-optimizer.git
cd ai-task-prompt-optimizer

3. Install Core Dependencies

npm install

4. Configure Environment Variables

Copy the template configuration to active file:

• On Linux/macOS:

  cp .env.example .env

• On Windows (Command Prompt):

  copy .env.example .env

Open the newly created .env file and insert your Google Gemini API key to activate the Online AI features:

GEMINI_API_KEY="AIzaSyYourGeminiApiKeyHere..."
APP_URL="http://localhost:3000"

Note: If the key is left empty, the application falls back gracefully to high-performance Offline Mode.

5. Start Development Server

Launch the full-stack system in development mode:

npm run dev

Open your browser and navigate to http://localhost:3000 to experience the app!

6. Production Compilation & Launch

To compile production assets for extreme speed and security:

# Compile React static files and package Node server.ts using esbuild
npm run build

# Start the optimized server
npm start

---

🐙 Share to GitHub (Initial Push Guide)

To easily push this complete codebase to your own GitHub profile:

1. Initialize Local Git Repository:

   git init
   git branch -M main

2. Commit all files:

   git add .
   git commit -m "feat: initial commit of AI Task Prompt Optimizer full-stack repository"

3. Link to GitHub Repository (Create a blank repository on GitHub named ai-task-prompt-optimizer first, then map it here):

   git remote add origin https://github.com/YOUR_GITHUB_USERNAME/ai-task-prompt-optimizer.git

4. Push to Github:

   git push -u origin main

---

🛠️ Technology Stack

• Frontend: React 19, Vite 6, TypeScript
• Styling: Tailwind CSS v4
• Animations: Motion 12 (Framer Motion)
• Icons: Lucide React
• Backend: Express.js
• Compiler: Esbuild
• AI SDK: @google/genai 2.4.0

---

📝 License

This project is licensed under the Apache-2.0 License. Feel free to copy, modify, distribute, or incorporate it into commercial products.