HTML5 Builder - Get Started

Новая версия RAD Studio XE3 принесла нам новый продукт под названием HTML5 Builder.
С помощью HTML5 Builder можно создавать современные WEB-приложения которые выглядят достаточно профессионально.
Если вы, так же как и я, ранее не смогли осилить RadPHP, то с новым продуктом скорее всего у вас что-нибудь да и срастется.
Новая среда кажется не привычной, но это лишь из-за цветовой гаммы, к которой, кстати, адаптируешься дстаточно быстро, в остальном интерфейс был максимально приближен к среде Delphi. Есть тот же Object Inspector, Tool Pallete, дерево со структурой приложения, редактор кода и дизайнер.

Скачав и установив trial- версию, я первым делом полез в Demo и попробовал запустить все что могло запуститься. Пошло не все, но большая часть.
Во время установки, помимо самого HTML5 Builder, будет так же установлен PHP и Apache. Все пройдет на автопилоте, и ни с чем не надо шаманить., что меня сказочно порадовало.

Ну, смотреть примеры это одно, а опробовать самому это другое, а значит, следующем моим шагом было вполне логичное желание сунуться в справку (да-да, я из тех странных людей, кто сначала смотрит инструкцию и справку, и только потом начинаю с умным видом изучать методом тыка). Справку, она же гайд, искать долго не придется, виднеется невооруженным глазом.
Выше упомянутое руководство предлагает нам "попробовать" на вкус новый продукт с создания четырех приложений в стиле "Hello, Web/Mobile!", таких как:
- Server Web Application и Cleint Web Application
- Server Mobile Application и Cleint Moblie Application

Сегодня опишу только первые два (Web).

 

И так, приступим к созданию первого приложения "Hello, Web!":
Для создания нового проекта после, запуска программы, с левой стороны, из списка операций, выберете пункт "New":

Затем в столбце по середине выделите "HTML5 Builder Projects":

Справа отобразятся файлы. Из них сейчас нам нужен только "Server Web Application", вот на нем и жмем двойным кликом:

Перед нами предстала рабочая область вашего проекта:

Справа, на палитре инструментов (Tool Palette), раскрываем список "Standard" и кладем на форму компоненты - Edit, Label, Button:

И вот что у нас должно получиться:

Выбираем "Label1", идем и инспектор объектов и очищаем поле "Caption".
Затем выбираем "Button1" и ставим ему в "Caption" фразу: "Say Hello".

Оставаясь на кнопке переходим на вкладку "Events" в инспекторе объектов и дважды щелкаем на событии "OnClick".
Теперь мы в редакторе кода и курсор встал между фигурными скобками ожидании ввода нами кода, описывающего события, которые произойдут после клика по кнопке.

function Button1Click($sender, $params)
{
 
}

Теперь запишем между скобками код суть которого в том, что после нажатия в Label будет выведена фраза: "Hello, " + введенный текст из поля Edit.

function Button1Click($sender, $params)
{
 $this->Label1->Caption = "Hello, ".$this->Edit1->Text."!"; 
}

Ну вот и всё. Нажмем на молнию в верху или просто на F9. Программа предложит вам сохранить файлы. После откроет браузер и запустит в нем вам скрипт.
Введите в Edit ваше имя и нажмите на кнопку.

Ну вот и написали мы наше первое приложение.

Второе - Client Web Application, отличается лишь кодом. Нажмите "New"->"HTML5 Builder Projects"->"Client Web Application" и дайте кнопке код:

Label1->Caption = "Hello, ".$this->Edit1->Text."!"; 
}

И все.))

Отличие Server Web от Client Web в том, что при Server варианте все обработка ложится на сам сервер, т.е. данные идут к нему и потом вам возвращается страница с новыми результатами. Когда же вы используете Client вариант, то тут вся работа, после загрузки страницы, происходит на стороне клиента, с помощью JavaScript.
Именно поэтому когда вы выбираете Event в инспекторе объектов для кнопки при Client варианте, так много различных событий, в то время как при Server методе всего четыре.

При тестировании Client Web Application в браузере вы скорее всего увидите, что после того как нажимаете кнопку, данные в Label меняются, а после страница перезагружается и все очищается. Но это лишь на локальном компе, при переносе на удаленный сервер у меня стало все нормально.

примечание:
после переноса файлов Client приложения их название не меняйте, иначе выйдет ошибка о том, что функция Button1Click не известна со ссылкой на документ rpcl/classes.inc.php

А теперь о переносе на хостинг. Все пошло не так гладко как хотелось бы.
Во-первых вам надо будет залить на сервер папку RPCL, найти ее можно там же, где у вас стоит и сам HTML5 Builder.
Без этой папки работать не будет ни один проект, так как на нее ссылаются все скрипты.

Если вы решили залить на хостинг Client Web Application, то не забудьте и про файлы с расширением *.js которые будут в папке с вашим проектом.
.
Server вариант работает хорошо.
А вот если вы запустили проект Client, то программа посыплет вас ошибками, а точнее одной "The Input Filter PHP extension is not setup on this PHP installation, so the contents returned by Input is *not* filtered"
К счастью это лечится путем ручной правки файла "system.inc.php", что лежит в папке "RPCL".
Открываем его и ищем подстроку: "throw new Exception" и комментируем ее ставя перед началом всей строки "//".

Теперь все работает.

На этом я заканчиваю

AltaVista,

vr-online.ru

Версия для печатиВерсия для печати

Рубрики: 

  • 1
  • 2
  • 3
  • 4
  • 5
Всего голосов: 0
Заметили ошибку? Выделите ее мышкой и нажмите Ctrl+Enter!

Читайте также

 

Комментарии

Аватар пользователя mental

Жесть, и вот зачем это надо? Лучше ПХП учить идите, дети, а не майтесь поделками покойного дядюшки Борланда.

Аватар пользователя Al

mental, а что надо? Полезная инфа. В любом случае для создания сайтов одного PHP мало. Надо знать как минимум HTML, PHP и MySQL. А уж визуальных полноценных редакторов PHP нет. Те, у кого есть много времени и мало рабоы, могут написать весь сайт на коленке, но где эти успешные и прибыльные сайты? ))))

Кстати, Борланд - вовсе не живой человек, хотя название компании происходит от фамилии. Компиляторы от Борланда создают самый быстрый и оптимальный код, проверено неоднократно.

Аватар пользователя savely

>Компиляторы от Борланда создают самый быстрый и оптимальный код, проверено неоднократно.

Да и компилятор Паскаля раз в n-сколько быстрее Сишного. ;)

P.S. IMHO, Паскаль "у заняпадзе" исключительно потому, что MS его "не любит". Жаль. 

P.P.S. Хм, а насчет того же PHP - в ХЕЗ вроде как все для этого есть.