Среда разработки html и css: 16 лучших сред для веб-разработки – Какой лучший редактор HTML, PHP, CSS, JS кода?

Среда создания сайтов | WebShake.RU

В настоящее время с развитием Интернета веб-программирование становится все более популярным и востребованным. Для написания веб-сайтов и веб-приложений необходимо иметь удобную и мощную среду разработки — IDE (Integrated Development Environment, интегрированная среда разработки).

Конечно, для написания сайтов можно использовать обычный блокнот вроде notepad в среде windows или pluma в среде linux, но для настоящей продуктивной разработки предпочтительнее иметь инструмент с интеллектуальным автодополнением, подсветкой синтаксиса, возможностью просматривать получившееся решение в браузере (автоматический запуск браузера с результатом работы). Кроме поддержки языка разметки html и стилей css среда разработки должна поддерживать редактирование и работу с файлами javascript и файлами на других языках программирования.

Какую IDE выбрать

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

• Для языка Python — PyCharm
• для языка Java — IntellijIdea
• для javascipt — WebStorm
• для C# — Rider
• для ruby — RubyMine
• для языка go — GoLand.

Также стоит отметить что у jetBrains есть также среда для языков программирования C/C++ но они не оптимизированы для написания сайтов и веб-приложений, поэтому в данный список они не включены.

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

PhpShtorm для PHP

Для языка php JetBrains предлагает среду разработки под названием phpStorm. Данную IDE доступна под различные версии операционных систем: под winbdows, Linux, MacOSX.

PhpStorm имеет полную функциональность среды webStorm (поддержка HTML , JavaScript для веб-разработки), также имеет отличные средства для рефакторинга кода, автодополнения кода, предотвращения ошибок на лету, средства для работы с базами данных MySQL, в нём можно отлаживать код с помощью XDebug. PhpStorm поддерживает последнюю версию языка программирования PHP, также поддерживает передовые технологии разработки веб приложений, такие как включая HTML5, CSS, Sass, SCSS, Less, Stylus, Compass, CoffeeScript, TypeScript, ECMAScript Harmony, шаблоны Jade, Zen Coding, Emmet, и, конечно же, JavaScript. Имеются встроенные средства для поддержки системы контроля версий таких как murcuril и Git. Детектор дублируемого кода и предотвращения ошибок на лету, система юнит-тестирования позволит писать более качественный и оптимизированный код.

Сама среда разработки написана на языке программирования Java и работает на JVM, что несёт такие издержки как повышенное потреблением оперативной памяти. Для веб-разработчика это будет важный пункт, который необходимо принять к сведению.

Чтобы не перегружать читателя техническими деталями, можно отметить вкратце, что данная среда разработки является профессиональной поэтому и не является бесплатной. Однако любой может попробовать её триальную версию, чтобы ознакомиться с её функционалом. Лицензию На один год можно приобрести за 199 долларов США. А ещё можно присоединиться к группе тестировщиков ранних версий, и пользоваться программой бесплатно, как это делаю я. Об этом читайте в статье Установка и настройка PHPStorm.

Облачные IDE для веб-программистов / mr. Gefest corporate blog / Habr

Здравствуйте, уважаемые коллеги и друзья! Меня зовут Евгений, в начале данной статьи я расскажу Вам о 4-ех облачных IDE для веб-разработчиков, а потом о новой online среде разработки, цель которой объединить возможности самых мощных IDE (например: webstorm), простой дизайн Sublime Text и новые решения.

Часть 1. Мир online-IDE

В сфере облачных сред разработки уже существует множество игроков, большинство из них либо уже прогорели, либо имеют слишком урезанные возможности по сравнению с offline IDE. Несмотря на такую ситуацию, есть 4 продукта, которые обладают неплохим функционалом:

• Koding
• Cloud 9
• ShiftEdit
• Codeanywhere

Koding

Первое впечатление от Koding — приятное. Красивый интерфейс, мягкие тона. Возможность развернуть виртуальную машину с поддержкой php, ruby, python, node.js и perl, которую можно настроить посредством ssh терминала.

