Do Not Be Misled by ‘Build an App in 5 Minutes’: In-Depth Practice with Cursor

  tr_cn        2024-12-17 21:30:22       15,149        0          English  简体中文  Tiếng Việt 

In August this year, I tried out Cursor and was thoroughly impressed, prompting me to write an introductory article about it. Soon after, I transitioned my daily work environment entirely from GitHub Copilot + JetBrains to the paid version of Cursor. After several months of use, it has felt incredibly smooth.

While using it myself, I’ve often recommended Cursor to colleagues and friends. However, many of them still have questions, such as:

  • What advantages does it have over native ChatGPT or Claude? Is Cursor’s power mainly because of Claude Sonnet 3.5?
  • How does it differ from GitHub Copilot? Why is it twice the price?
  • Is Cursor only suitable for quickly creating small demos from scratch?
  • Codeium recently launched Windsurf, which seems smoother based on some bloggers’ videos. Should I switch to that?
  • Is Coding Copilot only useful for beginners?
  • Amid the AI Copilot wave, how can we continue to improve our coding skills? Or will we eventually be fully replaced by agents?

These are common questions. I’ve found that the best way to address them is through live coding demonstrations. On Programmer’s Day(October 24), I gave an internal presentation at my company, showcasing the advantages and usage techniques of Cursor through hands-on demonstrations. However, since I used internal company code during that presentation, it’s not suitable for sharing directly.

In this article, I’ve slightly adjusted the content to share some of the appeal and practical insights of Cursor and AI coding copilots with a wider audience.

Introduction and Positioning of Cursor

Cursor is a company founded in 2022 by a group of young MIT students. At the time, GitHub Copilot already had a significant presence in the market. When Cursor’s product was initially launched, I gave it a brief try and found it rather basic—it seemed like little more than integrating the process of chatting with ChatGPT/Claude to generate code directly into VSCode. Nothing particularly groundbreaking.

However, its subsequent development exceeded almost everyone’s expectations. Let’s take a look at the market landscape back then:

  • For professional developers, GitHub Copilot had a clear advantage. It almost single-handedly validated the product-market fit (PMF) for coding copilots and achieved $100M in ARR. With both GitHub and VSCode under Microsoft’s umbrella, and OpenAI’s GPT-3.5 and Codex—the leading code models at the time—closely collaborating with Microsoft, GitHub Copilot had a formidable edge.
  • For non-programmers, products like ChatGPT, Claude, or Replit dominated the largest traffic entry points. For one-off tasks or demo projects, these tools were more than sufficient. There was no apparent advantage in moving these capabilities into VSCode.

So why did Cursor have the audacity to remodel Microsoft’s IDE and use OpenAI models, which were already tightly integrated with Microsoft, to compete with these major players?

After my own experience with Cursor and reviewing interviews with its founding team, it became clear that Cursor identified several sharp and distinctive entry points:

  • Cursor’s focus is clear: professional developers. They don’t aim to compete with tools like ChatGPT, v0, or Bolt. In fact, the visions behind Cursor and these tools might be fundamentally different (e.g., the debate over whether programmers will still exist in the future). If a user cannot distinguish the difference between these tools, they are likely not Cursor’s target audience.
  • Their key insight: coding is not just “completion,” but also “editing.” This means including both deletion and completion. While this might sound obvious now, at the time, all coding copilots only offered simple autocompletion. Even today, Cursor’s “Tab” experience stands out as unique, although Windsurf has started mimicking it.
  • Expanding the editing concept: Cursor extends this idea by generating code in the chat interface and then applying it to create edits across entire files or even multiple files using diffs. This workflow showcases their deep understanding of developers’ needs.
  • Rapid iteration versus big-company inertia: While large models like GPT have evolved from version 3 to 3.5 to 4, the user experience of GitHub Copilot hasn’t changed much. Big companies often face slower product iteration cycles, and the Cursor team realized they could move faster to explore and unleash the full potential of model advancements.

These strategies are worth learning from. By having a clear focus, deeply understanding developer workflows, and iterating rapidly, even a small team like Cursor has been able to challenge a giant like GitHub Copilot.

Cursor Workflow

