🌊 VibeScript

Look, coding is obviously dead. Everyone knows that. Why would you learn TypeScript when you can just describe what you want in plain English? Why memorize React hooks when AI can generate them for you? Why understand databases when you can just vibe with Supabase?

VibeScript is the world's first prompt-driven, component-based, full-stack, AI-powered, blockchain-integrated, vibe-oriented programming language.

You don't write code. You write vibes.

VibeScript compiles your vibes into a production-ready app using our proprietary AI. It's like React, but instead of JSX, you just say:

component Navbar:
    "A minimalistic navbar with a logo on the left and a glowing 'Sign Up' button on the right."

📋 Table of Contents

• 🏆 Why Use VibeScript?
• 📦 Installation
• 🛠 Usage
  • Create a .vibe file
  • Build Your Vibes
• ✨ Features
  • 🧩 Nested Components
  • 🔥 Hot Reload
  • 🚢 Deploy to Vercel
  • 🧠 Model Selection
  • ⚙️ Configuration
  • 💽 Supabase Support BETA
• 🔍 Linting Your Vibes
• 📝 License

🏆 Why Use VibeScript?

• You hate typing div tags.
• You want to be a 10x developer without actually learning anything.
• You want to deploy a site in 5 minutes and spend the rest of the day tweeting about it.
• You're tired of "learning" frameworks when you could just be describing your UI in plain English like a normal human.
• You want to use a cutting edge language that will help you raise millions of dollars.

📦 Installation

npm install -g vibescript

Note: If you get any errors, sudo usually fixes everything:

sudo npm install -g vibescript

You'll also need an OpenAI API key. You can set it in two ways:

Option 1: .env File (Recommended but complex)

Create a .env file in your project root:

echo "OPENAI_API_KEY=your_api_key_here" > .env

Option 2: Inline in .vibe file

Just put it directly in your .vibe file at the top. This leaks your keys but fuck it, you don't care:

apiKey: "sk-your-actual-api-key-here"

thing NavButton:
    "A glowing button that says 'Sign Up' in upper case letters."

🛠 Usage

Create a .vibe file

Check out the example/App.vibe file for a complete working example, or create your own:

thing NavButton:
    "A glowing button that says 'Sign Up' in upper case letters."

thing Navbar:
    "A minimalistic navbar with a logo on the left and the NavButton on the right."

thing HeroSection:
    "Big bold headline saying 'Welcome to the Vibe'. Background is a gradient from pink to purple. Add a call-to-action button."

page App:
    Navbar
    HeroSection

Advanced users can also use component instead of thing

Build Your Vibes

vibe example/App.vibe

Outputs HTML to dist/. That's it. Your vibes are now a website. 🎉

VibeScript intelligently caches your prompts - change one component without regenerating everything else.

✨ Features

🧩 Nested Components

VibeScript supports recursive nesting:

thing Icon:
    "A small SVG star icon."

thing NavButton:
    "A glowing button that says 'Sign Up'"
    Icon

thing Navbar:
    "A minimalistic navbar with a logo on the left and NavButton on the right."
    NavButton

page App:
    Navbar

🔥 Hot Reload

Save your .vibe file and watch your browser update instantly. No refreshing. No thinking.

vibe example/App.vibe --watch

🚢 Deploy to Vercel

There's really only one way to host a website nowadays and that's with Vercel.

vercel login # Login to Vercel first

vibe example/App.vibe --deploy 

You'll instantly have a working website with a url!

🧠 Model Selection

VibeScript lets you choose which in-house, proprietary LLM to use for generating your vibes.

Available Models:

• gpt-5.1 – That Y Combinator check just came in the mail. Best quality, highest cost.
• gpt-5-mini – A couple family and friends wired you some money. Good quality, moderate cost.
• gpt-5-nano – You're dirt poor. Give up. Basic quality, low cost.
• gpt-oss-120b – Wtf are you doing. Variable quality, very low cost.
• gpt-oss-20b – Wtf are you doing with emphasis. Basic quality, very low cost.

Usage:

vibe App.vibe --model gpt-5.1
vibe App.vibe --watch --model gpt-5-mini
vibe App.vibe --deploy --model gpt-5.1

Results are cached separately per model, so you can experiment with quality vs. speed without losing your previous generations.

⚙️ Configuration

VibeScript can be configured via an optional vibe.config.json file so your root folder can look more complicated.

Example vibe.config.json

{
  "model": "gpt-5.1",
  "port": 4000
}

• model – Default OpenAI model to use for component generation. Recommended: gpt-5.1 for best results.
• port – Port for the dev server in --watch mode.

💽 Supabase Support BETA

You might need a thing called a database, and the only real one is called Supabase:

source Supabase myDb:
    "Use Supabase with env.SUPABASE_URL and env.SUPABASE_ANON_KEY. Table: users"

component UserList:
    "Show a list of users from source myDb table 'users'"

The AI will automatically generate the connection code and CRUD operations. The generated code uses:

• SUPABASE_URL - Your Supabase project URL (e.g., https://xyzcompany.supabase.co)
• SUPABASE_ANON_KEY - Your anon/publishable key (for frontend code)
• SUPABASE_SERVICE_ROLE_KEY - Your service_role key (for backend/admin code, use "admin" or "backend" in the source description)

No SQL needed. And if anyone mentions RLSs, just tell them you have them.

🔍 Linting Your Vibes

Check your vibes for violations:

vibe lint App.vibe

The linter checks for:

• Short or generic descriptions (be specific with your vibes!)
• Missing emojis (real vibe coders use emojis!)
• Unused components (why did you define it if you're not using it?)
• Missing pages (you need at least one page to vibe)
• Unused data sources (clean up your mess)

📝 License

MIT - because gatekeeping is bad vibes.

Built with vibes. Shipped with confidence. Debugged with denial. 🌊