Обзор 12 лучших редакторов кода и IDE — Sublime text, Atom, Visual Studio Code, Brackets, WebStorm, Caret, Zed и др.

Приветствуем вас на первом выпуске шоу DevShow! Сегодня с вами Дмитрий Ковальчук и Николай Чернобаев! В этом видео они расскажут вам о самых интересных редакторах кода в 2017 году по мнению канала LoftBlog. Поехали…

1. DreamWeaver

Dreamweaver — визуальный HTML-редактор от компании Adobe. Редактор не пользовался особой популярностью у разработчиков, но в недавно вышедшей версии появилось множество дополнительных возможностей, таких как современный пользовательский интерфейс и гибкий механизм для быстрого написания кода. Эти функции упрощают работу веб-дизайнеров и разработчиков пользовательского интерфейса, позволяя создавать проекты, писать код и управлять веб-cайтами, которые прекрасно выглядят на любом экране.

Преимущества DreamWeaver

К особенностям DreamWeaver относятся возможность рассматривать изменения в режиме реального времени, не обновляя страницу браузера, и возможность оценивать внешний вид сайтов одновременно на нескольких устройствах. Обновленный механизм написания кода ускоряет работу за счет подсказок и визуальных средств, сокращая количество ошибок и упрощая чтение кода. Теперь возможно писать качественный код еще быстрее благодаря поддержке основных средств, предварительной обработке CSS, технологии Emmet и проверке ошибок в режиме реального времени.

Некоторые недостатки DreamWeaver

Но даже сейчас DreamWeaver имеет недостатки. Так, используя встроенный конструктор, вы теряете возможность для контроля исходного кода в чистом виде. Также еще DreamWeaver можно считать полноценным IDE, что говорит о тяжеловесности и требовательности к ресурсам. Редактор платный и входит в пакет Adobe Creative Cloud, который содержит большое количество вкусных плюшек, таких как Muse, Photoshop, Adobe Stock и другие.

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

Сайт: http://www.adobe.com/ru/products/dreamweaver.html

2. Brackets

Brackets – это современный открытый текстовый редактор с интеллектуальной поддержкой синтаксиса HTML. Он обладает привлекательным интерфейсом и удобным инструментарием. Редактор разработан компанией Adobe и распространяется совершенно бесплатно.

Преимущества Brackets

Brackets заточен специально для frontend-разработчиков и дизайнеров. Основной фишкой этого редактора является Live Preview, то есть автоматическая синхронизация страницы с редактируемым кодом. Также редактор очень хорошо работает с препроцессорами, имеет действительно умный автокомплит и некоторое подобие парсинга PSD, что позволяет сделать разметку стилей страницы.

Главной особенностью Brackets можно назвать inline-редактирование связанных участков кода. Эта возможность позволяет править CSS и JS прямо из HTML-документа, не переключаясь между файлами. Brackets в реальном времени анализирует структуру твоего проекта, строит дерево зависимостей и позволяет писать взаимозависимые участки кода, практически не покидая основного контекста файла. Из остальных особенностей выделяется быстрый доступ к документации (правда, не настолько детализированный, как у Light Table) и JSLint из коробки.

Если подвести итоги, то Brackets не предлагает ничего революционно нового, кроме inline-редактирования кода. Однако то, что есть, сделано на совесть и с душой. Если необходимо преимущественно верстать или писать клиентский код на не слишком замороченном стеке, вполне возможно, Brackets придется вам по душе.

Сайт: http://brackets.io/

3. WebStorm

WebStorm – среда разработки для JavaScript, равно подходящая как для frontend’a, так и для создания приложений на Node.js. Этот инструмент разработан компанией JetBrains и является платным.

Преимущества WebStorm

Его главным достоинством является удобный и умный редактор JavaSсript, HTML и CSS, который поддерживает также и другие языки, например TypeScript, CoffeeScript, Dart, Less, Sass и Stylus и фреймворки, например, Angular, React и Meteor.

WebStorm делает разработку проекта простой и удобной, обеспечивая подсветку и автодополнение кода, его анализ по ходу редактирования, быструю навигацию и рефакторинг. Он имеет мощные инструменты отладки и интеграции с системами управления версиями (Git, GitHub, Subversion, Perforce, Mercurial, CVS), понимает структуру проекта и код, отслеживает ошибки с помощью систем ESLint, JSHint, JSLint, TSLint, Stylelint и предлагает их решение. Встроенные в IDE инструменты для тестирования и работы с проектом помогают в разработке и делают ее удобнее и продуктивнее.

WebStorm и Node.js

В WebStorm можно эффективно разрабатывать приложения на Node.js. Он поддерживает полноценную отладку Node.js приложений. Новое приложение можно создать, используя шаблон Node.js Express, а необходимые модули установить с помощью встроенного в WebStorm менеджера npm.

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

Сайт: http://jetbrains.ru/

4. Sublimе Text

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

Преимущества Sublime Text

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

