Hey people!
I've been using Cursor AI IDE for about 2 months, every day, for both work and hobby coding and I feel I can share some great tips about it
First of all, if you're not familiar with Cursor or AI in Web Development in general, I highly suggest watching the videos below:
AI tools for software engineers, but without the hype – with Simon Willison (Co-Creator of Django) (must watch/listen)
https://www.youtube.com/watch?v=uRuLgar5XZw
General Cursor Usage: Cursor AI Tutorial for Beginners (How I Code 159% Faster) (2 months old. It is not that old yet, but it might be
worth looking for a more recent one)
https://youtu.be/yk9lXobJ95E
Using it with PRD and documentation: Best Cursor Workflow that no one talks about... (no need to watch everything; the first 18 min
are enough to get the idea)
https://www.youtube.com/watch?v=2PjmPU07KNs
Effective Code Review: Getting Cursor AI to Review Its Own Code
https://www.youtube.com/watch?v=vOlAniUTlCY
Cursor + Playwright: How to Build Robust Applications with Cursor AI + Playwright
https://www.youtube.com/watch?v=kH4hM0H_WPg
Podcast with the Cursor Team: Cursor Team: Future of Programming with AI | Lex Fridman Podcast #447
https://www.youtube.com/watch?v=oFfVt3S51T4
.cursorrules
Use a .cursorrules file in the root directory of your project to automatically use its content as context for all Cursor prompts.
It is shared for everyone and subject to git versioning.
Great to guide the AI to code like you’d do
Great to remind the AI about outdated things (like 'use client' on top of client-side files in Nextjs)
Use https://cursor.directory/ to get some sample usage.
The Composer
The Composer feature helps you create and edit multiple files simultaneously, making saving, testing and validating changes easy.
Easy Testing: Save all changes without individually applying changes to them
Creating Tests Together: Develop code and corresponding tests or Storybook components side by side.
Possible use case: It could be useful to add an extra simple/easy API payload field by adding all related files in the context.
Passing React Props: Pass props down through related components easily.
There are three ways to view the composer panel: Expanded, Floating, and Side Bar. I’m sticking with the third one currently.
Tip: Open all related files in your editor. In the Chat or Composer input, press / and select "Reference Open Editors" to include them in the context.
Golden tip: open all related files and add them at once to the context
Leveraging Markdown Files for Context
Include markdown files as instructions to provide the AI with project context.
Enhanced Understanding: Helps the AI grasp the specifics of your project.
Detailed Guidance: Offers more information than usual for better assistance.
Tip: Mention these instruction files in your prompts to incorporate their content.
Watch the start of this video to get a better understanding: https://youtu.be/2PjmPU07KNs
Keeping a Clean Working Directory
Always keep your working directory free of uncommitted changes.
Easy Reversion: Revert unwanted AI changes easily.
Manageable Commits: Make small, focused commits.
Linking to Documentation
Add links to library documentation in your prompts to guide the AI.
Up-to-Date Implementations: Ensures the AI uses the latest methods.
Avoid Deprecated Code: Prevents outdated implementations.
Tip: Include documentation links in your prompts.
Example: "Refer to Library X Documentation to implement the new feature."
Press @ do add a new documentation. We can even share them with the team
Using Voice-to-Text Tools and Chatbots
Utilize tools like Wispr Flow and ChatGPT to streamline your workflow.
Wispr Flow: Transcribes voice to text for faster prompt creation.
ChatGPT: Generates documentation without extensive typing.
Complex Prompts: Provides detailed context for better AI responses.
Tip: Combine voice transcription with chatbots to create and refine prompts efficiently.
Models
Use claude-3.5-sonnet for everything. Sometimes, o1-mini is more helpful when the task involves more thinking. The o1-preview model is pretty expensive in Cursor ($0.40/request), and using it on the ChatGPT Plus website is worthwhile.
(TODO: This is a published draft version of this blog post, I still want to format it better and add images)
Top comments (0)