Skip to content

abhineet34/EmbedAI

Repository files navigation

EmbedAI

EmbedAI is an open-source platform that enables users to create AI-powered tools and directly embed them into any website using a simple script.

Whether you want to offer an SEO Analyzer, a Recipe Maker, or a Resume Reviewer on your site, EmbedAI allows you to rapidly design the dynamic prompt engine behind it and inject the interactive frontend directly via an iframe-like Shadow DOM snippet.

🌟 Key Features

  • Builder Dashboard: An aesthetic, glassmorphic UI meant to construct your Tool's inputs and Prompt mapping templates ("Write a {{document_type}} for {{name}}").
  • Unified Full-Stack Architecture: Powered securely and dependably by Next.js (App Router).
  • The Widget SDK: The core viral component. Drop <script src=".../widget.js" data-id="TOOL_ID"></script> onto any site seamlessly. The widget utilizes a Shadow DOM to ensure zero CSS collision alongside local hostings.
  • AI Abstracted: Plug directly into the Vercel AI SDK to tap into OpenAI, Anthropic, or any future supported model.
  • Lead Capture: Collect user email addresses implicitly prior to generating AI query results.

🛠 Tech Stack

  • Core: Next.js (App Router), React, TypeScript
  • Database: Prisma ORM, SQLite (local MVP tier), easily upgradeable to PostgreSQL.
  • Styling: Tailwind CSS v4 + Framer Motion (Vibrant, Premium Dark Mode styling)
  • AI: Vercel AI SDK (@ai-sdk/openai)

🚀 Getting Started

1. Requirements

2. Installation

Clone the repository and install dependencies:

git clone https://github.com/abhineet34/EmbedAI.git
cd EmbedAI
npm install

3. Environment Variables

To connect strictly to the AI endpoints securely, create a .env file within your root directory:

DATABASE_URL="file:./dev.db"
OPENAI_API_KEY="sk-proj-YOUR-KEY-HERE"

4. Database Setup

Synchronize your local SQLite database with our core schema via Prisma:

npx prisma generate
npx prisma db push

5. Start the Development Server

npm run dev

Navigate to http://localhost:3000 to dive into the Tool Dashboard!


🎨 How to Use

Creating a Tool

  1. Navigate specifically to your Dashboard and hit "Create New Tool".
  2. Fill out your model options and build an input logic set (e.g. {{industry}}).
  3. Formulate your Prompt Engine inside the specific form container.
  4. Save the tool!

Embedding a Tool

  1. Upon saving, you'll be given an embed link on the right-hand panel of the Builder.
  2. It looks like this: <script src="http://localhost:3000/widget.js" data-id="12345"></script>.
  3. Paste that script absolutely anywhere inside a standard <form>, <body> or div block on ANY external website.
  4. Traffic routed by users on that external platform will securely ping back to your Node backend, process the prompt securely utilizing Server-Side operations, and respond visually instantly.

🗺 Roadmap

  • Backend APIs (Route Handlers)
  • Local Database Setup via Prisma
  • Premium Frontend Builder
  • AI Verification and Integration
  • Widget SDK / Shadow DOM setup
  • Implement Zapier/Webhooks & Multi-step API chains.
  • Remote Templates System seeding.

🤝 Contribution Guidelines

Contributions are absolutely welcome!

  1. Fork the repo.
  2. Create a feature branch: git checkout -b my-new-feature
  3. Commit your changes: git commit -m "Add some feature"
  4. Push to the branch: git push origin my-new-feature
  5. Submit a pull request!

About

Open-source platform to create AI tools and embed them as widgets into any website. Built with Next.js, Prisma, and the Vercel AI SDK.

Topics

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

 
 
 

Contributors