🧠 ThinkFirst

Turn AI into your sparring partner, not your ghostwriter.

Philosophy • Features • Tech Stack • Quick Start • Contributing

🚨 IMPORTANT NOTE

This repository represents the original concept of ThinkFirst.

We are actively developing a new commercial platform that offers a distinct set of features and capabilities separate from this open-source version.

👉 Want early access to the new ThinkFirst? Join the Waitlist here

---

🌟 Core Philosophy

The Problem: Most AI tools create a "Copy-Paste Trap" — outsourcing the struggle of thinking to a machine. The Solution: ThinkFirst flips the interaction using the "Brain First -> AI -> Brain Last" methodology:

1. 🛑 My Brain First: You formulate your own thesis or rough ideas before touching the AI.
2. 🤖 AI's Turn: The AI acts as a Socratic Coach. It critiques, structures, and offers counter-arguments, but refuses to generate the final text.
3. 📝 My Brain Last: You synthesize the feedback and write the final work yourself.

"Don't let AI steal your 'Aha!' moment."

✨ Features

🛡️ The Persona System

Switch between specialized coaching modes tailored to your cognitive needs:

Persona	Function	Best For
🧠 General Coach	Balanced guidance & feedback.	General inquiry.
🛡️ Devil's Advocate	Ruthlessly logical critique.	Strengthening weak arguments.
🏗️ The Architect	Structures scattered thoughts.	Outlining essays or projects.
❓ Socratic Expander	Pushes for deeper "Why" & "How".	Breaking through writer's block.
🔗 Analogy Maker	Explains via metaphors.	Understanding complex abstract concepts.

🚀 Modern Capabilities

• Powered by Gemini 2.5 Flash: Leveraging Google's model for high-speed, low-latency reasoning.
• Multi-Modal Playground: Upload diagrams or notes; the AI "sees" and critiques them.
• Dual Modes:
  • Search: Grounds answers with real-time Google Search data.
  • Think: Enhanced reasoning depth for complex logic puzzles.
• Privacy First: API keys are stored locally in your browser (localStorage). No backend tracking.

🛠 Tech Stack

This project is engineered with a focus on performance and modern web standards.

• Frontend: React 18 (ESM) + Vite
• Styling: Tailwind CSS + clsx + tailwind-merge
• Motion: Framer Motion for fluid UI interactions.
• AI SDK: @google/genai
• Icons: Lucide React

⚡ Quick Start

Prerequisites

• Node.js (v18+)
• A Google Gemini API Key (Get one here)

Installation

1. Clone the repository

   git clone https://github.com/Ryan-Guo123/ThinkFirst
   cd ThinkFirst

2. Install dependencies

   yarn install

3. Run the development server

   npm run dev

4. Configure API Key

   • Open the app in your browser (usually http://localhost:3000/).
   • Click Start Thinking
   • Click the Key Icon in the sidebar.
   • Paste your Gemini API Key.

📂 Key Structure

ThinkFirst/
├── components/
│   ├── Playground.tsx      # Main chat interface & Markdown rendering
│   ├── Header.tsx          # Navigation header
│   ├── Hero.tsx            # Landing page hero section
│   ├── Section.tsx         # Reusable section layout
│   ├── CodeBlock.tsx       # Code display component
│   ├── Button.tsx          # Button component
│   └── ui/                 # Animated UI components
├── services/
│   └── geminiService.ts    # Gemini SDK implementation & stream handling
├── lib/
│   └── utils.ts            # Utility functions
├── constants.ts            # System Instructions (Prompts) & Persona definitions
├── types.ts                # TypeScript type definitions
├── App.tsx                 # Main app component & routing
├── index.tsx               # Application entry point
├── index.html              # HTML template
├── vite.config.ts          # Vite configuration
└── package.json            # Dependencies & scripts

🤝 Contributing

We are looking for contributions to expand the "Thinking" capabilities:

• Prompt Engineering: Refine existing personas in constants.ts.
• UI/UX: Improve the thinking flow visualization.
• Integrations: Connect with Notion or Obsidian.

Pull requests are welcome. For major changes, please open an issue first to discuss what you would like to change.

📄 License

Distributed under the MIT License. See LICENSE for more information.

---

Star History