In this chapter, we will go over what DHTMLX is and the different ways in which we can use it. It is good to know that there are other options available and why DHTMLX stands out as a great choice for small-sized to full-sized web applications compared to others. We will also explain the application we will build, components that will be used, and what is needed to achieve this.
Surprisingly, I have found that DHTMLX's grid has more options than even the single libraries specializing in grids. Also, one must be careful of choosing a standalone library, as the documentation and maturity can sometimes be an issue.
What about the more robust component libraries?
One of DHTMLX's comparable libraries is Sencha Ext JS . They both aim to give the developer the tools needed to build rich desktop-like applications in a web environment. They also provide both a free version as well as a paid version which includes support.
The major difference between these two component libraries is their documentation and coding structure. Sencha Ext JS has a very granular documentation that, when learned, is very beneficial. DHTMLX has a straight to the point list of available methods and events which are available for each component.
Today, more and more web designers want to make applications. These designers have a better understanding of a customer's needs and how to create a more user-friendly application. These designers may not have an in-depth understanding of programming and documentation. DHTMLX caters toward this very well.
What is also important about a component is that they can be used together in a combination of components or separately in a block-level DOM element.
DHTMLX offers the following components:
DHTMLX also provides an online skin builder and a Visual Designer tool. The skin builder allows for editing the CSS of a current skin or downloading one of the many existing skins. For our application, we will use the default "Blue Sky" skin.
The Visual Designer tool is a graphical user interface that allows a user to create code without having to actually write it. This is free, and is available on the DHTMLX website.
Trumpets, please! We will be building a simple user management web application without a server-side database. Instead, we will be using HTML5's local storage. This will allow us to get going with DHTMLX quickly without being bound to a specific server-side language.
For the application, we will be using the Layout, Grid, Toolbar, Form, Chart, and Window components from the DHTMLX library. The app will provide the ability to add, delete, edit a user, and see charted data of those users in the system.
The following screenshot is what our final application will look like:
In this chapter, we covered what DHTMLX provides, which components are going to be utilized, and what our application will look like when completed. This brief introduction is enough to get us going.
In the next chapter, we will start the installation process by downloading and attaching the scripts in a local web server, then test that the library is installed correctly.