3 VSCode refactoring shortcuts

I figured I'd share a few tricks I use in VSCode to make the (sometimes monotonous) process a little easier

3 VSCode refactoring shortcuts

While refactoring some code today, I figured I'd share a few tricks I use in VSCode to make the (sometimes monotonous) process a little easier.

1. The VSCode React Refactor extension. I'm sure there are equivalents for Vue and other frameworks. It allows you to highlight a block of code a quickly wrap it in a function, and move it to a new location in the current file.

2. Native VSCode refactoring. After highlighting a function, you can right-click and select Refactor, (control+shift+R) which will give you a few options to move the code to a new file, or somewhere else. Builds upon the previous technique nicely.

3. A simple but powerful one, control-click to select multiple files. Useful if you refactored several functions into new files, and want to move them into a new directory entirely.

If you'd like to see it all in action, check out this short video detailing the whole process.

I encourage you to put the video on 1.5x playback speed. 😅

Cheers. 🍻