Pair Programming with Cursor - Part 1

I’ve recently started using Cursor, an AI-powered fork of VS Code, along with Claude 3.5 (Sonnet) as my coding sidekick. It’s a pretty sweet upgrade from GitHub Copilot. The AI really gets code, and I think it’s going to change how we write software. Since it’s still improving, I figured I’d share my experience and some best practices in real time.

Cursor has this cool feature called Composer (⌘-i). It's an AI chat in a palette that can access your entire project. It can write changes across multiple files, suggest code, and even present you with diffs to accept or reject. When it’s working well, it feels like pair programming with a really fast (but not always perfect) dev buddy.

Rebuilding My Blog Site with Cursor

To put Cursor to the test, I decided to rebuild this very blog. It was a Django-based site I originally created back in 2011. It worked, but needed a glow-up. So, over one long weekend, I rebuilt it using Typescript, Next.js, and Composer. And let me tell you, Composer made things fly. I was honestly shocked at how quickly everything came together.

I started by setting up a Next.js Typescript project, using Prisma ORM, Tailwind CSS, and shadcn-ui for the components based on a recommendation from Twitter.

I wanted to migrate my database from MySQL to Postgres, and use Prisma instead of Django, so I had some manual work to do first. I exported my original database as JSON, and wrote a seed script for Prisma that imported everything. Then I set up a cloud psql database and imported all the data; using Prisma Studio I had a nice little admin to preview things.

Then, I switched into product manager mode and started describing features to Composer as if I were writing a Jira ticket. For example:

Create a header with a logo and home link on the left. On desktop, show nav links on the right for Blog and About. On mobile, replace the nav with a hamburger menu that opens a flyout. If you need inspiration, check out this site: [link].

Composer whipped up the basic structure in seconds. From there, I refined the design with a few more prompts. I spent some extra time adding custom animations, like bouncing balls in the header (because why not?) and a dark/light mode switch in the footer—both entirely created with natural language commands.

How This Accelerates Development

The real game-changer? Composer’s ability to remember everything, from documentation to style guides. It’s like having an instant recall of all the details you’d normally have to dig through Stack Overflow for.

Take Tailwind CSS, for example. Composer knows every single class and can apply them with precision. No more googling to remember the exact utility class—you just describe what you want, and it gets to work. Same goes for Typescript. Type safety becomes a breeze when your AI partner never forgets what types you’re working with. In fact, the little things that create overhead when developing new products with Typescript start to disappear, because Cursor doesn’t forget those details as it goes along.

Composer in Action

Here’s how to get the most out of Composer:

1. Prompt it with details. You can reference files, repos, or docs to give it context.
2. Let it do its thing. Review the changes. If it looks good, hit “Save All.” Test it out and refine if needed. If it totally misses the mark, hit “Reject All” and try again.
3. Check the diffs. Once you’re happy, click “Accept All” to finalize the changes.

Where Composer Saved Me Big Time

• Search functions for the blog and admin.
• Sidebar components like “Recent Posts” and “Popular Posts.”
• Paginated blog posts.
• Generating an RSS feed.
• Loading skeletons (which Composer did better than I could).
• Password-protected admin system, with login and reset password flows.
• Admin pages for creating and editing posts, complete with an S3 image uploader and live Markdown preview.

Normally, these features would take a decent chunk of time. Composer? Knocked them out in minutes. It was like magic—just typing out what I wanted, and boom, done.

Areas Where Composer Fumbled

Of course, it’s not all rainbows. Composer had a few hiccups:

1. Forgetting the site theme. I had to remind it about dark/light mode constantly.
2. Reinventing the wheel. Sometimes it would write new code instead of using existing components.
3. Sticky sidebar trouble. Implementing the sticky sidebars resulted in several failed attempts, and I had to step in manually. I don't think the LLM can "see" something like a scrolling effect in action.
4. Unwanted changes. Occasionally, it would mess up things that were working fine in previous iterations. Keep an eye on the diffs!

These issues feel like growing pains, and I’m optimistic they’ll get ironed out with time.

What’s Next?

My next big project with Cursor will be re-writing the seller portal for my startup, Quiltster. It’s been on my to-do list forever, but with Composer as my pair programmer, I think it’s finally time to tackle it. Stay tuned—I’ll be documenting that journey too!

Let me know what you think!