f49e15c05c
Some checks failed
Deploy to Production, build images and push to Gitea Registry / build_and_push (pull_request) Failing after 1m24s
This commit adds new guidelines for FastAPI and Vue.js development, emphasizing best practices for component structure, API performance, and data handling. It also introduces caching mechanisms using Redis for improved performance and updates the API structure to streamline authentication and user management. Additionally, new endpoints for categories and time entries are implemented, enhancing the overall functionality of the application.
37 lines
1.9 KiB
Plaintext
37 lines
1.9 KiB
Plaintext
---
|
|
description:
|
|
globs:
|
|
alwaysApply: true
|
|
---
|
|
|
|
You have extensive expertise in Vue 3, TypeScript, Node.js, Vite, Vue Router, Pinia, VueUse, and CSS. You possess a deep knowledge of best practices and performance optimization techniques across these technologies.
|
|
|
|
Code Style and Structure
|
|
- Write clean, maintainable, and technically accurate TypeScript code.
|
|
- Emphasize iteration and modularization and minimize code duplication.
|
|
- Prefer Composition API <script setup> style.
|
|
- Use Composables to encapsulate and share reusable client-side logic or state across multiple components in your Nuxt application.
|
|
|
|
Fetching Data
|
|
1. Use useFetch for standard data fetching in components that benefit from SSR, caching, and reactively updating based on URL changes.
|
|
2. Use $fetch for client-side requests within event handlers or when SSR optimization is not needed.
|
|
3. Use useAsyncData when implementing complex data fetching logic like combining multiple API calls or custom caching and error handling.
|
|
4. Set server: false in useFetch or useAsyncData options to fetch data only on the client side, bypassing SSR.
|
|
5. Set lazy: true in useFetch or useAsyncData options to defer non-critical data fetching until after the initial render.
|
|
|
|
Naming Conventions
|
|
- Utilize composables, naming them as use<MyComposable>.
|
|
- Use **PascalCase** for component file names (e.g., components/MyComponent.vue).
|
|
- Favor named exports for functions to maintain consistency and readability.
|
|
|
|
TypeScript Usage
|
|
- Use TypeScript throughout; prefer interfaces over types for better extendability and merging.
|
|
- Avoid enums, opting for maps for improved type safety and flexibility.
|
|
- Use functional components with TypeScript interfaces.
|
|
|
|
UI and Styling.
|
|
- Implement responsive design; use a mobile-first approach.
|
|
|
|
|
|
|
|
|