Через некоторое время я столкнулся с проблемами. Вначале я не мог скрыть панели, которые занимали пол экрана, потом убрать терминал. Не получалось и добавить свой ftp-сервер, потому что там нет такой функции, что очень удивляет!

Сам редактор исходного кода основан на Ace-editor. Работает гладко, но в нем нет всех тех возможностей, что есть в offline-IDE (например умного auto-complete).

Koding обладает множеством социальных функций. В ней можно вступать в сообщества и делиться сообщениями в общей ленте, а также участвовать в парном программировании. На данный момент продукт всё ещё находится в стадии открытой beta-версии.

Koding является условно-бесплатной и включает в себя следующие тарифы:

Вывод: интересная и красивая IDE c социальными функциями, без возможности добавления своего ftp, с механизмом развертывания виртуального сервера, удобного способа управления проектами, не совсем понятным интерфейсом и малофункциональным редактором исходного кода.Ссылка

Cloud 9

При первом запуске, Cloud9 предлагает выбрать или добавить проект. Его можно создать на основе виртуального сервера, ftp или ssh.

После этого открывается окно приветствия, на котором определяется тип отображения интерфейса (full ide, minimal editor, sublime text), цветовая тема и другие настройки. Слева расположен удобный файловый менеджер, поддерживающий drag & drob. Дизайн интерфейса выглядит стандартно, но эстетично.

Рабочую область можно разделить на несколько частей. Для исходного кода используется редактор «Ace-editor». Он разрабатывается командой Cloud9. Стоит заметить, что «Ace-editor» в их IDE, обладает меньшим числом багов, чем тот, что лежит в открытом доступе.

Cloud9 имеет такие полезные функции, как поиск по файлами, Go to Symbol/command/line, редактор изображений и историю файловых изменений. Также стоить учесть, что её исходный код находится в открытом доступе и любой желающий без коммерческой цели может его запустить на своем сервере (Ссылка).

При разработке сайтов в данной IDE, их результат можно посмотреть в отдельном блоке интерфейса. Этот «preview» обладает одной необычной возможностью, которая заключается в том, что сайт можно виртуально проверить в разных браузерах и на разных устройствах. Данная технология предоставлена компанией «Sauce labs».

В Cloud9 имеется окно настроек, в котором можно изменить комбинации клавиш, выбрать тему подцветки редактора, подобрать размер табуляций и так далее. Недавно появилась светлая тема интерфейса в плоском стиле.

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

Cloud9 является условно-бесплатной и имеет следующие тарифы:

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

ShiftEdit

При первом знакомстве с ShiftEdit сразу бросается в глаза устаревший дизайн интерфейса, из эпохи Windows XP. Рассматриваемая среда разработки поддерживает ftp, sftp, google drive, dropbox, webdev, ssh и amazon s3. Файловый менеджер обладает не только стандартными возможностями, но и ещё механизмом drad & drop.

Редактор исходного кода использует бесплатную версию «Ace-editor» с присущими ей багами и небогатыми возможностями по сравнению с offline IDE. ShiftEdit обладает панелью навигации по коду и live режимом, который, к сожалению, мне так и не удалось нормально запустить как год назад, так и сейчас.

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

ShiftEdit условно-бесплатной и имеет следующие тарифы:

Вывод: данная среда разработки проста, имеет тяжелый и медленный интерфейс, поддержку ftp, sftp, google drive, dropbox, webdev, ssh и amazon s3, непонятный live-режим, неплохой файловый менеджер, а также она использует хороший, по меркам online-IDE, редактор «Ace-editor». Ссылка

Codeanywhere

Codeanywhere отличается от своих конкурентов тем, что имеет приложения под Android и iOS. К сожалению, они не очень хорошо адаптированы к мобильным платформам, как и их web-версия.

IDE является условно-бесплатной и имеет пять тарифов.

Она обладает стандартным, но стильным интерфейсом, где все на своих местах. В ней можно развернуть Development box для html5, node.js, php, ruby, c++ и python. Она поддерживает sftp, ftp, ssh, drobbox и google drive, а её редактор исходного кода работает на «CodeMirror». Как и большинство web-редакторов, она не имеет умного auto-complete, функций рефакторинга и остальных важных и удобных возможностей offline собратьев.

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

