Nuxt 3 Tailwind Vue 3 .cursorrules prompt file
About .cursorrules prompt file
What you can build
Nuxt 3 E-commerce Platform Builder: Create an intuitive platform for building e-commerce websites using Nuxt 3, Vue 3, and Tailwind. It would feature drag-and-drop components, configurable product listings, and a streamlined checkout process, all while ensuring code cleanliness and readbility using TypeScript.
Personalized Blogging System: Develop a blogging application that leverages Nuxt 3 for SSR benefits, with Tailwind for styling flexibility. It would include features like post scheduling, Markdown support, and SEO integration, ensuring high-quality, clear code and use of TypeScript for data interfaces.
Real-time Chat Application: A Vue 3 powered chat application with Nuxt 3, focusing on real-time messaging and provisional storage with Tailwind providing responsive design. It would use TypeScript for handling user and message data with a focus on security and performance.
Portfolio Website Generator: Build a tool for creating developer portfolio sites using Nuxt 3 for optimized loading, Vue 3 for dynamic content, and Tailwind for aesthetic layouts. The codebase would be structured to ensure maintainability and extensibility, with TypeScript providing robust type checking.
Online Learning Platform: Design an educational platform using Nuxt 3 that delivers courses with video and interactive content, styled with Tailwind. The code will be modular, focusing on functionality and readability, with TypeScript managing course, user, and progress interfaces.
Event Management System: Create a comprehensive system for managing events such as conferences and webinars. Use Nuxt 3 SSR capabilities for enhanced SEO and Tailwind CSS for a professional layout. Utilize TypeScript to handle event data, participant management, and scheduling features.
Recipe Sharing Network: Develop a community-driven recipe sharing site using Nuxt 3, where users can submit, share, and explore food recipes. Employ Tailwind for adaptive styling and ensure that TypeScript is used for strong type definitions and consistency across the application.
Job Board Website: A platform for job listings and applications built with Nuxt 3 and styled with Tailwind, emphasizing on clarity and ease of navigation. TypeScript will be used to manage job posts, application processes, and user profiles to maintain data integrity and accuracy.
Task Management Tool: Construct a task management and productivity app using Vue 3 and Nuxt 3. Incorporate Tailwind for clean layouts, while using TypeScript for defining task data and user interactions, ensuring that the app is scalable and performs adequately with clear, maintainable code.
Remote Collaboration Suite: Create a suite of tools for remote work, including file sharing, video conferencing, and collaborative document editing using Nuxt 3 for the web app structure, ensuring a seamless user experience. Tailwind will manage the UI, while TypeScript will handle complex data types across the suite.
Benefits
- Prioritizes readable, bug-free Vue 3 code using Nuxt 3 and Tailwind with up-to-date TypeScript patterns.
- Employs step-by-step pseudocode descriptions and modularization for efficient, functional implementations.
- Ensures no console.log or placeholders, focusing on secure, localized code with detailed examples.
Synopsis
Developers building a Vue 3 web application with Nuxt 3, Typescript, and Tailwind can use this prompt for generating concise, readable, and well-structured code following best-practices.
Overview of .cursorrules prompt
The .cursorrules file defines the characteristics and guidelines for an AI programming assistant specialized in developing Vue 3 applications using Nuxt 3, TypeScript, and Tailwind. It emphasizes producing clear, readable, and efficient code while adhering to the latest stable versions and best practices. The file outlines key principles such as step-by-step planning with pseudocode, ensuring correctness and completeness of functionality, and maintaining code readability. It specifies coding style preferences, including the use of descriptive variable names, TypeScript interfaces over types, and avoidance of console logs. The file insists on localizing hardcoded strings and using Nuxt 3's autoimport feature.