As mentioned earlier, Cursor is positioned for professional developers. Let’s further clarify the scenarios where it adds the most value and how it differs from other tools:

  • Beneficial for Both Novice and Experienced Developers. Whether you’re a beginner or a seasoned programmer, Cursor can significantly enhance your workflow. Experienced developers, in particular, should not overlook the potential of this new paradigm due to overconfidence in their skills.
  • Optimized for Maintaining Existing Projects. Most professional developers spend the majority of their time maintaining and iterating on existing medium-to-large projects rather than creating new ones from scratch every day. Many online tutorials focusing on “building an app from scratch” fail to represent typical workflows and do not highlight the distinctions between Cursor and tools like Claude Canvas.
  • Current Model Limitations. Today’s models are not yet capable of completing an entire feature in a large project with just a few instructions. Over-reliance on chat-based development might lead to lower success rates. A better approach is to treat Cursor as a “pair programming copilot” rather than an “intern programmer.”

Cursor in Real-World Workflows

Let’s explore how Cursor’s features can enhance productivity in daily tasks:

Cursor Tab

Cursor Tab is currently its most distinctive feature. In essence, it predicts the next piece of code you’re likely to edit and automatically completes it for you. Let’s look at a few scenarios:

Scenario 1: Changing print to logger

On a sunny morning, you are working with your pair programming partner to modify some code. You might tell your partner that during prototype development, there were a lot of print statements in this file. Now that the project is ready for production, we should change them all to logger outputs. You might also need to make sure that different types of information are logged with appropriate logging levels.

You can certainly invoke the chat window in Cursor by pressing CMD + L type out the entire request, and wait for Cursor to generate the diff for the whole file. However, this request can also be implicitly expressed by writing code. For example, you could directly add the following in the file:

import logging

logger = logging.getLogger(__name__)

# existing code omitted...

Then, you just need to modify the first print statement, and your programming partner, Cursor, will understand your intent. From there, simply pressing tab, tab, tab, you’ll be amazed to find that Cursor “guesses” all the places you want to modify and intelligently sets the correct logging levels.

Notice how much faster this approach is compared to typing the entire request in the chat window. It’s probably quicker, and it skips the subsequent apply + review + accept steps. So often, it’s worth considering whether expressing some intentions through example code or simple comments might be faster.

Scenario 2: Adding Function Parameters

This is another common scenario. Instead of using natural language to describe, “I want to add a parameter to a function, explain its purpose, modify the places where the parameter is used, and update all the calls to this function,” you can often achieve the same result by directly editing the function. By simply writing the parameter into the function, Cursor can infer your intent.

For example, consider a use case from Cursor’s official website:

Example: Adding a dropout Parameter

You add the dropout parameter to the __init__ method of a class. Cursor will automatically:

  • Update all the places in the file where the parameter needs to be used.
  • Modify any other calls to LSTMModel across the codebase, adding the necessary initialization for dropout.

This capability allows Cursor Tab to handle many small refactoring tasks that IDEs alone cannot easily manage.

Difference from GitHub Copilot

The approach of expressing intent by editing code might feel familiar if you’ve used other completion tools like GitHub Copilot. Often, when Copilot’s suggestions aren’t accurate, you may find yourself:

  • Typing a few extra characters to guide Copilot in the right direction.
  • Deleting some code to make Copilot “forget” the context and regenerate suggestions.
  • Changing the cursor position to nudge Copilot to start completing from a different point.

Cursor Tab automates these manual adjustments, such as “deleting a bit of code” or “moving the cursor.” As a result, Cursor feels significantly more “intelligent” in terms of onboarding and usability compared to tools like GitHub Copilot.

This streamlined experience demonstrates Cursor’s understanding of developer workflows and its ability to simplify even nuanced tasks, enhancing productivity for professional developers.

Inline Chat

Using CMD + K in Cursor allows you to bring up an inline chat window at the cursor position or on selected code. Compared to the sidebar chat, inline chat offers two main advantages:

  • Context-Aware Editing. The inline chat inherently understands the context based on the cursor position or selected code, focusing specifically on editing tasks.
  • Parallel Processing. Multiple inline chat windows can be opened simultaneously, enabling you to work on several edits at once without waiting for one to complete before starting the next.

I personally prefer using inline chat for the following tasks:

  • Template-like code generation: For example, referring to other parts of the file to write a new API, DB operation, data model, etc. This type of low-entropy code generation is something Cursor handles very well, saving a lot of time.
  • Adding comments to selected code: After selecting a block of code, I can ask Cursor to add comments and check if there are any unclear parts.
  • Renaming functions/variables: After selecting a function or variable name, I ask Cursor to suggest a better name.
  • Writing complex command-line instructions in the terminal: I can also call Cursor to help me write complex commands, such as Docker, git, etc. So, maybe I no longer need Warp?