Вывод: данный продукт в отличии от своих конкурентов использует «CodeMirror» для редактора исходного кода, имеет функцию развертывания виртуального сервера, поддерживает sftp, ftp, ssh, drobbox и google drive, обладает drag & drop файловым менеджером и эстетичным интерфейсом. Ссылка

Заключение первой части: рынок online-IDE развивается медленно, её продукты стараются использовать все больше преимуществ online перед offline, забывая о важных возможностях desktop IDE, таких как: умный auto-complete и рефакторинг кода. Три из четырех продуктов обладают темным дизайном, поэтому можно предположить, что это тренд в дизайне online-IDE. Большинство из рассмотренных сред разработки поддерживают возможность создания виртуального сервера, drag & drop файлового менеджера, имеют условно-бесплатную бизнес-модель и используют редактор «Ace-editor». Практически все online-IDE не адаптированы под мобильные платформы, хотя это должно быть одним из их преимуществ. Среди существующих игроков больше всего выделяется Cloud9, с его неплохим редактором кода и функцией тестирования сайтов на любом устройстве.

В следующих статьях планирую рассмотреть по конкретным метрикам и критериям облачные среды разработки и desktop IDE, которые основаны на web технологиях.

Часть 2. Другая online-IDE.

Меня зовут Евгений, я веб-программист (5 лет) и проектировщик интерфейсов (7 лет). В 15 лет увлекся темой сред разработки, языков программирования и методов трансляции. В 17 лет создал полноценную

IDE с интерпретатором под язык Object Pascal, а в дальнейшем провел множество экспериментов с компиляторами, языками программирования и java byte code.

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

Решение сделать среду разработки в браузере было принято по пяти причинам:

1. Хорошее знание веб-технологий.
2. Простота реализации необычного интерфейса.
3. Возможность открыть IDE на любом устройстве и в любом браузере без установки.
4. Доступность эффективных инструментов на любой мобильной платформе (например firebug не только на ПК, но и на планшете).
5. Механизм межсерверных вычислений, позволяющий реализовать множество интересных идей.

Каждый день в свободное от работы время я занимался его разработкой и при достижении версии 0.2 alpha я стал делать в нем сайты. Так я смог найти множество багов и проверить на практике необычный интерфейс. Какие-то решения убрал, какие-то добавил, но со временем стало уже понятно, что проект стал выходить за рамки «just for fun», про него стали спрашивать программисты, и

я решил обратиться к IT-сообществу с вопросами, для чтобы продукт стал удовлетворять не только мои потребности, но и других веб-разработчиков.

Перед тем, как их задать, я хочу рассказать об его цели и текущих результатах его разработки.

Цель: создать облачную IDE для веб-программистов, которая бы упрощала и ускоряла их работу, за счет объединения возможностей самых мощных IDE (например: webstorm), простого дизайна Sublime Text и новых решений (слово «инновации» уже раздражает).

Планируемые возможности:

• Умный auto-complete.
• Функции рефакторинга.
• Live-режим (даже с php файлами).
• DOM-инспектор с консолью, который можно использовать в любом браузере, в том числе и на мобильных устройствах.
• Файловый контроль версий.
• Поддержка sftp, dropbox, github и google drive.
• Расширенный файловый менеджер.
• Возможность работы с локальными файлами.
• Специальный интерфейс под мобильные устройства.
• API для разработки плагинов.
• Поддержка многофайловых snippet’ов (например, Вы решили вставить слайдер на главную страницу сайта, и с использованием многофайлового snippet’а можно добавить не только код-заглушку, но и загрузить на сайт в автоматическом режиме файлы слайдера и вставить ссылки на них в соответствующие места исходника).
• Репозиторий плагинов и snippet’ов.
• Современные технологии упрощенного программирования (emmet, easy motion и т.д.).
• Удобное управление проектами.
• Работа с psd файлами.
• Парное программирование.
• Разворачивание сервера для тестирования своего кода.
• Поддержка популярных языков программирования и веб-технологий.
• Функции генерации кода.
• Простой, стильный и необычный интерфейс, упрощающий работу.
• Несколько полезных социальных функций, таких как объединение в группы.
• Простой графический редактор и просмотрщик изображений.
• Реализация интересных технологий, основанных на межсерверных вычислениях (например: анализ исходного кода на лету).

