https://github.com/theubaidistan/quickai
Quick AI PERN Stack - The main idea of the project is that users enter text prompts, the application sends these inputs to an AI service through an API, and then displays the generated responses back on the screen in real time. Vercel handles the hosting and deployment, making the application.
https://github.com/theubaidistan/quickai
axios-react clerk clerk-auth clerk-billing cloudinary-api express expressjs gemini gemini-ai gemini-api neon-postgres neondb nodejs openai postgresql reactjs tailwindcss vercel vitejs
Last synced: 7 days ago
JSON representation
Quick AI PERN Stack - The main idea of the project is that users enter text prompts, the application sends these inputs to an AI service through an API, and then displays the generated responses back on the screen in real time. Vercel handles the hosting and deployment, making the application.
- Host: GitHub
- URL: https://github.com/theubaidistan/quickai
- Owner: theubaidistan
- Created: 2025-07-26T19:23:51.000Z (11 months ago)
- Default Branch: main
- Last Pushed: 2026-06-07T13:54:17.000Z (17 days ago)
- Last Synced: 2026-06-07T15:11:03.180Z (17 days ago)
- Topics: axios-react, clerk, clerk-auth, clerk-billing, cloudinary-api, express, expressjs, gemini, gemini-ai, gemini-api, neon-postgres, neondb, nodejs, openai, postgresql, reactjs, tailwindcss, vercel, vitejs
- Language: JavaScript
- Homepage: https://quick-ai-jet.vercel.app/
- Size: 1.54 MB
- Stars: 0
- Watchers: 0
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
Quick.AI
A full-stack AI-powered SaaS platform for text generation and image creation — built on the PERN stack with Clerk authentication, Gemini, and OpenAI.
---
## 🛠 Tech Stack
### Frontend
### Backend
### Database
### Auth & Billing
### AI / APIs
---
## ✨ Features
- 🤖 **AI Text Generation** — Powered by Google Gemini for fast, accurate text prompts
- 🎨 **AI Image Generation** — Powered by OpenAI's image generation API
- 🔐 **Authentication & Billing** — Clerk handles sign-up, sign-in, and subscription billing
- 🗄️ **PostgreSQL on NeonDB** — Serverless, scalable database for user and usage data
- ⚡ **Vite + React** — Lightning-fast frontend with hot module replacement
- 💨 **Tailwind CSS** — Utility-first styling for a clean, responsive UI
- 🔄 **Axios** — HTTP client for clean API communication between frontend and backend
- 🛡️ **Express Middleware** — Auth guards, error handling, and request validation on the backend
---
## 📁 Project Structure
```
quick-ai/
├── client/ # Vite + React frontend
│ ├── src/
│ │ ├── components/ # Reusable UI components
│ │ ├── pages/ # Route-level pages
│ │ ├── lib/ # Axios instance & helpers
│ │ └── main.jsx
│ ├── tailwind.config.js
│ └── vite.config.js
│
├── server/ # Express backend
│ ├── controllers/ # Route handler logic
│ ├── middleware/ # Auth, error, validation middleware
│ ├── routes/ # API route definitions
│ ├── db/ # NeonDB / PostgreSQL connection
│ └── index.js
│
└── README.md
```
---
## 🚀 Getting Started
### Prerequisites
- Node.js ≥ 18
- A [NeonDB](https://neon.tech/) account and database URL
- A [Clerk](https://clerk.com/) account (API keys for auth + billing)
- Google Gemini API key
- OpenAI API key
### 1. Clone the repo
```bash
git clone https://github.com/theubaidistan/quick-ai.git
cd quick-ai
```
### 2. Configure environment variables
**`server/.env`**
```env
DATABASE_URL=your_neondb_connection_string
CLERK_SECRET_KEY=your_clerk_secret_key
GEMINI_API_KEY=your_gemini_api_key
OPENAI_API_KEY=your_openai_api_key
PORT=5000
```
**`client/.env`**
```env
VITE_CLERK_PUBLISHABLE_KEY=your_clerk_publishable_key
VITE_API_BASE_URL=http://localhost:5000
```
### 3. Install dependencies & run
```bash
# Backend
cd server
npm install
npm run dev
# Frontend (in a new terminal)
cd client
npm install
npm run dev
```
---
## 🌐 Deployment
| Service | Platform |
| -------- | -------------------------------------------------------- |
| Frontend | [Vercel](https://quick-ai-jet.vercel.app/) |
| Backend | [Vercel](https://quick-ai-server-mocha-zeta.vercel.app/) |
| Database | [NeonDB](https://neon.tech/) (Serverless PostgreSQL) |
---
## 📚 Course Credit
Built as part of a full-stack JavaScript learning journey following **Jonas Schmedtmann's** courses on [Udemy](https://www.udemy.com/course/the-ultimate-react-course/?couponCode=KEEPLEARNING).
---
## 👨💻 Author
**Ubaidistan**
- GitHub: [@theubaidistan](https://github.com/theubaidistan)
- Live: [quick-ai-jet.vercel.app](https://quick-ai-jet.vercel.app/)