Lovable Prompt Creator - AI Prompt Generator

## APPLICATION OVERVIEW
This project aims to develop a web application similar to Linktree, allowing users to create personalized landing pages that aggregate links to their social media profiles, websites, and other online content. The application will feature user dashboards for easy management, an admin panel for overseeing user activity, and a builder tool for customizing link pages.

## CORE FEATURES
1. **User Authentication**: Secure user registration and login system, allowing users to create and manage their accounts.
2. **Custom Link Builder**: An intuitive interface for users to add, edit, and organize their links with customizable options for layout and style.
3. **User Dashboard**: A comprehensive dashboard where users can view analytics on link performance, edit their profiles, and manage their links.
4. **Admin Panel**: A robust admin interface for managing users, monitoring activity, and handling reports or issues.
5. **Responsive Design**: The application will be fully responsive to ensure an optimal experience across all devices.
6. **Analytics and Insights**: Provide users with data on link clicks, traffic sources, and other relevant metrics to help them optimize their pages.

## DESIGN SPECIFICATIONS
- **Visual Style**: minimalist - Clean, simple design with plenty of white space, minimal color palette, and focus on typography.
- **Color Mode**: Light theme with dark text on light backgrounds.
- **Primary Color**: #1978E5 (accent for buttons, links, highlights).
- **Typography**: Use Inter from Google Fonts for headings, Inter for body text and UI elements.
- **Border Radius**: 8px (moderately rounded) for buttons, cards, and inputs.
- **Layout**: The main layout will consist of a top navigation bar, a side menu for the dashboard, and a content area that dynamically changes based on user interactions.

## TECHNICAL REQUIREMENTS
- **Framework**: React with TypeScript
- **Styling**: Tailwind CSS
- **UI Components**: shadcn/ui
- **State Management**: React Context API or Redux (as needed for complex state management)

## IMPLEMENTATION STEPS
1. **Set Up Environment**: Initialize a new React project using Create React App with TypeScript support, and install Tailwind CSS and shadcn/ui components.
2. **Design Components**: Create reusable components like buttons, cards, modals, and form elements using Tailwind CSS for styling.
3. **User Authentication**: Implement user authentication features using a library like Firebase Authentication or Auth0.
4. **Build the Dashboard**: Create the user dashboard layout with sections for analytics, link management, and user profile settings.
5. **Develop Admin Panel**: Implement admin functionalities, including user management, activity logs, and content moderation tools.
6. **Link Builder Development**: Create the link builder interface, ensuring users can easily customize and preview their link pages in real-time.
7. **Testing**: Conduct thorough testing for functionality, usability, and responsiveness across devices and browsers.
8. **Deployment**: Deploy the application on a platform like Vercel or Netlify and set up a backend service if necessary for data management.

## USER EXPERIENCE
Users will experience a seamless onboarding process with a clear call to action for sign-up. Once registered, they can easily navigate to their dashboard to manage links and view analytics. The link builder will provide a straightforward interface that allows users to drag and drop elements, customize colors, and see changes in real-time, enhancing their overall experience. Admins will have easy access to manage users and monitor activity efficiently, ensuring the platform remains secure and user-friendly.