Перевод статьи «5 Top Cloud IDEs for JavaScript Developers».
Традиционно разработчики пишут код в текстовых редакторах (редакторах кода), установленных на их локальных машинах. Но в последнее время привычки начали меняться. Рост популярности облачных сервисов привел, в том числе, и к подъему облачных сред разработки (IDE).
Эти IDE удовлетворяют отдельный спектр запросов разработчиков. Вы ищете сервис, с помощью которого сможете выборочно делиться отрывками кода с коллегами? Вам нужна возможность встраивать отрывки кода в посты блогов или документацию, которую вы создаете? Вы ищете вариант редактора, позволяющий вам писать и обычный текст, добавляя его к коду для пояснения концепций прямо внутри IDE? Вам нужна IDE для полного цикла разработки? Облачные IDE особенно хороши в том, что касается возможности делиться кодом и работать совместно.
В этой статье мы расскажем о самых популярных облачных IDE для JavaScript-разработчиков.
1. Codetable
Codetable от HackerEarth это простая IDE с базовым функционалом. Она идеальна для того, чтобы делиться сниппетами кода. В Codetable разработчику доступно большое количество языков программирования. Также есть возможность запускать код дистанционно, при помощи серверов HackerEarth.
HackerEarth главным образом обслуживает хакатоны, проводимые компаниями для найма новых разработчиков. В Codetable для выполнения фрагментов кода используется тот же движок.
Когда вы закончили писать программу, она отсылается на сервер для выполнения. После окончания выполнения вам показываются результаты работы программы, а также время выполнения и уровень использования памяти. Это именно те параметры, которые применяются для оценки программы на хакатонах. Также можно определить пользовательский input для программы — это дополнительная особенность.
Хотя Codetable обладает только базовым функционалом, это хороший выбор для начинающих разработчиков, не желающих отвлекаться на большое количество функционала, в котором они пока все равно ничего не понимают.
2. JSFiddle
JSFiddle это одна из самых ранних IDE. Она родилась из идеи «песочницы» для HTML, CSS и JavaScript. JSFiddle послужила вдохновением для многих конкурентов.
Эта IDE позволяет вам писать код на указанных языках фронтенда, предоставляет возможность взаимодействия между ними и выводит результаты в режиме реального времени. В этом инструменте отрывки кода называются «fiddle».
Основное предназначение подобных «песочниц» — тестирование кода в режиме реального времени, а также предоставление возможности делиться отрывками кода и работать над кодом с коллегами. Ваши товарищи могут сделать форк вашего кода, модифицировать его и тоже поделиться этим кодом. Кроме того, вы можете встраивать отрывки своего кода (с превью в реальном времени) на сторонние сайты, например, в блог или в документацию, — для наглядности.
Также при помощи JSFiddle можно симулировать AJAX-запросы.
JSFiddle предоставляет разработчику вспомогательный код в виде бойлерплейтов для популярных JS-библиотек — jQuery, Vue и React. К уникальным особенностям JSFiddle можно отнести возможность добавления кода на StackOverflow и баг-репорты через GitHub Issues.
3. CodePen
Хотя CodePen тоже зарождалась в качестве песочницы для HTML, CSS и JavaScript кода, с годами она существенно развилась и теперь предоставляет гораздо больше функционала.
CodePen служит в качестве онлайн-инструмента социальной разработки для фронтенд-разработчиков. Как и JSFiddle, она выполняет все основные функции, которые можно ожидать от облачной IDE: с ее помощью можно делиться кодом, тестировать его и работать над ним вместе с товарищами.
Основной функционал добавления HTML, CSS и JavaScript кода, которые могут взаимодействовать между собой, остается неизменным. Вы можете сохранить «pen», поделиться им с коллегами и даже встроить на сторонние сайты.
Аккаунт на CodePen для управления всем вашим кодом можно создать бесплатно, а платная версия CodePen Pro обойдется вам от 8 долларов в месяц (счет выставляется за год). Бесплатный аккаунт дает доступ ко всему базовому функционалу CodePen. Оплатив CodePen Pro, вы получаете возможность убрать рекламу, создавать приватные Pen-ы, получить доступ к хостингу ассетов и более высокие позиции в рейтинге популярности.
Если вам нужна полнофункциональная JavaScript IDE, CodePen Pro это хороший вариант. В 2017 году CodePen представила новый функционал — Projects. С его помощью можно прямо на сайте управлять целыми фронтенд-проектами.
4. Observable
Observable это облачная JavaScript-IDE, созданная Майком Бостоком, который также был одним из основных разработчиков D3.js. В своей работе он вдохновлялся Jupyter — аналогичным веб-инструментом для создания заметок на Python. «Записные книжки» Observable предназначены для создания JavaScript-заметок в облаке, причем кроме самого кода вы можете хранить и текст в разметке Markdown.
Demo notebook поможет вам испытать функционал Observable перед созданием аккаунта. Добавление в код Markdown-сниппетов открывает много новых возможностей. Вы можете постепенно объяснять концепцию, добавляя пояснения к блокам кода в рамках одной «записной книжки». Также можно использовать этот инструмент для создания документации по вашей программе. Бесплатный аккаунт на Observable дает вам возможность создавать новые записные книжки, сохранять изменения и делиться кодом с коллегами.
Teams at Observable это платный функционал (цена стартует от 9 долларов в месяц за каждый редактор), предоставляющий вам значительно больше возможностей для командной работы. Функционал многопользовательского редактирования позволяет нескольким членам команды одновременно работать над одной записной книжкой.
5. Google Cloud Shell
Google Cloud Shell предоставляет вам среду разработки в облаке. Вы получаете доступ к терминалу в браузере, причем аутентификация будет привязана к вашему Google-аккаунту.
Cloud Shell по умолчанию содержит такие популярные инструменты как MySQL-клиент, Docker и Kubernetes. Кроме того, Cloud Shell готова к разработке бэкенд-технологий (Node.js, Python и PHP). Вам предоставляется 5 GB пространства в вашей домашней директории.
Google Cloud Shell бесплатна для пользователей Google Cloud Platform. С ценами Google Cloud более подробно можно ознакомиться здесь.
Если вам нужна мощная виртуальная машина, портативная и доступная где угодно, Google Cloud Shell это прекрасная платформа для вас.
Вы можете вызывать терминал из браузера и запускать в нем обычные unix-команды. Помимо консольных редакторов VIM и Emacs, Google также предоставляет графический текстовый редактор в браузере (при этом окно браузера делится надвое). При использовании этого редактора вы также будете видеть графическое представление файловой системы в меню слева — им можно пользоваться для загрузки и скачивания файлов.
Если вы ищете альтернативу локальной машине для разработки, Google Cloud Shell способна вам помочь.
Какую IDE выбрать
Давайте вернемся к вопросам, которые мы ставили в начале статьи.
Если вам нужно запускать маленькие сниппеты кода или делиться кодом с друзьями, стоит попробовать Codetable от HackerEarth.
Вы хотите иметь возможность встраивать свой код в статьи и работать над ним совместно с коллегами? Обратите внимание на JSFiddle или CodePen.
Если вам нужна уникальная возможность смешивать markdown и ваши отрывки кода, — выбирайте Observable, она идеальна для составления документации и написания статьей.
Вы хотите решение для синхронной командной работы? Присмотритесь к функционалу Teams на Observable или Team Plans на CodePen Pro.
Если же вам нужна полноценная IDE в облаке, попробуйте CodePen Pro или Google Cloud Shell.
[customscript]techrocks_custom_after_post_html[/customscript]
[customscript]techrocks_custom_script[/customscript]
