Webstorm: это что и зачем?


Web Technologies

All the new features and improvements of WebStorm 2020.2 are available in PhpStorm 2020.2, either out of the box or with free plugins available in the plugin repository.

Prettier as the default formatter in JavaScript projects

Want to use Prettier instead of the built-in formatter to tidy up your code? With this update, it has become even easier than before. Just tick the new On code reformat checkbox and the IDE will use Prettier whenever you reformat your .js, .ts, .jsx, and .tsx files. Other file types can be easily added, too.

Best-in-class Vue.js support

Nuxt.js support, Vue-specific code style settings, improvements around Vue in TypeScript projects, and a lot of other things were added in the past year. Vue support in PhpStorm has never been so advanced!

Silent installation on Windows

Silent installation is performed without any user interface. It can be used by network administrators to install WebStorm on a number of machines and avoid interrupting other users.

To perform silent install, run the installer with the following switches:

  • : Enable silent install

  • : Specify the path to the

  • : Specify the path to the installation directory

    This parameter must be the last in the command line and it should not contain any quotes even if the path contains blank spaces.

For example:

WebStorm.exe /S /CONFIG=d:\temp\silent.config /D=d:\IDE\WebStorm

To check for issues during the installation process, add the switch with the log file path and name between the and parameters. The installer will generate the specified log file. For example:

WebStorm-*.exe /S /CONFIG=d:\temp\silent.config /LOG=d:\JetBrains\WebStorm\install.log /D=d:\IDE\WebStorm

Debugging, Testing and Profiling

PhpStorm provides powerful built-in tools for debugging, testing and profiling your applications.


Zero-configuration debugging makes it really easy to debug your PHP applications. Besides, PhpStorm provides numerous options for debugging your PHP code with Visual Debugger, so you can: inspect variables and user-defined watches, set breakpoints and evaluate an expression in runtime, debug remote applications, debug a page in multiple sessions simultaneously, and more.


You can develop PHPUnit tests right in PhpStorm and run them instantly from a directory, file or class, by using the context menu options. Code Coverage from PHPUnit shows how much of your code is covered with tests.

Умная помощь при написании кода

PhpStorm — это среда разработки, которая по-настоящему понимает ваш код. IDE обеспечивает первоклассную поддержку PHP 5.3/5.4/5.5/5.6/7.0/7.1/7.2, мгновенно предотвращает ошибки, предоставляет точное автодополнение и безопасные рефакторинги, а также возможность редактирования кода на HTML, CSS и JavaScript.

Умный редактор PHP-кода

IDE обеспечивает умное автодополнение, подсветку синтаксиса, расширенные настройки форматирования, проверку ошибок на лету, сворачивание фрагментов кода, поддержку языковых комбинаций и много других возможностей для продуктивной разработки. Автоматические рефакторинги позаботятся о порядке в вашем коде и помогут легко и безопасно выполнять глобальные настройки проекта.

Анализ качества кода

Сотни встроенных инспекций проверяют код прямо в режиме редактирования, а также позволяют проанализировать весь проект на наличие ошибок и проблем в структуре кода. Для большинства инспекций доступны быстрые исправления, которые позволяют откорректировать код мгновенно. Нажмите Alt+Enter, чтобы просмотреть список возможных исправлений для любой инспекции.

HTML/CSS/JavaScript Editor

PhpStorm includes all the features of WebStorm related to HTML, CSS and JavaScript.

HTML and CSS Editor

All the cutting edge web development technologies are supported including HTML 5, CSS, SASS,SCSS, LESS, CoffeeScript, ECMAScript Harmony, Jade templates, etc. Live Edit gives you an opportunity to see all the changes instantly in the browser without refreshing the page.

JavaScript Editor

The smartest JavaScript Editor is bundled with the IDE, offering code completion, validation and quick fixes, refactorings, JSDoc type annotations support, JavaScript debugging and unit testing, support for JavaScript Frameworks, and more.

New Technologies

PhpStorm provides a streamlined experience for the full development cycle with new languages such as TypeScript, CoffeeScript, and Dart.

Template settings and contents

Item Description
Name This field appears when a new template is created. Specify the name of the new template.
Extension In this field, specify the extension. WebStorm will apply this template when new files of this type are created.
Template text

