Data

Tools

Indexes

Applications

Experiments

Awesome

An open API service indexing awesome lists of open source software.

https://github.com/sohambhattacharjee2003/chatbot


https://github.com/sohambhattacharjee2003/chatbot

expressjs imagekit mongodb openai reactjs stripe tailwindcss

Last synced: 9 months ago
JSON representation

Awesome Lists containing this project

README 

          
# AI Chatbot — Text + Image Generation



**Repository:** `SohamBhattacharjee2003/Chatbot`



---



## Short description (repo tagline)



AI-powered chat application built with the MERN stack that generates both conversational text and images using OpenAI, stores/serves media with ImageKit, and supports paid features through Stripe.



---



## Table of Contents



* [Project Overview](#project-overview)

* [Key Features](#key-features)

* [Tech Stack](#tech-stack)

* [Architecture & Flow](#architecture--flow)

* [Getting Started (Local)](#getting-started-local)



  * [Prerequisites](#prerequisites)

  * [Environment Variables](#environment-variables)

  * [Install & Run](#install--run)

* [Deployment Notes](#deployment-notes)

* [How It Works — Implementation Details](#how-it-works---implementation-details)



  * [OpenAI integration](#openai-integration)

  * [ImageKit integration](#imagekit-integration)

  * [Stripe integration](#stripe-integration)

* [Project Structure (High-level)](#project-structure-high-level)

* [Testing & Troubleshooting](#testing--troubleshooting)

* [Contributing](#contributing)

* [License](#license)

* [Contact](#contact)



---



## Project Overview



This project is a production-oriented AI chatbot that supports *both* natural-language conversation and AI-generated images. The app exposes a polished UI (deployed on Vercel), a backend API (Node/Express) backed by MongoDB, and paid/premium features managed via Stripe. Image storage/optimization/delivery is handled via ImageKit for fast CDN delivery.



Designed for: demos, prototypes, teaching samples, and as a foundation for commercial products that want conversational + visual AI features in one package.



---



## Key Features



* Text generation & completion using OpenAI (chat, prompts, context/history-aware replies).

* Image generation via OpenAI image endpoints (or image model) and/or pipeline to ImageKit.

* Image upload, optimization, and CDN delivery using ImageKit.

* Stripe payments for premium features (credits, subscriptions, or per-generation billing).

* Persistent chat history stored in MongoDB per user.

* Clean, responsive frontend (React) and deployment-ready configuration (Vercel-friendly).



---



## Tech Stack



* **Frontend:** React (compatible with Next.js if used), client-side UI components

* **Backend:** Node.js + Express

* **Database:** MongoDB (Atlas or self-hosted)

* **AI:** OpenAI APIs (text & image generation)

* **Storage/CDN:** ImageKit

* **Payments:** Stripe (Secrets on server)

* **Auth (suggested):** JWT / session-based auth

* **Deployment:** Vercel (frontend), any Node host (backend) or unified deployment



---



## Architecture & Flow



1. User interacts with the React UI and sends chat messages.

2. Frontend calls backend API endpoints (`/api/chat`, `/api/generate-image`, etc.).

3. Backend validates auth, applies rate limits or credit checks (if using Stripe), and forwards requests to OpenAI.

4. Generated images are uploaded (or proxied) to ImageKit for CDN delivery and stored metadata in MongoDB.

5. Stripe handles purchases; server verifies Stripe webhooks to grant credits/subscriptions.

6. Chat history and usage metrics are recorded in MongoDB.



## Deployment Notes



* **Frontend:** Deploy on Vercel for zero-config deployments. Add environment variables in the Vercel dashboard.

* **Backend:** You can deploy the backend to Vercel (serverless functions), Render, Railway, Heroku, or any VPS. Ensure webhooks (Stripe) are reachable and secure.

* **MongoDB:** Use MongoDB Atlas for an easy hosted DB; set the `MONGO_URI` accordingly.

* **Stripe Webhooks:** Use Stripe CLI for local testing, and set the `STRIPE_WEBHOOK_SECRET` in production.



---



## How It Works — Implementation Details



### OpenAI integration



* Server makes authenticated requests to OpenAI for completions/chat and for generating images.

* Conversations may be stored and passed as `messages` for context to the OpenAI Chat API.

* Make sure to handle token usage and errors gracefully (rate limits, timeouts).



### ImageKit integration



* Upload generated images (or user uploads) to ImageKit via the SDK/server-side upload to keep private keys secure.

* Store the returned CDN URL in your database for fast access in the client.



### Stripe integration



* Use server-only secret key to create payment intents, handle subscriptions or one-off purchases.

* Verify Stripe webhook signatures on the backend to securely grant credits or update subscription status.

* Keep billing logic idempotent and safe for repeated webhook calls.



---



## Project Structure (High-level)



```

/Chatbot

  /client            # React or Next.js frontend

  /server            # Express API, OpenAI calls, Stripe webhooks

  README.md

  .env.example

```



If your repo uses a monorepo or different structure, adjust this section to match the actual layout.



---



## Testing & Troubleshooting



* If image generation fails: check `OPENAI_API_KEY`, and ensure your usage plan supports image endpoints.

* If uploads fail: verify ImageKit keys and endpoint, and that uploads are done server-side (private key).

* If payments fail: check Stripe test keys, webhook endpoint, and check logs for `idempotency_key` issues.



---



## Contributing



Thanks for considering contributions! A recommended CONTRIBUTING.md workflow:



1. Fork the repo

2. Create a feature branch (`git checkout -b feat/my-feature`)

3. Make changes, add tests if applicable

4. Open a pull request with a clear description



Please follow consistent formatting and linting. Add tests or manual reproduction steps for bug fixes.



---



## License



Suggested: **MIT License** — lightweight and permissive. Add a `LICENSE` file if you choose it.



---



## Contact



Maintainer: **Soham Bhattacharjee**



* GitHub: `https://github.com/SohamBhattacharjee2003`

* Live demo: [https://chatbot-woad-iota.vercel.app/](https://chatbot-woad-iota.vercel.app/)



---



If you'd like, I can:



* generate a `README.md` file you can copy/paste or commit directly,

* craft a shorter `GitHub repository description` and `README` banner (badges + one-line), or

* produce a polished `CONTRIBUTING.md`, `SECURITY.md`, or `ISSUE_TEMPLATE.md` next.



Tell me which of the above you'd like next and I'll add it directly to the repo content.