Minha primeira experiência com Cursor + Claude Sonnet

Vítor França - Sep 3 - - Dev Community

Minha primeira experiência usando Cursor como IDE e Claude 3.5 Sonnet para desenvolver software

Implementação do Jogo da Vida

Acredito que nesse momento você já ouviu falar, ou pelo menos tenha visto algo relacionado ao Cursor. Caso não tenha, lá vai uma breve descrição do que é, segundo sua própria documentação:

Cursor is a fork of VS Code. This allows us focus on making the best way to code with AI, while offering a familiar text editing experience.

Em resumo, Cursor é uma IDE que possui integração e funcionalidades diretamente ligadas ao uso de IA para o desenvolvimento de software.

Dito isso, vamos a minha experiência :)

Já deixo aqui o link para o repositório: Game of Life

Meu background

Para que você tenha um entendimento mais aproximado da minha experiência, vou deixar aqui algumas informações que podem ser relevantes para o resultado e minhas considerações finais:

  • Sou desenvolvedor de software, mais especificamente Front-end com 5 anos de experiência
  • Sou formado em Ciência da Computação
  • Nunca havia usado nenhuma extensão em nível de IDE além do Github Copilot que envolvesse IA
  • Sim, utilizo ChatGPT no meu dia-a-dia (tenho vários pontos sobre isso, mas fica para um próximo post)

Como toda experiência, precisamos definir regras:

Sou OBRIGADO a aceitar as sugestões de código gerados pela IA
Utilizar inglês como linguagem de comunicação
Não posso alterar o código de forma a encontrar solução para bugs e/ou melhorar a qualidade do que foi gerado
Objetivo
Para testar tudo que foi apontado, o objetivo é implementar uma versão interativa do "Jogo da Vida" de Jhon Cornway utilizando Angular 17 (sim, a versão é relevante para o conteúdo deste artigo)

Jogo da Vida

O jogo da vida, é um Autômato celular , do qual possui algumas regras definidas:

  • Uma célula viva com 2 ou 3 vizinhas vivas continua viva.
  • Uma célula viva com menos de 2 vizinhas vivas morre.
  • Uma célula viva com mais de 3 vizinhas vivas morre.
  • Uma célula morta com exatamente 3 vizinhas vivas se torna viva.

Modal contento as regras do jogo

Prompts

Como dito anteriormente, o idioma utilizado foi o Inglês para toda a interação e os comandos foram dados de forma direta e clara, como por exemplo:

Implements "Game of Life" in a grid with full width and height of the screen.
Add a button that randomizes the grid and another one that is going to start
the simulation. Please use Angular Material for the styles

Importante: Resolvi fazer esse artigo um pouco depois do teste e perdi o histórico com os comandos e os resultados, então não consigo colocar 100% o que escrevi e isso explica a ausência do resultado de cada comando. Porém, farei um seguinte com próximos passos e evolução deste projeto.

Para cada geração de código, eu aceitava tudo, rodava e pedia correções como ajuste de layout, margem, bugs, etc.

Qualidade do código

Não posso dizer que o código é perfeito, mas digo com tranqulidade que em todo tempo foi gerado código legível e compreensível, de modo que se fosse preciso eu seria capaz de intervir e corrigir/melhorar algo que fosse gerado.

Bugs/Problemas

Assim como nós programadores de carne e osso, as IAs também geram bugs, e nesse meu primeiro contato não foi diferente. Tive muitos problemas com posicionamento de elementos no layout (como as estastística e visiblidade dos botões), alguns problemas com as cores do grid e o principal: o sistema de detecções de padrões não funciona (mas está listado como próximos passos).

Mesmo com os problemas, o código gerado era confiável e resolvia o que era pedido, necessitando de alguns ajustes aqui e ali. Vale destacar que as regras do Jogo da Vida foram todas implementadas sem nenhum problema ou necessidade de ajuste.

Tempo

Acredito que gastei menos de 1h30m em todo o projeto, isso levando em conta que ainda estava me ambientando com os atalhos e testando algumas formas de realizer os prompts. E apesar de não ser um projeto muito complexo, eu precisaria de pelo menos 2x esse tempo (Sendo otimista) para implementar da mesma forma.

Pontos positivos

  • Geração rápida de código
  • A flexibilidade entre adicionar contexto para cada comando facilita muito a correção de bugs, criação de funções e buscas por problemas que você talvez não soubesse que estavam ali
  • Código que funciona :)
  • IDE baseada em VSCode, então pude simplesmente importar tudo que uso no meu dia-a-dia

Pontos negativos

  • Ainda é complicado a solução de alguns problemas (principalemente relacionados a layout)
  • Apesar do código ser funcional, algumas implementações deixam um pouco a desejar

Conclusão

Estou muito surpreso e muito satisfeito com a qualidade de tudo que foi produzido e acredito que posso me beneficiar e muito disso no dia a dia para trabalhos manuais e repetitivos como geração de testes, correção de bugs simples, criação de MVP's e conceitos simples, de modo que ainda preciso realizar ajustes para que a qualidade do código me agrade.

Próximos Passos

Agora que o primeiro protótipo foi feito, os próximos passos serão criar novas funcionalidades para este projeto (quero muito arrumar a detecção de Padrões e adicionar alguns padrões pré-implementados como Portas Lógicas). Além disso, vou criar aplicações utilizando tecnologias que não domino (mas tenho vontade de aprender como Three.js) e não somente aceitar o código, mas também ajustar e melhorar a qualidade do que foi gerado para entender o real potencial.

Ah, também quero ver como o v0 está funcionando (parece estar muito interessante).

Novamente o link para o repositório no Github: Game of Life.

Se você leu até aqui, meu muito obrigado :)
Deixe aqui sua crítica ou sugestão para próximos posts

.
Terabox Video Player