Example: Generating Commands in the Terminal

Chat

The standard sidebar chat is the most familiar format, often compared to products like ChatGPT or Claude. However, as a professional IDE, Cursor demonstrates significant advantages when working on existing projects, particularly in its ability to understand context. Let’s explore a few typical scenarios:

Scenario 1: Refactoring/Feature Modification

Imagine collaborating with your programming partner on a refactor, where changes in the model layer require corresponding modifications in files that call this model, including adjustments to complex control flow logic. If using ChatGPT, the workflow might look like this:

  1. Manually gather context, including model changes, the current file, and the instruction itself.
  2. Paste all this into ChatGPT.
  3. Wait for ChatGPT to generate new code, copy it back into the IDE.
  4. Use a diff tool to check for missing, incorrect, or excessive changes.
  5. If issues arise, repeat the process by copying error messages back to ChatGPT.

This process is cumbersome and error-prone. In Cursor, these pain points are addressed seamlessly:

  • Use @ to easily specify files, folders, or code definitions for Cursor to reference.
  • After generating the code, apply it with one click. Cursor directly updates the current file and presents a “pull request”-style diff for review.
  • If issues are found, ask follow-up questions to iterate further. To avoid “session contamination,” you can start a new session and reintroduce the necessary information.
  • Once changes are accepted, linting errors or test failures might occur. Instead of copying error messages manually, you can use AI Fix in Chat (for lint errors) or Debug with AI (in the terminal) to resolve them directly.

Example: Fixing Errors Automatically

In the example below, running mypy for code checks in the terminal reveals two errors. Simply click the Debug with AI button, and the errors are automatically sent to Cursor Chat. Cursor generates a code diff, and after applying the fix, everything works correctly. This significantly improves efficiency.

Scenario 2: Unit Test Generation

Whether you follow a TDD approach or write functionality first and add tests later, you can collaborate with Cursor to quickly construct test templates (including dependencies, mocks, etc.) and iterate to cover more scenarios.

Example: Generating Unit Tests

After generating unit tests, run them directly. If errors occur, combine this with the Debug with AI feature to quickly fix the issues.

Scenario 3: Performance Optimization

This is an example from the official website, where some Rust code is being optimized. In daily work, you can use chat to have Cursor quickly review an entire file and request checks and optimizations in areas such as performance, stability, and security.

Scenario 4: Integrating Web Searches

When debugging issues or learning new frameworks, tools like devv, phind, or Perplexity are often used in the coding domain. Similarly, you can use the @Web command in Cursor to perform web searches, retrieve comprehensive and up-to-date knowledge, and combine it with your codebase to provide more targeted solutions. For instance, you can have Cursor help migrate your project from Poetry to UV:

Web search integration

This shows how traditional scenarios requiring frequent web searches can be handled with Cursor, including environment configuration, dependency installation, and troubleshooting complex issues.

Additionally, there’s a similar feature called @Docs, particularly useful for popular libraries undergoing incompatible major version changes. For example, Pydantic 1.x has been widely used for a long time, and language models may have strong familiarity with it. However, if your project is using Pydantic 2.x, importing the URL of the updated documentation into Cursor becomes crucial to significantly enhance the accuracy of the generated code.

Built-in and imported documentation support

Scenario 5: Code Review

In earlier versions, this was a standalone tab, but in the new version, it seems to have been upgraded to Bug Finder, now charged based on usage. However, you can still use the @Git command in chat to have Cursor help review your code and identify potential bugs. To achieve better results, you may need to refine your prompts.

AI Code Review

Other Context Generation

In chat, the @ operator allows for very flexible control over the current chat context, which is quite similar to communicating with a real programmer. Apart from the features mentioned earlier, you can also:

  • @Recommended: Automatically recommend relevant context to bring in.
  • @Codebase: Import the entire codebase, useful for understanding the project’s code or finding specific implementations of features.
  • @Notepad: This feature is less commonly used but can be helpful for creating development plans or functional specifications that can be referenced later in specific code files.
  • @Lint errors: Automatically fix code issues detected by the LSP (Language Server Protocol).

