UI frameworks are emerging to become an accepted standard for building complex, consistent and maintainable presentation layer for a web application. UI frameworks, when implemented sets standard for developing presentation layer of any web application.
Adopting such a framework can greatly simplify application development, and provide a measure of consistency and predictability across a family of developed systems.
This whitepaper explores more about what is UI framework and how the power of Sun’s Java Server Faces can be leveraged to build a more generic UI framework for a complex web application. It also includes advantages and some examples of the UI framework implementation.
Introduction
The Internet has no doubt become the most popular source of information today. More and more businesses have adopted the Internet as the vehicle to display their business information, advertise their products, and maintain customer interactions. The activity of developing Web applications occupies a fair amount of resources, time, and effort. Doing so in an efficient and timely manner directly contributes to a business's success.
The ability to rapidly develop a Web site to support business changes poses a challenge to many companies. Consequently, a reusable, scalable, and extensible user interface (UI) framework for developing Web applications is undoubtedly desirable.
what is UI framework?
UI framework development essentially promotes some common design goals like: modularity, information hiding, ease of use and layered approach in order to conquer complexity.
- A typical web UI framework involves following features:
- Rapid Application development support
- Clean component model
- Advanced form handling
- Rich and reusable component set
- Pluggable look and feel
- Easy internationalization
- Integration with the other frameworks/applications.
It is absolutely necessary that one is able to compose a form or even a flow of forms in a website in a rapid prototyping mode. The Developer should not much bother about the underlying technology.
Clean component model
The framework system provide a clean and concise object oriented component model as known from traditional UI programming. This includes super classes that provide common behavior and state. Also, there will be a common event handling mechanism as well as a mechanism to separate view, controller and model in a proper way.
Advanced form Handling
Handling of forms is automated as much as possible. This includes automatic type conversion of form input as well as form value formatting. Of course, form handling provides an automatic error handling facility at the level of individual components but also at the level of the form itself. The framework also provides a set of typical validators.
Rich Component Set
Given today requirements, the framework provides a component set that includes all the standard html controls. But other components are also there include to offer real benefits, since these are the components developed (or copy-and-pasted) over and over again in typical web projects. Such components include but are not limited to
- Tables - with events of course
- Calendar controls
- Date and time chooser
- Country chooser
- Tabbed panes
- Tree controls
Each and every website has a unique look and feel. The framework provides a support for pluggable rendering facilities. This can be achieved with a clear component model for renderers and pluggable render factories. Also, a sophisticated framework provides support for on-line switching of the underlying render engine and for choosing a custom render mechanism for individual components to satisfy typical customer’s requirements.
Easy Internationalization
Internationalization is there in every aspect of the ui components - renderers as well as formatters and type converters - in a way that makes it possible to switch internationalization settings at any point at runtime.
Integration with other programming models of frameworks
Framework provides integration with other technologies also through various mechanisms. This feature allows UI to sustain amidst multi-technical platforms. Like, there may be a requirement to for an application to talk to a different application. So, framework caters such requirements.
UI Framework Benefits
Adopting a UI framework for any web application development results into following advantages:
- Today, the major part of web application across any enterprise suffers from lack of these features discusses above, which in turn results into higher development cost for any enterprise, If they are having multiple UI based application portfolio. Incorporating a framework makes cost down.
- This allows the UI (i.e., Web pages) to be developed independently of the business logic, enabling a loose coupling between presentation and business implementation.
- Adoption of framework dictates standards across applications.
- Developers are required to be very knowledgeable in a wide variety of UI coding languages such as html, jsp, css, asp, JavaScript and xsl.
- When one follows a UI standard, there are typically IDE plug-ins that greatly simplify building the UI.
Java Server Faces - Introduction
In the past, technologies such as JavaServer Pages (JSP) have provided a primitive approach to develop HTML-based Web applications using Java. However, they have failed to provide a standard and reusable UI framework. The JavaServer Faces (JSF) technology offers a standard and effective way to manage and develop reusable UI components, which together assemble a Web application.
Some key points about JSF are as follows:
- JSP page is made up of UI components
- UI component values are stored as properties in Managed Java Beans. Each UI component will specify a specific bean and bean property that it represents. As a result there can be many beans that represent the html form. This is unlike Struts where there is only one bean per form – the Form Bean.
- UI components can be associated with a Java Bean (the whole component, not just the value of the component). In this case the Java Bean is called a Backing Bean. Using a backing bean gives the developer access to all UI components in a form.
- Actions are associated with UI components unlike Struts where an action is associated with the form.
JSF provides certain UI components that can be used to develop web pages easily coupled with Java beans for business logic.
Any web application’s UI has following features in general like:
- Framework (including login, banner, navigator tree, content area, page path)
- Data Manager ( table /List)
- Search
- Properties Pages
- Wizards
- Modal Dialogues (including confirmation, error, warning, wait, etc.)
- Special Messages window
- On-line Help
A JSF component can be written for all these features in a more generic way and the same can be utilized in more generic way across pages/across applications.
And coding in a page would be as simple as :
<b:myPage styleClass="subtle" styleClassSecond="datashow" class=”someBean” />
instead of hundreds of lines of HTML/JavaScript code.
An Example of Framework based Application
Below we have screenshot to two sample application that are built using JSF based UI framework.
The main feature which have been utilized here are:
- Tiles for common layout like banner, navigator and content page
- table component functionality which will be used across application
- JSF component for navigation tree
- JSF component for path
In today's customer-oriented economy, even the best technology does not guarantee market acceptance. Factors such as benefits to business, cost of adoption, and availability of service and support from tools influence a business's decision on whether or not to adopt a new technology. Businesses must understand the implications of a new technology on each of the above concerns. So a UI framework eases the process of designing, developing, and maintaining Web applications and creates a cost effective development environment.
0 comments:
Post a Comment