Intelligent coding assistance

WebStorm helps you write great code. Its intelligent editor with code completion, on-the-fly code analysis, code formatting and refactorings enhances your productivity and takes your development experience to a whole new level.

Supported languages and frameworks

WebStorm brings you first-class coding assistance for JavaScript, ECMAScript 6, TypeScript, CoffeeScript, Dart, and Flow.

It helps you write HTML, CSS, Less, Sass and Stylus code.

On top of all that, you can benefit from advanced support for Node.js and popular frameworks such as React, Angular, Vue.js, Meteor, and more.

AngularJS

WebStorm takes code completion for AngularJS apps to the next level as well. Get coding suggestions for default and custom directives, controller and app names, and code insights for data bindings.

Multiple carets and selections

WebStorm, too, has everyone’s favorite multiple carets and selections. Edit several locations in your file at the same time, and even have code completion and live templates working for that. Select the locations to edit with Alt+Click. Or, select the occurrences of the current word and edit them all at the same time.

Live edit

Live Edit allows you to see page content updates in the browser (Google Chrome only) immediately, without reloading, with the changes you make in your HTML and CSS files. It works as part of the JavaScript debug session.

Code completion

WebStorm analyzes your project to provide the best code completion results for all methods, functions, modules, variables, and classes defined in your application. Сoding assistance is context-aware and can also be framework-specific.

When working with CSS, enjoy code completion for properties and their values. In Less and Sass, get assistance for mixins. And, of course, in HTML you can get code completion for all tags and attributes.

Emmet

In WebStorm you can use the full power of Emmet abbreviations to raise your productivity. Type an abbreviation in HTML, then hit Tab to expand it into the markup. Emmet also works in CSS and JSX.

Navigation

With WebStorm’s powerful navigation features, get around your code efficiently and save time when working with large projects.

For any method, function or variable in your code, jump to its definition with a simple Ctrl+Click, or search for its usages.

Search through the whole project for a symbol, file or class name, by using the Search everywhere dialog (Double Shift).

Structure view can help you navigate through a currently opened file with ease.

Code quality analysis

WebStorm has hundreds of built-in inspections covering all the supported languages. In addition to that you can use ESLint, TSLint, Stylelint, JSCS, JSHint and JSLint.

All errors and warnings are reported right in the editor as you type, with many quick-fix options available.

Any line of code with a possible issue is marked in the right-hand editor gutter, so you can easily spot errors and warnings in a long file.

You can also run code quality analysis for the whole project and automatically apply selected quick-fixes.

Code style

Use a consistent code style, by having WebStorm automatically apply the configured code style as you write code, or by reformatting whole files at once.

Configure your code style for any language, including indents, spaces, aligning rules, and so forth. Save the code style scheme in the project settings and, if you want, share it with your teammates via VCS.

EditorConfig

WebStorm automatically applies the code style specified in the .editorconfig project file.