Piscinas Project Development Guidelines

This skill provides AI coding assistants with context-specific instructions for working on the Piscinas project, a Next.js application built with TypeScript and Tailwind CSS.

Project Context

The Piscinas project is a Next.js application with the following characteristics:

Framework: Next.js with App Router

Language: TypeScript

Styling: Tailwind CSS

Linting: ESLint

Source directory: `src/`

Development server: http://localhost:3000

Development Workflow Checklist

When working on this project, ensure the following steps are completed:

1. **Project Setup Verification**

- Confirm `.github/copilot-instructions.md` exists

- Verify project requirements are clearly documented

- Ensure Next.js project is scaffolded with TypeScript

2. **Configuration Standards**

- TypeScript strict mode enabled

- Tailwind CSS properly configured

- ESLint rules enforced

- App Router structure maintained

- `src/` directory organization followed

3. **Development Workflow**

- Project compiles without errors before commits

- Development server runs successfully

- All tasks are properly configured

- Documentation stays up-to-date (especially README.md)

4. **Code Quality Gates**

- TypeScript compilation passes

- ESLint checks pass

- Application launches without runtime errors

- Changes are tested locally before committing

Coding Standards

TypeScript Guidelines

Use strict TypeScript types

Avoid `any` type unless absolutely necessary

Prefer interfaces for object shapes

Use type inference where appropriate

Export types/interfaces that are reused

Next.js App Router Patterns

Use Server Components by default

Mark Client Components with `'use client'` directive only when needed

Follow file-based routing conventions

Use proper loading and error boundaries

Implement metadata exports for SEO

Styling with Tailwind

Use Tailwind utility classes for styling

Create custom components for repeated patterns

Avoid inline styles unless dynamic

Follow mobile-first responsive design

Maintain consistent spacing and color scales

File Organization

Keep components in `src/components/`

Place app routes in `src/app/`

Store utilities in `src/lib/` or `src/utils/`

Keep types in `src/types/` or co-located with components

Use barrel exports (`index.ts`) for cleaner imports

Documentation Requirements

When making changes:

Update README.md with new features or setup steps

Document complex logic with inline comments

Maintain the project checklist in `.github/copilot-instructions.md`

Add JSDoc comments for exported functions/components

Keep environment variable documentation current

Running the Project

```bash

Install dependencies

npm install

Run development server

npm run dev

Build for production

npm run build

Run production build

npm start

Lint code

npm run lint

```

Constraints

All code must compile successfully in TypeScript

ESLint warnings should be addressed, not suppressed

The development server must start without errors

Changes should not break existing functionality

Documentation must be updated alongside code changes

Piscinas Project Development Guidelines

Piscinas Project Development Guidelines

Project Context

Development Workflow Checklist

Coding Standards

TypeScript Guidelines

Next.js App Router Patterns

Styling with Tailwind

File Organization

Documentation Requirements

Running the Project

Install dependencies

Run development server

Build for production

Run production build

Lint code

Constraints

Reviews (0)