Профессиональные программы для создания сайтов

Для типовых/шаблонных сайтов существует масса готовых решений: CMS (для тех, кто хочет полностью контролировать свой сайт), онлайн-конструкторы (облачные сервисы с готовой инфраструктурой) или даже оффлайн-конструкторы (как Mobirise и аналоги). А что есть для профессионалов? Для тех, кто делает нетиповые и зачастую очень сложные проекты?
Название Наша оценка Описание Детальнее
VisualStudioCode
5.0
  • Очень удобный редактор кода
  • Кроссплатформенный инструмент
  • Легко расширяется за счёт дополнений
  • Подходит для разных ЯП web-разработки
visualstudio.com
WordPress
5.0
  • Комплексный сервис для прототипирования интерфейсов
  • Есть десктоп-приложение
  • Идеален для работы команд
  • Поддерживается установка плагинов
figma.com
PhpShtorm
5.0
  • Крутая IDE, способствующая повышению продуктивности
  • Есть рефакторинг, unit-тесты, отладка
  • Идеальное решение для крупных проектов
  • Работает со всеми версиями языка PHP
jetbrains.com
GitKraken
4.5
  • Удобный git-клиент с графическим интерфейсом
  • Совместим со всеми популярными git-хранилищами
  • Есть дополнительные инструменты для разработчиков
gitkraken.com
Docker
4.0
  • Удобная система контейнеризации приложений
  • Масса готовых образов и контейнеров
  • Контейнеры легко разворачиваются в облаке
  • Поддерживаются все популярные платформы
docker.com

Для типовых/шаблонных сайтов существует масса готовых решений: CMS (для тех, кто хочет полностью контролировать свой сайт), онлайн-конструкторы (облачные сервисы с готовой инфраструктурой) или даже оффлайн-конструкторы (как Mobirise и аналоги). А что есть для профессионалов? Для тех, кто делает нетиповые и зачастую очень сложные проекты?

Условно инструменты для web-разработчиков можно разделить на следующие категории:

  • инструменты для работы с фронтендом и дизайном (средства проектирования интерфейсов, прототипирования, графические редакторы, сервисы согласования правок по макетам и т.п.);
  • инструменты для работы с бэкэндом (комплексные среды разработки, средства тестирования, оптимизации кода и т.д.);
  • вспомогательные инструменты и сервисы (облачные среды сборки проектов, git-хранилища, локальные web-серверы и готовые контейнеры, библиотеки иконок, фотостоки и т.д.).

У каждого разработчика или у команды разработчиков свои предпочтения, своя методология и свой «джентльменский набор» ПО. Но есть инструменты и программные среды, которыми пользуется подавляющее большинство, они точно подойдут для типовых задач в 90% случаев. О них и пойдёт речь ниже.

Что можно сделать с помощью таких инструментов? Создать уникальный дизайн, натянуть HTML-шаблон на CMS, разработать модули/плагины для CMS и даже собственную CMS, собрать и запустить сайт на основе фреймворка, разработать оригинальное web-приложение со сложной архитектурой… Да всё, что угодно.

1. Visual Studio Code – крутой и полностью бесплатный редактор кода от Microsoft

Visual Studio Code – это универсальное средство web-разработки, которое может использовать любой желающий. Этот инструмент был впервые представлен в 2015 году, вышел из стадии беты в 2016 году. Visual Studio Code – своего рода свободный кроссплатформенный аналог другого инструмента от Microsoft, Visual Studio (версии Professional и Enterprise). Если Visual Studio – это полнофункциональная среда разработки, то Visual Studio Code – это только редактор кода, хоть и продвинутый, с массой дополнительных функций.

Плюсы