This ability to control context with such flexibility reflects the Cursor team’s deep understanding of a programmer’s daily workflow and sets it apart from generic chatbots.

Additionally, it’s possible to upload design diagrams into chat for Cursor to process. However, since large models’ ability to reason with images is still somewhat limited, this feature is not yet as practical.

Composer

Many bloggers have recommended this feature, and I understand that it mainly extends the single-file editing in chat to multi-file editing and creation. In fact, before version 0.43, I used this feature quite infrequently because the current model capabilities made it challenging to accurately generate edits across multiple files in complex projects (feel free to provide examples if you disagree).

So, to put it simply, tasks with increasing complexity can generally be mapped to tab -> inline chat -> chat -> composer, forming a gradual progression.

Interestingly, with the launch of Windurf, it was realized that the composer’s agent workflow was perhaps too simplistic, leading to suboptimal results. Windurf’s Cascade, although it requires more time for “thinking,” often achieves better results with the same model. As a result, Cursor quickly introduced the composer’s agent mode in version 0.43.

Using composer to read open-source code

Now, Cursor integrates multi-step context retrieval, reading, executing commands (terminal), gathering feedback, and determining next steps, resembling a ReAct agent workflow. As we have already seen, Cursor embeds AI capabilities at various stages, and connecting these abilities through an agent is a natural evolution.

Earlier demonstrations also used the composer in non-code domains, such as storing personal knowledge in local markdown files like Obsidian and using the composer for “AI-driven search and Q&A.” However, in the new version, the composer seems to focus more on coding scenarios, as I couldn’t trigger document retrieval after several attempts. On the other hand, the @Codebase feature in chat can achieve this effect.

Other Tips

It’s also worth mentioning the cursorrules file, which can be thought of as a general knowledge document for the current project. It may include:

  • Guidelines for the project’s tech stack, such as specific framework versions.
  • Project-specific coding conventions, such as naming, comments, error handling, logging standards, and performance/security considerations.

You can find some project templates in cursor.directory, modify them, and use them for your own project.

AI-Assisted Programming Thinking

From the above introduction, we can see that Cursor already helps us with many low-entropy tasks in our daily work, such as:

  • Writing habitual patterns in various programming languages and frameworks; even for frameworks you’re not familiar with, Cursor can help you quickly get started.
  • Common coding styles and expressions in your project repository; the clearer your project structure and the more readable the code, the more this aspect will grow.
  • Tasks like running code, handling errors, searching, and trying fixes—Cursor can help increase efficiency in these repetitive tasks.

From the perspective of Flow Theory, on one hand, Cursor helps us complete low-difficulty “boring” typing tasks through auto-completion and chat. On the other hand, the rich knowledge from large models combined with deep context understanding of the codebase (via RAG) helps improve a programmer’s knowledge base, reducing the challenges and anxiety caused by unfamiliar technologies or code. Using Cursor feels like pairing with a virtual programming partner, allowing us to maintain focus and creativity.

To better leverage these tools for productivity in the AI era, our focus will shift more toward design and validation phases.

  • As a virtual programming partner, Cursor, like humans, needs to understand the code we write to provide better suggestions. So, in the AI era, the importance of writing clear and readable code has increased.
  • Well-organized code will make it easier to find the right context when using @ commands, and this becomes more apparent as you use Cursor more deeply. Principles like good naming and single responsibility are very helpful.
  • AI and human programmers have significant differences in cognitive patterns. If you’re involved in LLM-related applications, you may be more aware of how AI interprets code. For example, writing more cases and thought processes in comments, avoiding complex “multi-hop retrieval” logic, and occasionally asking AI how it understands a piece of code or asking it to perform tasks with your code can optimize its reasoning (similar to prompt optimization techniques).
  • As AI-generated code capabilities grow stronger and faster, efficiently reviewing and validating these outputs will soon become a bottleneck. On one hand, automated testing will become increasingly important. On the other hand, products like Cursor may start offering assistance in code reviews.

Of course, these are just my preliminary thoughts, and I welcome everyone to share ideas and engage in discussions.

Comparison of Other AI-Assisted Programming Products