Сейчас уже готова архитектура, основные функции работы с ftp и исходным кодом, а также простой и удобный механизм управления проектами. В системе реализовано множество необычных интерфейсных решений, которые немного упрощают работу. В проектах запоминаются открытые файлы, ссылки в live-режиме, открытые ftp-сервера и все раскрытые в них папки. За основу редактора исходного кода взят Ace-editor, на данный момент я его дорабатываю, чтобы достичь функций умного auto-complete’a. В mr. Gefest имеется начальная версия live-режима.

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

Для 1.0 alpha версии я планирую доработать интерфейс и реализовать следующие функции:

• Умный auto-complete для js, html, css, php.
• Стандартный и удобный файловый менеджер с контролем версий и с поддержкой sftp, github.
• Функцию быстрого перехода по ключевым элементам исходного кода (тэги, функции, классы, переменные и т.д., как в Subime Text).
• Полную поддержку Live-режима.
• Расширенный двухколонный файловый менеджер (в стиле total commander).

Поэтому, пожалуйста, напишите список функций online-IDE, которые для Вас важны. Вначале самые значимые. Например:

1. Умный auto-complete для js, html, css, php.
2. Стандартный и удобный файловый менеджер с контролем версий и с поддержкой sftp, github.
3. и т.д.

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

P.S.: тех, кто хотел бы помочь в разработке или в дизайне online-IDE, прошу написать мне личное сообщение, я надеюсь, что Вы найдетесь, ведь вместе мы сможем сделать всё гораздо быстрее.
P.S. 2: если Вы хотите первыми воспользоваться закрытой 1.0 alpha версией online-IDE, то напишите мне свою почту в комментариях или в формате личного сообщения.
P.S. 3: со своей стороны, я хочу поблагодарить ХабрХабр за предоставление бесплатного корпоративного блога по тарифу «Стартап», спасибо Вам большое!
P.S. 4: тех, кто читает статью 30-31 числа, «С наступающим», а тех, кто >= 1 января — «С новым 2015 годом»!

CodeLobster IDE — бесплатный PHP, HTML, CSS, JavaScript редактор

CodeLobster IDE – бесплатный PHP, HTML, CSS, JavaScript редактор

В этой статье мы рассмотрим бесплатный кросс-платформенный редактор для веб-разработки — CodeLobster IDE. Он уже долгое время присутствует на рынке и завоевал симпатии очень большого количества пользователей.

Как работает

CodeLobster IDE предназначен для редактирования PHP, HTML,CSS и JavaScript файлов. Он подсвечивает код в зависимости от синтаксиса, показывает подсказки для тэгов, функций и их параметров. Этот редактор очень хорошо работает со смешанным кодом.

Если Вы вставите РНР код в какой-нибудь HTML шаблон, то редактор корректно подсветит и HTML и PHP части, то же самое будет со вставками CSS и JavaScript кода.

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

CodeLobster IDE предоставляет контекстную помощь по всем поддерживаемым языкам. Для этого он использует актуальную информацию и документацию с официальных сайтов. Поэтому мы можем сразу увидеть описание любогоHTML тэга, CSS атрибута, PHP или JavaScript функции по нажатии клавиши F1.

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

Другие полезные возможности программы:

• Подсветка парных тэгов и скобок. Вам никогда не придется считать количество открытых и закрытых круглых или фигурных скоб. Редактор сам позаботится об этом.
• Автоматическая подсветка типов кода, возможность выделения прямоугольных блоков, возможность сворачивания кода, закладки, сниппеты, специальное окно со структурой файла и всего проекта и т.д.
• Интерфейс приложения переведен на 17 языков, среди которых Английский, Русский, Немецкий, Французский, Испанский и т.д.
• CodeLobster IDE мульти-платформенная (кросс-платформенная) IDE, которая поддерживает следующие операционные системы: Windows 7, Windows 8, Windows 10, Mac OS, Linux, Ubuntu, Fedora, Debian.

