- π€ Introduction
- βοΈ Tech Stack
- π Features
- π€Έ Quick Start
- π‘οΈ Security & Authentication
- π Deployment
- π License
Podcastr is a premium AI-powered platform designed for the modern content creator. By integrating cutting-edge technologies like OpenAI's Text-to-Speech and DALL-E 3, Podcastr allows users to generate professional-grade audio content and striking visual thumbnails from simple text prompts.
Whether you're an aspiring podcaster or a seasoned pro, Podcastr provides a unified dashboard to build, organize, and share your voice with the world.
- Framework: Next.js 14 (App Router)
- Backend / Database: Convex
- Authentication: Clerk
- AI Engine: OpenAI (TTS & DALL-E 3)
- Styling: Tailwind CSS
- Components: Radix UI & Shadcn UI
- Animations: Framer Motion
π Robust Authentication: A secure environment for creators with Clerk-powered login and registration.
π AI Voice Generation: Transform scripts into audio using multiple AI voices (Alloy, Echo, Fable, Onyx, Nova, Shimmer).
π AI Thumbnail Studio: Craft unique cover art using DALL-E 3 prompts directly within the app.
π Dynamic Podcast Player: A fixed, responsive player with full playback control (play/pause, seek, volume, Mute/Unmute).
π Intelligent Discovery: Search and filter through trending podcasts or explore by voice type and author.
π Creator Profiles: Dedicated spaces to showcase your work and track listener engagement.
π Responsive Layout: A sleek, dark-mode first interface optimized for desktops, tablets, and mobile devices.
To set up Podcastr locally, follow these steps:
# Clone the repository
git clone https://github.com/MadtorXD/podcastr.git
# Navigate to the directory
cd podcastr
# Install dependencies
npm installCreate a .env.local file in the root directory:
# Convex Configuration
CONVEX_DEPLOYMENT=
NEXT_PUBLIC_CONVEX_URL=
# Clerk Authentication
NEXT_PUBLIC_CLERK_PUBLISHABLE_KEY=
CLERK_SECRET_KEY=
# Clerk URLs
NEXT_PUBLIC_CLERK_SIGN_IN_URL='/sign-in'
NEXT_PUBLIC_CLERK_SIGN_UP_URL='/sign-up'
# OpenAI API
OPENAI_API_KEY=# Start the Convex development server
npx convex devnpm run devVisit http://localhost:3000 to start creating!
Podcastr uses Clerk for session management and user protection. The Middleware is configured to protect all routes by default while allowing access to public sign-in and sign-up pages.
The custom middleware.ts ensures that static assets are served efficiently without unnecessary invocation, preventing system overhead.
The project is optimized for deployment on Vercel. Ensure all environment variables are added to your Vercel project settings. For real-time user syncing, configure a Clerk Webhook pointing to your Convex HTTP endpoint (e.g., https://<your-project>.convex.site/clerk).
This project is licensed under the MIT License.