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

WebStorm — это редак­тор кода для раз­ра­бот­чи­ков, кото­рые пишут на Java Script. Этим инстру­мен­том поль­зу­ет­ся Давид Рога­нов — наш зна­ко­мый из Яндекс.Практикума. Если еще не чита­ли интер­вью с ним — про­чи­тай­те, там исто­рия успе­ха через кон­курс Яндек­са, вдох­нов­ля­ет!

Всё в коробке

Вы ска­чи­ва­е­те WebStorm и через секун­ду може­те рабо­тать — все нуж­ные инстру­мен­ты для фронтенд-разработки на JavaScript добав­ле­ны по умол­ча­нию. Вам доступ­ны попу­ляр­ные пла­ги­ны и фрейм­вор­ки, мощ­ный ана­ли­за­тор, удоб­ный дви­жок для тести­ро­ва­ния кода, совре­мен­ный отлад­чик при­ло­же­ний и дру­гие функ­ции, кото­рые мож­но посмот­реть на офи­ци­аль­ном сай­те в раз­де­ле «Функ­ци­о­наль­ность». При этом WebStorm крос­сплат­фор­мен­ный, поэто­му вы смо­же­те писать код в любой опе­ра­ци­он­ной систе­ме и про­ве­рять резуль­тат с помо­щью любо­го бра­у­зе­ра.

Пред­ставь­те: вы выпол­ни­ли про­ект, полу­чи­ли гоно­рар и мах­ну­ли в отпуск. Толь­ко вы при­хо­ди­те на пляж — и вне­зап­но зво­нит заказ­чик с прось­бой сроч­но что-то там изме­нить. Вы нахо­ди­те любой ноут­бук, захо­ди­те в бли­жай­шую кафеш­ку, ска­чи­ва­е­те WebStorm, загру­жа­е­те рабо­чий файл и за часик допи­ли­ва­е­те код. Заказ­чик счаст­лив и выпи­сы­ва­ет вам пре­мию. Все доволь­ны.

А вот если бы вме­сто WebStorm вы ска­ча­ли любой бес­плат­ный редак­тор, то полу­чи­ли бы сре­ду раз­ра­бот­ки без пла­ги­нов и нуж­ных инстру­мен­тов — это тер­пи­мо для одно­го неболь­шо­го про­ек­та, но не для серьёз­ных задач. Поэто­му если под рукой не будет ваше­го основ­но­го ПК, то это гро­зит пре­рван­ным отпус­ком ради пра­вок в про­ек­те.


Вы уста­нав­ли­ва­е­те WebStorm, выби­ра­е­те или созда­ё­те новый файл и сра­зу може­те рабо­тать

Настраиваемый интерфейс

Если стан­дарт­ные настрой­ки вас не устра­и­ва­ют — сде­лай­те так, как удоб­но. В WebStorm мож­но пере­на­стро­ить интер­фейс рабо­че­го про­стран­ства, доба­вить или отклю­чить пла­ги­ны и рас­по­ло­жить любые инстру­мен­ты в про­из­воль­ном поряд­ке. При этом настрой­ки мож­но задать под один про­ект или сра­зу под все новые фай­лы.

Для тех, кто не любит гра­фи­че­ские интер­фей­сы, в WebStorm есть zen-режим — это когда вы пол­но­стью уби­ра­е­те все эле­мен­ты меню, погру­жа­е­тесь в раз­ра­бот­ку и вызы­ва­е­те нуж­ные функ­ции через горя­чие кла­ви­ши. Есть толь­ко вы и код.

Или дру­гая ситу­а­ция: у вас мно­го парал­лель­ных задач, кото­рые жела­тель­но дер­жать перед гла­за­ми. В этом слу­чае вы може­те раз­ме­тить рабо­чее про­стран­ство на боль­шое коли­че­ство отдель­ных зон и в каж­дой делать отдель­ные запи­си. Не хва­тит одно­го экра­на — под­клю­чи­те вто­рой мони­тор и ни в чём себе не отка­зы­вай­те.


WebStorm в стан­дарт­ном режи­ме

Акти­ви­ру­ем zen-режим: вклад­ка View → Appearance → Enter Zen Mode. Ниче­го лиш­не­го в интер­фей­се, посколь­ку нет само­го интер­фей­са

Сообщество

Реше­ния боль­шин­ства про­блем мож­но под­смот­реть на фору­ме про­ек­та.

Если под­хо­дя­ще­го отве­та нет, то вы може­те его доба­вить в баг-трекер — чек-лист, в кото­рый коман­да WebStorm зано­сит поль­зо­ва­тель­ские жало­бы. Все уни­каль­ные про­бле­мы попа­да­ют в общий спи­сок и выстав­ля­ют­ся на голо­со­ва­ние раз­ра­бот­чи­ков — когда какой-то баг наби­ра­ет мно­го голо­сов, коман­да WebStorm ста­ра­ет­ся его устра­нить. Если же про­бле­ма не уни­каль­на, то вам под­ска­жут тему на вет­ке фору­ма или дадут ссыл­ку на ста­тью в бло­ге. В любом слу­чае без помо­щи вы не оста­не­тесь.

Вот вам при­мер силы актив­но­го сооб­ще­ства. В баг-трекере несколь­ко лет висел запрос на функ­цию сов­мест­но­го редак­ти­ро­ва­ния кода — коман­да WebStorm его игно­ри­ро­ва­ла, посколь­ку боль­шая часть сооб­ще­ства голо­со­ва­ла за дру­гие фичи. В 2020 году мир столк­нул­ся с пан­де­ми­ей, и мно­гие раз­ра­бот­чи­ки пере­клю­чи­лись на уда­лён­ную рабо­ту — в таких усло­ви­ях воз­мож­ность сов­мест­но­го редак­ти­ро­ва­ния кода быст­ро набра­ла попу­ляр­ность и сра­зу же попа­ла в раз­ра­бот­ку. В сере­дине года дол­жен вый­ти спе­ци­аль­ный пла­гин, кото­рый пол­но­стью закро­ет про­бле­му. С вялым сооб­ще­ством добить­ся тако­го мощ­но­го откли­ка не полу­чит­ся.

Здоровый перфекционизм

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


Шрифт JetBrains Mono: за счёт про­стых обте­ка­е­мых форм не напря­га­ет зре­ние, помо­га­ет подол­гу кодить и исполь­зу­ет­ся в WebStorm по умол­ча­нию

Для срав­не­ния посмот­ри­те на шрифт Inconsolata — авто­ры доба­ви­ли мико­за­сеч­ки, и гла­зам тяже­ло сколь­зить по длин­но­му коду

Или оце­ни­те шрифт Fira Code, в кото­ром неко­то­рые бук­вы деко­ра­тив­но заветв­ле­ны. При дли­тель­ном чте­нии это застав­ля­ет всмат­ри­вать­ся в строч­ки кода и созда­ёт допол­ни­тель­ную зри­тель­ную нагруз­ку.

Подключать или нет

WebStorm — это плат­ный инстру­мент для про­фес­си­о­наль­ной фронтенд-разработки, кото­рый удоб­но исполь­зо­вать в объ­ём­ных ком­мер­че­ских про­ек­тах. Для нович­ков и мел­ких задач он не нужен, посколь­ку вы запла­ти­те за функ­ци­о­наль­ность, кото­рой не буде­те поль­зо­вать­ся.

Если хоти­те попро­бо­вать, у систе­мы 30-дневный проб­ный пери­од. Инте­рес­но ваше мне­ние: сто­ит ли WebStorm сво­их денег? Ведь все­гда есть Sublime Text...