🚀 QuickLintAI

Microfeedback de Código com Inteligência Artificial

Uma aplicação web que fornece feedback instantâneo e sugestões de melhoria para pequenos trechos de código JavaScript/TypeScript e C#, utilizando IA para análise de estilo e performance.

✨ Características Principais

• 🔍 Análise Instantânea: Feedback em segundos para trechos de até 1024 caracteres
• 🎯 Perfis Personalizáveis: Escolha entre análise "Rigorosa" ou "Flexível"
• 📱 Interface Responsiva: Funciona perfeitamente em desktop e mobile
• 🔧 Diff Lado a Lado: Visualização clara das sugestões com sintaxe destacada
• 🌐 Múltiplas Linguagens: Suporte a JavaScript, TypeScript e C#

🛠 Stack Tecnológica

Frontend

• Next.js (React) - Framework full-stack
• Tailwind CSS - Estilização utilitária
• shadcn/ui - Componentes acessíveis e modernos
• Monaco Editor - Editor de código avançado

Backend

• ASP.NET 8+ - API REST robusta e performática
• C# - Linguagem principal do backend

Comunicação

• REST API - Endpoint /api/feedback para análise
• HTTPS - Comunicação segura
• CORS - Configurado para desenvolvimento e produção

🎯 Como Funciona

1. 📝 Cole seu código no editor Monaco integrado
2. ⚙️ Selecione o perfil de análise (Rigoroso ou Flexível)
3. 🚀 Envie para análise com um clique
4. 👀 Visualize as sugestões em formato diff lado a lado
5. 💡 Aplique as melhorias em seu código

🏗 Arquitetura do Projeto

QuickLintAI/
├── 📁 src/
│   ├── 🎨 frontend/          # Aplicação Next.js
│   │   ├── src/
│   │   │   ├── app/          # Pages e layouts
│   │   │   ├── components/   # Componentes React
│   │   │   └── lib/          # Utilitários
│   │   └── package.json
│   │
│   └── ⚙️ application/       # Backend .NET
│       └── QuickLintAI.Api/
│           ├── Controllers/  # Endpoints da API
│           ├── Services/     # Lógica de negócio
│           ├── Models/       # Modelos de dados
│           └── Program.cs
│
├── 📚 docs/                  # Documentação
├── 🔧 run.sh                 # Script de execução (Linux/macOS)
└── 🔧 run.ps1               # Script de execução (Windows)

🚀 Início Rápido

📥 Para instalação detalhada: Consulte o Guia Completo de Instalação com instruções específicas para Linux, Windows e macOS.

✅ Story #000 Concluída: O header com sistema de temas e layout base já estão implementados e funcionais!

Pré-requisitos

• .NET 8.0 SDK - Download
• Node.js (v18+) - Download
• npm ou yarn

Execução com Scripts Automatizados

Linux/macOS

# Tornar executável (primeira vez)
chmod +x run.sh

# Executar aplicação completa
./run.sh full

# Ou executar separadamente
./run.sh frontend    # Apenas frontend
./run.sh backend     # Apenas backend

Windows

# Executar aplicação completa
.\run.ps1 full

# Ou executar separadamente
.\run.ps1 frontend   # Apenas frontend
.\run.ps1 backend    # Apenas backend

Execução Manual

Frontend

cd src/frontend
npm install
npm run dev

Backend

cd src/application/QuickLintAI.Api
dotnet restore
dotnet run

🌐 URLs de Desenvolvimento

• Frontend: http://localhost:3000
• Backend API: http://localhost:5000
• Swagger/OpenAPI: http://localhost:5000/swagger

📖 Funcionalidades Detalhadas

🎨 Interface do Usuário

• Editor de Código: Monaco Editor com suporte completo a sintaxe
• Seletor de Perfil: Rádio buttons para escolher entre "Rigoroso" e "Flexível"
• Botão de Envio: Com indicador visual de carregamento
• Visualizador de Diff: Comparação lado a lado com comentários explicativos

⚙️ Backend API

• FeedbackController: Endpoint principal /api/feedback
• AIService: Integração com modelos de linguagem
• Validação: Limite de 1024 caracteres por snippet
• Logging: Monitoramento completo de requisições e erros

🔄 Atualizações Recentes

