Imaginify is a modern web application that allows users to generate and enhance images with AI, manage their content securely, and access premium features through Stripe-based payments.
- React – Frontend UI Library
- Next.js – Full-stack React framework for server-side rendering and routing
- Cloudinary – Image management and generation (upload, transformation, delivery)
- Stripe – Secure payment gateway integration
- Clerk – Authentication and user management
- 🔐 User Authentication: Secure login/signup with Clerk
- 🎨 Image Generation: Use AI-powered tools via Cloudinary APIs
- 💼 User Dashboard: Personalized space to view and manage generated images
- 💳 Subscription Plans: Purchase premium access using Stripe
- 🌐 Server-side Rendering: Optimized performance and SEO via Next.js
imaginify/
│
├── pages/ # Next.js pages
│ ├── index.tsx # Landing page
│ ├── dashboard.tsx # User dashboard
│ ├── api/ # API routes
│
├── components/ # React components
├── lib/ # Stripe, Cloudinary, and Clerk helpers
├── public/ # Static files
├── styles/ # Global and component-specific styles
├── utils/ # Utility functions
├── .env.local # Environment variables
└── README.md # You're here!
- Clone the Repository
git clone https://github.com/your-username/imaginify.git
cd imaginify- Install Dependencies
npm install
# or
yarn install- Setup Environment Variables
Create a .env.local file with:
NEXT_PUBLIC_CLERK_PUBLISHABLE_KEY=your_clerk_key
CLERK_SECRET_KEY=your_clerk_secret
STRIPE_SECRET_KEY=your_stripe_secret
NEXT_PUBLIC_STRIPE_PUBLISHABLE_KEY=your_stripe_publishable_key
CLOUDINARY_CLOUD_NAME=your_cloud_name
CLOUDINARY_API_KEY=your_cloudinary_key
CLOUDINARY_API_SECRET=your_cloudinary_secret- Run the Dev Server
npm run dev
# or
yarn devVisit http://localhost:3000 in your browser.
(Include if available)
MIT License © 2025 Rushikesh Godase