В Профессиональной Версии есть несколько дополнительных возможностей. Например, возможность работы с проектами на удаленном сервере посредством встроенного ФТП/СФТП клиента. При этом можно легко выбирать файлы для редактирования, просматривать результаты и синхронизировать изменения в файлах на хостинге.

Дополнительно Профессиональная Версия включает следующий набор дополнений:

• Полноценная поддержка JavaScript библиотек таких как jQuery, Node.js, AngularJS, BackboneJS, VueJS и MeteorJS.
• Большой набор расширений для работы с PHP фреймфорками — CakePHP, CodeIgniter, Laravel, Phalcon, Symfony, Twig и Yii.
• Плагины для работы с популярными ЦМС – Drupal, Joomla, Magento, WordPress.

После многих лет работы можно с уверенностью сказать, что мульти-платформенный CodeLobster IDE показывает себя только с лучшей стороны. Он работает быстро, эффективно, и очень сильно облегчает работу, особенно с большими проектами.

Вы можете скачать CodeLobster IDE с официального сайта —  http://codelobster.com/.

---

Спасибо, что читаете! Подписывайтесь на мой канал в Telegram и Яндекс.Дзен. Только там последние обновления блога и новости мира информационных технологий. Также, читайте меня в социальных сетях: Facebook, Twitter, VK, OK.

Респект за пост! Спасибо за работу!

Хотите больше постов? Узнавать новости технологий? Читать обзоры на гаджеты? Для всего этого, а также для продвижения сайта, покупки нового дизайна и оплаты хостинга, мне необходима помощь от вас, преданные и благодарные читатели. Подробнее о донатах читайте на специальной странице.

На данный момент есть возможность стать патроном, чтобы ежемесячно поддерживать блог донатом, или воспользоваться Яндекс.Деньгами, WebMoney, QIWI и PayPal:

Спасибо! Все собранные средства будут пущены на развитие сайта. Поддержка проекта является подарком владельцу сайта.

Поделиться ссылкой:

Похожее

10 лучших браузерных IDE, о которых должен знать каждый программист

10 лучших браузерных IDE, о которых должен знать каждый программист

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

1. Лучшая профессиональная онлайн IDE: AWS Cloud9

Когда Amazon купила Cloud9 IDE в 2016 году, она уже была очень популярна среди программистов. Полная интеграция с Amazon Web Services делает ее, пожалуй, самой мощной и расширяемой платформой для онлайн разработки, доступной на данный момент. Интерактивная IDE сочетает в себе редактор кода с терминалом и мощные средства отладки.

2. Лучшая бесплатная онлайн IDE: CodeTasty

CodeTasty — это полнофункциональная облачная IDE в облаке, которую легко и быстро настроить.

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

3. Лучшая онлайн IDE для начинающих: Codeacademy

Codecademy сочетает онлайн IDE с уроками для обучения программированию от новичка до эксперта. Их разнообразный каталог охватывает популярные языки, включая Python, JavaScript, CSS, HTML и Ruby.

4. Лучшая онлайн IDE для артистов: p5.js

Библиотека p5.js основана на JavaScript и предоставляет инструменты для создания интерактивного дизайна с помощью кода.

5. Лучшая онлайн IDE для Python: Codevny

Интерактивная среда разработки Python IDE должна быть быстрой, простой в использовании и иметь терминал для тестирования. Codenvy предоставляет все это и многое другое. Codenvy — это языковой агностик, и каждый экземпляр IDE является независимой средой разработки.

6. Лучшая онлайн IDE для JavaScript: JSFiddle

Разбираетесь в JavaScript? Попробуйте JSFiddle с шаблонными проектами, чтобы быстро воплотить идеи ваших веб-приложений в жизнь.

JSFiddle является полностью бесплатным и используется такими гигантами, как Google и Facebook вместе с тысячами разработчиков.

7. Лучшая онлайн IDE для пользователей GitHub: Gitpod

Хотя концепция GitHub IDE на первый взгляд может показаться странной, в этом есть много смысла. Gitpod существует как способ редактирования файлов на GitHub в браузере. Расширение браузера добавляет кнопку на страницу GitHub, которая при нажатии открывает рабочую область для текущего проекта.

