Overview
SparkAI is a dynamic full-stack SaaS platform that aggregates multiple AI-powered productivity tools into a single, unified dashboard. Users can generate articles, brainstorm SEO-optimized blog titles, create images from text, remove backgrounds or objects from photos, and receive AI-driven resume reviews — all guarded securely behind authenticated free and premium tiers.
The platform employs a classic MERN-style monorepo architecture, replacing MongoDB with Neon (serverless Postgres). Built utilizing a React 19 SPA and an Express 5 API, it proxies user requests to third-party AI aggregators like Google Gemini, Clipdrop, and APILayer.
Serverless Deployment Ready
Both the client and server applications are natively designed to deploy efficiently as serverless functions strictly on Vercel, maximizing uptime while maintaining low cost limits.
Core Platform Features
Text & Content Generation
- Article Generation — Input a prompt and desired length to generate comprehensive full-length articles powered directly by Google Gemini 2.5 Flash.
- Blog Titles — Brainstorm dynamic, SEO-friendly lists of blog title suggestions immediately.
- Resume Reviews — Upload PDFs up to 5MB, extract textual data via
pdf-parse, and retrieve structured feedback (Strengths, Weaknesses, Recommendations) orchestrated through APILayer and Gemini.
Visual Modifications
- Text-to-Image — Execute generative image prompts directly through the robust Clipdrop API, outputting base64 PNG results natively.
- Background Removal — Effortlessly upload images to strip out entire backgrounds intelligently using dedicated AI APIs.
- Object Removal — Highlight and describe specific targets within an image textually to remove them with AI magically filling the gap contextually.
Authentication Networks
- Tiered Subscription Plans — Clerk handles complex authentication gating, restricting free users strictly to 10 generations (tracked via
privateMetadata) while offering premium accounts unlimited access. - Data Persistence — Every successful generation is securely stored directly inside the serverless Neon Postgres database natively linked to the user's Clerk ID.
- Community Feed — Optional capabilities letting users publish their creations directly to a public gallery format allowing likes and interactions globally.
Technology Stack
Frontend Interface
React 19 SPA over Vite 7, styled expertly utilizing Tailwind CSS v4, dynamic class-variance-authority, and React Router v7.
Express 5 API
Node.js ESM architecture parsing complex multer multipart unifications
seamlessly through /tmp buffers specifically mapped for Vercel.
Third-Party Integrations
Extensive REST communication routing through Google Gemini, Clipdrop AI suites, and specific APILayer checkpoints.
Neon Postgres & Clerk
Serverless relational persistence perfectly synchronized logically with external Clerk identity arrays and metadata constraints.
Application Architecture
The proxy infrastructure hides expensive AI API keys entirely from the vulnerable client bounds while reliably tallying accurate billing/usage quotas sequentially.
Client Request Hook
The client submits an actively authenticated POST /api/ai/<tool> REST request including payload objects (such as prompt details or multi-part images) directly containing an encrypted Clerk JWT header.
Identity & Quota Gate
The Express clerkMiddleware intersects the signal, verifying authenticity securely. A custom middleware reads explicitly the user's plan structure alongside their free_usage metric dynamically embedded inside their Clerk privateMetadata, gracefully blocking requests that exceed the 10 free generation limit.
Third-Party Procurement
If authorized successfully, the backend controller dispatches instructions toward external infrastructure (Gemini / Clipdrop). It returns specific payloads logically transforming them efficiently to base64 images or markdown text formats.
Serverless Syncing
Before returning the final resolution structure natively down to the client, the API increments the user's free usage dynamically applying updates to neon database constraints ensuring accurate history tracking simultaneously.
Project Ecosystem
Frequently Asked Questions
Explore the AI Suite
Ready to evaluate the dynamic tools efficiently? Experience the multiple AI models and sleek Vite dashboard firsthand by visiting the Live Application today!
