πLIVE DEMO: https://imagify-ico4.vercel.app/
Imagify is a full-stack AI SaaS web application that allows users to generate images from text prompts using the ClipDrop API.
The application includes secure user authentication, a credit-based image generation system, payment integration for purchasing credits, and image download functionality.
This project demonstrates real-world MERN stack development with AI API integration and SaaS-style features.
- User authentication (signup & login)
- AI-powered text-to-image generation using ClipDrop API
- Credit-based system for image generation
- Payment integration to purchase credits
- Download generated images
- Responsive and user-friendly UI
- React.js
- Tailwind CSS
- Axios
- React Router DOM
- Node.js
- Express.js
- JWT authentication
- MongoDB (Mongoose)
- ClipDrop API (image generation)
- Payment gateway integration
- Frontend: Vercel
- Backend: Render
Imagify/ βββ client/ # React frontend β βββ src/ β βββ public/ β βββ package.json β βββ server/ # Express backend β βββ controllers/ β βββ routes/ β βββ models/ β βββ middleware/ β βββ package.json β βββ README.md
Backend: cd server npm install
makefile Copy code
Frontend: cd client npm install
Copy code
Start backend: cd server npm run dev
powershell Copy code
Start frontend: cd client npm run dev
Copy code
Open http://localhost:3000 in your browser.
- Each image generation consumes one credit
- Users must purchase credits when balance is insufficient
- Credits are added after successful payment
- Users can download generated images directly from the application interface