Wed Jan 22 2025


PDL (Project Development Lab)
Next.js
Tailwind CSS
tRPC
Google Generative AI
A web application developed for the Project Development Lab (PDL) course in the second year of college, enabling users to fetch YouTube video transcripts and interact with an AI-powered chatbot to ask questions about the content.
What is PDL?
Introduction
PDL (Project Development Lab) is a web application created as part of the second-year college curriculum for the Project Development Lab course. It allows users to input a YouTube video URL to fetch its transcript and engage with an AI-powered chatbot, utilizing Google Generative AI to answer questions based on the transcript. Built with Next.js, TypeScript, and Tailwind CSS, the project showcases a modern, responsive interface with a robust backend powered by tRPC and the YouTube Transcript API.
Features
- YouTube Transcript Retrieval: Easily fetch transcripts from YouTube videos by providing a video URL.
- AI-Powered Chatbot: Ask questions about the video content, with concise answers generated by Google Generative AI.
- Responsive Interface: Mobile-first design with Tailwind CSS, ensuring seamless use across devices.
- tRPC Integration: Type-safe and efficient API communication for smooth data handling.
- Form Validation with Zod: Secure and validated user inputs using React Hook Form and Zod.
- Embedded YouTube Player: Displays the selected video alongside the chatbot for quick reference.
- Robust Error Handling: Manages errors for invalid URLs, unavailable transcripts, or API issues.
- Shadcn UI Components: Polished and consistent UI elements for an enhanced user experience.
- TypeScript Support: Ensures type safety and improves developer productivity.
- Scalable Structure: Built with Next.js and tRPC for a maintainable and extensible codebase.
Tech Stack
- Next.js
- Tailwind CSS
- tRPC
- Google Generative AI
- YouTube Transcript API
- React Hook Form
- Zod
- Shadcn UI
Open-Source and No Hidden Costs
PDL is an open-source project developed for educational purposes as part of the Project Development Lab course. It integrates with the YouTube Transcript API and Google Generative AI, requiring an API key for the latter, but there are no hidden costs associated with its core functionality.
Get Involved
Contributions to the PDL project are welcome to enhance its features and functionality. Whether you're a student or developer, you can contribute by fixing bugs, adding features, or improving the UI. Visit the GitHub repository to explore the codebase, report issues, or submit pull requests.
Stay Connected
Stay updated with the latest project developments by following us on social media: