Sitemap
Sachin Patel

Sachin Patel

Senior Software Engineer | Frontend specialist | Building scalable web apps & optimizing UX | Sharing insights on modern web technologies. More: sachinp.com

Level Up Your Coding Workflow with Cursor: A Developer’s Guide to AI Coding Assistants

5 min readApr 10, 2025

--

Press enter or click to view image in full size
Photo by Remy_Loz on Unsplash

Whether you’re enhancing current features, working with legacy files, refactoring spaghetti code, or simply trying to improve code quality, AI can act as a powerful assistant — but only if you know how to guide it well.

AI-powered code editors are reshaping the way developers write, refactor, and understand code. While many demos highlight how AI can spin up entire projects from scratch, this post takes a more practical, real-life perspective: how to use AI effectively within an existing codebase.

This isn’t an in-depth tutorial or theoretical guide. Instead, it’s a collection of quick, actionable tips based on my real-world usage of Cursor IDE over the past few months. If you’re just getting started with AI coding tools, these learnings will help you get more value out of the experience and integrate AI smoothly into your development workflow.

1. Building New Components (The Smart Way)

When working in a mature or large codebase, adding new components is part of everyday life. AI can significantly reduce the time required — if you give it the right instructions.

A. Break down the requirement into small, manageable tasks

Don’t dump the entire feature description in one go. Instead, isolate smaller responsibilities like layout, state management, logic, and API integration.

For example:

  • First prompt: “Create the base JSX layout for a product grid with dummy data.”
  • Follow-up: “Add filtering logic based on selected categories.”
  • Then: “Integrate this with the fetchProducts API and handle loading/error states.”

Why this helps: When you chunk things down, AI understands context better and delivers results that are easier to validate. You also avoid bloated or irrelevant output.

B. Use clear, precise prompts with well-defined expectations

AI performs best when you give it all the context upfront: component name, expected props, how it should behave, and how it should look.

Example prompt:

“Create a React component named ProductGrid that takes in a list of products and available categories as props. Render a grid of products and display a dropdown filter to filter by category."

C. Iterate with follow-up prompts

Once AI returns something useful, keep building on it:

  • “Add skeleton loading and an error message.”
  • “Make the layout responsive on mobile screens.”
  • “Add accessibility attributes for screen readers.”
  • “Convert this to TypeScript with proper types.”

Think of the AI like a junior developer: give it small tasks, review its output, and guide it to the finish line.

2. Working with Existing Code

Let’s face it — most developers spend far more time maintaining and updating existing code than writing fresh features. AI can be your best friend in this space if you scope it correctly.

A. Adding new logic or functions

If the new logic is independent, you can prompt AI directly.

Example prompt:

“Write a helper function that takes a price number and returns a formatted currency string. It should return a fallback message for invalid input.”

B. Modifying existing methods

This is where things get tricky. Broad prompts can confuse the model and lead to unintended changes.

Get Sachin Patel’s stories in your inbox

Join Medium for free to get updates from this writer.

Poor prompt:

“Update handleSubmit to include validations.”

Better prompt:

“Within handleSubmit, add a condition to validate that the email ends with ‘.org’. If not, set an error message and prevent form submission.”

By narrowing the focus, you reduce the chances of AI altering unrelated logic.

C. Refactor large files one step at a time

Instead of feeding AI an entire file:

  • Highlight a single function or block
  • Prompt: “Refactor this function to improve readability and add inline comments.”
  • Follow-up: “Split this into two smaller pure functions.”
  • Follow-up: “Move the API call into a separate utility module.”

Why this works:

  • Reduces confusion for AI and you
  • Easier to track and test changes
  • Keeps your code stable while improving it incrementally

3. Enhancing & Refactoring Code

Some of the most immediate value from AI comes from helping you polish existing code — making it cleaner, faster, and easier to understand.

A. Optimize for performance or readability

  • “Refactor to use early returns to avoid deep nesting.”
  • “Extract the date formatting logic into a utility.”
  • “Rewrite this callback using async/await.”

B. Improve code documentation

  • “Add inline comments to explain the logic in this useEffect.”
  • “Generate a short summary for this file that I can include in the README.”

C. Improve naming conventions

  • “Suggest more descriptive names for these variables and functions based on their purpose.”

4. Chat With AI Like a Design Partner

AI isn’t just a code writer. It’s an idea generator, rubber duck, and architectural sounding board — if you treat it that way.

A. Use it to brainstorm solutions

“Should I debounce search input using useEffect, a custom hook, or lodash.debounce?”

AI will often give you a helpful breakdown:

  • Pros and cons of each approach
  • When to use useCallback or useMemo
  • Code snippets and common pitfalls

B. Explore architecture and trade-offs

“Should I use Redux or Context API for global state in a mid-sized React app?” “Should I do client-side filtering or call the API on each filter change?”

C. Break down work like a product manager

“I need to build a multi-step form. What are the logical steps to implement it in React?”

D. Explore better ways to improve old code

“Is there a cleaner pattern for handling async form submission with loading states?”

You’re not just solving problems — you’re learning, improving, and designing smarter.

Prompting Cheatsheet

Here’s a quick reference guide to help you prompt more effectively:

Generate new code:
Include structure, input/output expectations, and purpose.

Refactor/optimize:
Be specific: “Make this more readable”, “Remove unnecessary nesting”, “Extract side effects.”

Understand code:
Ask: “What does this hook do?”, “Explain this function step by step.”

Improve naming:
“Suggest more expressive identifiers for these variables.”

Explore design:
“What’s a more modern or testable way to approach this?”

🚫 Bad Prompt:

“Do this for me.”

✅ Good Prompt:

“Write a custom React hook that handles fetch requests with loading and error states.”

Want to sharpen your prompting skills? Try this free prompt engineering course which helped me articulate prompts.

Summary

Using AI in your code editor isn’t about replacing developers — it’s about amplifying your productivity. With clear communication, tight scope, and thoughtful iteration, you can:

  • Ship features faster
  • Improve readability and maintainability
  • Onboard new teammates more efficiently
  • Learn and grow through real-time collaboration

Treat AI like a trusted pair programmer — one that helps you brainstorm, write, review, and refactor code. Once you develop that habit, it becomes a seamless part of your development flow.

The future of coding isn’t solo — it’s collaborative, and AI is right there with you on the journey.

--

--