Редакторы для создания программ на JS или «Что у разработчиков в голове?»

в 13:25, , рубрики: javascript, Веб-разработка, Песочница, Программирование, метки:

JavaScript скриптинг — вот тема данного поста. Рассмотрю я в нем некоторые программы и постараюсь описать личные ощущения и проблемы.

Итак, предисловие (или введение)

Програмым на JavaScript были всегда, начиная с первого браузера. Хотя если быть честным, то они появились еще во времена программируемой бытовой техники. Обычно программы делаются для интерактивности, либо это какие-то мелкие рюшечки плюшечки, которыми увешаны страницы для красоты.

Забавы ради

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

Некроссбраузерность. Вот допустим написали вы программу и запихали в нее красивости, сделали «часы», проверили в установленной у вас «Опере», все работает. Выкладываете, и слышите затем комментарии, где одни хвалят, а другие ругают вас, что что-то не работает. Чаще всего это из-за того, что одни методы работают в одном браузере, но не работают в другом. Как раз для этого и существует второе замечательное свойство.

Кроссбраузерность. Обратное первому свойству. Это означает, что каким бы изощренным не было ваше приложение, оно будет одинаково работать везде.

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

Что-то я нарыл… Проверим!

Я подумал, раз программы можно делать для браузера, то наверняка есть программа, которая этот процесс облегчает. Я задался целью найти такую, и, как ни странно, нашел. Когда я начал искать, уже во всю рекламировали html5, и первая программа, что я нашел — это Game Maker HTML5. К моему разочарованию я так и не нашел нормальную версию, одна у меня вообще начала требовать СМС. Забив на эту прогу, я скачал обыкновенный GM8, но там и намека нет на html или js. Я начал искать другие программы.

JSBuilder

Название у программы внушительное, сразу вспоминается «Borland C++ Builder» (или не Borland?).
Первую, которую скачал заблокировал антивирус. Это подбило мое доверие к программе, но рискнув, я скачал с другого источника, и запустил в SandBox'е. Прога сразу начала жаловаться на пути и на доступ. Но интерфейс вроде ничего. Скриншот интерфейса привести не могу, так как у меня нет хостинга, куда я мог бы выложить изображение (печаль).

К сожалению, программа запускается ужасно медленно, даже при отключенном антивирусе. После запуска я обрадовался, так как интерфейс очень походил на указанную выше программу (от Борланда). Поковырявшись в меню, я кой-чего сообразил. Одно расстройство, как я ни извращался я не смог запустить программу на ней, то кнопка «Run» не появлялась, то она не реагировала, то вообще открывала браузер на пустой странице. Весь процесс создания занимает не очень много времени, но все же. Есть поддержка событий, вся она работает с DOM архитектурой и это хорошо, однако никакой компиляции (сборки, имеется ввиду), что очень огорчает. Собирать приложение из файлов проекта тоже можно, но это нудно очень. Еще расстроил тот факт, что отсутствует какая-либо документация, если не знаком с Delphi или C++Builder, то не видать тебе счастья. При работе с объектами их программный код меняется автоматически, однако если сменить название объекта, то событие его создания удаляется, не знаю почему. Поэтому перед переименованием стоит сделать копию ресурсов, а затем вставить, менять в них не придется ничего, так как там используется параметр «this», а не id объекта.

В общем, впечатление от программы осталось неважным. От программы с таким названием ожидал большего, хотя визуальный редактор отличный, плохо, что автор не развивает программу. Еще один «камень» в огород программы, это то, что иногда исчезает окошко со свойствами объекта, поэтому время от времени приходится сворачивать и заново открывать окно редактора, но думаю это уже издержки среды. И все же после небольшого мучения я смог запустить приложение, но увы, но работало только под IE, что меня тут же огорчило, причем настолько, что я отказался от программы.

DreamViewer

Продукт, который заслуживает внимания не моего, а скорее профессиональных студий дизайна и разработки. Эта программа меня откровенно обрадовала и шокировала. В ней можно создавать хоть что, и это будет выглядеть Кроссбраузерно (?). Однако программа произвела и отрицательное впечатление. Она ужасно тормозит при визуальном редактировании, и работа с пикселями у нее рознится почему-то. Но это уже не влияет на разработку, так как это из «другой оперы нота». Огорчила программа тем, что она вылетает при неизвестных мне обстоятельствах, причем никакой системы вылетов нет, она может просто быть открытой, и вылететь, даже если я не прикоснусь к ней. Либо может спокойно продержаться долго, даже когда я в ней усердно работаю. Благо сессии позволяют не терять данные при вылетах, но это жутко раздражает, так как запускается программа так же долго. В целом если компьютер мощный, то это не такая и проблема. Единственный минус, это интерфейс, он вроде и удобный, но весь запутанный, так что до нужного момента не так то просто и добраться.

NVU