Edit the template contents. You can use:

  • Plain text.

  • directives to work with template includes.

  • Custom variables. Variables’ names can be defined either directly in the template through the directive or during the file creation.

    Note that WebStorm doesn’t prompt for the values of Velocity variables defined with .

  • Variables to be expanded into corresponding values in the format.

    The following predefined variables can be used in file templates:

    Variable Description
    Current system date
    Current day of the month
    Dollar sign . This variable is used to escape the dollar character, so that it is not treated as a prefix of a template variable.
    Current hour
    Current minute
    Current month
    Full name of the current month (January, February, and so on)
    First three letters of the current month name (Jan, Feb, and so on)
    Name of the new entity (file, class, interface, and so on)
    Name of your organization specified in the project settings (Ctrl+Alt+Shift+S)
    Name of the IDE (for example, WebStorm)
    Name of the current project
    Current system time
    Login name of the current user
    Current year

    Treating dollar sign

    • You can prevent treating dollar characters in template variables as prefixes. If you need a dollar character ( inserted as is, use the file template variable instead. When the template is applied, this variable evaluates to a plain dollar character .


      • To use some version control keywords (such as , , and so on) in your default class template, write instead of the dollar prefix .

      • The template code will be rendered as .

Reformat according to style

Select this checkbox, to have WebStorm reformat generated stub files according to the style defined on the Code Style page.

This option is only available in the Files tab.

Enable Live Templates

Select this checkbox to use a live template inside a file template. In doing so, one has to put the live template fragments into Velocity escape syntax.

For example:

Thus, one can specify the cursor position. Note that it is required to use the live template variables here!


This read-only field provides information about the template, its predefined variables, and the way they work.

This field is not available in custom templates.

Running and debugging a React application

The recommended way to start building a new React single page application is Create React App. Only in this case your development environment is preconfigured to use webpack and Babel. Otherwise, you need to first.

For applications created with Create React App , WebStorm generates two run/debug configurations with default settings:

  • An npm configuration with the default name npm start. This configuration runs the command that launches the development server and starts your application in the development mode.

  • A JavaScript Debug configuration with the default name Debug Application. This configuration launches a debugging session.

Отладка, трассировка и тестирование

WebStorm имеет встроенные инструменты для отладки, трассировки и тестирования клиентских и Node.js-приложений. Продуманная интеграция позволяет решать эти задачи намного проще и без сложной настройки.


В WebStorm встроен инструмент для отладки клиентского кода (работает в браузере Chrome) и приложений на Node.js. Прямо в IDE можно ставить точки останова, осуществлять пошаговое выполнение кода и проверять переменные.


Тестировать приложения с помощью WebStorm проще, так как IDE интегрируется с Karma, Mocha, Jest и Protractor. Запускайте и отлаживайте тесты прямо в IDE, просматривайте результаты в удобном формате и легко переходите к тестируемому коду.

Трассировка и профилирование

Встроенный инструмент spy-js помогает трассировать JavaScript-код. Spy-js покажет, как файлы связаны с вызовами функций, и выявит фрагменты кода, выполнение которых заняло особенно много времени.

Достижение паритета разработки и работы приложения

Где бы ни было развернуто ваше приложение — в виртуальных машинах или в контейнерах, — у нас есть инструменты, которые помогут вам вести разработку в этих окружениях. IDE JetBrains помогут доставить код в вашу среду разработки и выполнить отладку кода непосредственно в ней.

Для виртуальных машин

Каждая IDE JetBrains способна выполнять развертывание кода и артефактов с помощью SCP, а также открывать терминал SSH. Имеется поддержка сложных конфигураций SSH с bastion-хостами; их настройка может выполняться с помощью конфигурационного файла SSH (даже в Windows).

Вы можете использовать Vagrant для упрощения автоматизации процессов, относящихся к виртуальным машинам. Поддержка Vagrant реализована во всех IDE JetBrains — вы можете подключиться к настроенным с помощью Vagrant виртуальным машинам без дополнительной настройки.

Подробнее:Создание среды разработки Python в Amazon EC2Помощь по запуску SSH-терминала в IntelliJ IDEA

Для контейнеров

Все IDE JetBrains позволяют вам выполнять сборку и запуск как контейнеров Docker, так и проектов Docker Compose. Наша поддержка Docker позволяет редактировать файлы Dockerfile и YAML-файлы Compose с невероятной легкостью.

Пользуетесь Kubernetes? Несмотря на то, что Kubernetes значительно упрощает процесс развертывания, для его настройки требуются сложные YAML-файлы. Kubernetes-плагин от JetBrains помогает вам в этом: он генерирует сниппеты, позволяет выполнять навигацию по конфигурации и содержит инспекции, помогающие вам писать корректные конфигурации.

Подробнее:Что IntelliJ IDEA 2017.3 дает в плане поддержки Docker?IntelliJ IDEA: поддержка Kubernetes

Удаленные интерпретаторы

Если вы разрабатываете код на Python, Node.js, PHP или Ruby, вы можете использовать встроенную в IDE JetBrains функциональность удаленного интерпретатора. Вне зависимости от цели подключения, будь то виртуальная машина или Docker-контейнер, вы можете настроить удаленный интерпретатор для использования удаленной машины в качестве среды выполнения проекта. После выполнения этой настройки все конфигурации запуска будут выполняться на удаленной машине, однако рабочий процесс будет соответствовать вашей локальной среде разработки.

При настройке удаленного интерпретатора ваша IDE сканирует среду удаленного компьютера, чтобы обеспечить корректную работу механизма автодополнения кода. Для дополнительного упрощения процесса разработки юнит-тесты выполняются в удаленном режиме.

После настройки удаленного интерпретатора консоль Python, IRB или Rails будет запускаться на удаленной машине: вы сможете прототипировать свой код в том же окружении, где он будет выполняться.

Подробнее:Использование Docker Compose в PyCharm на Windows

Удаленная отладка

В большинстве конфигураций запуска отладка поддерживается без дополнительной настройки. В более сложных конфигурациях запуск кода из IDE может быть невозможен. Например, при тестировании тулчейна, генерирующего образы виртуальных машин. В этих случаях вы можете использовать встроенные в IDE JetBrains средства удаленной отладки для подключения к уже выполняющемуся коду.

Разработка на следующих языках поддерживается как в специализированных IDE для этих языков, так и в IntelliJ IDEA Ultimate с применением соответствующего языкового плагина. Поддержка JavaScript доступна во всех платных версиях IDE JetBrains.

Найдите свою IDE от JetBrains

Intelligent coding assistance

WebStorm brings you smart coding assistance for JavaScript and compiled-to-JavaScript languages, Node.js, HTML and CSS. Enjoy code completion, powerful navigation features, on-the-fly error detection, and refactorings for all of these languages.

Modern frameworks

WebStorm provides advanced coding assistance for Angular, React, Vue.js and Meteor. Enjoy support for React Native, PhoneGap, Cordova and Ionic for mobile development and develop for server-side with Node.js. All in one IDE!

Smart editor

The IDE analyzes your project to provide the best code completion results for all supported languages. Hundreds of built-in inspections report any possible issues right as you type and suggest quick-fix options.

Navigation & Search

WebStorm helps you get around your code more efficiently and save time when working with large projects. Jump to a method, function or variable definition in just one click, or search for the usages.

Последние изменения


Новая госзакупка в роли заказчика, контракт № 28100542748615300750120

Новая госзакупка в роли заказчика, контракт № 25856694268615300750120


Новая госзакупка в роли заказчика, контракт № 5936874142615300750, контрагент: ООО «СМК Основа»


Новая госзакупка в роли заказчика, контракт № 3017666279261530075, контрагент: ООО «Югагромаш»


Новая госзакупка в роли заказчика, контракт № 3302678129261530075, контрагент: ООО «Динамика Юг»


Новая госзакупка в роли заказчика, контракт № 1574145995261530075, контрагент: ООО «Академия — Цифровые Технологии»


Новая лицензия № ЛО-61-01-007619 от 02.03.2020, вид деятельности: Медицинская деятельность (за исключением указанной деятельности, осуществляемой медицинскими организациями и другими организациями, входящими в частную систему здравоохранения, на территории инновационного центра «Сколково»)


Новая госзакупка в роли заказчика, контракт № 37726772028615300750120

Intelligent coding assistance

PhpStorm is a PHP IDE that actually ‘gets’ your code. It supports PHP 5.3/5.4/5.5/5.6/7.0/7.1/7.2, provides on-the-fly error prevention, best autocompletion & code refactoring, zero configuration debugging, and an extended HTML, CSS, and JavaScript editor.

Smart PHP Code Editor

The IDE provides smart code completion, syntax highlighting, extended code formatting configuration, on-the-fly error checking, code folding, supports language mixtures and more. Automated refactorings that treat your code with care, helping to make global project settings easily and safely.

Code Quality Analysis

Hundreds of code inspections verify your code as you type and inspect the whole project for possible errors or code smells. Quick-fixes for most inspections make it easy to fix or improve the code instantly. Alt+Enter shows appropriate options for each inspection.

Easy Code Navigation & Search

PhpStorm helps you get around your code more efficiently and save time when working with large projects. Jump to a method, function or variable definition in just one click, or search for its usages.

Краткая справка

ГБПОУ РО «САТК» действует с 19 июля 2001 г., ОГРН присвоен 29 октября 2002 г. регистратором Межрайонная инспекция Федеральной налоговой службы № 26 по Ростовской области. Руководитель организации: директор Сероштан Александр Иванович. Юридический адрес ГБПОУ РО «САТК» — 347628, Ростовская область, Сальский район, поселок Гигант, Крупской улица, дом 6.

Основным видом деятельности является «Образование профессиональное среднее», зарегистрирован 1 дополнительный вид деятельности. Организации ГОСУДАРСТВЕННОЕ БЮДЖЕТНОЕ ПРОФЕССИОНАЛЬНОЕ ОБРАЗОВАТЕЛЬНОЕ УЧРЕЖДЕНИЕ РОСТОВСКОЙ ОБЛАСТИ «САЛЬСКИЙ АГРАРНО-ТЕХНИЧЕСКИЙ КОЛЛЕДЖ» присвоены ИНН 2400502479, ОГРН 1233219031102, ОКПО 11286524.

IDE features

WebStorm is built on top of the open-source IntelliJ Platform, which we at JetBrains have been developing and perfecting for over 15 years. Enjoy the fine-tuned, yet highly customizable experience it provides to fit your development workflow.


WebStorm provides a unified UI for working with many popular Version Control Systems, ensuring a consistent user experience across git, GitHub, SVN, Mercurial, and Perforce.

Local history

Whether you’re using VCS or not, Local history can be a real code saver. At any time you can inspect the history of either a particular file or directory, and roll back to any of its previous versions.


WebStorm is extremely customizable. Adjust it to perfectly suit your coding style, from shortcuts, fonts and visual themes to tool windows and editor layout.

Инструменты для работы с базами данных

Узнайте, что нового в DataGrip — там вы найдете подробную информацию об улучшениях для работы с базами данных в PhpStorm.

Редактор больших значений

Если в ячейке длинное значение, его удобно просматривать и редактировать в отдельной панели, которая поддерживает режим переноса строк (переключается на правой панели инструментов).

Подсветка Google BigQuery

В списке диалектов пополнение: Google BigQuery. Это пока еще не полноценная поддержка базы, а только правильная подсветка кода. Соответственно, для запуска запросов не надо выделять код, IDE сама определит, что нужно запустить.

Редактирование кода

Подсветка синтаксиса для более чем 20 языков

Если вам необходимо просмотреть в WebStorm файлы на PHP или Python, теперь для этих и многих других языков доступна подсветка синтаксиса. Благодаря коллекции файлов грамматики TextMate, поставляемых с IDE, никакой дополнительной настройки не потребуется.

Автодополнение для ключевых слов и имен, содержащих опечатки

Наверняка вы когда-нибудь вводили или вместо . Теперь при автодополнении IDE понимает такие опечатки и, как обычно, предложит наиболее подходящий вариант. Эта функция работает для всех поддерживаемых языков и любых символов: ключевых слов, классов, функций, компонентов и т. д.

Поддержка скриптов командной оболочки

В WebStorm теперь удобно работать со скриптами командной оболочки. В файлах и работает автодополнение кода, доступна новая конфигурация запуска, а IDE интегрируется с анализатором кода ShellCheck и инструментом форматирования shfmt.

С этим читают