Home > Web Front-end > JS Tutorial > My first experience with Cursor + Claude Sonnet

My first experience with Cursor + Claude Sonnet

WBOY
Release: 2024-09-03 17:04:01
Original
1247 people have browsed it

My first experience using Cursor as an IDE and Claude 3.5 Sonnet to develop software

Minha primeira experiência com Cursor + Claude Sonnet

I believe that by now you have heard of, or at least seen something related to Cursor. If not, here is a brief description of what it is, according to its own documentation:

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

In summary, Cursor is an IDE that has integration and functionalities directly linked to the use of AI for software development.

That said, let's look at my experience :)

I leave here the link to the repository: Game of Life

My background

So that you have a closer understanding of my experience, I will leave here some information that may be relevant to the result and my final considerations:

  • I'm a software developer, more specifically Front-end with 5 years of experience
  • I have a degree in Computer Science
  • I had never used any IDE-level extension other than Github Copilot that involved AI
  • Yes, I use ChatGPT in my daily life (I have several points about this, but that's for a next post)

Like every experience, we need to define rules:

I am REQUIRED to accept AI-generated code suggestions
Use English as a language of communication
I cannot change the code in order to find solutions to bugs and/or improve the quality of what was generated
Objective
To test everything that has been pointed out, the objective is to implement an interactive version of Jhon Cornway's "Game of Life" using Angular 17 (yes, the version is relevant to the content of this article)

Game of Life

The game of life is a cellular Automaton, which has some defined rules:

  • A living cell with 2 or 3 living neighbors remains alive.
  • A living cell with less than 2 living neighbors dies.
  • A living cell with more than 3 living neighbors dies.
  • A dead cell with exactly 3 living neighbors becomes alive.

Minha primeira experiência com Cursor + Claude Sonnet

Prompts

As previously stated, the language used was English for the entire interaction and the commands were given directly and clearly, such as:

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

Important: I decided to write this article a little after the test and I lost the history with the commands and the results, so I can't put 100% of what I wrote and that explains the absence of the result of each command. However, I will do a follow-up with the next steps and evolution of this project.

For each code generation, I accepted everything, ran it and asked for corrections such as layout adjustment, margin, bugs, etc.

Code quality

I can't say that the code is perfect, but I can say with ease that readable and understandable code was generated at all times, so that if necessary I would be able to intervene and correct/improve something that was generated.

Bugs/Problems

Just like us flesh-and-blood programmers, AIs also generate bugs, and my first contact was no different. I had a lot of problems with the positioning of elements in the layout (such as the statistics and visibility of the buttons), some problems with the colors of the grid and the main one: the pattern detection system doesn't work (but it is listed as next steps).

Even with the problems, the generated code was reliable and solved what was requested, requiring some adjustments here and there. It is worth highlighting that the rules of the Game of Life were all implemented without any problems or need for adjustment.

Time

I believe I spent less than 1h30m on the entire project, taking into account that I was still getting used to the shortcuts and testing some ways of carrying out the prompts. And although it's not a very complex project, I would need at least 2x that time (being optimistic) to implement it in the same way.

Positive points

  • Fast code generation
  • The flexibility of adding context to each command makes it much easier to fix bugs, create functions and look for problems you might not have known were there
  • Code that works :)
  • IDE based on VSCode, so I could simply import everything I use in my day-to-day life

Negative points

  • It is still difficult to solve some problems (mainly related to layout)
  • Although the code is functional, some implementations leave a little to be desired

Conclusion

I am very surprised and very satisfied with the quality of everything that was produced and I believe that I can benefit a lot from this on a daily basis for manual and repetitive work such as generating tests, fixing simple bugs, creating MVP's and concepts simple, so I still need to make adjustments so that the quality of the code pleases me.

Next Steps

Now that the first prototype has been made, the next steps will be to create new features for this project (I really want to fix Pattern detection and add some pre-implemented patterns like Logic Gates). Furthermore, I will create applications using technologies that I do not master (but I want to learn like Three.js) and not only accept the code, but also adjust and improve the quality of what was generated to understand the real potential.

Ah, I also want to see how v0 is working (it looks very interesting).

Again the link to the repository on Github: Game of Life.

If you've read this far, thank you very much :)
Leave your review or suggestion for future posts here

The above is the detailed content of My first experience with Cursor + Claude Sonnet. For more information, please follow other related articles on the PHP Chinese website!

source:dev.to
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template