Недостатки Sublime Text

К минусам редактора можно отнести проблемы с обратной совместимостью и отсутствие встроенной консоли.

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

Сайт: https://www.sublimetext.com/

5. Atom

Atom – это бесплатный текстовый редактор с открытым исходным кодом и поддержкой плагинов, написанных на Node.js, и встраиваемых под управлением Git Control. Его создателями являются программисты веб-сервиса Github, которые решили помочь своей целевой аудитории и создать нечто, что разработчики могут использовать каждый день.

Преимущества Atom

Главная особенность Atom — богатые возможности по настройке. Редактор можно настроить на свой вкус. Изначально в него встроены файл-менеджер, продвинутые функции поиска и замены, разнообразные курсоры, опции сворачивания кода, ясный интерфейс, возможность импорта правил и тем из TextMate.

Десктопное приложение Atom имеет полный доступ к файловой системе, естественные для операционной системы меню и панель команд. При этом оно идеально приспособлено для веб-программирования: можно добавлять собственные функции для редактирования CSS, HTML и JavaScript. Нужно отметить также интеграцию с Node.js, включая запуск веб-сервера прямо из редактора. Архитектура программы проста и понятна каждому: можно заменить любой пакет своим собственным и закачать его в центральный репозиторий, чтобы им воспользовался любой желающий.

Такой поистине прекрасный редактор все же более тяжеловесен, нежели Sublime Text. Но можно сказать точно, что Atom — достойный редактор для удобной работы программиста с множеством приятных дополнений.

6. Visual Studio Code

Visual Studio Code — кроссплатформенный редактор кода, поддерживающий базовые возможности интегрированной среды разработки (IDE), созданный в Microsoft.

Преимущества Visual Studio Code

Позиционируется как «легкий» редактор кода для кроссплатформенной разработки веб- и облачных приложений. Visual Studio Code распространяется бесплатно и разрабатывается как программное обеспечение с открытым исходным кодом.

Visual Studio Code позволяет разрабатывать как консольные приложения, так и приложения с графическим интерфейсом, в том числе с поддержкой технологии Windows Forms, а также веб-сайты, веб-приложения, веб-службы как в родном, так и в управляемом кодах для всех платформ.

В редакторе присутствуют встроенный отладчик, инструменты для работы с Git и средства рефакторинга, навигации по коду, автодополнения типовых конструкций и контекстной подсказки. Продукт поддерживает разработку для платформ ASP.NET и Node.js, и считается легковесным решение, которое позволяет обойтись без полной интегрированной среды разработки. Большим плюсом редактора является поддержка большого количества языков, таких как C++, C#, Python, PHP, JavaScript и других.

Visual Studio Code вышел относительно недавно и уже начал постепенно набирать свою популярность. Если вам хочется попробовать в этом году что-то новенькое, то стоит смело остановить ваш выбор на этом редакторе.

Сайт: https://code.visualstudio.com/

7. Eclipse

Eclipse — свободная IDE модульных кроссплатформенных приложений, которая развивается и поддерживается компанией Eclipse Foundation. В основном IDE популярна в разработке довольно больших проектов у back-end-разработчиков и мобильных разработчиков.

Eclipse поддерживает очень много языков, в том числе JavaScript, PHP, Python и другие, а также работает с серверами Tomcat, GlassFish и т. д. Это довольно старое IDE и не имеет такой большой популярности, как скажем тот же Sublime Text или Brackets. Но если вам вдруг захочется познакомиться с этой программой, добро пожаловать на сайт, приведенный ниже.

Сайт: https://eclipse.org/

8. Light Table

Light Table — легковесная интегрированная среда разработки, написанная на ClojureScript с использованием Node.js. Разработка Light Table началась в 2011 году американским программистом Крисом Грейнджером.

Основной задачей Light Table является сделать процесс разработки по-настоящему интерактивным и наглядным, давая разработчику моментальный фидбек на любое действие, тем самым помогая быстрее ориентироваться в большом коде.

Крутые фичи Light Table

Одной из самых крутых особенностей Light Table является возможность работать с документацией по ходу написания кода. Чтобы увидеть описание функции, достаточно просто навести на нее курсор и редактор моментально найдет и выведет документацию по запрошенной функции или параметру (в случае с build-in методами) или покажет prepend-описание функции, оставленное прямо в коде. Чем-то это напоминает автокомплит, но значительно более глубокий и мощный.

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

Третья фишка Light Table — уникальная возможность организации кода в так называемые таблицы. Они представляют собой логически завершенные блоки кода, через которые можно наглядно представить взаимодействие отдельных функций программы. С помощью этой возможности очень удобно разделить файл на несколько независимых блоков-функций и работать с ними, соорудив некое подобие настоящего дашборда из кода. Также приятной особенностью является интеллектуальная подсветка блоков.