Русскоязычная программа для визуального проектирования, хотя скорее для дизайна, однако в ней можно строить и программы, но никакой прозрачной работы вы не увидите. Есть страница, и есть события. Работа с событиями производится в отдельном окне. Однако у этой программы есть один огромный плюс — это справка. В этой программе наверное самая лучшая справка по html. Из нее я почерпал много знаний, который в будущем мне пригодились. Однако эта программа подойдет скорее тем, кто хочет создавать страницы. Полноценный визуальный редактор страниц позволит вам буквально за минуту создать контур будущей страницы, и еще за минуту полноценную работу. WYSIWYG — вот ключевой момент создания страниц в этом редакторе. Для тех кто не знает, расшифровывается как «Что видишь, то и получишь», то есть суть.

JSCreat (или ГСКонструктор)

Новая программа, вышедшая только в апреле этого года. Нашел я ее когда «шуршал» на форуме javascript.ru. Там один паренек комментировал ее и просил помощи по редактору. Меня это естественно заинтересовало. К моему удивлению поисковик мне ничего не выдал по запросу JSCreat, и ГСКонструктор тоже. Сейчас можете не беспокоиться, поисковики выдают результаты нормально. Первый запуск был волнительным. Так как по описанию редактор стоящий. Но я сильно удивился, когда взору предстало окошечко, где было просто написано: «Редактор приложений». И все. То есть вообще все! Я не мог понять, скачал новую версию с официального сайта, и тогда все прояснилось. Та версия, которую я скачал была «левой». В официальной все было отлично. Открылось белое окошко со вкладками. Слева панелька с объектами, справа свойства. Сразу же вспомнилась программа JSBuild. Хотя интерфейс значительно отличался от всех знакомых мне редакторов. Он полностью на русском, что меня обрадовало. И тут есть необычное меню, на котором изначально видны все кнопочки, не так как в JSB. Я сразу же нажал на «Тестовый запуск». Браузер открылся, и мне предстала строка «Ты еще ничего не сделал...». Я даже улыбнулся, разработчик веселый. Сказать честно, непривычно двигать объекты не перетаскивая мышью сами объекты, а перетаскивать мышь на кнопке «двигать». Объекты двигаются стабильно, но привыкал я долго. То же и с кнопкой масштабирования. Сказать честно, это даже прикольно, нет надоедливой рамки. Однако в этом редакторе я нашел то, чего искал в остальных — это удобство в работе. Сначала неудобно, но потмо понимаешь, что все на своих местах. Я набросал на форму компонентов, или объектов, как их называет автор, и нажал на тестовый запуск. В браузере предстало мое творение в таком виде, в котором я его создал. Радости не было предела. Работа с событиями происходит в отдельном окне, есть быстрый переход между событиями, и автосоздание событий, то есть если выбрать событие OnClick, и оно не создано для текущего объекта, то оно будет создано и курсор уже будет внутри. Правда есть минус — слабая подсветка синтаксиса, но радует то, что она вообще есть. Есть работа с буфером, что позволяет вставлять изображения и текст прямо из буфера. Скажу это удобно. На большом меню есть создание нового проекта, открытие существующего, сохранения, настройки проекта, настройки редактора, настройки программы, тестовый запуск, сборка приложения, «о программе» и справочник функций. Кроме самого J, в редакторе предоставляется небольшой список функций для работы с DOM-структурой, работа со стилями, работа с положенеи мэлементов. команды движения. Есть даже команда для создания новых элементов, причем они могут создаваться в любом количестве. Огорчило меня то, что нет исходников или примеров, а те что есть, привязаны к версии, на которой они были разработаны. Поэтому пришлось учить все самому. Хотя на оф сайте и есть небольшой урок для работы с редактором, не хватает ему видео-уроков. В настройках редактор есть два вида тестового запуска, простой тест и тест в WEB ОС «ГСПортал». Со вторым я так и не разобрался, но это и не главное. Главное, что появился неплохой редактор для JS. Плюс в настройках проекта можно добавить jQuery к проекту, и сразу же его использовать, что я собственно и сделал. Но тогда встроенные функции становятся ни к чему. Есть работа со страницами, то есть как я понял, все страницы создаются в одном документе, и переключаются специальными командами, причем у меня даже получилось сделать это. Переключается оно всего одной командой. Общее впечатление осталось положительным и восторженным.

Как итог, хочу сказать

После всех программ, что я рассмотрел, хотелось бы составить небольшой итог.
Итак, JSBuilder — устаревшая, но была бы отличной перспективной разработкой.
DreamViewer — отличный, но сложный рекатор с большими возможностями.
NVU — Дизайнерский пакет, который вряд ли подойдет для создания нормальных программ.
JSCreat — Очень перспективный и подающий надежды проект, работа со страницами, эффекты, jQuery, все это делает его отличным инструментом.

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

Автор: Skaner


  1. Витек:

    Помогите, не могу найти программу JSCreat!!!

  2. Витек:

    Ребята я понял! В поиск писать надо ГСКонструктор… Хотя сама прога называется JSCreat.

* - обязательные к заполнению поля


https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js