An AI Saas tool that can Generate Music, Video, Photo, Code & Chat.
It is built using Nextjs, TailwindCss+ShadcnUi, Zustand, Clerk, Prisma, Postgresql, and Stripe.
![Screenshot 2024-01-31 084121](https://private-user-images.githubusercontent.com/91591901/301030588-c32e4ccd-ee93-4386-98af-0ccddbc27632.png?jwt=eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJnaXRodWIuY29tIiwiYXVkIjoicmF3LmdpdGh1YnVzZXJjb250ZW50LmNvbSIsImtleSI6ImtleTUiLCJleHAiOjE3MjAxMTA2MjAsIm5iZiI6MTcyMDExMDMyMCwicGF0aCI6Ii85MTU5MTkwMS8zMDEwMzA1ODgtYzMyZTRjY2QtZWU5My00Mzg2LTk4YWYtMGNjZGRiYzI3NjMyLnBuZz9YLUFtei1BbGdvcml0aG09QVdTNC1ITUFDLVNIQTI1NiZYLUFtei1DcmVkZW50aWFsPUFLSUFWQ09EWUxTQTUzUFFLNFpBJTJGMjAyNDA3MDQlMkZ1cy1lYXN0LTElMkZzMyUyRmF3czRfcmVxdWVzdCZYLUFtei1EYXRlPTIwMjQwNzA0VDE2MjUyMFomWC1BbXotRXhwaXJlcz0zMDAmWC1BbXotU2lnbmF0dXJlPWEyMjY2YTYwNjM5ODljNDk5MTJmOGQ2Mzk0NTI0MzIzMjYxNzRiNzI5ZTUxNWJkMDUzNTMwMDNlZTU5MGJhN2QmWC1BbXotU2lnbmVkSGVhZGVycz1ob3N0JmFjdG9yX2lkPTAma2V5X2lkPTAmcmVwb19pZD0wIn0.bjo112Gl7cPhP07bCoK1P91lCaqOF1hbrY-Z-AHSMks)
- Full responsiveness
- Tailwind animations and effects
- Image Generation Tool (Open AI)
- Video Generation Tool (Replicate AI)
- Conversation Generation Tool (Open AI)
- Music Generation Tool (Replicate AI)
- Clerk Authentication (Email, Google, 9+ Social Logins)
- Client form validation and handling using react-hook-form
- Stripe monthly subscription
- Free tier with API limiting
- How to write POST, DELETE, and GET routes in route handlers (app/api)
- Server error handling using react-toast
- Page loading state
- How to fetch data in server react components by directly accessing the database (WITHOUT API! like Magic!)
- How to handle relations between Server and Child components!
- How to reuse layouts
NEXT_PUBLIC_CLERK_PUBLISHABLE_KEY=
CLERK_SECRET_KEY=
NEXT_PUBLIC_CLERK_SIGN_IN_URL=/sign-in
NEXT_PUBLIC_CLERK_SIGN_UP_URL=/sign-up
NEXT_PUBLIC_CLERK_AFTER_SIGN_IN_URL=/dashboard
NEXT_PUBLIC_CLERK_AFTER_SIGN_UP_URL=/dashboard
OPENAI_API_KEY=
REPLICATE_API_TOKEN=
POSTGRES_URL_NON_POOLING=
STRIPE_API_KEY=
STRIPE_WEBHOOK_SECRET=
NEXT_PUBLIC_APP_URL="http://localhost:3000"
Clone the project
git clone https://link-to-project
Go to the project directory
cd my-project
Install dependencies
npm install
Add Postgresql Database (I used vercel Postgresql)
npx prisma db push
Start the App
npm run dev