Несмотря на довольно непривычную философию, Light Table — это, несомненно, редактор нового поколения. Его особенность заключается в изменении самого подхода к процессу разработки сложного ПО. Прочувствовать его особенность вы сможете, только работая со сложным проектом. Нужно только привыкнуть. Но вот это как раз-таки будет непросто.

Сайт: http://lighttable.com/

9. NetBeans

NetBeans — свободная интегрированная среда разработки приложений (IDE) на языках программирования Java, Python, PHP, JavaScript, C, C++, Ада и ряда других. Проект NetBeans поддерживается и спонсируется компанией Oracle.

Положительные стороны NetBeans

Последние версии NetBeans поддерживают рефакторинг, профилирование, выделение синтаксических конструкций цветом, автодополнение набираемых конструкций на лету и множество предопределённых шаблонов кода. Netbeans интегрируется со всеми популярными контролями версий Subversion, Mercurial, и Git. Можно удобно и быстро разрабатывать в нем как десктоп, так и мобильные и веб- приложения.

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

Сайт: https://netbeans.org/

10. Vim

Vim — свободный текстовый редактор, созданный на основе более старого vi. Ныне это один из мощнейших текстовых редакторов с полной свободой настройки и автоматизации, возможными благодаря расширениям и надстройкам.

Бесспорные преимущества Vim

Vim единообразно поддерживает всё на свете: Ruby/Rails, Python, C, OpenCL (+PyOpenCL), CUDA (+PyCUDA), bash, Go, XML, YAML, HTML, Markdown, Textile, CSS, .ini, Sage, Magma, GAP, LaTex, а также специфические конфиги некоторых программ (типа X, mutt и т.п.) и почту. Он умеет почти всё, и вам не надо заново привыкать к инструменту.

Vim может работать только в режиме консоли. Иными словами, с ним ваш компьютер может быть тонким клиентом. Кроме того, связка vim + tmux + ssh — это постоянно открытая рабочая сессия. Если вы начали работать на одной машине (к примеру, на работе), отлогинились не закрывая редактора и т.п., а затем продолжили работать из дома с ноутбука — это чрезвычайно удобно.

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

В заключение о Vim

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

Сайт: http://www.vim.org/

11. Caret

Caret – это расширение для Google Chrome для написания и редактирования кода. Расширение придется по вкусу веб-разработчикам. Оно позволяет, не выходя из браузера, посмотреть на работу кода. Такое приложение может пригодиться, если у вас вдруг рядом нет рабочей машины или вы сейчас не на рабочем месте, а вам нужно срочно решить какую-то задачу. Для детального знакомства, можно перейти по ссылке ниже.

Сайт: http://thomaswilburn.net/caret/

12. Zed

Zed — это текстовый редактор с открытым исходным кодом, который также пытается переосмыслить современный процесс разработки ПО. Если, например, Light Table пытается изменить сам принцип разработки, то Zed в основном ограничивается экспериментами с интерфейсом. Разработка была начата в 2011 году, и на сегодняшний день на официальном сайте Zed доступен в виде бинарников под основные платформы, а также в качестве приложения для Chrome Web Store.

Особенности Zed

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

Второй запоминающейся особенностью Zed является упор на многоколоночный интерфейс. Стоит отметить, что вторая (или даже третья) колонка предназначена не только для одновременного редактирования нескольких файлов, но также и для моментального предпросмотра кода на языках, требующих препроцессинга (таких как Markdown или CoffeeScript).

При работе с Zed очень чувствуется его ориентированность на удаленное редактирование. Так, из коробки он имеет шикарную поддержку редактирования файлов из Dropbox или напрямую на удаленном сервере и поддерживает сессии.

Отрицательные черты Zed

Но, к сожалению, как редактор Zed весьма беден. Его встроенное автодополнение базируется на словаре, он не имеет удобных средств работы с расширениями, не позволяет настроить UI так, как хотелось бы. Временами приложение достаточно надолго застывает и теряет всякую отзывчивость, что, конечно, не добавляет удобства.

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

Сайт: http://zedapp.org/

Вместо заключения…

Сегодня мы рассмотрели множество редакторов и IDE. По мнению Дмитрия, для серьезной веб-разработки лучше всего подойдет WebStorm. Если вам нужен быстрый и качественный редактор, то лучше выбрать Sublime Text или Atom. Если вы хотите что-то новенькое, то это, конечно, Visual Studio Code. Николай же советует вам обратить в этом году внимание на Brackets и Atom, поскольку он сам ими активно пользуется.

Продвинутые разработчики, а какими редакторами или IDE пользуетесь вы — Sublime text, Atom, Visual Studio Code, Brackets, WebStorm, Caret или Zed? Напишите в комментариях, какую программу вы выбрали и почему. Предлагаем вам активно обсудить этот вопрос.

Как всегда с вами был LoftBlog! До новых встреч!

P.S.Поддержите нас комментариями и лайками, друзья, чтобы мы продолжали записывать для вас полезные ролики на самые актуальные темы.

Оставь комментарий!

Добавить комментарий