Программы для совместного программирования
Мир ударными темпами осваивает киберпространство, переходя в онлайн. В этой статье мы рассмотрим лучшие инструменты для совместного онлайн-кодинга и другой работы над проектами.
1. Teletype для Atom
Atom – разработанный GitHub бесплатный редактор с открытым исходным кодом для Linux, macOS, Windows. Поддерживает все популярные языки программирования. Teletype – плагин, добавляющий возможность совместного редактирования кода в режиме реального времени. Отсутствует централизованный сервер: совместная работа по peer-to-peer. Для шифрования всех взаимодействий между сотрудниками применяется WebRTC. Принцип работы продемонстрирован на видео ниже:
Цена: бесплатно.
2. Cloud9 IDE
AWS Cloud9 – облачная IDE от Amazon, поддерживающая более 40 языков, включая C, C++, CoffeeScript, Go, Java, PHP, Python (2 и 3) и Ruby. Она по умолчанию включает все SDK, библиотеки и подключаемые модули, необходимые для создания бессерверных приложений. Cloud9 имеет собственный терминал, предоставляющий доступ с привилегиями sudo к управляемому инстансу Amazon EC2, на котором размещена среда разработки, а также интерфейс командной строки AWS с предварительно настроенной аутентификацией. Это упрощает быстрый запуск различных команд и обеспечивает прямой доступ к сервисам AWS. Есть поддержка нескольких параллельных сред разработки для изолирования ресурсов проекта.
В бесплатной версии доступно: 1 Gb RAM + 1 vCPU, Amazon Linux либо Ubuntu Server 18.04 LTS, чат, подключение через SSH.
Внешний вид AWS Cloud9
Цена: Бесплатно первые 12 месяцев. Если среда задействует ресурсы за пределами уровня бесплатного пользования, они оплачиваются по стандартным тарифам AWS.
3. Visual Studio Live Share
Visual studio code – редактор кода, разработанный Microsoft для Windows, Linux и macOS. С помощью плагина Visual Studio Live Share организуется общий доступ и совместная работа над проектами. Кодом можно делиться в режиме «только чтение» или «запись», а также обмениваться терминалами и серверами.
Цена: бесплатно.
4. CodeSandbox
CodeSandbox работает с JavaScript и TypeScript: Node.js, Angular, Adonis, Gatsby, Marko, Nuxt, Next, Sapper, Apollo, Ember, Nest, Styleguidist, MDX Deck, Gridsome, Quasar и Vuepress.
Редактировать можно без регистрации, но для включения общего доступа нужно авторизоваться через GitHub. Приглашенные пользователи могут одновременно редактировать, создавать, переименовывать и обновлять файлы и код. Также можно увидеть, какой файл они просматривают и над чем сейчас работают. Есть чат и уведомления. Функция Classroom Mode позволяет назначать определенных людей редакторами, остальных – в режим «только для чтения».
Внешний вид CodeSandbox IDE
Цена: бесплатно или 9$/мес. за безлимитные приватные песочницы и репозитории для проектов на GitHub.
5. Codeshare
Codeshare поддерживает более 80 языков, есть видеочат, темы на выбор, возможность скачать код, но каждые 24 часа файлы обнуляются. То есть отлично подходит для собеседований. Чтобы включить общий доступ, достаточно нажать кнопку Share .
Внешний вид Codeshare
Цена: бесплатно в режиме для чтения.
6. CodePen
CodePen – онлайн-платформа для редактирования и хранения кода на HTML, CSS и JavaScript. Поддерживает возможность совместного доступа Collab Mode:
Цена: от 8$/мес.
7. Collabedit
Collabedit – веб-редактор кода, позволяющий совместно работать в режиме реального времени.
Цена: бесплатно.
8. Codebunk
Codebunk – еще один веб-редактор. Без регистрации можно добавлять пользователей с правами «только для чтения», просто отправив ссылку на страницу с кодом. Поддерживает 21 язык программирования. Есть видео- и текстовый чат.
Внешний вид Codebunk
Цена: первый месяц бесплатно, далее от 9$/мес.
9. Repl.it
Рис. 6. Repl.it
Цена: в бесплатной версии работать одновременно могут только 2 пользователя. Доступно 100Мб для хранения кода, 500 Мб оперативной памяти, 0.2 – 0.5 vCPUs.
10. kodeWeave
kodeWeave – онлайн редактор HTML, Javascript и CSS с аудио- и текстовым чатом. Совместная работа доступна без регистрации.
Внешний вид kodeWeave
Цена: бесплатно. В начале появляется неназойливая реклама.
11. SyncFiddle
SyncFiddle – поддерживает JavaScript, HTML, CSS. Совместное редактирование по ссылке без регистрации. Срок хранения кода – 7 дней. Есть история изменений.
Внешний вид SyncFiddle
Цена: бесплатно.
Google Colab
Google Colab – бесплатная облачная среда для Jupyter Notebook, позволяющая совместно работать над проектам, написанными на Python. Хорошо подходит для машинного обучения, анализа данных и образования. Предоставляет свободный доступ к вычислительным ресурсам, включая графические процессоры. Блокноты запускаются путем подключения к виртуальным машинам с максимальным сроком работы – 12 часов. Код можно сохранять на Google Drive.
Внешний вид Google Colab
Цена: бесплатно.
Если в вашей компании тяга ко всему облачному, присмотритесь к Cloud9 от Amazon или к более специфическим: kodeWeave, CodeSandbox или CodeBunk. В ином случае имеет смысл просто установить плагин к VS Code или Atom. Для совместной работы с данными мы рекомендуем использовать Google Colab. А каким сервисом пользуетесь вы? Поделитесь в комментариях.
«Люди не являются островами в открытом океане». Это высказывание успешно можно использовать особенно в том случае, если вы — дизайнер или разработчик. Несмотря на существование платных средств, как Basecamp и Zimbra, вы можете использовать ещё и бесплатные, которые, пожалуй, не уступают платным (а порой и обгоняют их).
В этой статье мы рассмотрим 14 бесплатных Web-приложений для совместной работы в сети Интернет. Нужен вам простой редактор с самыми основными возможностями или полнофункциональное приложение для управления проектами, вы сможете обнаружить здесь по крайней мере одно приложение, удовлетворяющее вашим требованиям.
1. Google Docs
Пожалуй, это самое известное онлайн-приложение для совместной работы над документами. С помощью него вы можете открывать доступ к документам, электронным таблицам вашим коллегам или клиентам и работать с ними в режиме реальном времени. Так как Google Docs — это Web-приложение, то требования у него минимальные, а документы хранятся на сервере, что позволяет вам получить доступ к ним из любой точки Солнечной Системы (при условии наличия у вас соединения с интернетом). Если вы ещё не придумали как использовать это приложение, вам уже подсказывают.
2. Stixy
Stixy — это гибкая система для рисования и размещения объявлений. С помощью неё вы сможете создавать неограниченное число записок, изменять их настройки и перемещать по своему виртуальному столу. Помимо всего прочего, есть ещё одно полезное её применение: комментирование и совместное обсуждение Web-страниц или их частей.
3. Project2Manage
Данное приложение является полноценным бесплатным менеджером проектов (как, например Basecamp). Каждому, кто захочет завести себе проект, может сделать их неограниченное количество. Пользователь может устанавливать различные уровни доступа и ограничения для каждого из членов команды, описывать свои задачи, результаты работы и т.д.
Данный сервис — это бесплатное, Web-ориентированное приложение для совместного брейнсторминга. Вы можете создавать с помощью него красивые mind maps («карты разума»), делясь ими с другими членами команды. После этого вы можете сохранить карту, послать по почте, распечататать или вставить напрямую в Web-страницу (вам даётся HTML-код вставки). Помимо прочего, вы можете просто дать ссылку на созданную карту в режиме только для чтения, например как это сделал я. Данный сервис занял почётное место среди моих закладок, так как он позволяет быстро и удобно работать с mind maps.
5. Dabbleboard
Dabbleboard — самодостаточное приложение для рисования. Вы можете рисовать эскизы интерфейса, диаграммы, создавать диаграммы, включая много других разных вещей. Вы можете создавать тулкиты (наборы объектов рисования многократного использования) или использовать предопределённые.
6. Protonotes
Protonotes является бесплатным виджетом для ваших HTML-прототипов. Для его добавления на собственную страницу вам необходимо лишь поиграться с JavaScript. Protonotes очень подходит для тестирования удобства использования интерфейса, критики дизайна, тестирования чего-либо. Чтобы всегда быть в курсе событий (например, когда коллеги добавят новую заметку), вы можете подписаться по RSS. Кроме того, все данные могут быть экспортированы, например, в CSV и открыты в приложениях, таких как Excel.
7. ProjectPier
Ещё одно онлайн-приложение для управления проектами, однако ProjectPier ещё и OpenSource-проект, написанный на PHP. Управляйте вашими задачами, членами команды, проектами с применением единого интерфейса, который сам по себе является очень простым, лёгким. Если вы всё ещё не уверены, стоит ли использовать данное Web-приложение, попробуйте принять 10 причин на это от разработчиков.
8. Twiddla
Разработчики позиционируют свой продукт как бесплатную Web-площадку для проведения встреч, совещаний. Twiddla является исключительным решением для подобных целей. Вы можете просматривать Web-сайты, одновременно разрисовывая их так, как вам это будет угодно, обмениваться файлами и устраивать беседы с коллегами. Однако существует ещё и возможность аудиосвязи (специальная опция для тех, кто плохо рисует). Данный проект также подойдёт тем, кто любит критиковать Web-сайты, их дизайн или удобство использования.
9. Wetpaint
Wetpaint — это приложение для совместной работы группы людей, который сочетает в себе возможности Wiki, блогов, форумов и социальных сетей. Однако, несмотря на обилие возможностей, программа очень простая и ею легко сможет овладеть даже человек без каких-либо специальных технических навыков.
10. Thinkature
Бесплатное средство для совместной работы. Вы получаете рабочее пространство, на котором вы можете рисовать, переписываться с коллегами и собирать контент со всего окружающего Web. Гибкость Thinkature позволяет вам стать настоящим хозяином программы.
11. Spicebird
Если вы хотите управлять своим проектом с помощью настольного приложения, вам следует обратить внимание именно на Spicebird — полноценное средство, призванное удовлетворить всем нуждам менеджера проектов. В него встроен чат, групповой календарь, адресная книга и многое другое. Если у вас всё ещё остались вопросы, вы можете посмотреть видеодемонстрацию приложения.
12. Mindquarry DO
Данное приложение с открытым исходным кодом для работы в команде написано на Java (J2EE). Вы можете поставить его себе на сервер и быть уверенным, что передаваемые вами данные не попадут третьим лицам. Для дополнительной информацией по установке обязательно следует обращаться к списку требований.
13. Vyew
Vyew очень похожа на Twiddla: с помощью неё можно устраивать конференции, в которых одновременно могут участвовать до 20 человек. Вы можете открывать в общий доступ свои рабочие столы, использовать встроенное средство для захвата экрана. Вместе с тем, вы можете создавать и обмениваться диаграммами с другими участниками конференции с помощью расширения DiagramVyew.
14. Writeboard
Написанное небезызвестной группой энтузиастов 37 Signals, данное приложение — простой способ обмениваться информацией вместе с коллегами. Вы начинаете с созданием собственного рабочего пространства, приглашаете коллег и просто начинаете писать. Ваши коллеги смогут увидеть ваши изменения и правки в режиме реального времени. Вы можете сохранять и отслеживать изменения, создавать новые и откатывать документ к старым версиям.
Программ, предназначенных для написания и редактирования исходного кода веб-приложений, великое множество. Современные и удобные редакторы способны закрывать забытые кавычки, расставлять отступы, скобки и даже дописывать за программистом команды. Мощные IDE сами обновляют содержимое файлов на удаленных серверах и хранят историю изменений проекта. Подобрать идеальный продукт – задача почти невыполнимая. Сберечь время поможет подборка самых популярных решений.
Для удобства все инструменты разбиты на три группы:
- редакторы кода – относительно простые программы, основная функция которых состоит непосредственно в создании и изменении файлов с программным кодом;
- многофункциональные интегрированные среды (IDE) – мощные инструменты, объединяющие десятки прикладных функций;
- облачные IDE – функциональность десктопных сред для веб-разработки в виде интернет-сервиса.
Параметры инструментов сведены в общие групповые таблицы. Это позволит наглядно сравнить разные продукты и выбрать подходящий.
Редакторы кода
Komodo Edit
Мини-версия полноценной среды разработки Komodo IDE по умолчанию предоставляет базовые функции редактора, а подключаемые расширения добавляют поддержку синтаксиса разных языков и полезные опции, например, компиляцию препроцессоров CSS.
Komodo Edit не является признанным лидером среди аналогичных продуктов, но свои функции выполняет отлично. Особенно хорош редактор для обработки XML.
- поддержка множества языков (с плагинами);
- автодополнение кода и подсказки;
- выделение сразу нескольких фрагментов текста;
- удобное управление проектом, отслеживание изменений файлов;
- быстрая навигация.
Vim – расширенный вариант классического редактора текстов Vi, используемого в системах UNIX. Редактирование кода изначально не было его предназначением, но расширения и плагины довели его практически до совершенства. Существует забавная обучающая онлайн-игра, которая помогает освоить Vim, – Vim Adventures. Также начинающим будет полезна небольшая шпаргалка.
- огромное количество дополнений;
- многоязычность;
- поддержка множества файловых форматов;
- мощные поисковые инструменты;
- возможность бесконечно отменять внесенные изменения;
- интеграция с большим количеством сторонних приложений.
GNU Emacs
Еще один базовый редактор кода Linux-систем GNU Emacs сложнее, чем тот же Vi, но при этом мощнее и имеет большую функциональность:
- несколько режимов редактирования, синтаксическое выделение кода для разных языков;
- подробная документация и руководство для начинающих пользователей;
- поддержка кодировки Unicode;
- использование визуального интерфейса или диалекта Emacs Lisp для тонкой настройки рабочей среды;
- хороший отладчик;
- дополнительные удобства, например, почтовый клиент, планировщик;
- менеджер расширений.
Adobe Brackets
Относительно молодой кодовый редактор Brackets сделал основной упор на визуализацию и упрощение работы с CSS-препроцессорами. Проектирование веб-страницы прямо в браузере становится очень быстрым и легким делом. Brackets – отличное решение для программистов и дизайнеров, имеющих дело с пользовательскими интерфейсами и фронтендом в целом.
- визуализация HTML-кода и стилей, возможность просмотра изменений в режиме реального времени и мгновенного редактирования;
- работа с PSD-файлами, возможность импорта изображений без использования Adobe Photoshop;
- удобная компиляция CSS-препроцессоров.
Visual Studio Code
Технология IntelliSense обеспечивает умное автодополнение кода: редактор может дописывать названия уже объявленных функций, а подсказки содержат ссылки на нужные главы документации.
В редактор встроен отладчик кода.
Atom от GitHub
Текстовый редактор Atom хорош уже в базовой конфигурации, а дополнительные настройки могут сделать его идеальным.
Встроенный пакетный менеджер облегчает поиск, установку и создание модулей.
По умолчанию установлены 8 тем оформления, а также есть доступ к темам, созданным другими участниками сообщества.
- умное автодополнение;
- удобный файловый менеджер;
- разделение рабочей области для удобства анализа нескольких файлов благодаря многопанельному интерфейсу;
- удобные механизмы поиска внутри проекта.
Sublime Text 3
Sublime Text - это удобный и быстрый редактор, работать с которым одно удовольствие. Он кроссплатформенный, нетребовательный к ресурсам компьютера и легко расширяемый. Бесплатная базовая версия предоставляет всю необходимую функциональность:
- подсветку синтаксиса распространенных языков;
- автодополнение;
- множественное выделение (очень удобно!);
- фолдинг (сворачивание блоков кода);
- удобные комбинации горячих клавиш;
- возможность разделить рабочую область на несколько окон;
- широкие возможности кастомизации.
Платная лицензия стоит $80, но никаких новых функций у продукта не появится.
Для Sublime создано очень много плагинов. С их помощью можно легко добавить дополнительные возможности:
- отладку;
- темы оформления;
- поддержку языков.
Сравнение текстовых редакторов
Интегрированные среды разработки (IDE)
Eclipse
Для разработчиков, часто меняющих платформы программирования и языки, идеальным решением может стать Eclipse. Среда имеет хорошую поддержку Java, JavaScript и множества других популярных языков. С ее помощью также удобно создавать приложения для мобильных устройств.
NetBeans
IDE NetBeans имеет огромное количество поклонников по всему миру. Среда предназначена для удобной разработки мобильных, десктопных и веб-приложений.
В программе есть предустановленный анализатор кода для языка Java, поддержка C++ и PHP. Для удобства веб-разработчика встроены современные инструменты обработки HTML5 и JavaScript, включая платформу NodeJS и фреймворк AngularJS.
NetBeans осуществляет синтаксическую и семантическую подсветку кода, расставляет отступы, облегчает рефакторинг. Из приятных мелочей – сниппеты, подсказки и генераторы фрагментов кода.
Geany
Одна из самых легких и быстрых сред для веб-разработки. Geany обеспечивает удобную работу с HTML, XML, PHP и другими языками веб-программирования.
- поддержка и подсветка синтаксиса множества языков;
- фолдинг (сворачивание блоков кода);
- автодополнение и подсказки;
- сниппеты;
- удобная навигация;
- управление проектом;
- менеджер плагинов;
- система обработки кода от компиляции до выполнения.
Light Table
Основная идея еще одной замечательной среды Light Table заключается в том, что для комфортной разработки требуется не просто окно кодового редактора и менеджер папок, а полноценная и удобная рабочая область. IDE позволяет перемещать элементы, вынося вперед самые нужные, для создания максимально удобного интерфейса.
JetBrains
Здесь не одна IDE, а сразу несколько. Компания создает специализированные среды разработки для разных языков – выбирайте по вкусу:
Достоинства подобных сред для веб-разработки очевидны. Они мощны и заточены под конкретный язык со всеми особенностями синтаксиса и логики. Это интеллектуальные редакторы с широчайшими возможностями анализа, отладки, тестирования и рефакторинга кода. Все IDE позволяют легко перемещаться по проекту и поддерживают работу с системами контроля версий.
Из недостатков - повышенная требовательность к ресурсам системы и цена (у всех продуктов есть бесплатный пробный период - 30 дней).
Сравнение интегрированных сред для веб-разработки
Облачные IDE
Множество десктопных приложений давно переместились в "облако", включая и IDE. Быстро растет популярность удобных и доступных облачных сред для веб-разработки. Переход на принципиально новую технологию хранения данных и организации работы облегчает столь широко используемый инструмент, как GitHub.
Cloud9
Программа Cloud9 полностью написана на языке JavaScript. Работу серверной стороны обеспечивает NodeJS. Эта IDE – настоящий рай для веб-разработчика, неудивительно, что ее быстро освоили фронтендеры и дизайнеры.
Помимо вездесущего JavaScript, среда отлично поддерживает синтаксис большинства популярных языков программирования.
- Vim-режим;
- удобный версионный контроль (Git, SVN);
- встроенные инструменты для контроля качества CSS- и JavaScript-кода.
Codeanywhere
Одна из самых удобных облачных сред для веб-разработки – IDE Codeanywhere. Она работает практически на всех платформах, включая мобильные. Теперь разработчик может программировать там, где ему удобно.
Редактор понимает синтаксис базовых языков веб-программирования (HTML, CSS, JavaScript, PHP, SQL) и ряда других. Интегрированный Dropbox и SFTP-клиент позволяют обмениваться файлами с другими разработчиками и осуществлять резервное копирование.
Eclipse Che
Многопользовательская система Eclipse Che объединяет в себе среды для разработки и выполнения кода. Система поиска и установки плагинов позволяет настроить инструмент в соответствии с потребностями программиста.
Che представлена в двух конфигурациях. Многопользовательская версия способна обслуживать несколько изолированных друг от друга рабочих мест, а также управлять доступом пользователей с разными правами с помощью Permissions API. Аутентификация и регистрация новых пользователей контролируется механизмом KeyCloak. Для хранения пользовательских данных используется СУБД PostgreSQL. В однопользовательской версии эти компоненты отсутствуют.
Neutron Drive
Большинство сложных проектов применяют уже созданные и испытанные ранее решения. Так, облачная среда Neutron возникла на базе редактора кода Ace. Новая IDE имеет встроенный SFTP-клиент, что позволяет программисту легко изменять файлы на удаленном сервере и сразу же видеть внесенные изменения.
Интерфейс программы легко подстраивается под конкретного пользователя благодаря набору визуальных тем и настраиваемых горячих клавиш.
Orion
Orion – относительно молодой продукт, возникший на базе легендарной Eclipse Java IDE. Многолетний опыт мощного и проверенного инструмента был перенесен в облако, сохранив привычный интерфейс.
Основная сфера применения среды – разработка фронтенда, поэтому имеется хорошая поддержка HTML, CSS и JavaScript с различными надстройками.
На текущий момент работа над продуктом еще ведется: в скором времени можно ожидать появления новых функций и добавления других языков программирования.
Много лет меня преследовал этот зуд — попытки найти «идеальный» текстовый редактор для совместной работы. Но не просто любой текстовый редактор, который поддерживает совместную работу, о нет, моя задача — найти (ну, по крайней мере, искать) открытые текстовые редакторы с групповой работой в режиме реального времени (т. е. не только обычный текст, но и структурированный контент). Таким образом, основное внимание в этой статье уделяется довольно нишевой категории инструментов с открытым исходным кодом и технологиям, на которых они работают. Если ваши интересы шире, можете обратиться к этому постоянно обновляемому списку редакторов.
Итак. Я много раз прыгал с обрыва и нырял в практически бесконечное море программ для совместной работы в реальном времени. Полёт вниз, этот бодрящий нырок на дно бассейна, мне уже хорошо знаком. Обычно он начинается с некоторого первоначального волнения и удивления (скачок) новых низкоуровневых технологий и исследовательских работ, затем следует чувство перегруженности и желания всплыть (эй, тут довольно глубоко) и исследовать прикладную часть, а затем период, когда мои мысли лучше всего описать фразой: «Я действительно настолько глуп для этого?» (вполне вероятно), потому что обычно документация, демо и код не совсем совпадают или имеют смысл, компонент совместной работы на сервере не запускается и встречаются пограничные ситуации, когда более двух пользователей вводят одно и то же слово, и… на этом всё заканчивается (всплыл, хватая ртом воздух).
После этого трудно снова поднять тему, следующий этап — это своего рода зима размышлений, в дрёме, пережидая суровую погоду, когда я обычно позволяю полуготовому коду работать месяцами… или годами. Пока мы не встретимся снова, бесконфликтный реплицированный тип данных!
Рис. 1. Прыжок
Дело в том, что в 2017 году я был так взволнован перспективами одного алгоритма (разновидность CRDT), описанного в исследовательской статье, что потратил несколько дней и реализовал его на JavaScript, только чтобы узнать, что в самой научной статье есть пограничная ситуация, для которой не приведено решения (хорошо… но может всё-таки?). Я в то время обратился к автору, но не получил ответа, и обнаружил, что эта конкретная пограничная ситуация рассмотрена в аналогичном алгоритме другой командой, но чёрт, из-за этих тонкостей в реализации, возможно, я мог бы перенести его на Lisp… ТАК, СТОП! Что здесь происходит? Я, конечно, не хочу внедрять новый алгоритм из исследовательской работы и исправлять его проблемы! Что я делаю, как я сюда попал? Давайте перемотаем обратно!
То, что мне (и, вероятно, вам тоже, дорогой читатель) действительно нужно — это редактор plug-and-play, готовый продукт. Который решает проблему совместной работы в реальном времени. Который позволяет нескольким подключённым пользователям за тысячи миль друг от друга редактировать структурированный документ, нажимая клавиши на клавиатурах, и видеть изменения друг друга на своих экранах. Вот и всё. Однако редакторы — это сложно. и я никак не мог найти такого инструмента.
Наступил 2019 год (зуд вернулся с силой), и на этот раз не только появился волшебный редактор, но на самом деле даже два претендента на выполнение долгожданной спецификации. Первоначально я хотел полетать с вами над полем и перечислить почти все текстовые редакторы для совместной работы, но, похоже, это не добавит большой ценности. Вместо этого давайте сосредоточимся на двух редакторах, которые могут стать «тем самым».
Но редакторов два, и нужно сделать выбор — было бы неплохо объективно рассмотреть, какой из них действительно лучше подходит. Предлагаю глубоко научную систему классификации со следующими категориями (используя киви в качестве стандартной единицы добра):
Рисунок 2. Интерфейс CKEditor 5 (один из возможных вариантов), источник
Начнём с CKEditor 5, последней версии из большой линейки качественных редакторов. Он прекрасен. Я знаю, знаю, что это не критерий, и он в реальности не имеет значения (и мы можем даже не согласиться), но я просто должен был сказать о его красоте. Итак, этот редактор берёт много киви: он лицензирован под GPL (некоторое обсуждение ограничений здесь), (+1), поддерживает изображения, таблицы, списки (+3), математика поддерживается плагином (+1) и он также поддерживает совместную работу в реальном времени с удалённым курсором и выделениями (+2). Создатели CKEditor написали удивительный подробный пост в блоге о том, как они его разработали с помощью операционных преобразований.
Тем не менее, я не смог найти необходимую реализацию сервера для совместной работы в реальном времени, а вся документация указывает на обязательную необходимость их облачного сервиса и (платного) компонента даже в проектах, совместимых с GPL.
Уровень офлайновой поддержки трудно определить, но похоже, что она не совсем полная (например, редактор выдерживает ненадолго прерванное подключение, но не несколько дней работы в автономном режиме). Наверное, половина киви? То же самое касается мобильной поддержки, там также ведётся работа по полной поддержке (+0,5). И последний момент, CKEditor, безусловно, используется в продакшне, но я не смог найти список продуктов на его основе (+0,5).
Хороший редактор, но отсутствие доступного сервера совместной работы с открытым исходным кодом действительно удручает.
Полная оценка: 8,5/11
Рис. 3. Atlaskit Editor от Atlassian
Около года назад Atlassian запустила систему Atlaskit Design с открытым исходным кодом, и с ней пришло много вкусностей, в том числе полноценный готовый к использованию редактор на основе ProseMirror. Я уже чувствую, что это может быть тот редактор, который мы искали! Он выпущен под лицензией Apache 2.0, по мнению многих, очень разрешительной лицензией open source (+1 киви). Он не только поддерживает изображения, таблицы и списки, но поддерживает их исключительно хорошо (+3 киви)! Реализация таблиц, чего очень не хватает большинству редакторов, тут выполнена прекрасно:
Рис. 4. Управление таблицами в Atlaskit Editor
К сожалению, математика не поддерживается, но сам редактор основан на ProseMirror, так что не должно стать проблемой добавить к нему существующее решение (+0,5). Он определённо поддерживает совместную работу в реальном времени с удалёнными курсорами и выделениями (+2), это из лучших примеров UI такой поддержки, какие я когда-либо видел (например, удалённые курсоры затемняются, если перекрываются с вашими собственными, и другие прекрасные детали реализации). Кроме того, из моего тестирования поддержка работы в офлайне кажется очень прочной (+1) — вероятно, это связано с подходом «центральной компетенции», который использует для совместной работы ProseMirror. Ничего себе, мы уже добрались до 7,5 киви, а ещё много пунктов! Вперёд!
Во всяком случае, если продолжать спускаться по критериям, то всё остальное достойно киви: он абсолютно точно используется в продакшне (миллионы пользователей), и у него есть мобильная поддержка (+2). Как раз когда я собирался объявить победителя (в общей сложности 9,5 киви) и опубликовать этот пост, появилось что-то ещё. Оказывается, логотипы и значки, используемые в редакторе, и многие другие компоненты Atlaskit лицензированы под очень ограничительной лицензией ADG, в которой говорится, что вы не можете использовать их за пределами вселенной Atlassian. Однако те же иконки широко используются и плотно интегрированы в редактор. Крупный облом номер два, и я забираю у них киви. Мы вернулись к 8,5, и если вы ведёте подсчёт, то видите, что результат теперь одинаковый. И он окончательный.
Вот если бы что-то сделать с этими иконками.
Я подумал, что после всех последних достижений в области онлайновых текстовых редакторов будет очень печально остаться с двумя великолепными редакторами с удивительными функциями, которые всё равно нельзя использовать в проектах с открытым исходным кодом — либо из-за проблем лицензирования, отсутствия доступных строительных блоков, либо и то, и другое.
Поэтому сначала я разработал серверную часть (на основе PostgreSQL, фреймворке PubSweet и смеси REST/WebSockets), код доступен здесь. Он довольно простой, но выполняет свою работу и обеспечивает сохраняемость документов и канал связи в реальном времени. Удивительно, но благодаря огромному сообществу ProseMirror я смог выяснить, как всё должно работать, не имея точной спецификации интерфейса (+1 киви).
А затем я заменил иконки, используемые редактором, значками из набора Feather. В частности, пришлось заменить три пакета. Поскольку лицензия ADG, среди прочего, запрещает любые производные работы, то эти пакеты нужно было переделывать с нуля. Вероятно, из-за этого потерялись некоторые функции, в основном, с точки зрения доступности для людей с ограниченными возможностями, но зато создана хорошая открытая база для дальнейшего развития. Например, в некоторых случаях для значков отсутствуют лучшие альтернативы, так что если вы хотите внести свой вклад в этот проект, вот вам первая проблема (+1 киви)!
Рис. 5. Демонстрация возможностей редактирования в режиме реального времени в Atlaskit Editor
Итоговый (исправленный) результат: 10,5/11
Есть два редактора, которые я хотел бы упомянуть, хотя у них прямо сейчас нет готового решения для совместной работы в реальном времени, но оба построены поверх библиотек, которые поддерживают такую функциональность. Возможно, у обоих это в планах.
Рис. 6. Редактор Wax (текстовый процессор на основе ProseMirror)
Первый — это Wax (назван в честь древних восковых табличек) от Coko Foundation. Этот текстовый процессор сначала сделали на библиотеке Substance (репозиторий), а теперь перестроили под ProseMirror (репозиторий). Он исключительно упакован функциональностью. Это не совсем те функции, за которые мы даём киви, но тем не менее это отличные функции. Wax изначально построен для вёрстки книг, он поддерживает заметки (нумерованные аннотации, распространённые в книгах), историю изменений, поиск и замену, орнаменты и другие. Может, за это давать апельсины ? В этом случае Wax получит 4 киви (открытая лицензия, изображения, списки, использование в продакшне) и пару апельсинов, возможно, четыре. . Это много фруктов!
Рис. 7. Texture, редактор на основе Substance
Наконец, у нас есть Texture, очень специфический, профессиональный (но с открытым исходным кодом) редактор для создания научного контента в формате JATS (стандарт XML для журнальных статей). Если тут поупражняться в подсчёте фруктов, у нас почти наверняка закончатся пальцы: открытая лицензия, таблицы, изображения, глубокая поддержка математики, ссылки и перекрёстные ссылки, списки, поддержка метаданных, список продолжается! Повторяю, и Wax, и Texture — замечательные редакторы, и единственное, что удерживает их от максимального количества киви — это отсутствие функций совместного редактирования в реальном времени, чему посвящена эта статья.
Если вы создаёте систему, в которой ключевым компонентом является совместное редактирование в реальном времени, вы выбрали правильное время. В прошлом году ландшафт созрел, и теперь здесь появились почти plug-and-play открытые решения. Возможно, с вашей помощью ровно через год у нас будет целый набор открытых проектов. И возможно, только возможно, мы также будем использовать инструменты, построенные поверх этих открытых слоёв, даже не зная об этом.
Сегодня все чаще говорят о возможности удаленной работы. Тут и там большие компании анонсируют повсеместный исход офисного и не только планктона из корпоративных теплиц. Разработчики – первые, кого вспоминают в этот контексте. Работая удалённым разработчиком, вы зачастую не можете встретиться лицом к лицу с клиентом, лично представить свой проект, присесть за стол к коллеге, чтобы вместе решить какую-то проблему. Из-за этого у некоторых может возникнуть впечатление, что у удалённой работы есть ряд серьёзных недостатков. На мой взгляд, и по мнению десятков тысяч удаленных разработчиков это ложное впечатление. Удалённые разработчики в целом счастливее, работают усерднее, и быстро осваивают подходящие инструменты для совместной работы. Конечно, удалённая работа — вещь непростая. Ведь нас с детства приучают к тому, что нам нужен коллектив, и что общаться нужно лицом к лицу. Уходя из офиса на удалёнку, приходится учиться пользоваться инструментами, компенсирующими географическую распределённость команды. Под катом — подборка инструментов, которая поможет вам эффективно взаимодействовать с коллегами в других городах и странах. Безусловно, это не весь инструментарий. Было бы любопытно прочесть о ваших находках в комментариях к данной статье.
1. Usersnap: совместный сбор пользовательских отзывов и отслеживание багов
Работа с ошибками и пользовательскими откликами может быть затруднена из-за самого характера взаимодействия с пользователями. С помощью Usersnap можно просматривать отзывы и информацию о багах в одном контексте с пользователями. Ребята из команды техподдержки говорят, что порой пользователей может раздражать требование сделать скриншот проблемного экрана. К тому же это замедляет сам процесс сбора отзывов. К тому же нередко бывает так, что, когда ты просишь сделать скриншот, баг волшебным образом исчезает. И возникает через неделю.
В Usersnap, когда пользователь хочет оставить отзыв, он может сделать скриншот и оставить описание. В этом случае формируется задача на вашей стороне. А вы потом можете связаться со своими коллегами и решить проблему полностью в том же контексте.
В Usersnap есть удобный механизм интеграции со Slack, JIRA, Basecamp, Trello, Intercom и кучей других сервисов. Инструмент встраивается в ваш привычный рабочий процесс, но при этом у пользователей появляется более удобный способ отправки отчётов о багах, по сравнению с перепиской с командой поддержки.
2. Cloud9: облачный IDE для совместного кодинга
Cloud9 — это качественная альтернатива отправке итераций своего кода на разбор. Сервис показывает в IDE в реальном времени внесённые изменения. Вы можете в любой момент войти, нажать “Preview” и увидеть, что сделали в коде ваши коллеги. Это идеальный сервис для парного программирования, он помогает укоротить цикл получения фидбека внутри команды, быстрее обновлять клиентские продукты. По мере готовности можно пушить код прямо на FTP и автоматически синхронизировать с GitHub.
Этот сервис — один из нескольких инструментов для совместной работы в нашей подборке. Но при этом он обладает наиболее развитым набором возможностей, хотя и не имеет видеочата. Если же вы привыкли жить в своём текстовом редакторе, то обратите внимание на Floobits (см. ниже).
3. InVision: кликабельные прототипы для веб-дизайнеров
Вы могли бы загружать полноэкранные PNG в Basecamp, или пересылать их по почте для оценки коллегам, но самый лучший вариант — иметь возможность отправлять работающий прототип своего сайта. Для грубых набросков можно использовать Koombea, но InVision позволяет прорабатывать прототипы более детально.
В InVision доступно множество опций по настройке прототипов. Есть интеграция со Sketch: дизайны из этого сервиса можно добавить в InVision, а затем просто перетаскивать на «холст», конструируя прототип из отдельных Sketch-файлов.
4. Screenhero: расшаривание экрана для веб-разработчиков
Любой, кто пытался совместно кодить через Skype, подтвердит — это ужасно. Screenhero избавлен от этих недостатков. Этот сервис разработан для совместной работы над кодом с низким уровнем задержки, поддерживает несколько курсоров и объединённое IDE-управление. Screenhero пару лет назад был приобретён Slack, и сейчас живёт внутри него. Так что если вы уже пользуетесь Slack, то очень рекомендую попробовать Screenhero.
Помимо работы над кодом, этот сервис ещё и очень удобен для проведения встреч и презентаций, обеспечивая голосовой чат и расшаривание экрана внутри приложения Slack.
5. VNC-сервер: два человека на одном компьютере
Если вы предпочитаете более широко настраиваемые DIY-решения для совместной работы с кодом и архитектурой, то попробуйте настроить собственный VNC-сервер.
С помощью TightVNC (бесплатный, Windows/Unix) или RealVNC (€30, мультиплатформенный), вы можете получить доступ к компьютеру своего коллеги и давать ему советы, как если бы вы программировали, сидя рядом друг с другом и набивая код в отдельных окнах. Это куда удобнее, чем если бы вы работали в одном офисе. Правда, начинать работу с VNC-серверами получается не так быстро, но если парное программирование через Cloud9 не даёт вам ощущения кулхацкера, то VNC вам должно понравиться.
6. Basecamp: централизованное накопление файлов и получение обратной связи
7. Floobits: расшаривание экрана и совместные терминалы/IDE
Floobits — это комбинация Screenhero и Cloud9, но больше заточенная под разработчиков, чем Screenhero, и с более развитой чат-функциональностью, чем в Cloud9. Этот сервис — своеобразный Google Docs для кода, потому что вы видите изменения на странице в реальном времени. Floobits поддерживает Sublime Text, Atom, Neovim, Emacs и IntelliJ IDEA, он полностью интегрирован в Google Hangouts.
Floobits ставится очень быстро, меньше чем за две минуты. Если у вас есть аккаунт на GitHub, то можете напрямую подключить свои репозитории. По сравнению с Cloud9 или VNC-сервером, для Floobits есть не так много плагинов с поддержкой текстовых редакторов. Но ведь вам понадобится лишь какой-то один из них.
8. Dropbox Paper: альбом для дизайнеров и разработчиков
Dropbox Paper тихо запустили в 2015 в качестве Dropbox-брендированной версии Hackpad. Будучи прекрасным инструментом для управления бизнес-документацией, Paper замечательно подходит для организации совместной работы над ранними стадиями дизайна и фрагментами кода, избавляя от бесконечной переписки по почте.
У Dropbox Paper есть пара преимуществ перед Google Docs. Во-первых, сервис обеспечивает понятное и читабельное отображение кода. Во-вторых, работа с ним чем-то похожа на писание в Medium, который обладает завидным UX.
Примеры для вдохновения, фрагменты кода, прототипы, ссылки и комментарии можно размещать в одном легкодоступном месте, превращая простой документ в полноценную папку проекта.
9. Redpen: получение обратной связи на одном экране
Если вы находитесь на ранней стадии создания дизайна сайта, и ещё оглядываетесь в поисках источников для начальных идей, то вряд ли имеет смысл связываться с InVision, пока у вас не сформируется устойчивое представление о будущем дизайне. Red Pen — замечательная простая альтернатива для расшаривания одиночных экранов и аннотаций.
Перетащите мышью дизайн в приложение, получите ссылку для расшаривания, и возвращайтесь попозже, чтобы увидеть комментарии к конкретным частям изображения. Red Pen позволяет сразу указывать описываемые места, а не писать «чуть левее, между полосой прокрутки и заголовком».
10. Every Time Zone: потому что часовые пояса не имеют значения
Every Time Zone необходим для любой удалённой совместной работы в реальном времени. Большинство конвертеров часовых поясов выглядят так, словно в последний раз обновлялись в 1990-х (и столь же дружелюбны к пользователю, как инструменты в те годы). Но Every Time Zone очень наглядно и удобно отображает часовые пояса по всему миру.
Это не так-то легко проиллюстрировать статическим изображением, но вы можете перетаскивать слайдер и сразу видеть текущее время в любой стране мира. Можно больше не ломать голову, высчитывая разницу по Гринвичу.
11. Agreedo: продуктивные совещания
Совещания отнимают много времени и зачастую непродуктивны, потому что команды обычно забывают заранее составлять чёткую повестку и отслеживать принятые решения. Решить обе эти проблемы можно с помощью Agreedo. Сервис позволяет превращать идеи в повестку, а после завершения обсуждения — в протокол совещания. Каждое принятое решение можно превратить в задачу с отслеживанием выполнения. Поддерживается Mac, Windows, iOS и Android.
12. Wunderlist: управление задачами
Wunderlist — невероятно простой инструмент. Наверное, поэтому он очень хорошо подходит для удалённых команд. Для сохранения здоровой атмосферы в коллективе критически важно отслеживать выполнение задач, но это не должно отнимать слишком много времени. Wunderlist позволяет меньше заниматься управлением задачами и больше — их выполнением. Некоторые возможности:
1. Можно помечать задачи, в решении которых вам не удаётся продвинуться.
2. Можно сортировать список по важности выполнения.
3. Можно разбивать список на подзадачи.
4. Не обязательно указывать дату выполнения, если нет реального дедлайна.
5. Можно назначать ответственных за выполнение.
6. Есть списки задач “Today” и “Assigned to Me”.
7. Wunderlist можно интегрировать со Slack.
13. Skitch: визуальная коммуникация
Зачастую трудно объяснить человеку, что ты имеешь в виду, когда не находишься с ним лицом к лицу. Skitch позволяет коммуницировать визуально, создавая указатели, текстовые описания, геометрические формы, выделения и псевдоштампы («одобрено», «отклонено» и так далее).
Skitch помогает очень просто и быстро делиться идеями и мнениями. К тому же это очень удобный инструмент для создания скриншотов с отправкой комментариев по почте или экспортом в графический файл.
14. Draft: совместная работа над документами
Draft — это упрощённая версия GitHub для Markdown-файлов. Сервис позволяет совместно работать над документами, объединять конкретные изменения, сделанные разными сотрудниками. Это особенно полезно при написании статей или составлении юридических документов, которые потом можно экспортировать в Markdown, DOCX, HTML или PDF.
15. Slack: взаимодействие в команде
Если кто-то ещё не знает, Slack — весёлый сервис для общения в команде. Особенно полезен он для удалённых разработчиков, но кто-то жалуется, что привлекательность Slack может приводить к снижению продуктивности. Наверное, всё дело в том, что сервис просто используют неправильно.
Вот некоторые сервисы, с которыми интегрируется Slack:
• Управление задачами с помощью Wunderlist, Trello, Asana или (для Agile-команд) JIRA.
• Похвалы и награды сотрудникам с помощью Bonusly или Leo Slackbot.
• Расшаривание экранов с помощью Screenhero.
• Совместная работа над дизайном с помощью InVision, Zeplin или UXPin.
• Источники вдохновения по дизайну с помощью Dribbble.
• Мозговой штурм на виртуальной маркерной доске с помощью Sketchboard.
• Многое другое!
16. Zapier: автоматизация рабочих процессов
Некоторые из вышеупомянутых интеграций были сделаны с помощью Zapier. Этот сервис позволяет автоматизировать рабочие процессы за счёт соединения ваших любимых приложений, так что вы можете одновременно работать над задачей и держать коллег в курсе относительно текущего прогресса. Это особенно полезно для тех, кто не любит часто переключаться между разными приложениями.
Достаточно сказать Zapier, какие приложения использует ваша команда, и он самостоятельно установит взаимосвязи. Кстати, это способ решения разногласий по поводу выбора единого инструментария в команде. Например, кто-то предпочитает Dropbox, а кто-то — Google Drive. Тогда вы можете просто создать коннектор “Zap” (или взять уже готовый), который будет пересылать файлы из Dropbox в Google Drive, уведомляя об этом команду с помощью Slack. Тогда никто ничего не пропустит, и все могут продолжать пользоваться своими любимыми инструментами.
Заключение
Некоторым может показаться, что удалённая совместная работа — штука трудная. Но в этом случае уместно вспомнить фразу «дела убедительнее слов». Вышеперечисленные инструменты помогут избавиться от непродуктивных разговоров и сэкономить время на устранение разрывов между приложениями. Можете порекомендовать другие инструменты для совместной работы удалённой команды? Не держите эти сакральные знания в себе, делитесь в комментариях.
Читайте также: