This is an example custom assistant that will help you complete the Python onboarding in VS Code. After trying it out, feel free to experiment with other blocks or create your own custom assistant.
## Build & Development Commands
- Project Overview: Clearly explain the purpose of the portfolio site.
Technology Stack: Mention Next.js, Tailwind CSS, Appwrite (database), Firebase (authentication).
Component Documentation:
Navbar: Sticky, minimal design.
Hero Section: Full-screen introduction.
Portfolio Showcase: Grid layout with hover effects.
Testimonials: Carousel or grid format.
Contact Form: Integrated with Firebase authentication, storing inquiries in Appwrite.
Code Examples: Provide snippets for key functionalities.
SEO & Performance:
Use next/image for optimized images.
Implement lazy loading for non-critical components.
Add structured data for better SEO ranking.
## Testing Guidelines
-
## Code Style & Guidelines
Use JSX instead of TYPESCRIPT.
Follow ESLint and Prettier for code formatting.
Maintain a modular folder structure:
components/ → Reusable UI components
layouts/ → Page layouts
pages/ → Next.js pages
lib/ → Utility functions, API calls
Use Next.js Server Components where applicable.
Ensure accessibility:
Proper alt attributes for images.
Good color contrast for readability.
-
## Documentation Guidelines
- Project Overview: Provide a brief description of the architecture portfolio website, its purpose, and key features.
Technology Stack: Mention and link to the official documentation of the technologies used:
Next.js (Frontend Framework) → https://nextjs.org/docs
Tailwind CSS (Styling) → https://tailwindcss.com/docs
Appwrite (Database & Backend) → https://appwrite.io/docs
Firebase (Authentication) → https://firebase.google.com/docs
Folder Structure: Document the project's folder organization:
components/ → UI components (Navbar, Hero, Portfolio, etc.).
layouts/ → Page layouts.
pages/ → Next.js route pages.
lib/ → Utility functions and API handlers.
Component Documentation: Explain the purpose and props of each key component.
Example:
Navbar: Sticky, minimal design with navigation links.
Hero Section: Full-screen introduction with CTA.
Portfolio Showcase: Grid layout with hover effects.
Contact Form: Integrated with Firebase authentication.
API & Database Documentation:
Authentication: Email/password and Google OAuth using Firebase.
Database Structure: Appwrite collections for storing portfolio projects and user inquiries.
API Routes: Explain Next.js API routes for handling database interactions.
Code Examples: Provide essential snippets, such as setting up authentication, fetching data, and UI components.
SEO & Performance Optimization:
Use next/image for optimized images.
Implement lazy loading for non-critical components.
Add structured metadata for SEO improvements.
Deployment & Hosting: Document the deployment process with relevant links:
Netlify (Next.js Hosting) → https://netlify.com/docs
Firebase Hosting (Alternative) → https://firebase.google.com/docs/hosting
Use Cargo to write a comprehensive suite of unit tests for this function
No Data configured
No MCP Servers configured