Bite-size video tutorials for badass web developers.

egghead

**Note:** This course is being actively developed and more lessons will be added in the future.

Cursor is an AI-enhnaced code editor that allows you to call upon the robots to refactor or stub out functions for you with natural language. 

In this course, John will show you workflows that will save you time and effort by utilizing the features such as its mult-line editing and context.

In particular, by giving Cursor's AI the proper context, whether that's lines of code or multiple files, you'll get better output when trying to extend or refactor logic that's present.


Cursor's Composer feature lets us input multiple files as context for us to run commands on. In this lesson we'll give Cursor a handful of theme files that we've created to have it create more popular themes for us. You'll see that it generates popular themes such as `monokai` and `solarized-light`

Create Variations of CSS Themes with Cursor's Composer

When you ask an AI to refactor or write a function for you it will have limited knowledge of what data you are using. 

By providing it some expected input to a function you want it to write or refactor, it will do a much better job at writing code that gets the job done. Of course you will still want to verify that your code works as you expect.

Produce Better Refactored Code with AI by Providing Mock Data as Input

Another great use-case for Cusor Composer is to handle creating new API that is similar to previous functions that you've already written.

In this lesson we'll give composer context of two of our files and a line of code to extract logic into an API for our application to use.

Prompt Cursor to Create New Function API with Composer Context

Cursor Tab can help with your entire workflow from generating logic that you describe, updating existing code and fixing errors with AI, as well as extracting duplicate logic into a utils function.

Streamline Adding and Refactoring Code with Cursor Tab

Repetitive tasks are a prime example of problems AI can help you solve efficiently. We'll look at a file that has several function calls (`measurePerformance`) that we could use a macro or regex to remove. Instead, we'll use Cursor composer to write the regex and make sure it handles all the cases we want.

Remove Repetitive Code Structures Across an Entire File with Cursor Composer

When you're in the terminal and know what you want to do but don't quite know how to get it done, Cursor can help you.

Here we'll demo to complex git commands that I would normally have to research and look up flags for but by articulating what I want to cursor, it writes the command for me. 

For example, I want to get all the files staged for commit and sort them by number of lines affected. Within seconds, Cursor will generate:

`git diff --cached --numstat | sort -rn`

Generate and Execute Complex Git Commands with Cursor Composer in the Terminal

I have a function that I want to benchmark. I could write this logic out but it's time consuming and something I know Cursor could handle well. We'll have cursor write the benchmark logic for us then tweak it to get output that we can work with when we need to optimize our code.

I'll also use Cursors chat function to verify there aren't any edge cases that are missed in this initial pass.

Generate Logic for Benchmarking a Function with Cursor Composer

If you have the idea of what you want to build but don't the language you need to build in, Cursor can help. This is a show-case of how I went from an empty Swift project to a fully functional window centering tool in about 15 minutes without any prior knowledge of Swift. 

I described the tool I wanted Cursor to build and then followed up with the errors that were encountered until Cursor solved all these errors. 

Build Tools in Languages You Don't Know with Cursor

Produce Better Refactored Code with AI by Giving Mock Data

Streamline Adding and Refactoring Code with Cursor Copilot++

Composing Closures and Callbacks in JavaScript

Learn everything you need to know to take advantage of signals and be prepared for signal-based components

Productive Developer Workflows with AI Enhanced Cursor IDE

John Lindquist

You might also like these resources:

Composing Closures and Callbacks in JavaScript

Modernize State Management in Angular with Signals

Course Content

You might also like these resources:

Composing Closures and Callbacks in JavaScript

Modernize State Management in Angular with Signals