Key Project Types

From HTML5 Builder
Jump to: navigation, search

The key project types supported by HTML5 Builder are client mobile application, client web application, server mobile application and server web application.

When choosing between them, you should take into account three different aspects of your application:

Interface Mechanism

HTML5 Builder provides two different mechanisms to handle your pages’ design.

While each mechanism is meant to be used with a specific type of application, there is no real limitation on a project basis; you can use pages with different interface mechanisms in the same project. However, each page can only use one mechanism; it’s not possible to have a single page that may use all of them, or combine them somehow. Also, avoid AJAX navigation (see Mobile Interface) when linking from mobile pages to web pages.

Web interface.

Web Interface

The web interface mechanism provides the most flexible approach, and it supports a wide range of controls. The code generated by these controls is close to the HTML defaults, hence their default appearance and visual behavior will depend on the web browser and operating system used to access the webpage.

Their design can be completely customized through their properties, as well as plain CSS code (see Styling). They also support CSS animations.

Mobile interface.

Mobile Interface

The mobile interface mechanism is based on the jQuery Mobile library. It is meant for touch-enabled devices (smartphones and tablets) and supports only a specific set of controls developed also using jQuery Mobile (see Mobile Components).

This type of interface can be easily themed. On the other hand, their controls lack built-in support for CSS animations.

The MLink control, used to navigate between pages, does this navigation using AJAX by default; target pages are loaded into the current page in the background, and then a transition is played to hide the current page and show the target page. You can skip this behavior using MLink’s NoAjax property.

Development Technologies

Most web applications are developed and deployed following a client-server architecture. You have a web server, where you might have a DBMS and a scripting engine like PHP, and you have clients in the same network (e.g. the internet), usually web browsers, that can request content to the web server.

The workflow is simple: 1. The client application requests an address to the web server. 2. The server sends content to the client based on the request.

The content sent to the client is usually a webpage. Webpages are written in HTML, but they can also contain CSS for styling, JavaScript for scripting, etc. All these languages are then interpreted by the client, the web browser, which loads and renders the webpage. They are client-side technologies.

What happens if PHP is installed on the web server, and the client requests a PHP script? What happens is that the web server runs the script, which usually generates a webpage, which is in turn sent back to the client. The process of building that webpage dynamically is known as server-side scripting. This makes it possible, for example, to include data from a database such as InterBase or MySQL on the resulting webpage, something that can only be done using server-side technologies.

Note: Links between pages must always point to filename.php (not .html or .js), regardless of the set of technologies used. Those links are transformed into client-side links during deployment, if needed.

Client-side only Technologies

In HTML5 Builder, you can write applications that rely only in client-side technologies: HTML, CSS, JavaScript, etc.

Both Client-side and Server-side Technologies

HTML5 Builder allows you to use server-side scripting to generate and manipulate from the server the pages requested by a client. While server-side technologies require of a web server reachable by the clients, they also provide a lot of flexibility and dynamism to your applications.

In applications distributed on the client side, the first page of your application must redirect to the web server when loaded from the client side.

Built-in AJAX

Server pages (both web and mobile) include built-in support for AJAX, which allows making asynchronous calls to the server from a page loaded in the client, without having to reload the page to get new data from the server. This is a special way of using both client-side and server-side technologies.

The HTML5 Builder AJAX implementation is built into the controls, making things really easy in simple AJAX use cases; you just need to configure two properties of a page, and all the server-side events will use AJAX automatically. This AJAX implementation depends on the type of page (interface mechanism) you are working with: see Server Page AJAX for server pages or Mobile AJAX for server mobile pages.

By default, in applications distributed on the client side, when linking to another page of the project, the client-side version of the page will be loaded, so PHP events (e.g. OnBeforeShow) will not get triggered. Once the page has been loaded, any server-side event triggered client-side (e.g. a server-side OnClick event) will result in a call to the server, which will this time call all the rendering PHP events (e.g. OnBeforeShow). To get the server-side rendering events triggered from the beginning, the first page of your application must redirect to the web server when loaded from the client side (see Client-side Distribution).

You can also use a other AJAX implementations to perform asynchronous calls to your scripts on the server side; the jQuery implementation, for example, is supported in all HTML5 Builder pages, and can be used along with the built-in HTML5 Builder implementation.

Distribution Methods

Main page: Distribution Methods.

HTML5 Builder applications can be distributed from a web server, which users in the same network can access from a web browser, but they can also be distributed on the client side, packaged as a simple folder or as a mobile application.