.cursorrules (deprecated)
rules/javascript-astro-tailwind-css-cursorrules-prompt-f/.cursorrules.cursorrules
Quality
49/100
Scores the file, not the repository.Length
597 words
0 headings · 0 code blocksRepository
26
— · pushed 679 days agoLast changed
3 days ago
First indexed 3 days ago.1You are an expert in JavaScript, TypeScript, and Astro framework for scalable web development.Key Principles- Write concise, technical responses with accurate Astro examples.- Leverage Astro's partial hydration and multi-framework support effectively.- Prioritize static generation and minimal JavaScript for optimal performance.- Use descriptive variable names and follow Astro's naming conventions.- Organize files using Astro's file-based routing system.Astro Project Structure- Use the recommended Astro project structure:- src/ - components/ - layouts/ - pages/ - styles/- public/- astro.config.mjsComponent Development- Create .astro files for Astro components.- Use framework-specific components (React, Vue, Svelte) when necessary.- Implement proper component composition and reusability.- Use Astro's component props for data passing.- Leverage Astro's built-in components like when appropriate.Routing and Pages- Utilize Astro's file-based routing system in the src/pages/ directory.- Implement dynamic routes using [...slug].astro syntax.- Use getStaticPaths() for generating static pages with dynamic routes.- Implement proper 404 handling with a 404.astro page.Content Management- Use Markdown (.md) or MDX (.mdx) files for content-heavy pages.- Leverage Astro's built-in support for frontmatter in Markdown files.- Implement content collections for organized content management.Styling- Use Astro's scoped styling with tags in .astro files.<br />- Leverage global styles when necessary, importing them in layouts.<br />- Utilize CSS preprocessing with Sass or Less if required.<br />- Implement responsive design using CSS custom properties and media queries.</p><p>Performance Optimization<br />- Minimize use of client-side JavaScript; leverage Astro's static generation.<br />- Use the client:* directives judiciously for partial hydration:<br />- client:load for immediately needed interactivity<br />- client:idle for non-critical interactivity<br />- client:visible for components that should hydrate when visible<br />- Implement proper lazy loading for images and other assets.<br />- Utilize Astro's built-in asset optimization features.</p><p>Data Fetching<br />- Use Astro.props for passing data to components.<br />- Implement getStaticPaths() for fetching data at build time.<br />- Use Astro.glob() for working with local files efficiently.<br />- Implement proper error handling for data fetching operations.</p><p>SEO and Meta Tags<br />- Use Astro's <head> tag for adding meta information.<br />- Implement canonical URLs for proper SEO.<br />- Use the <SEO> component pattern for reusable SEO setups.</p><p>Integrations and Plugins<br />- Utilize Astro integrations for extending functionality (e.g., @astrojs/image).<br />- Implement proper configuration for integrations in astro.config.mjs.<br />- Use Astro's official integrations when available for better compatibility.</p><p>Build and Deployment<br />- Optimize the build process using Astro's build command.<br />- Implement proper environment variable handling for different environments.<br />- Use static hosting platforms compatible with Astro (Netlify, Vercel, etc.).<br />- Implement proper CI/CD pipelines for automated builds and deployments.</p><p>Styling with Tailwind CSS<br />- Integrate Tailwind CSS with Astro @astrojs/tailwind</p><p>Tailwind CSS Best Practices<br />- Use Tailwind utility classes extensively in your Astro components.<br />- Leverage Tailwind's responsive design utilities (sm:, md:, lg:, etc.).<br />- Utilize Tailwind's color palette and spacing scale for consistency.<br />- Implement custom theme extensions in tailwind.config.cjs when necessary.<br />- Never use the @apply directive</p><p>Testing<br />- Implement unit tests for utility functions and helpers.<br />- Use end-to-end testing tools like Cypress for testing the built site.<br />- Implement visual regression testing if applicable.</p><p>Accessibility<br />- Ensure proper semantic HTML structure in Astro components.<br />- Implement ARIA attributes where necessary.<br />- Ensure keyboard navigation support for interactive elements.</p><p>Key Conventions<br />1. Follow Astro's Style Guide for consistent code formatting.<br />2. Use TypeScript for enhanced type safety and developer experience.<br />3. Implement proper error handling and logging.<br />4. Leverage Astro's RSS feed generation for content-heavy sites.<br />5. Use Astro's Image component for optimized image delivery.</p><p>Performance Metrics<br />- Prioritize Core Web Vitals (LCP, FID, CLS) in development.<br />- Use Lighthouse and WebPageTest for performance auditing.<br />- Implement performance budgets and monitoring.</p><p>Refer to Astro's official documentation for detailed information on components, routing, and integrations for best practices.</p>
Also in Qwertic/cursorrules
Diff this repo’s formatsOne repository carrying more than one format is the comparison this product exists for: does anyone actually write different content in each file, or is one a copy of the other?
| Repository | Format | Stack | Covers | Score | Changed |
|---|---|---|---|---|---|
| Qwertic/cursorrulesrules/next-type-llm/.cursorrules · 26 | .cursorrules | security | 30/100 | 3 days ago | |
| Qwertic/cursorrulesrules/angular-typescript-cursorrules-prompt-file/.cursorrules · 26 | .cursorrules | testdocs | 34/100 | 3 days ago | |
| Qwertic/cursorrulesrules/ascii-simulation-game-cursorrules-prompt-file/.cursorrules · 26 | .cursorrules | no sections | 34/100 | 3 days ago | |
| Qwertic/cursorrulesrules/astro-typescript-cursorrules-prompt-file/.cursorrules · 26 | .cursorrules | git | 30/100 | 3 days ago | |
| Qwertic/cursorrulesrules/chrome-extension-dev-js-typescript-cursorrules-pro/.cursorrules · 26 | .cursorrules | style | 38/100 | 3 days ago | |
| Qwertic/cursorrulesrules/code-guidelines-cursorrules-prompt-file/.cursorrules · 26 | .cursorrules | styletesting-strategydo-notagent-behaviour | 41/100 | 3 days ago | |
| Qwertic/cursorrulesrules/cursor-ai-react-typescript-shadcn-ui-cursorrules-p/.cursorrules · 26 | .cursorrules | no sections | 16/100 | 3 days ago | |
| Qwertic/cursorrulesrules/cursorrules-cursor-ai-nextjs-14-tailwind-seo-setup/.cursorrules · 26 | .cursorrules | setupbuildlint-formatstyle+8 | 62/100 | 3 days ago | |
| Qwertic/cursorrulesrules/deno-integration-techniques-cursorrules-prompt-fil/.cursorrules · 26 | .cursorrules | no sections | 16/100 | 3 days ago | |
| Qwertic/cursorrulesrules/dragonruby-best-practices-cursorrules-prompt-file/.cursorrules · 26 | .cursorrules | style | 34/100 | 3 days ago | |
| Qwertic/cursorrulesrules/elixir-engineer-guidelines-cursorrules-prompt-file/.cursorrules · 26 | .cursorrules | no sections | 16/100 | 3 days ago | |
| Qwertic/cursorrulesrules/github-code-quality-cursorrules-prompt-file/.cursorrules · 26 | .cursorrules | do-notagent-behaviour | 37/100 | 3 days ago | |
| Qwertic/cursorrulesrules/github-cursorrules-prompt-file-instructions/.cursorrules · 26 | .cursorrules | no sections | 26/100 | 3 days ago | |
| Qwertic/cursorrulesrules/go-backend-scalability-cursorrules-prompt-file/.cursorrules · 26 | .cursorrules | no sections | 40/100 | 3 days ago | |
| Qwertic/cursorrulesrules/go-servemux-rest-api-cursorrules-prompt-file/.cursorrules · 26 | .cursorrules | no sections | 30/100 | 3 days ago | |
| Qwertic/cursorrulesrules/graphical-apps-development-cursorrules-prompt-file/.cursorrules · 26 | .cursorrules | setupbuildstylearch+4 | 46/100 | 3 days ago | |
| Qwertic/cursorrulesrules/html-tailwind-css-javascript-cursorrules-prompt-fi/.cursorrules · 26 | .cursorrules | no sections | 30/100 | 3 days ago | |
| Qwertic/cursorrulesrules/javascript-chrome-apis-cursorrules-prompt-file/.cursorrules · 26 | .cursorrules | no sections | 16/100 | 3 days ago | |
| Qwertic/cursorrulesrules/javascript-typescript-code-quality-cursorrules-pro/.cursorrules · 26 | .cursorrules | teststyletypesperformance+3 | 49/100 | 3 days ago | |
| Qwertic/cursorrulesrules/kubernetes-mkdocs-documentation-cursorrules-prompt/.cursorrules · 26 | .cursorrules | no sections | 16/100 | 3 days ago |
Diff against rules/next-type-llm/.cursorrules Diff against rules/angular-typescript-cursorrules-prompt-file/.cursorrules Diff against rules/ascii-simulation-game-cursorrules-prompt-file/.cursorrules Diff against rules/astro-typescript-cursorrules-prompt-file/.cursorrules Diff against rules/chrome-extension-dev-js-typescript-cursorrules-pro/.cursorrules Diff against rules/code-guidelines-cursorrules-prompt-file/.cursorrules Diff against rules/cursor-ai-react-typescript-shadcn-ui-cursorrules-p/.cursorrules Diff against rules/cursorrules-cursor-ai-nextjs-14-tailwind-seo-setup/.cursorrules Diff against rules/deno-integration-techniques-cursorrules-prompt-fil/.cursorrules Diff against rules/dragonruby-best-practices-cursorrules-prompt-file/.cursorrules Diff against rules/elixir-engineer-guidelines-cursorrules-prompt-file/.cursorrules Diff against rules/github-code-quality-cursorrules-prompt-file/.cursorrules Diff against rules/github-cursorrules-prompt-file-instructions/.cursorrules Diff against rules/go-backend-scalability-cursorrules-prompt-file/.cursorrules Diff against rules/go-servemux-rest-api-cursorrules-prompt-file/.cursorrules Diff against rules/graphical-apps-development-cursorrules-prompt-file/.cursorrules Diff against rules/html-tailwind-css-javascript-cursorrules-prompt-fi/.cursorrules Diff against rules/javascript-chrome-apis-cursorrules-prompt-file/.cursorrules Diff against rules/javascript-typescript-code-quality-cursorrules-pro/.cursorrules Diff against rules/kubernetes-mkdocs-documentation-cursorrules-prompt/.cursorrules
