My WebStorm Configuration (2019)

Thoughts from 30^th April 2019

I like to refresh the configuration of my IDE every other year or so, and thought this year I’d write it down for anyone interested - and for me to check next time! These are the interesting parts of my configuration for WebStorm, the IDE I use for 95% of my day-to-day programming work. (The other 5% being Sublime Text, which I use for quick scripts and text manipulation.)

Plugins

.env files support

Adds syntax highlighting for .env files

.ignore

Adds syntax & file highlighting for .gitignore files, and others

Bash Support

Adds syntax highlighting for .sh files

Extra Actions

Adds the ability to split the current selection into multiple lines, with one cursor per line

Key Promoter X

Adds reminder popups when clicking functions that you can keybind

Makefile support

Adds syntax highlighting for Makefile files

nginx Support

Adds syntax highlighting for nginx configuration files

Quokka

Adds scratch files that can be run directly in the IDE, with inline output of variable state

String Manipulation

Adds the ability to change strings quickly, for example snake_case to camelCase

Toml

Adds syntax highlighting for .toml files

UUID Generator

Adds the ability to generate a UUID v4 with a keybind

Keybinds

These are the keybinds that I use most often or find the most useful while writing code, ignoring very basic, well known keybinds like CTRL C. Some of them are the default, some of them are customized for my preferences.

Moving around files

SHIFT SHIFT

Search anything (classes, files, symbols, actions).

CTRL TAB

Switch between open files and tool panels

CTRL E

View recently used files

CTRL SHIFT E

View recently changed files

CTRL B

Go to definition (for example where a function is declared)

CTRL H

Find in path

CTRL SHIFT H

Replace in path

Moving around in the code

CTRL W

Expand selection (word, statement, block, method)

CTRL SHIFT W

Shrink selection

CTRL G

Go to line number

F2

Go to next IDE warning

SHIFT ENTER

Start new line after current line

SHIFT ALT ENTER

Start new line before current line

CTRL SHIFT L

Split selection into lines (multi-cursor like Sublime Text, from Extra Actions plugin)

CTRL F

Open "find" panel for current file

CTRL L

Find next occurrence

CTRL ALT L

Find previous occurrence

CTRL D

Select next occurrence

CTRL SHIFT D

Select all occurrences

CTRL SHIFT +

Expand all collapsed code folds

Writing code

ALT ENTER

Show IDE intentions (help fix the code automatically, for example missing imports)

CTRL SHIFT C

Comment selected lines with a line-comment

CTRL R

"Refactor this" dialogue

CTRL ALT R

Rename (variable, method, class, file)

CTRL ALT F

Reformat with Prettier (from Prettier plugin)

CTRL ALT V

Extract variable from selection

CTRL ALT C

Extract constant from selection

CTRL ALT M

Extract method from selection

CTRL ALT I

Inline selection (move the implementation of a variable into the spots where the variable was used)

CTRL ALT S

"String Manipulation" dialogue (from String Manipulation plugin)

CTRL ALT J

Join lines (merges all selected lines into one)

CTRL SHIFT V

Paste from history

F9

Sort lines (from String Manipulation plugin)

CTRL SHIFT A

Add selected files or folders to version control

CTRL SHIFT G

Open version control "commit" dialogue for selected files or folders

Open & close panels

ALT 1

Toggle "Project" panel

ALT 2

Toggle "Version Control" panel

Miscellaneous

CTRL Space

Open code completion (in case it closed while typing)

CTRL SHIFT S

Synchronize file (force refresh from disk)

CTRL ALT 1

Generate a random UUID (from UUID Generator plugin)

CTRL ALT D

Open selection on devdocs.io