Редактирование происходит в IDE на основе кода VS.

8. Лучшая онлайн IDE для Ruby и Ruby on Rails: Repl.it

Repl.it — среда для Ruby и Ruby on Rails и является идеальным местом для оттачивания ваших навыков.

9. Лучшая онлайн IDE для Arduino/IOT: Arduino Web Editor

10. Лучшая онлайн IDE для Visual Hardware программирования: XOD.io

XOD — это визуальный программист с открытым исходным кодом для плат Arduino на базе узлов. Каждый блок представляет собой устройства и датчики, и вы можете установить связь между ними, перетаскивая линии с каждого узла.

---

Спасибо, что читаете! Подписывайтесь на мой канал в Telegram и Яндекс.Дзен. Только там последние обновления блога и новости мира информационных технологий. Также, читайте меня в социальных сетях: Facebook, Twitter, VK, OK.

Респект за пост! Спасибо за работу!

Хотите больше постов? Узнавать новости технологий? Читать обзоры на гаджеты? Для всего этого, а также для продвижения сайта, покупки нового дизайна и оплаты хостинга, мне необходима помощь от вас, преданные и благодарные читатели. Подробнее о донатах читайте на специальной странице.

На данный момент есть возможность стать патроном, чтобы ежемесячно поддерживать блог донатом, или воспользоваться Яндекс.Деньгами, WebMoney, QIWI и PayPal:

Спасибо! Все собранные средства будут пущены на развитие сайта. Поддержка проекта является подарком владельцу сайта.

Поделиться ссылкой:

Похожее

IDE для PHP, JavaScript, HTML, CSS с встроенным веб и MySQL сервером и phpMyAdmin, FTP? — Хабр Q&A

Проекты делаю на PHP, JavaSript, HTML, CSS, MySQL с использованием локального затем удаленого веб-сервера, с phpMyAdmin и MySQL
Требования к IDE (если конечно такая существует, либо близко к этому)
Сразу cкажу что сейчас использую WebMatrix от Microsoft
Желательно что бы некоторые пункты выполнялись IDE автоматически, так же может быть и ручная настройка но предусмотренная в IDE(например окошко указания папки PHP, папки с MySQL и т.д.).

1. Установка и настройка PHP и phpMyAdmin вместе с IDE, либо через встроенный загрузчик (PHP есть в WebMatrix но там нет phpMyAdmin)
   
2. Установка и настройка MySQL вместе с IDE, либо через встроенный загрузчик (также есть в WebMatrix)
   
3. Встроенный локальный веб сервер (кнопочка Run из IDE)
   
4. Возможность задавать любое имя хоста, а не вида localhost:[порт] и не конфигурационным файлом, а указанием в IDEшных настройках проекта.
   
5. Файл проекта для IDE не должен храниться в папке самого проекта и там не должно создаваться никаких доп или конфигурационных файлов.
   
6. Контроль версий
   
7. Поставил и работает(возня в настройках минимальна, отсутствие нелогичных ошибок типа когда изменил localhost на своё имя домена и уже ничего не работает)
   
8. Поддержка кириллических путей к файлам
   
9. Работа доменов и сервера не привязана к одной папке и может быть запущена из любого места(это минус OpenServer)
   
10. Загрузка файлов через FTP при сохраниении
    

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

1. Dreamweawer, OpenSerwer (минусы: у IDE не современная работа с кодом, сервер отдельно. Однако в нем есть PHP, phpMyAdmin, MySQL)
   
2. Visual Studio for Web странная настройка веб сервера через включение IIS, и т.д. (- работает с грехом пополам, конфиг файл в корне)
   
3. Visual Studio Code (вместо PHP в основном работа с ASP.NET, localhost не изменишь на своё имя домена, нет PHP, phpMyAdmin, MySQL)
   
4. Aptana Studio или Eclipce (localhost не изменишь на своё имя домена, нет PHP, phpMyAdmin, MySQL)
   
5. phpDesigner (localhost не изменишь на своё имя домена, нет phpMyAdmin, MySQL)
   