Visual Studio Code имеет открытый код и распространяется бесплатно. Интерфейс можно русифицировать (за счёт дополнений из каталога). Программа умеет работать с различными языками web-программирования: подсвечивается синтаксис, автоматически подсвечиваются ошибки, предлагаются варианты дополнения кода при вводе и т.д. В перечне поддерживаемых ЯП числятся: Python, PHP, Java, Go, JavaScript (включая библиотеку React), C (C++ и C#) и другие. А также разметки HTML, INI, JSON, CSS, Markdown и многие другие.

Редактор можно установить на любую десктопную операционную систему: MacOS, Linux и, конечно, Windows. Профессионалам Visual Studio Code нравится, в том числе, за-за исчерпывающего дополнительного функционала: встроенные инструменты отладки, помощь при рефакторинге кода, удобный поиск и навигация, интеграция с git-хранилищами, возможность кастомизации горячих комбинаций (в том числе в соответствии с другими привычными IDE), а также возможность установки дополнений (в настоящий момент в официальном каталоге более 24 тысяч бесплатных плагинов и тем).

Минусы

Несмотря на открытость кода, Visual Studio Code прямо заявляет об отслеживании действий пользователей. Общую телеметрию легко отключить, но отдельные функции, например, синхронизация параметров через учётную запись, всё равно будут продолжать следить за вами (преимущественно для персонализации ввода).

Visual Studio Code – это не полноценная IDE, здесь многие функции выполняются через команды в консоли или с помощью JSON-файлов.

Стоимость использования

Инструмент полностью бесплатный. Если вам нужно профессиональное решение для комплексной разработки (IDE), то это уже Visual Studio Community (бесплатно для индивидуальных разработчиков и для open-source проектов), Visual Studio Professional (от $45/месяц) и Visual Studio Enterprise (от $250/месяц).

Перейти на Visual Studio Code →


2. Figma – самый популярный инструмент для прототипирования интерфейсов

Figma – это онлайн-сервис, но для более удобной работы вне браузера предоставляется desktop-приложение (оно всё равно требует постоянного подключения к сети). Впервые об этой платформе узнали в 2016 году, после того как разработчики выкатили первый релиз клиентов для всех популярных платформ (macOS и Windows).

Несмотря на отсутствие русскоязычного интерфейса, Figma остаётся одним из самых удобных средств прототипирования как для индивидуальных дизайнеров, так и для команд разработчиков. Ключевая особенность инструмента – его «облачность» (все изменения автоматически сохраняются в аккаунте, работу будет сложно потерять или случайно удалить, а при работе команд вы получаете единый интерфейс, в котором все правки отображаются в реальном времени).

Плюсы

Figma идеально подходит для быстрого создания качественных дизайнов и для прототипирования. Сервис одинаково хорошо справляется как с простыми, так и со сложными интерфейсами. Отдельной благодарности разработчики достойны за работу с группами элементов (вы можете выделить несколько кнопок/изображений/иконок и т.п. и работать с ними со всеми сразу). Не нужно ничего экспортировать в PDF или в другие форматы, клиент может посмотреть прототипы онлайн, причём, они будут интерактивными (с анимацией и переходами между связанными экранами).

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

А ещё здесь есть бесплатный тарифный план без ограничений по занимаемому пространству. Студенты и учебные заведения могут получить особые привилегии.

Минусы

У Фигмы не самая продвинутая работа с типографикой (не получится задать интервал между символами, нет отрицательного отступа и т.д.). При работе требуется постоянное подключение к сети интернет (даже десктоп-приложение не спасает).

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

Стоимость использования

Бесплатный тариф позволяет создавать не более 3 проектов, все они будут публичными. Тариф Professional обойдётся от $12/месяц (любое количество проектов, включая приватные), а план для организаций – от $45/месяц.

Перейти на Figma →


3. PhpStorm – самая продвинутая среда разработки для PHP

PhpStorm – лучший инструмент для продуктивной разработки сайтов и web-приложений на PHP. Вообще, компания-разработчик JetBrains подарила миру не одну IDE, а целую плеяду, в том числе IntelliJ IDEA (для Java и JavaScript, на ней основывается среда разработки Android Studio). Но PhpStorm – это особый случай. Эта IDE – одна из немногих для PHP, которая была и остаётся платной. Причём, разработчики охотно её покупают. Почему? Она умеет многое, с ней написание кода заметно ускоряется, вне зависимости от того, какого размера или сложности ваш проект.

Плюсы

PhpStorm подходит для работы с кодом популярных CMS-систем (Drupal, Joomla, WordPress и т.д.), а также совместима со всеми востребованными фреймворками (Symfony, Laravel, Yii и др.). Код дополняется на лету, обеспечивается работа с legacy-проектами. Есть подсветка синтаксиса (так как речь о PHP, то к поддерживаемым синтаксисам автоматически относятся SQL, HTML, CSS, Less, Sass, JavaScript Emmet и другие связанные технологии).

Есть рефакторинг, отладка, unit-тесты (а также интеграция с профилировщиком) и предварительный просмотр в браузере. Так как язык PHP активно развивается и меняется, PhpStorm всегда следует в ногу со временем и актуализирует поддержку новых стандартов.

PhpStorm совместим со всеми популярными git-хранилищами.

Минусы

Из существенных минусов этой IDE можно отметить только её платность и отсутствие русскоязычного интерфейса. Кому-то эта среда разработки может не понравиться просто из-за предыдущего опыта использования других инструментов (это скорее дело привычки).

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

PhpStorm нельзя купить насовсем, разработчики оставили только модель подписки.

Стоимость использования

Триал-период – 30 дней. Для индивидуальных разработчиков эта IDE будет стоить примерно от $7.42/месяц (при оплате сразу за год, потом дешевле). Организациям – от $199/год. Есть специальные предложения для образовательных учреждений, студентов и open-source проектов.

Перейти на PhpStorm →


4. GitKraken – кроссплатформенный клиент Git

GitKraken – это легендарное решение от компании Axosoft. На каком бы языке вы ни писали, какие бы сайты ни делали, в одиночку или с командой, вам обязательно нужен репозиторий кода (git-хранилище).

Несмотря на то, что программа имеет закрытый исходный код (первый релиз – 2016 год), она очень популярна в среде программистов и всех тех, кто работает с git-хранилищами. GitKraken – это клиент с GUI (графическим пользовательским интерфейсом), поэтому знания bash-команд не потребуются. Все действия можно выполнять в окне программы с помощью кнопок и контекстного меню. В GitKraken очень удобное дерево проекта (поддерживаются и git-flow сценарии).

Плюсы

Применение в личных целях полностью бесплатное. Для входа в программу можно использовать имеющиеся аккаунты GitHub или Google (альтернатива – регистрация своего аккаунта GitKraken). Приложение имеет встроенный SSH-клиент (его можно заменить на сторонний) и умеет авторизовываться с помощью ключевых файлов. Аналогичная ситуация с редактором кода, его легко заменить, например, на Visual Studio Code.

Есть предустановленные светлая и тёмная темы, готовая интеграция со следующими git-хранилищами (включая Enterprise-решения): GitLab, GitHub, Azure, Bitbucket. А ещё GitKraken умеет работать с Trello и Jira, имеет своё решение для организации рабочих процессов – GitKraken Boards (канбан-доска с приложениями для мобильных устройств).

Поддерживается смена профилей пользователей (очень удобно, если у вас разные требования к рабочему окружению для разных задач, например, для работы с хобби-проектами или с корпоративными задачами), есть функционал Drag&Drop и т.д.

Минусы

Бесплатная версия не работает с приватными репозиториями (соответственно, отпадают интеграции с Enterprise-хранилищами) и может использоваться только одним пользователем (не получится работать командами, нет инструментов управления членами команды).

Есть ограничения и по другим бесплатным продуктам для GitKraken: Boards Free и Timelines Free. Не более 1 пользователя, лимиты по количеству канбан-досок, отсутствие работы с приватными таймлайнами и т.п.

Стоимость использования

Только GUI-клиент GitKraken для индивидуальной работы можно получить полностью бесплатно. Есть suite-решение (GitKraken + Timelines Free + Boards Free) тоже бесплатное, но с ограничениями. Git-клиент со всеми корпоративными фичами распространяется по подписке – от $49/год за каждого пользователя ($99/год для Enterprise-разработки). GitKraken Suite – от $79/год за каждого пользователя (всё вместе дешевле).

Перейти на GitKraken →


5. Docker – лучшее ПО для контейнеризации приложения со всем необходимым окружением

Docker – это своего рода изолированная среда, аналогичная виртуальной машине, готовая для приёма программных контейнеров (это как «упакованные» приложения с со всем необходимым для их работы окружением, готовые для быстрого развёртывания внутри реальной операционной системы).

Ранее многие команды и индивидуальные разработчики использовали среду Vagrant (а это уже готовая виртуальная машина на базе VirtualBox целиком, сконфигурированная для тех или иных задач). Но Vagrant-контейнеры слишком тяжёлые и проблемные для командной работы, ведь в «упаковку» попадают все файлы гостевой операционной системы. В случае с Docker, пакеты (контейнеры) намного компактнее и удобнее в развёртывании, причём, они могут расширяться за счёт специальных модулей (образов, image).

Плюсы

Docker-контейнеры быстро разворачиваются практически на любой платформе, поддерживаются архитектуры x86-x64 и ARM, Linux и Windows-системы. Таким образом, вы можете абстрагироваться от операционной системы и создавать софт, который легко переносится в облачную инфраструктуру любого крупного провайдера хостинга. Такая среда просто масштабируется и дорабатывается под задачи или под особенности команд. Нужны специальные библиотеки? Пожалуйста. Ведёте сразу десятки проектов? Не проблема, хоть тысячи, у каждого будет свой контейнер.

Для управления контейнерами предоставляется специальное ПО с удобным графическим интерфейсом – Docker Desktop (для Windows и MacOS, также поддерживает среду Kubernetes). Если вам нужна типовая среда разработки, вы можете скачать и использовать готовый для этих целей контейнер. На Docker Hub более 5 млн. образов. Там же можно скачать готовые плагины для расширения функциональности исходного Docker’а.

Минусы

Как и во многих сервисах для разработчиков, у Докера есть бесплатный тарифный план для хобби-формата. Но если речь заходит о профессиональной разработке (нужны приватные репозитории, работа команд, увеличение производительности при сборке проектов и т.п), то тут уже нужна оплата, причём, по модели подписки.

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

Стоимость использования

Бесплатная подписка позволяет использовать практически все возможности сервиса, сюда даже входит 1 приватный репозиторий. Платные подписки – от $5/месяц. Сюда будут входить: премиум-поддержка, некоторые опции безопасности (расширенное сканирование на вирусы), возможность работы команд с приватными репозиториями и другие специфические опции.

Перейти на Docker →


Выводы

Мы привели примеры только «лучших из лучших», но в каждой категории ПО часто имеются не менее функциональные альтернативы. Плюс, у каждого web-разработчика могут быть свои личные предпочтения.

Однако, в командах определение отдельных инструментов и сервисов, соответствующих стоящим задачам, будет задаваться мнением большинства или предпочтениями лидера (в зависимости от методологии и применяемой модели работы).

2021-03-09 Евгений Куликов Рейтинг: 5.0

ЛУЧШИЕ КОНСТРУКТОРЫ САЙТОВ