Here’s a brief comparison of some other AI-assisted programming products:

  • OpenAI Canvas, Claude Artifacts: These are aimed at a broader audience and primarily target “one-off” code generation or MVP development. Unlike Cursor, they do not offer deep integration with an existing codebase context or adapt to complex IDE workflows.
  • GitHub Copilot, Codeium, Supermaven: These IDE plugin products still have a significant gap in completion experiences. Cursor Tab seems to be a specialized model, though the technical barriers may not be high, and it’s unclear why GitHub Copilot hasn’t followed suit. In terms of chat capabilities, GitHub Copilot lacks the flexible context control seen in Cursor.
  • “Agent” Products (e.g., devin, replit, bolt, v0): If the product is too general, it’s currently hard to achieve great results. Products focused on specific domains, such as frontend code generation, may perform slightly better but are mostly limited to small demo-level generation. This ties into broader speculations about the future of AI in programming—will programmers’ jobs eventually disappear?
  • Windsurf: The biggest issue with Windsurf is that its autocomplete is still quite limited, and since it’s relatively new, many features (such as Python LSP) and its stability are not as strong as Cursor. However, it’s more affordable and worth keeping an eye on.
  • Open-Source Alternatives to Cursor (e.g., aider, cline): These alternatives allow a “pay-as-you-go” model but generally lack the level of polish and refinement that Cursor offers.
  • JetBrains AI: Compared to VSCode, JetBrains still has many loyal users in the Java ecosystem, which has prevented many from switching to Cursor. However, market feedback for JetBrains AI seems poor, and even the GitHub Copilot plugin in JetBrains is less effective than in other environments.

Summary

As of December 2024, if you’re not interested in experimenting, Cursor is a great choice. Migrating from JetBrains should not be too difficult:

  • Search for and install recommended plugins for specific languages; VSCode performs well for frontend, Python, Rust, and Go support.
  • It’s best to re-learn the keyboard shortcuts, though you can also install the IntelliJ IDEA Keybindings plugin.
  • Double Shift global search is no longer available, so use CMD + P, CMD + T, SHIFT + CMD + F instead.
  • The graphical Git operations are somewhat weaker, but still sufficient for basic use.
  • The high configurability offers great flexibility, though there are some small quirks to work around.

For a more detailed guide on migration, you can check online resources specific to this transition.

Looking to the Future

From the perspective of Cursor, the future improvements can be considered from two key angles: the Agent framework and the programmer workflow. Although this article is already quite long, a few points worth summarizing include:

  • Voice Integration: If we think of Cursor as a virtual programming partner, integrating real-time voice input could be very interesting. This could allow for describing the code as it’s being generated, making the experience more natural and seamless.
  • Efficient Code Review: One important direction for improvement is how to review AI-generated code effectively. Current code review products have room for significant improvement, particularly in how review content is organized, which often feels rigid and inflexible.
  • Architectural Design Assistance: Could Cursor help at the architectural design level? The first step might be allowing Cursor to understand code in a more “hierarchical” manner, rather than just providing flat context.

The Future of the Programmer Profession: A question worth exploring is whether the role of programmers will change as AI becomes more capable.

  • Cursor clearly aims to be a “high-end tool” for professional programmers, believing that the programming profession will continue to exist long-term and not be completely replaced by AI. The barrier to using Cursor is relatively high, as it’s designed more for the current ways that programmers work.
  • In contrast, products like Devin, Magic.dev, and others seem to lean towards becoming more of a “universal coding agent” that could potentially replace programmers. Could the future be one where “everyone can develop their own applications,” or where “only product managers are needed”?

When I first tried MidJourney and Suno, I wondered whether everyone would become digital artists in the future. But quickly, I realized that I didn’t have the “creative impulse” for this kind of work. Even after seeing a lot of creations from others, I often couldn’t express what I wanted to create myself. In the end, I found that my need for AI-generated art was limited to creating a cover image when writing articles, and this feature will likely be integrated into many platforms for content creators in the future.

Similarly, my thoughts on the future of programmers are similar: code creation may be a more specialized skill compared to art, writing, music, or video, and fewer people may think about developing their own app. However, generating code for personalized vertical applications may become a feature included in other domain-specific products.

Note: The post is authorized by original author RandomGenerator to translate and publish on our site. Original post is in Chinese and located at https://mp.weixin.qq.com/s/JVb7-4a2XOFhfeJusaxvFg

ARTIFICIAL INTELLIGENCE  GUIDE  CURSOR  CODE EDITING  WINDSURF  DISCUSSION 

       

  RELATED


  0 COMMENT


No comment for this article.



  RANDOM FUN

Front end heavy product