Программа code для программирования
Универсальный редактор кода от Microsoft, довольно быстрый и функциональный. Среда с открытым исходным кодом поддерживает автоматическое умное дополнение текста программ с использованием технологии Microsoft IntelliSense и подсветку синтаксиса для большинства популярных языков.
Возможностей Visual Studio Code хватит для любительской и профессиональной разработки. В редактор встроены средства для действий с Git‑репозиториями и инструменты для рефакторинга. Расширить функциональность можно за счёт тысяч плагинов — ищите их прямо в среде по названию или по языку, на котором вы пишете.
Быстрее редактировать код в Visual Studio Code помогут сочетания клавиш. Они обеспечат быструю навигацию по вашему проекту и впечатлят рекрутера на собеседовании.
2. Atom
Простой и удобный редактор с открытым исходным кодом — детище GitHub Inc., крупнейшего сервиса для хостинга и совместной разработки программного обеспечения, который сейчас принадлежит Microsoft. Atom поддерживает огромное количество языков и подходит для кросс‑платформенной разработки.
Здесь доступны плагины, написанные на Node.js, — они серьёзно расширят ваши возможности. Atom работает быстро и надёжно, поддерживает синхронизацию с Git, сворачивание блоков кода, автоматическое дополнение слов и другие функции профессиональных редакторов.
С инструментом Teletype for Atom вы сможете совместно с коллегой писать код в режиме реального времени. Это идеальное средство для парного программирования, быстрых багфиксов и мозговых штурмов в R & D.
Редактор поставляется с четырьмя вариантами интерфейса и восемью темами — светлыми и тёмными. Также есть инструменты для ручной кастомизации на CSS/Less, HTML и JavaScript — всё это поможет вам настроить исключительно комфортную рабочую среду.
3. Sublime Text 3
Лёгкий, но довольно мощный редактор, который подходит и для начинающих разработчиков, и для профессионалов. Он быстро запускается даже на слабых компьютерах и поддерживает плагины, написанные на Python.
Sublime можно гибко настраивать, чтобы работать с проектами из тысяч файлов. Поддерживается автодополнение, множественная правка, мгновенное редактирование нескольких строк. Всё это сводит к минимуму рутинные действия и избавляет от новых ошибок.
Также можно сохранять сниппеты (фрагменты кода, которые вы часто используете), чтобы вставлять их сочетанием клавиш, без долгих поисков по старым проектам.
В третьей версии редактора улучшили индексирование файлов, чтобы ускорить поиск переменных, функций и классов. Появилась и возможность перехода к предыдущей позиции курсора.
Вообще, Sublime Text 3 — проприетарный редактор: его можно купить за 80 долларов. Но пробная версия доступна бесплатно, и срок её использования разработчики пока не ограничивают.
4. IntelliJ IDEA
- Языки: Java, Kotlin, Scala, Groovy, С, С++, CSS, Go, HTML, PHP, Python, Ruby, XML, YAML и другие.
- Платформы: Windows, macOS, Linux.
Среда изначально создавалась для Java и актуальна в первую очередь для Java‑подобных языков, к примеру Kotlin, Scala и Groovy. Развивает её компания с российскими корнями JetBrains. Она, собственно, создала Kotlin — язык, который Google назвала приоритетным для Android‑разработки.
IntelliJ IDEA Overview of IntelliJ IDEA — мощная, хоть и не очень быстрая система с большим набором инструментов для создания десктопных, мобильных и веб‑приложений, ПО для интернета вещей. Версии две: платная Ultimate для компаний и бесплатная Community с открытым исходным кодом.
В Community нет полноценной поддержки фреймворка Spring, а также Java EE (Enterprise Edition), JavaScript, TypeScript, SQL. Но в целом здесь есть всё необходимое для старта небольших проектов, к примеру отладчик, поддержка фреймворков для сборки Maven и Gradle, систем контроля версий Git и SVN. А набор встроенных инструментов для Android такой же, как в официальном Android Studio от Google.
5. PyCharm
- Языки: Python, Jython, Cython, IronPython, PyPy, Django и другие.
- Платформы: Windows, macOS, Linux.
Ещё одна интегрированная среда разработки от JetBrains, но уже с упором на Python и его фреймворк Django. Версии также две: Professional c полноценной поддержкой научной (создание моделей, графиков, тестирование гипотез) и веб‑разработки на Python, HTML, JS и SQL; Community — только для Python и с открытым исходным кодом.
Среда включает мощные средства для анализа написанных программ, графический отладчик, позволяет быстро создавать и запускать юнит‑тесты. С PyCharm просто ориентироваться даже в больших проектах и редактировать код на лету — есть автодополнение, автоматический импорт, готовые шаблоны и быстрый просмотр документации для элементов. Наконец, здесь удобно делать рефакторинг кода, чтобы его было легче поддерживать и расширять.
На сайте и во встроенном меню PyCharm вы найдёте множество плагинов. Это средства для работы с большими данными, написания кода на определённых языках программирования (например, R или Rust), создания тем оформления, анализа логов.
6. Brackets
- Языки: HTML, CSS, JavaScript и другие.
- Платформы: Windows, macOS, Linux.
Лучший редактор с открытым исходным кодом для веб‑разработки. Сам он создан на JavaScript, HTML5 и CSS3.
Brackets — детище Adobe Systems. Он появился в 2014 году и активно развивается, чтобы обеспечить веб‑разработчикам как можно больше возможностей.
Особенно удобен Brackets для фронтенда: встроенные инструменты ускоряют действия с CSS, позволяют увидеть все селекторы, отредактировать их и сразу оценить результат. Также в наличии JavaScript‑отладчик Theseus и локальный веб‑сервер для тестирования проектов.
Код из Brackets вы можете просматривать в браузере в режиме реального времени. Среда синхронизируется с Git и поддерживает сотни расширений, а также пользовательские горячие клавиши и JavaScript‑подсказки.
Обратите внимание на средства быстрого редактирования в Brackets. Они позволяют вносить изменения сразу в несколько элементов, функций или свойств, а также менять код на CSS или JavaScript не выходя из связанного HTML‑файла. Результат можно увидеть в браузере — с подключением бэкенда или без него.
7. Vim
- Языки: С, С++, Shell Script, Bash Script, Java и другие.
- Платформы:Windows, macOS, Linux.
Наследник легендарной серии Vi, которая создавалась ещё для Unix, обеспечивает полную свободу настройки и автоматизации разработки. Правда, новичкам будет непросто его освоить. Потому что нельзя просто взять и выйти из Vim с первого раза.
У Vim есть два режима: нормальный и ввода. Такой подход защищает от случайного внесения изменений.
На старте редактор находится в нормальном режиме, работать с текстом в нём можно модульно: например, удалить слово или строку. Кроме того, здесь получится быстрее перемещаться по файлу и находить всё что нужно.
Чтобы переключиться в режим ввода, надо нажать кнопку I или Insert, обратно — Esc. И только в нормальном режиме у вас получится корректно выйти из Vim. Если введёте ZQ или :q!, то покинете файл, не сохранив изменения, а по ZZ, :wq или :x — выйдете после сохранения файла. В первые дни работы с Vim эти комбинации хочется написать на стикере, который всегда будет перед глазами, но со временем к ним привыкаешь.
8. Eclipse
- Языки: Java, C, С++, Perl, PHP, JavaScript, Python, Ruby, Rust, Scout, 1C V8 и другие.
- Платформы: Windows, macOS, Linux.
Универсальная интегрированная среда, на базе которой создаются другие системы для разработки на определённых языках или для тестирования. Компания IBM вложила в проект около 40 миллионов долларов, а затем открыла код Eclipse и передала его сообществу для дальнейшего развития.
Фактически на базе Eclipse создаются расширения, которые позволяют комфортно работать с различными языками и проектами. Расширения — это модули, редакторы панели, перспективы и так далее. Один из самых известных — Eclipse JDT (Java Development Tools). Этот модуль позволяет писать код на Java, интегрирован с системой контроля версий Git, может обмениваться данными с трекером ошибок Bugzilla и с инструментами отслеживания задач вроде Jira.
На официальном сайте доступны готовые Eclipse IDE для Java, C, C++, PHP, JavaScript и других популярных языков. Также вы можете загрузить саму платформу и модули для решения конкретных задач. Отдельно отметим 1C: Enterprise Development Tools для работы с платформой «1C:Предприятие».
9. Aptana Studio
- Языки: HTML, JavaScript, CSS, Ruby on Rails, PHP, Python и другие.
- Платформы: Windows, macOS, Linux.
Этот мощный и удобный редактор для веб‑разработки — один из самых известных дистрибутивов Eclipse. На старте в нём есть подсветка синтаксиса и автодополнение кода на HTML, JavaScript и CSS. С помощью плагинов можно адаптировать Aptana Studio под Ruby on Rails, PHP, Python.
Интегрированная среда разработки поддерживает кросс‑платформенность и автоматически дополняет введённый текст. Она сообщает об ошибках в коде и помогает быстро от них избавиться.
Для комфортной отладки в Aptana Studio есть встроенный веб‑сервер Jaxer, который позволяет выполнить JavaScript на своей стороне и предоставить результат. Кроме того, среда взаимодействует с сервисом Aptana Cloud. Он облегчает развёртывание веб‑приложений в облаке и создание масштабируемой инфраструктуры.
Вы можете загрузить версию редактора для нужной ОС. А если у вас установлена среда Eclipse, достаточно будет плагина Aptana для неё.
10. Notepad++
Этот текстовый редактор с открытым исходным кодом — нечто гораздо большее, чем просто умная замена блокнота. Он поддерживает подсветку синтаксиса для всех популярных (и не только!) языков, систем сборки и разметки — вплоть до Ada, COBOL и Fortran.
Notepad++ очень лёгкий и быстрый. Тысячи плагинов делают его редактором на все случаи жизни: здесь есть и проверка грамматики на разных языках, и сравнение файлов, и генерация цифровых подписей, и конвертация в различные кодировки, и многое другое. А самое удобное — в отличие от блокнота, если вы закроете Notepad++ и оставите в нём несохраненные файлы, они автоматически откроются при следующем запуске программы.
11. Emacs
- Языки: C, C++, Java, Perl, Lisp, Objective‑C и другие.
- Платформы: Windows, macOS, Linux.
Небольшой редактор макросов (Emacs расшифровывается как Editor MACroS) с годами переродился в целое семейство. После серии Vi и её наследника Vim он стал настоящим откровением и здорово облегчил жизнь тем, кто писал код лет 30–40 назад.
Но и сегодня Emacs в умелых руках сможет многое. В нём есть основной и множество дополнительных режимов, например для разных языков программирования, просмотра каталогов, работы с почтой. Поддерживается быстрое перемещение по тексту и файлам с помощью сочетаний клавиш. Редактор можно гибко настраивать: от установки количества пробелов для каждого уровня отступа до запуска определённых функций после изменения буфера обмена.
Пасхалки в Emacs — отдельная история. Например, здесь предусмотрены игры и специальный режим психотерапевта — разговор с виртуальной собеседницей Элизой. Более того, вы можете установить расширение для Emacs и автоматизировать игру в тетрис — в перерывах между работой над кодом, конечно.
12. Komodo IDE
- Языки: Python, Perl, Ruby, HTML, CSS, JavaScript и другие.
- Платформы: Windows, macOS, Linux.
Бесплатный редактор кода от канадской компании ActiveState, разработчика версий языков программирования Active Perl и Active Python. Есть также вариант Komodo Edit c меньшим набором возможностей — без встроенной поддержки юнит‑тестов и отладчиков.
Komodo IDE предоставляет подсветку синтаксиса, автодополнение, возможность работы с различными концами строк и кодировками. Здесь удобно редактировать файлы на разных языках программирования и гипертекстовой разметки. Для Perl, PHP, Python, Ruby, TCL, JavaScript есть и проверка синтаксиса — сторонние средства не понадобятся.
За свою долгую историю существования Microsoft выпустил немало инструментов разработки. Но так уж сложилось что на слуху у всех только лишь Visual Studio – большая и мощная IDE «комбайн» предназначенная для всего и вся. Развивается этот продукт уже более двух десятков лет и вобрал в себя самые разные функции. Многим этот инструментарий нравится и иногда даже задавали вопрос – будет ли перенесен Visual Studio на другие платформы. На что чаще всего получали ответ нет. Наверное, понятно почему, в целом такое портирование будет дорогим и неоправданно сложным, уж очень много всего в этой IDE завязано на Windows.
И вот, этой весной для многих неожиданностью было то что Microsoft представил новый продукт под названием Visual Studio Code, да еще и работающий сразу на трех платформах, Linux, OS X и Windows. Не замахиваясь на все функции полноценной IDE, внутри Microsoft решили переосмыслить подход, по которому строится основной инструментарий программиста и начали с самого главного – редактора кода. Visual Studio Code это именно редактор, но при этом обладающий функциями IDE, полагающийся на расширения.
Установка Visual Studio Code
Mac OS X
Совет: если вы хотите чтобы Visual Studio Code стартовал из терминала добавьте в ~/.bash_profile
Linux
Совет: если вы хотите чтобы Visual Studio Code стартовал из терминала добавьте на него ссылку
Windows
Совет: если вы хотите чтобы Visual Studio Code стартовал из терминала сделайте logon/logoff, соответствующие пути к файлу прописываются в переменной PATH самим установщиком
Дополнительные инструменты
Без инструментария Visual Studio Code годится разве что для простого редактирования файлов, для полноценной работы понадобится сопутствующий инструментарий, который зависит от ваших целей и задач:
Начало работы
Чтобы попробовать в деле VS Code, проще всего создать веб-проект Node. Для этого установите Node на свой компьютер (ссылка выше) и выполните следующие команды:
Базовые возможности Visual Studio Code
Как и многие редакторы кода, VS Code использует распространенную схему расположения основных элементов – слева обозреватель файлов, справа редактор кода. В дополнение к этому есть специфичные элементы, обеспечивающие навигацию и выполнение специальных команд.
Файлы, папки, и проекты
Расположение основных элементов
VS Code обладает интуитивно понятной и простой схемой расположения основных элементов. Интерфейс разделен на четыре основных блока, это:
- Редактор, основной блок в котором осуществляется изменение содержимого открытого файла
- Сайдбар, с помощью которого можно увидеть различные представления файлов проекта
- Статусбар, показывающий текущий статус различных операций
- Вьюбар, позволяющий переключаться между режимами сайдбара и индицирующий с помощью иконок различную информацию, например количество исходящих git изменений
Редактор VS Code может открыть для редактирования на экране до трех файлов одновременно, располагая их друг за другом справа. Открыть дополнительные редакторы можно различными способами:
Ctrl (Mac: Cmd) и кликнуть на файле в обозревателе
Ctrl+\ для того чтобы разделить активный текущий редактор на два
Open to the Side в контекстном меню файла в обозревателе
Совет: Вы можете переместить сайдбар слева на право с помощью меню View, Move Sidebar а так же включить его видимость с помощью клавиатуры (Ctrl+B).
Палитра команд
Самым главным инструментом взаимодействия с редактором в VS Code является палитра команд. Вызвать ее можно через клавиатуру, нажав на комбинацию Ctrl+Shift+P. Множество команд перечисленных в палитре тоже привязаны к клавишам.
Введите в строку команды знак вопроса? и тогда вы получите перечень команд которые работают в текущем контексте:
Некоторые часто используемые команды:
- Ctrl+P навигация к файлу или символу по набранной строке
- Ctrl+Tab циклично открывает последние отредактированные файлы
- Ctrl+Shift+P выводит список команд редактора
- Ctrl+Shift+O навигация к некоторому символу в файле
- Ctrl+G навигация к строке в файле
- Ctrl+Tab выводит список всех файлов которые были открыты от момента запуска VS Code, удерживайте Ctrl и нажимайте Tab до тех пор пока не выберите нужный файл
- Alt+Left и Alt+Right навигация по ранее редактированным файлам и строкам назад и вперед
Обозреватель
Обозреватель предназначен для открытия и управления файлами находящимися в папке вашего проекта. Вы можете осуществлять множество привычных операций по созданию, изменению имени, удалению файлов и папок, и их перемещению.
Файлы, которые вы редактировали или открывали двойным щелчком в обозревателе, помещаются в верхнюю часть обозревателя и получают статус Working files:
Автосохранение
По умолчанию, VS Code работает в режиме явного сохранения, которое вы можете выполнить, нажав на комбинацию Ctrl+S. Этот режим совместим с большинством инструментов следящих за статусом файлов (например bower). Можно включить и режим автоматического сохранения (Auto Save), нажав Ctrl+Shift+P и набрать auto.
Поиск
Нажимите Ctrl+Shift+F и введите интересующую вас фразу. Результаты поиска будут сгруппированы, в дополнение вы можете развернуть узел группы чтобы посмотреть множественные вхождения. В строке поиска поддерживаются регулярные выражения.
Более детальный поиск может быть осуществлен с помощью команды Ctrl+Shift+J. Введите в дополнительные поля критерии поиска.
Возможности редактора
Подсказки IntelliSence
Где бы вы не находились в вашем коде, нажав на Ctrl+Space будет выведено окно подсказки IntelliSence. При наборе кода редактор будет показывать его автоматически.
Подсказки параметров
Для перегруженных функций вы можете листать варианты реализации используя клавиши Up и Down.
Сниппеты кода
Переход к определению символа
Нажав на F12 вы перейдете к определению символа. Если нажать Ctrl и провести курсором по символу вы увидите определение в дополнительном окне.
Переход к методу или переменной
Нажав на Ctrl+Shift+O вы откроете перечень методов в файле, в дополнение вы можете нажать двоеточие: и методы будут сгруппированы по типу. Нажав на Up и Down выберите нужный метод и курсор в редакторе перейдет на строку где находится выбранный метод.
Просмотр определения символа
Если вам необходимо быстро посмотреть на определение символа или на референсы, для того чтобы вспомнить детали реализации или использования, можно использовать поиск или переход к определению символов, что не всегда удобно так как переключает контекст.
В этом случае можно воспользоваться командами Reference Search (Shift+F12) или Peek Definition (Alt+F12) и результаты поиска будут отображаться в инлайн окошке:
Переименование методов и переменных
Отладка
Сохраните конфигурационный файл и выберите пункт Launch в меню, установите точку останова и нажмите F5 для старта отладки.
Отладчик позволяет просматривать значения текущих переменных:
Контроль версий
VS Code интегрирован с системой контроля версий git, и поддерживает большинство команд. В версии 0.5 был зафиксирован ряд ошибок связанных с интеграцией. Поддерживаются локальные и удаленные репозитарии.
Конфликты
VS Code позволяет осуществлять слияния и разрешение конфликтов при работе с системой контроля версий:
В этом переводе расскажем про альтернативные редакторы кода, которые ничуть не уступают VS Code, а при грамотном подборе расширений даже превосходят его.
Редактор Visual Studio Code, также известный как VS Code работает на Linux, Windows и macOS. Он занимает промежуточное положение между простым текстовым редактором исходного кода и интегрированной средой разработки (IDE), которая управляет всей вашей кодовой базой. Функциональность VS Code можно расширить с помощью плагинов. Это надёжный редактор кода, который может достойно побороться с проприетарными конкурентами.
Изначально VS Code был создан как open source продукт. Однако его готовые сборки распространяются под проприетарной лицензией Microsoft. Но не всё так плохо.
Использование VS Code как open source
Исходники VS Code доступны на GitHub. Тем не менее, когда вы загружаете готовую сборку, в игру вступает Лицензия Microsoft. И тогда ваш VS Code резко перестаёт быть open source продуктом. Оказывается, в данном случае решает процесс сборки.
На практике различия между VS Code и Code-OSS минимальны. В частности, в VS Code работает телеметрия: то есть, Microsoft собирает данные об использовании продукта. Справедливости ради нужно отметить, что в наши дни существует множество продуктов, которые собирают такие данные.
Если вам нравится VS Code, но вы хотите рассмотреть «true» open source альтернативы, то вам определённо стоит читать дальше.
VSCodium
Самая очевидная альтернатива VS Code — это VS Code без фирменных дополнений Microsoft. Проект VSCodium содержит только свободные компоненты, построенные на основе кодовой базы VS Code. Разработчики VSCodium сделали всё возможное, чтобы мы имели возможность отключить телеметрию. Они подготовили чистую сборку исходного кода VS Code, которую вы можете скачать, не создавая её самостоятельно.
Разработчики напоминают, что VS Code включает в себя некоторые проприетарные инструменты, которые не могут поставляться с открытым исходным кодом. Если они вам нужны, существуют документированные способы решения этих проблем. Но если вам нужна очень специфичная функция из VS Code сборки Microsoft, вы должны убедиться, что она работает в VSCodium.
Кроме того, нужно проверить, что вся телеметрия отключена.
Code-OSS
Если вы не хотите использовать сборку VSCodium, вы можете самостоятельно скомпилировать VS Code из исходного кода и в итоге получить то же самое. Исполняемый файл называется Code-OSS, а не VSCode. Условия лицензирования и способы решения проблем с использованием проприетарных функций — те же, что и у VSCodium.
При первом запуске нужно проверить, что телеметрия отключена.
Atom — это IDE-подобный текстовый редактор с открытым исходным кодом, который Microsoft приобрела вместе с GitHub. Как и VS Code, вы можете расширить редактор Atom с помощью плагинов, добавить темы и собрать свою комбинацию дополнительных инструментов. Это кроссплатформенный продукт, который имеет встроенную интеграцию с GitHub. Короче говоря, Atom — это идеальный вариант, если необходимые вам расширения уже существуют или вы готовы их написать.
Как и VS Code, Atom по умолчанию использует телеметрию. Её можно отключить, и в отличие от VS Code, нет никаких ограничений на расширения, поэтому вам не нужно менять рабочий процесс из-за требований конфиденциальности. Atom, безусловно, полезный инструмент для разработчиков. Более того: он в принципе подходит для всех, кто использует компьютер. Если вы ищете хороший текстовый редактор общего назначения, можете попробовать Atom.
GNOME Builder
Geany
Geany — мощный, надёжный и лёгковесный редактор с полезными функциями, которые помогут вам написать хороший код на Bash, Python, Lua, XML, HTML, LaTeX и так далее. Он поддерживает 50 различных языков программирования и скриптовых языков, а также языки разметки и файлы (таких как .diff и .po). Geany как минимум обеспечивает сопоставление скобок и подсветку синтаксиса, а обычно предлагает гораздо больше.
С помощью плагинов вы можете добавить такие функции, как обозреватель проекта, проводник, отладка, терминал и так далее. Вы можете продолжать расширять его функциональность и в какой-то момент он превратится в настоящую IDE. Если вы не можете запустить VS Code на компьютере из-за ограничений ЦП или ОЗУ, Geany может стать хорошей альтернативой. Он быстро запускается, и потребляет малый объём памяти. Хотя Geany работает медленнее, чем Vim в терминале, он не тормозит даже на Raspberry Pi.
Brackets
Brackets — это текстовый редактор и IDE для веб-разработчиков. Он имеет мощную поддержку HTML, CSS, JavaScript, PHP и даже Python. У Brackets богатая экосистема расширений, поэтому с подходящими плагинами он позволит писать практически на любом современном языке.
Существуют расширения, помогающие анализировать, запускать скрипты и даже компилировать и выполнять код прямо в окне редактора. Brackets имеет традиционный интерфейс, который может понять практический каждый, кто выходил за пределы блокнота. Если вы потратите немного времени на добавление соответствующих расширений и знакомство с ними, Brackets с помощью автозаполнения и линтера поможет избежать глупых ошибок при наборе текста. И если вы пишете код, это ускорит процесс тестирования и отладки.
Если вам нравится быть впереди планеты всей, то стоит попробовать Che. Это облачная IDE, она работает по модели SaaS. Тем не менее, это полноценный open source проект. Если у вас есть экземпляр Kubernetes, можете полностью перенести её к себе.
Che — не просто IDE, которая живёт в облаке. Это IDE, созданная для облачной разработки. Она не пытается что-либо хранить на вашей локальной файловой системе. Если у вас есть Git-сервер, вы можете рассматривать его как файловую систему и работать над проектом непосредственно из его репозитория. Конечно, вы также можете скачать любой проект, над которым работаете, если хотите иметь локальную резервную копию.
Но его главная особенность, которой восхищаются разработчики облачных решений, заключается в том, что Che — это полнофункциональная среда разработки с открытым исходным кодом, ориентированная на Kubernetes. Если вы создаёте приложения, сайты или контейнеры (или их комбинацию) для облака, то вам стоит попробовать Che.
А чем пользуетесь вы?
Вы используете одну из этих альтернатив VS Code? Или может быть, пока ещё думаете о том, чтобы попробовать одну из них? Поделитесь своим опытом в комментариях?
На правах рекламы
Встречайте! Впервые в России — эпичные серверы!
Мощные серверы на базе новейших процессоров AMD EPYC. Частота процессора до 3.4 GHz. Максимальная конфигурация — 128 ядер CPU, 512 ГБ RAM, 4000 ГБ NVMe!
Писать код при желании можно и в текстовом редакторе — ничто не мешает вам создать простейший сайт в «Блокноте», сохранив файл с расширением .html. Однако если вы хотите сделать процесс комфортнее и быстрее, стоит обратить внимание на интегрированные среды разработки (Integrated Development Environment, IDE) или продвинутые редакторы. В этой подборке мы собрали 10 популярных платформ, которые предлагают удобные функции для веб-разработчиков.
Что такое IDE и зачем она вам
Существует немало функций IDE, которые вы вряд ли встретите в более простых инструментах, особенно если работаете над созданием веб-приложения или довольно сложного сайта. Вам, скорее всего, пригодятся:
— компилятор: превращает ваш код в исполняемый файл;
— интерпретатор: запускает скрипты, которые не нужно компилировать;
— отладчик: позволяет находить проблемные места и ошибки в коде;
— инструменты автоматизации: помогают автоматизировать сборку проекта и ускорить процесс разработки.
В IDE все эти элементы обычно объединяются в единую платформу.
Несмотря на многие преимущества IDE, на самом деле они нужны не всегда. Если вы занимаетесь в основном разработкой веб-интерфейсов, вполне можно обойтись и стандартным редактором кода. Также IDE не стоит использовать для создания простых статических сайтов, иначе вы можете начать стрелять из пушки по воробьям: более сложные инструменты скорее замедлят процесс, чем сделают его эффективнее.
На что обратить внимание при выборе среды разработки
1. Поддержка нужной вам операционной системы (ОС). Особое внимание этому пункту стоит уделить, если вы работаете в команде. Лучше всего отдавать предпочтение кроссплатформенным решениям.
2. Возможности совместной разработки. Это опять же относится к командам, собирающимся работать с общим репозиторием. Многие платформы, которые мы рассмотрим ниже, интегрируются с Git.
3. Поддерживаемые языки (программирования, разумеется). Здесь не забывайте о долгосрочной перспективе — вдруг когда-нибудь вы решите добавить в проект возможности, реализуемые на каком-либо другом языке. Стоит выбрать среду, которая поддерживает несколько языков программирования.
4. Цена вопроса. Есть много бесплатных решений с открытым исходным кодом. Однако, как обычно бывает почти со всем подобным программным обеспечением, стоимость зависит от количества доступных функций.
Чтобы помочь вам определиться, мы собрали 10 лучших IDE и редакторов кода, которые поддерживают популярные языки для веб-разработки (HTML, CSS, JavaScript, PHP и Python). Сразу оговоримся, что это не топ, а список (первый — не значит лучший, последний — не значит самый плохой). Поэтому вы можете выбирать любой инструмент, исходя из своих нужд и предпочтений.
Примечание: все указанные цены актуальны на момент написания материала.
1. Visual Studio + Visual Studio Code
IDE от Microsoft, Visual Studio, доступна только для операционных систем Windows и macOS. Поддерживает Python, PHP, JavaScript, HTML, CSS и многие другие языки.
Visual Studio обладает всеми преимуществами IDE, включая удалённую отладку. Кроме того, платформа содержит:
— Умное дополнение кода IntelliSense, чтобы ускорить процесс написания программ;
— Инструменты для совместной работы: управление доступами и настраиваемые параметры редактора позволят писать код в едином стиле;
— Интеграцию с Git;
— Простое развёртывание благодаря встроенной интеграции с Azure.
К недостаткам Visual Studio можно отнести стоимость: цены на лицензии Professional, предназначенные для профессиональных команд разработчиков, начинаются от 45 $ в месяц. Корпоративная лицензия обойдётся в 1199 $ за первый год, продление — 799 $ в год.
Visual Studio Code
В качестве более простого решения можете рассмотреть бесплатный, но очень мощный и популярный редактор Visual Studio Code — он предлагает не так много возможностей, как IDE, зато позволяет писать код более чем на 72 языках и включает функции отладки. VS Code поддерживается не только на Windows и macOS, но и на Linux.
В редакторе есть умное автодополнение IntelliSense, встроенная интеграция с Git, а также огромная библиотека расширений.
А ещё разработчики GitHub собираются встроить VS Code прямо в браузер с помощью инструмента Codespaces, чтобы можно было вносить изменения в проект, не выходя из GitHub. Сейчас Codespaces находится на этапе бета-тестирования.
2. IntelliJ IDEA
IntelliJ IDEA — Java-ориентированная платформа для разработки от JetBrains. Несмотря на это, она позволяет работать со всеми языками, которые мы упоминали выше (HTML, CSS, JavaScript, PHP и Python). Из коробки вам будут доступны инструменты для написания кода на HTML, CSS и JavaScript (в версии Ultimate). Поддержку PHP и Python можно добавить с помощью плагинов.
IntelliJ IDEA доступна для систем Windows, macOS и Linux. Ключевые функции:
— Умное автодополнение, которое предлагает элементы кода исходя из текущего контекста;
— Встроенная интеграция с системами контроля версий;
— Интеграция с инструментами сборки, такими как Apache Maven, Gradle и Webpack.
IntelliJ IDEA поставляется в трёх ценовых вариантах. Community-версия доступна бесплатно, однако она не включает себя поддержку JavaScript и работу с инструментами базами данных, что может быть критично для веб-разработки. Стоимость индивидуальной лицензии IntelliJ IDEA Ultimate — 149 $ в год, для организаций же цена составит 499 $ на пользователя в год. Также можно попробовать версию Ultimate бесплатно в течение 90 дней.
3. PyCharm
Если вы занимаетесь разработкой на Python, то присмотритесь к PyCharm — ещё одной IDE от JetBrains. Как и IntelliJ, она поддерживается всеми тремя основными операционными системами. Professional-лицензия включает поддержку HTML, JavaScript и CSS. Кроме того, вы всегда можете расширить функционал с помощью плагинов.
С PyCharm вам будут доступны:
— Автодополнение кода и автоматический поиск ошибок;
— Интеллектуальная навигация по проекту;
— Встроенные отладчик, профилировщик Python и терминал;
— Интеграция с популярными системами контроля версий, а также с Jupyter Notebook, Anaconda и другими библиотеками.
Как и IntelliJ IDEA, PyCharm имеет Community-версию с открытым исходным кодом, но с ограниченными функциями — в ней отсутствуют многие инструменты для веб-разработки, нет профилировщика Python и поддержки баз данных.
Professional лицензия стоит 89 $ за год для частных лиц и 199 $ в год для организаций (за одного пользователя).
4. PhpStorm
Если вам больше по душе PHP, то обратите внимание на PhpStorm от JetBrains. Эта IDE имеет много общего с IntelliJ IDEA и PyCharm. Вы можете использовать её на Windows, macOS и Linux, и она поддерживает разработку на JavaScript, CSS и HTML.
Кроме того, PhpStorm рекомендуется JetBrains для работы с популярными CMS: например WordPress, Drupal, Joomla и другими.
Функциональность включает в себя:
— Автодополнение кода и рефакторинг;
— Эффективные функции навигации;
— Встроенная интеграция с системами контроля версий, инструменты командной строки, управление базами данных SQL;
— Визуальный отладчик и функция Live Edit, позволяющая сразу посмотреть, как будут выглядеть изменения в браузере.
Что касается цен, то PhpStorm, в отличие от других продуктов JetBrains, не предлагает бесплатную лицензию. Стоимость начинается от 89 $ в год для индивидуального использования и 199 $ для организаций. Также доступна 30-дневная пробная версия.
5. WebStorm
Для разработчиков на JavaScript JetBrains предлагает платформу WebStorm. Она поддерживает популярные фреймворки для фронтенда (Angular, React, Vue.js) и бэкенда (Node.js, Meteor). Среди преимуществ IDE можно выделить:
— Умное автодополнение кода;
— Инструменты для тестирования Karma, Mocha, Protractor и Jest;
— Интеграция с популярными системами контролями версий.
WebStorm не имеет бесплатной лицензии, цена для индивидуального использования — 59 $ в год, для компаний — 129 $ в год на пользователя.
6. Komodo IDE
Komodo IDE от ActiveState позиционирует себя как «одна IDE для всех языков». И это действительно так: платформа поддерживает JavaScript, HTML, CSS, Python, PHP и множество других языков программирования.
Ключевые особенности Komodo IDE:
— Интеллектуальная подсветка синтаксиса и автодополнение кода;
— Визуальный отладчик и инструменты для тестирования;
— Предварительный просмотр страниц: не нужно переключаться между IDE и браузером;
— Интеграция с Devdocs.io для удобного поиска документации;
— Поддержка популярных систем контроля версий;
— Профилирование кода на Python и PHP.
Community-лицензия Komodo для одного пользователя полностью бесплатна. Расширенная индивидуальная лицензия стоит 84 $ в год, а цены на тарифы для команд разработчиков и бизнеса стартуют от 228 $ в год за одного пользователя.
7. Sublime Text
Строго говоря, Sublime Text больше похож на редактор кода, но он содержит функции, аналогичные полноценным IDE. Sublime Text доступен для всех трёх основных операционных систем и поддерживает HTML, CSS, JavaScript, PHP, Python и другие языки. Кроме того, он включает в себя несколько функций, позволяющих ускорить и упростить редактирование кода, например:
— Навигация Goto Anything для быстрого перехода к файлам, строкам или словам;
— Быстрое внесение изменений сразу в нескольких местах;
— Интеграция с Git через Sublime Merge;
— Быстрое переключение между несколькими проектами с фиксацией изменений.
Если вы хотите расширить возможности Sublime Text, подключите к нему плагины для автозаполнения, отладки и других расширенных функций.
Sublime Text можно скачать бесплатно, однако для дальнейшего использования необходимо приобрести лицензию. Индивидуальный план стоит 80 $ в год, а цена на бизнес-лицензию зависит от числа людей в команде (минимально — 50 $ в год за пользователя для команды от 50 человек).
8. Brackets
Brackets — редактор с открытым исходным кодом, который отлично подойдёт для разработчиков веб-интерфейсов. Доступен для Windows, Linux и macOS. Из коробки поддерживает HTML, CSS и JavaScript, а PHP и Python можно подключить через LSP.
Brackets позволяет редактировать файлы в режиме реального времени: вы можете следить за внешним видом вашего проекта по мере внесения изменений без необходимости перезагрузки страницы.
Также в Brackets есть множество расширений для интеграции с Git, автодополнения кода и других полезных фич.
Хотя Brackets тоже больше относится к редакторам кода, чем к полноценным IDE, он полностью бесплатен и даёт простор для экспериментов: вы можете сами создавать расширения для него или даже переписать исходный код программы под себя.
9. Atom
Atom — редактор кода с открытым исходным кодом от GitHub. Как можно догадаться, он имеет встроенную интеграцию с Git и GitHub. Atom совместим с Windows, macOS и Linux, а также позволяет:
— Совместно редактировать код в режиме реального времени с помощью Teletype;
— Быстро писать код с умным автодополнением;
— Разделять интерфейс редактирования, чтобы одновременно работать с несколькими файлами или проектами;
— Устанавливать расширения с помощью встроенного менеджера пакетов.
Также вы можете попробовать Atom IDE — расширенную версию Atom, более похожую на полноценную IDE.
10. NetBeans
NetBeans — платформа с открытым исходным кодом от Apache, включающая множество функций, необходимых для веб-разработки. Совместима с системами Windows, Linux и macOS. NetBeans больше ориентируется на Java, но по умолчанию также доступны JavaScript, HTML и CSS. PHP и Python можно добавить с помощью плагинов.
Функциональность NetBeans включает:
— Умное редактирование и автодополнение кода;
— Настраиваемые сочетания клавиш для более быстрой работы;
— Интеграция с Git, Maven и другими платформами.
NetBeans полностью бесплатна и открыта для вклада разработчиков, желающих усовершенствовать платформу.
Разумеется, в этой подборке мы привели лишь малую часть существующих сред разработки и редакторов кода. Например, можно было бы упомянуть о Notepad++, Eclipse или активно развивающихся облачных IDE вроде Codeanywhere или Cloud9.
Пишите в комментариях, какую IDE или редактор используете вы. Что вам в них нравится, а чего не хватает? Пробовали ли вы другие решения?
Делитесь, какие полезные подборки вы хотели бы видеть в блоге в будущем — мы обязательно учтём ваши пожелания.
Visual Studio Code – это один из наиболее популярных редакторов кода, разработанный корпорацией Microsoft. Он распространяется в бесплатном доступе и поддерживается всеми актуальными операционными системами: Windows, Linux и macOS. VS Code представляет собой обычный текстовый редактор с возможностью подключения различных плагинов, что дает возможность работать со всевозможными языками программирования для разработки любого IT-продукта.
Несмотря на столь высокую популярность программы, ее функционал до сих пор остается не таким очевидным, из-за чего многие пользователи предпочитают продукт конкурента, нежели VS Code. Чтобы решить все проблемы, возникающие при работе с Visual Studio Code, рекомендую ознакомиться с подробным гайдом по настройке этого редактора кода. В нем я покажу, что VS Code – это мощный инструмент, которым может пользоваться каждый.
Установка Visual Studio Code
С установкой среды не должно возникнуть никаких проблем, но давайте все же проведем небольшой ликбез. Выполним несколько действий:
- Переходим на официальный сайт и загружаем установочный файл.
- Следующим шагом запускаем установочник и ставим редактор кода на компьютер. В блоке «Выберите дополнительные задачи» рекомендую отметить два пункта, позволяющие запускать файлы через выпадающее меню – так вы сможете быстро открыть код в VS Code.
На этом установка завершена. Теперь мы можем использовать редактор кода по назначению. Обычно с этим не должно возникнуть никаких проблем, однако на слабых машинах запуск утилиты часто прерывается. Вылечить такой недуг можно с помощью добавления нового значения к пути ярлыка. Для этого откроем его свойства через правый клик мыши и в графе «Объект» пропишем --disable-gpu.
Готово! Теперь программа должна работать на любом компьютере.
Интерфейс Visual Studio Code
При первом запуске перед нами отобразится окно приветствия, через которое можно получить быстрый доступ к ранее запущенным проектам либо создать новые. Весь интерфейс на английском языке (всего в несколько кликов он переводится на русский, но об этом чуть позже). Давайте пока разберемся с интерфейсом: откроем для примера файл с кодом, посмотрим, как его идентифицирует программа без предварительных настроек, и разберем каждый блок утилиты.
Запустить файл с кодом мы можем через правый клик мыши -> Открыть с помощью Code. Файл можно открыть и в программе: для этого в верхнем правом углу выбираем «File» и жмем «Open File…». После этого переходим в нужную директорию и выбираем файл.
В результате перед нами отобразится окно с кодом из файла. Давайте визуально разделим интерфейс на блоки и рассмотрим каждый из них более детально.
Первое, что бросается в глаза, – это блок кода, для которого отведено больше всего места. Название функций и прочее подсвечено разными цветами. Здесь же указан путь до файла, а чуть выше расположены вкладки-файлы, по которым можно перемещаться. С помощью них мы можем добавлять не просто один файл с кодом, а целый проект.
Следующий блок – левая панель управления, включающая в себя 5 основных вкладок: «Проводник», «Поиск», «Система управления версиями», «Запуск кода» и «Расширения». Первая предоставляет пользователю возможность просматривать содержимое проекта и быстро перемещаться внутри него.
Вторая вкладка – поиск. Используется для нахождения слов в документе. Он также может быть запущен с помощью комбинации клавиш «CTRL+SHIFT+F». Алгоритм использования довольно прост – вводим название в поиск и смотрим результат.
Система управления версиями – предназначена для взаимодействия с git.
Запустить и проверить работоспособность кода мы можем в следующей вкладке:
Еще одна важная вкладка, с помощью которой из Visual Studio Code можно сделать функциональную утилиту, это «Расширения». В ней находятся установочники для всех популярных инструментов, используемых разработчиками.
Следующий блок – нижний статус-бар. В нем отображается общая информация о состоянии программы. Обратите внимание, что VS Code автоматически определяет язык программирования и информирует нас об этом.
И еще один раздел – правая панель, включающая в себя небольшой дисплей, который отображает код в уменьшенном варианте, а также позволяет удобно скроллить внутри него. Здесь же мы можем разделить окно кода на несколько столбцов, а также закрыть все файлы одним кликом – для этого используются две верхние кнопки.
Как видите, если пройтись по интерфейсу программы, то она уже не кажется такой сложной. Чтобы сделать все еще проще, давайте проведем русификацию всех элементов интерфейса. О том, как это сделать, поговорим далее.
Русификация Visual Studio Code
Чтобы провести русификацию программы, открываем вкладку с расширениями и прописываем запрос vscode-language-pack-ru. В результате будет отображен новый элемент с кнопкой «Install» – кликаем по ней и ожидаем завершения установки.
Перезагружаем программу и смотрим, что язык интерфейса был изменен на русский:
Если вы захотите вернуть англоязычный интерфейс, для этого потребуется открыть раздел с плагинами и удалить установленный пакет с русским языком.
Внешний вид
Мы можем полностью изменить цветовую схему утилиты. Чтобы это сделать, воспользуемся комбинацией клавиш «CTRL+SHIFT+P» и введем запрос «theme». В отобразившемся списке выберем «Параметры: Цветовая тема».
В результате отобразится список возможных тем – для примера возьмем солнечную тему.
После применения темы интерфейс примет следующий вид:
Обратите внимание, что это не весь список тем – вы можете установить и другие. Для этого пролистайте в самый низ списка и выберите «Установить дополнительные цветовые темы…». После этого в левой части отобразится дополнительный блок с доступными цветовыми решениями.
Вот так мы можем изменить внешний вид программы. Теперь давайте перейдем к техническим моментам и рассмотрим работу наиболее важных плагинов.
Управление проектами
По умолчанию Visual Studio Code поддерживает работу с несколькими проектами, однако перемещаться между ними не очень удобно. Для удобства обычно используют плагин под названием Project Manager. С его помощью открывается возможность перемещения между рабочими областями всего в один клик. Установка проходит через магазин расширений, о котором мы говорили ранее. После того как менеджер проектов будет установлен, в левой панели управления появится новая вкладка для работы с плагином.
Теперь работа с проектами не должна вызывать никаких трудностей.
Автоформатирование кода
Один из важных этапов программирования – умение приводить все к единому виду с правильными отступами. Для таких задач в VS Code есть специальные плагины, позволяющие форматировать весь текстовый документ. Это такие расширения, как PHP-CS-Fixer для PHP, Prettier для JS/HTML/CSS и другие.
Рассмотрим, как форматируется код, написанный на JavaScript:
- Возьмем для примера функцию, отступы в которой выстроены случайным образом.
- Устанавливаем плагин Prettier через магазин расширений и открываем документ, который нужно отформатировать. Зажимаем комбинацию клавиш «CTRL+SHIFT+P» и вводим запрос «Format Document».
- Смотрим на код и видим, что он преобразился и принял аккуратный вид.
Аналогичным образом мы можем отформатировать код, написанный на других языках программирования. Для этого достаточно установить нужное расширение.
Автодополнение
В популярных программах, подобных Visual Studio, встроена функция автодополнения, помогающая завершить код. Например, вы пишите строчку кода, а среда подсказывает, как ее завершить. С помощью этой опции можно не только вспомнить нужную функцию, но и быстро написать код.
По умолчанию функция автодополнения в Visual Studio Code доступна только для некоторых языков. Для прочих языков программирования существуют дополнительные пакеты с окончанием «intellisense».
Посмотреть, какие пакеты доступны, вы можете в магазине плагинов.
Рекомендую установить PHP Intellisense, CSS Intellisense и Path Intellisense.
Управление Vim
Vim – это свободный текстовый редактор, работающий на основе vi. По умолчанию он установлен на каждой операционной системе семейства Unix. Кроме того, он доступен и в Visual Studio Code. Для работы с ним потребуется установить расширение с аналогичным названием:
Теперь мы можем перемещаться по файлу клавишами h, j, k, l, использовать Esc и сохранять файл командой :w.
Отладка кода
Для того чтобы запустить код в VS Code, нам нужно воспользоваться одним из расширений. Например, для JavaScript подойдет Debugger for Chrome. Узнать, какое расширение необходимо для конкретного языка, можно через «Выполнить» -> «Установить дополнительные отладчики…».
В результате в левой части окна будет отображен список доступных плагинов – найдите в нем подходящий для вас и следуйте инструкции.
После того как нужный плагин будет установлен, можно запускать отладку кода. Для этого достаточно открыть пункт «Выполнить» и нажать на кнопку «Запустить отладку». Также это можно сделать с помощью клавиши «F5».
С помощью плагинов мы можем отладить код, написанный на любом языке программирования.
Заключение
Сегодня мы разобрали функционал инструмента Visual Studio Code. Данная среда хороша не только для профессионалов, но и для новичков, изучающих основы программирования. Одно из преимуществ программы – это минимальное требование к железу: запустить программу можно практически на любом компьютере.
Надеюсь, что работа в VS Code больше не будет для вас проблемой, а активные проекты ждет успех. Удачи!
Читайте также: