Lovable Prompt Creator - AI Prompt Generator

## APPLICATION OVERVIEW
This project aims to create a web application for an online course platform similar to Hotmart. Users will be able to browse, purchase, and enroll in various courses while enjoying a clean and intuitive interface. The application will facilitate a seamless learning experience, catering to both course creators and learners.

## CORE FEATURES
1. **Course Catalog**: A searchable and filterable list of available courses, showcasing course titles, descriptions, and prices.
2. **User Authentication**: Secure login and registration functionality for both students and instructors, allowing users to manage their profiles and courses.
3. **Course Management**: Instructors can create, edit, and manage their courses, including adding content such as videos, quizzes, and downloadable resources.
4. **Payment Integration**: A secure payment processing system to handle course purchases, with options for various payment methods.
5. **User Dashboard**: A personalized dashboard for students to track their enrolled courses, progress, and certificates of completion.
6. **Feedback and Ratings**: A system for students to give feedback and rate courses, helping future users make informed decisions.

## DESIGN SPECIFICATIONS
- **Visual Style**: Minimalist - Clean, simple design with plenty of white space to enhance readability and focus on content. Minimal color palette to avoid distractions.
- **Color Mode**: Light theme with dark text on light backgrounds to ensure high contrast and readability.
- **Layout**: A responsive grid layout for course listings, featuring a prominent hero section on the homepage, followed by course categories and testimonials.
- **Typography**: Use a modern sans-serif font for body text (e.g., Inter or Roboto) and a slightly bolder font for headings to create a clear hierarchy.

## TECHNICAL REQUIREMENTS
- **Framework**: React with TypeScript for building a robust and type-safe application.
- **Styling**: Tailwind CSS for utility-first styling, enabling rapid UI development.
- **UI Components**: Utilize shadcn/ui for pre-built components that follow the minimalist design guidelines.
- **State Management**: Use Zustand or Redux for managing global application state if necessary.

## IMPLEMENTATION STEPS
1. **Set Up Environment**: Initialize a new React project with TypeScript and install Tailwind CSS along with shadcn/ui components.
2. **Create Authentication Flow**: Implement user registration and login functionality, ensuring secure password storage and session management.
3. **Develop Course Catalog**: Build the course catalog page, integrating filtering and searching capabilities.
4. **Implement Course Management**: Create a user interface for instructors to add and manage their courses, including uploading media and setting pricing.
5. **Integrate Payment Processing**: Set up a payment gateway (e.g., Stripe) to handle secure transactions.
6. **Build User Dashboard**: Create a dashboard for students to view their courses, progress, and certificates.
7. **Add Feedback Mechanism**: Implement functionality for students to provide ratings and comments on courses.
8. **Test and Deploy**: Conduct thorough testing for usability and performance, then deploy the application to a cloud hosting service.

## USER EXPERIENCE
Users will experience a seamless interaction starting from a visually appealing landing page that leads them to explore the course catalog. After logging in, students can manage their profiles and track their learning journey on their dashboard. Instructors will find it easy to create and manage their courses, ensuring a smooth experience for both content creators and learners. The minimalist design will guide users naturally through the platform, making each interaction straightforward and enjoyable.