✅ Janeiro 2025 - Story #000 Concluída

• 🎨 Header responsivo implementado com logo QuickLintAI
• 🌙 Sistema de tema completo (Light/Dark/Sistema) funcionando
• 📱 Layout mobile-first com design system alinhado ao Style Guide
• ⚡ Base sólida estabelecida para desenvolvimento das próximas features
• 🚀 Aplicação rodando em http://localhost:3000

Próximo marco: Story #001 - Monaco Editor Setup

🧠 Perfis de Análise

🔴 Rigoroso

• Foco em regras estritas de estilo
• Análise profunda de performance
• Sugestões detalhadas de refatoração

🟡 Flexível

• Sugestões mais leves e práticas
• Foco em legibilidade
• Melhorias graduais

🔧 Scripts Disponíveis

Comando	Descrição
full	Executa frontend e backend simultaneamente
frontend	Apenas frontend em modo desenvolvimento
backend	Apenas backend com hot reload
build-all	Build de produção completo
clean	Limpa arquivos de build
install	Instala todas as dependências

📋 Para mais detalhes sobre os scripts, consulte docs/SCRIPTS_README.md

📚 Documentação

• Instalação - Guia completo de instalação para Linux, Windows e macOS
• MVP - Especificação completa do produto mínimo viável
• Scripts - Guia completo dos scripts de automação
• Funcional - Requisitos funcionais detalhados
• Tipos Sincronizados - Referência de tipos entre frontend e backend

📋 Progresso das Stories

Acompanhe o desenvolvimento incremental do projeto através das stories:

Story	Título	Tipo	Prioridade	Status	Descrição
#000	Setup Inicial e Header	Infraestrutura	Alta	✅ Concluída	Header com nome do app e seleção de tema
#001	Editor de Código Monaco	Funcionalidade	Alta	📋 Planejada	Editor com syntax highlighting e validação
#002	Seletor de Perfil	Funcionalidade	Alta	📋 Planejada	Escolha entre análise Rigorosa/Flexível
#003	API Backend Feedback	Funcionalidade	Alta	📋 Planejada	Endpoint de análise com integração IA
#004	Visualizador de Diff	Funcionalidade	Alta	📋 Planejada	Comparação lado a lado de código
#005	Integração Completa	Funcionalidade	Alta	📋 Planejada	Fluxo end-to-end da aplicação
#006	Setup do Projeto	Infraestrutura	Alta	📋 Planejada	Configuração inicial e dependências
#006	Validação e Erros	Funcionalidade	Média	📋 Planejada	Sistema robusto de validação
#007	Componentes de Loading	Melhoria	Média	📋 Planejada	Feedback visual e spinners
#008	Seletor de Linguagem UX	Melhoria	Baixa	📋 Planejada	UX aprimorado com auto-detecção
#009	Painel de Debugging	Funcionalidade	Baixa	📋 Planejada	Visualização de prompts enviados

📊 Status das Stories

• 📋 Planejada: 9 stories
• 🔄 Em Andamento: 0 stories
• ✅ Concluída: 1 story
• ❌ Cancelada: 0 stories

🎯 Próximas Prioridades

1. Story #001 - Implementar editor Monaco com syntax highlighting
2. Story #002 - Adicionar seleção de perfil de análise
3. Story #003 - Desenvolver API backend com IA
4. Story #004 - Visualizador de diff lado a lado

💡 Dica: Cada story é independente e pode ser desenvolvida incrementalmente. Consulte os arquivos individuais para detalhes técnicos completos.

🤝 Contribuindo

1. Fork o projeto
2. Crie uma branch para sua feature (git checkout -b feature/AmazingFeature)
3. Commit suas mudanças (git commit -m 'Add some AmazingFeature')
4. Push para a branch (git push origin feature/AmazingFeature)
5. Abra um Pull Request

📄 Licença

Este projeto está sob a licença MIT. Veja o arquivo LICENSE para mais detalhes.

🙋‍♂️ Suporte

Encontrou um problema ou tem uma sugestão?

• 🐛 Reporte um bug
• 💡 Sugira uma feature
• 📖 Consulte a documentação

---

QuickLintAI - Transformando código bom em código excelente, uma sugestão por vez! ✨