6. WebStorm(есть работа с JavaScript, нет с PHP только редактриование) + phpStorm(есть работа с PHP, нет с JavaScript только редактриование) (c localhost не получилось возникает ошибка непонятно какая, как впрочем и c другими IDE). Вопрос зачем так разделять PHP и JavaScript между IDE. Но я не против работать и в двух средах лишь бы они слаженно работали.
   
7. WebMatrix (localhost не изменишь на своё имя домена, нет phpMyAdmin однако есть встроенный редактор бд как с локальной так и с удаленной)
   

…
Даже всех IDE не помню в которых работал, то что надо не нашел, пока остановился на WebMatrix так как он ближке всего к тому что я хочу, но как вижу он пока не развивается.

Может есть какие то варианты достижения таких результатов(кроме разработки собственной IDE =))
Расскажите как делают такие проекты.

Пользовательский интерфейс и C# на html? — Хабр Q&A

> Значит возможен ли UI с помощью html, css и js?
Теоретически — возможен.
Практически — для десктопа нет ничего более высокоуровневого, чем браузерные движки (в которых очень многого не хватает, поэтому многое придется сделать самому), вот обзор нескольких движков:
www.codeproject.com/Tips/825526/Csharp-WebBrowser-…
Еще один серьезный минус — тяжеловесность (несколько десятков мегабайт будет весить движок).
Правда, еще можете HTMLayout/Scite глянуть, я их особо не видел, из преимуществ — легкий вес, нужно будет и мне их глянуть, но видимо вменяемых оберток под .NET для них нет, а это плохо.

На мобильниках есть PhoneGap и React Native (благо в Android 4.x из коробки уже входит нормальный браузерный движок, а не такой, как IE — WebBrowser на винде), но они сыроваты, толком не документированы, малоизвестны.
Скорее это не для «великолепного» интерфейса, а для интерфейса быстросоздаваемого, когда есть наработки на HTML+CSS+JS и надо на них построить GUI в мобильном приложении. И кроме этих HTML+CSS+JS, в приложении особо ничего больше и не планируется.
Скажем, есть некий сайт, и нужно напилить для него мобильный клиент (типа как для VK, Facebook и т.д.) Так как сайт, слава Богу, имеет стройное RESTful API, то проще не писать нативный GUI, а взять ту же веб-морду на HTML+CSS+JS, прилепить ее к PhoneGap и с помощью какой-то матери сбилдить все это.

В Atom и VS Code, возможно, дело было отчасти в том, что именно те алгоритмы, в которых было автодополнение, подсветка синтаксиса для HTML, CSS, JS (и прочие основные возможности любой IDE), — именно те алгоритмы были только на JS (или готовые контролы для этого были на HTML+CSS+JS). А так как — еще раз — это основа любой IDE, то ничего удивительного.
Ну и да, VS Code и Atom — в основном рассчитаны на Web-разработчиков, среди которых есть и линуксоиды и маководы, и немало, поэтому в данном случае имеет хоть какой-то смысл кроссплатформенность — которая в иных случаях не дает ничего, кроме затруднения разработки и падения ее качества.

> Ходят слухи что WPF, помирает
Запомните раз и навсегда — никакой инструмент просто так не помирает.
Паровозы не исчезнут, пока не появятся тепловозы и электровозы.
Где альтернатива для WPF?
MS напилил новую платформу Windows Universal Apps (ранее — Metro), и усиленно проталкивает ее в массы, называя эти приложения «Windows Apps», ясно намекая, что якобы это и есть полноценные приложения для винды.
Но дерьмо не станет конфеткой от того, что его завернут в фантик. WUP — по-прежнему сырое УГ, да и в будущем конфеткой не станет — кадры в MS давно уже не те, чтобы писать хорошие, гибкие, удобные фреймворки без избыточности во всех ее 50 оттенках.
WPF и WinPhone уже были сыроваты — а еще более новый WUP еще хуже.
Ну и да, замечу, что WUP далеко не принципиально новый, и во многом основан на том же WPF (поэтому не так и сложно перейти с одного на другое). WUP — это такой же «не WPF», как и Spartan — «не IE», и примерно как Bolgenos — не «Ubuntu».