Skip to content

YTxFSGAMERz/hook-and-thread

Repository files navigation

⚡ Hook & Thread

Transform raw ideas into high-engagement LinkedIn posts. AI-powered post generator, hook creator, rewriter, carousel builder, and viral angle generator for founders, developers, and creators.

Tech Stack TypeScript Vite Supabase Netlify


✨ Features

Feature Description
🔥 Post Generator Enter a raw idea → get a polished, ready-to-post LinkedIn post with hooks, takeaways, and CTAs
🎣 Hook Creator Generate 3 alternative hooks (punchy, curiosity-driven, contrarian) to A/B test
✏️ Rewriter Paste an existing post → AI transforms it using a chosen framework and audience
📑 Carousel Builder Auto-generate 3–10 slide carousels with titles and content for each slide
Viral Angle Generator Enter a topic → get 5 viral content angles, click one to auto-generate a full post
💾 Post History All generated posts are saved with one click and browsable in the sidebar

🎯 Viral Angle Generator (New!)

Type any topic and get 5 clickable viral angles:

  • 🔥 Controversial Opinion — a bold, slightly polarizing take
  • 💥 Personal Failure Story — a relatable "I messed up" narrative
  • 📊 Industry Insight — a data-driven or insider perspective
  • 🛠️ Step-by-Step Framework — a structured how-to breakdown
  • 🚨 Myth-Busting Post — debunking a common misconception

Click any angle → a full post is generated from it.


🛠️ Tech Stack

  • Frontend: React 18 + TypeScript + Vite
  • Styling: Tailwind CSS + shadcn/ui + Framer Motion
  • Auth & DB: Supabase (Auth + Postgres)
  • AI: LLM endpoint via streaming JSON responses
  • Deployment: Netlify (auto-deploy from GitHub)

🚀 Getting Started

Prerequisites

  • Node.js 18+
  • npm

Setup

# Clone the repo
git clone https://github.com/YTxFSGAMERz/post-spark-ai.git
cd post-spark-ai

# Install dependencies
npm install

# Start the dev server
npm run dev

Open http://localhost:8080 in your browser.

Environment Variables

Create a .env file with:

VITE_SUPABASE_URL=your_supabase_url
VITE_SUPABASE_PUBLISHABLE_KEY=your_supabase_anon_key

📁 Project Structure

src/
├── components/
│   ├── editor/
│   │   ├── ForgePane.tsx    # Left panel — input, tabs, framework & audience selectors
│   │   ├── StagePane.tsx    # Right panel — post preview, hooks, carousel, viral angles
│   │   └── HistorySidebar.tsx
│   └── ui/                  # shadcn/ui components
├── contexts/
│   └── AuthContext.tsx       # Supabase auth provider
├── lib/
│   ├── constants.ts          # Frameworks, audiences, editor modes
│   └── stream.ts             # LLM streaming client
├── pages/
│   ├── Editor.tsx            # Main editor — prompt builder, generate handler
│   ├── Landing.tsx           # Landing page
│   └── Auth.tsx              # Login/signup
└── index.css                 # Tailwind config + design tokens

📄 License

MIT — build what you want with it.


Built with ☕ and AI by Farhan

About

Hook and Thread is a lightweight project designed to help users generate engaging social-media hooks and thread ideas for platforms like LinkedIn or Threads. It focuses on quickly turning simple ideas into structured content formats—such as attention-grabbing hooks, multi-post threads, and short storytelling frameworks—making it easier for creators

Topics

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

 
 
 

Contributors