What are Web applications?

Web applications are applications that a user views in a Web browser. A Web browser reads Hypertext Markup Language (HTML) and uses it to render text, images, and controls such as text input fields, buttons, and hyperlinks. The Web browser gets the HTML by connecting to a Web application server using the Hypertext Transfer Protocol (HTTP). A Web application server is software that runs on a computer and is accessible on a network through the user's Web browser.

Web application server software is available at no cost and in many different commercial licensing and support models. You can install Web server software on almost any computer, but typically, Web server software used to expose Web applications to the public on the Internet is installed on advanced computer hardware that is more robust than a personal computer.

To learn more about Web application server software, see:

Hosting providers are entities that provide Web application server software and hardware for you. Typically, you pay a hosting fee to the provider for this service. One benefit of using a hosting provider is not having to administer the Web server software or hardware yourself (typically). Using a hosting provider, you can devote more time to building the Web application and less time worrying about the infrastructure on which it will run. One disadvantage of using a hosting provider may be that they typically support a given set of technologies—such as computer languages and databases—so make sure you chose a hosting provider that supports the technologies you intend to use.

Web applications are accessible on a network by specifying a uniform resource locater (URL) in the Web browser's address bar. A URL specifies the name of the server, the file you're requesting from the Web server, and optional parameters that the Web application can use to provide dynamic content.

To learn more about URLs, see Untangle URIs, URLs, and URNs.

What are the different types of Web applications?

All Web applications fit into one of two different categories: static and dynamic. A static Web application (or Web site) is HTML and other content that is relatively unchanging. Static Web applications consist of resources in the form of HTML in plain text files in a directory structure. This directory structure is accessible by the Web application server. When the Web application server is asked for a resource with a URL, the server finds the resource in the directory structure that matches the request and sends it to the user's browser. In static Web applications, the Web application server provides the resource as it is, without interpreting it first. Static Web applications are good options for building Web sites that contain information that doesn't change often.

A dynamic Web application can provide changing (dynamic) content to the user. In a dynamic Web application, the Web application server does something with the resource after reading it from the file system and before sending it to the user's Web browser. The software that the Web application server uses in this process is called an interpreter. An interpreter reads a resource from a directory structure, processes it in some way, and then sends the output to the user's Web browser in the form of HTML.

An example of an interpreter is the PHP interpreter, which reads PHP code from the file system and executes the PHP code to build output in the form of HTML. Other examples of technologies that can be used to build dynamic Web applications include JavaServer Pages (JSP), Java™ Platform, Enterprise Edition (Java EE), Ruby, Python, and Groovy.

To learn more about these technologies, see these resources:

How do I do programming in Web applications?

Web applications can respond to user interaction and can have dynamic behavior when you use a programming language aside from HTML. There are two types of programming in Web applications: client-side and server-side programming.

Client-side programming means using a programming language that the user's Web browser will execute. The most standard programming language by far for client-side programming is JavaScript™. JavaScript can be included in separate text files that are referenced by the HTML files, or you can put it directly into the HTML in special HTML tags called scripttags. When the user's Web browser encounters these script tags, it executes the JavaScript code contained in those tags or files.

To learn more about JavaScript coding, see Crossing borders: JavaScript's language features.

Client-side programming has certain limitations, because code that is executed by a Web browser does not have easy, direct access to a database or files. Client-side programming can also have performance limitations, as not all users' computers are equally powerful, and not all Web browsers have the same performance.

Other examples of client-side programming include computer languages that are compiled to a file and executed by the browser using a browser plug-in. An example of code that is used in this way is Adobe Flex MXML and ActionScript, which are compiled to an SWF file. The browser downloads the SWF file and executes it (as long as the browser has the correct Adobe Flash Player plug-in installed). Other technologies include Microsoft® Silverlight and the JavaFX technology.

To learn more about client-side programming with Adobe Flex, see:

Server-side programming refers to using computer languages to write code and execute it on the Web server. This execution takes place after a user has made a request using a URL and before the Web server software sends the HTML back to the user's Web browser. Web applications that include server-side programming often access a database or files on the Web server. Examples of Web applications that use extensive server-side programming are e-commerce sites, social-networking sites, and wikis.

Many more options are available for server-side programming, but these options require you to install additional software and make it available on the Web application server. The Web application uses this additional software—often in the form of an interpreter or module—to execute the code located on the server. Because server-side programming has this dependency, you must make sure that if your Web application is installed at a hosting provider, your provider supports the server-side computer language.

An example of a server-side Web application programming language is PHP. To use PHP in a Web application, you put PHP code in files that are accessible to your Web server. You must also make sure that a PHP interpreter (or module) is installed and configured for the Web server. If you're using a hosting provider, you must make sure your provider supports PHP.

When a user accesses the PHP using their browser, the Web application server software locates the PHP file in the Web server's file system. The server executes the PHP and usually generates HTML that will be sent back to the user's Web browser.

To learn more about PHP, see PHP project resources

You can use many other programming languages to build Web applications today. Examples include JSP and Ruby.

To learn more about server-side programming, see:

What tools are available?

Many different tools are available for building HTML files and cascading style sheet (CSS) files and for doing both client- and server-side programming. These tools range from free to expensive, from open source to proprietary.

Because HTML files, CSS files, and JavaScript files are plain-text files, the most basic tools that you can use for building a Web application are a simple text editor, a Web application server, and a Web browser. Vendors provide each of these tools at no cost.

Different editors are available for HTML and programming that provide more features than simply editing text. Some editors include features such as syntax highlighting, file formating, and validation. Some tools offer "what you see is what you get" (WYSIWYG) editing, which is useful for designing HTML and CSS files, because you can see how the files will look when rendered in a browser without having to deploy the files to a Web application server.

Beyond simple editors are integrated development environments (IDEs), which include features found in many advanced text editors plus features such as the ability to interact with your Web application server and database and to deploy and debug the code in applications.

To learn more about IDEs available for Web development, see:

To learn more about other tools available for Web development, see Must-have tools for HTML, JavaScript and AJAX development and debugging

What are Web frameworks?

Web frameworks are groups of prebuilt Web components and patterns that can be used to make Web programming easier and more organized. By using a Web framework, you can significantly decrease the amount of effort required to build a Web application. Some Web frameworks provide features like user security. Many allow you to make your Web application configurable.

A common goal of Web frameworks is to help reinforce use of the model-view-controller (MVC) design pattern. A design pattern is an arrangement of code or components that has emerged over time as a working solution. The MVC design pattern is common in Web application programming, and it encourages the separation of code that represents objects in the business (the model) from code that tells the application what to do (the controller) from the code that builds the HTML (the view). Many Web frameworks enforce an MVC pattern, allowing you to organize your code so that changes to any one of the model, view, or controller has less impact on the others. One criticism of Web application frameworks is that they move the relationships between controller, view, and model components out of code and into configuration files—often Extensible Markup Language (XML) files. A disadvantage of using extensive configuration is that errors can occur that will not be caught by a compiler or usually by an IDE. These errors are typically discovered at run time—while the code is executing. Errors in configuration can be more difficult to find than errors in code.

Examples of Web frameworks in the Java programming language are the Spring Framework, JBoss Seam, Apache Wicket, Apache Click, Apache Tapestry, and Apache Struts.

You can learn more about these Web frameworks on the IBM developerWorks site:

Examples of Web frameworks that are available in the PHP programming language include CakePHP, CodeIgniter, and the Zend Framework.

You can learn more about these Web frameworks on the IBM developerWorks site:

Web frameworks used commonly in the Ruby programming language include Ruby on Rails (RoR). RoR is a convention-over-configuration framework, which means that the relationship between model, view, and controller components is derived by how the different components are named instead of making extensive use of configuration files.

An example of a Web application framework available for the Groovy programming language is Grails. Grails is a convention-over-configuration framework similar to RoR.

To learn more about Grails, see:

Some of these frameworks are extensive—entire books and user communities have sprung up around their use. Although the goal of most frameworks is to be as easy to learn as possible, some frameworks require a lot of reading and learning before they can be used in the best way possible. You can read more about many of these frameworks on their site.

How do I use databases?

Databases are applications that allow you to store and access data. Web applications use them to provide dynamic functions to users, such as displaying products, content management, user management, and more.

How you can access the database is specific to the server-side programming language you're using to build your Web application. Each programming language has its own drivers that you can use to connect to the database and access information. The drivers allow you to execute queries and commands and work with the results.

Databases are available in many different licensing models, from free to paying per connection or CPU on the Web server. Some very good, robust databases are available as open source projects. Others are proprietary.

Databases come in different types. A common type of database is a relational database management system (RDBMS), where data is stored according to the relationship it has to other data. In many implementations, an RDBMS consists of storing data in different tables and building relationships between rows in the tables. Data stored in an RDBMS is available for querying using a language called Structured Query Language (SQL). Most relational databases support SQL, and most of them offer full support for SQL that conforms to American National Standards Institute (ANSI) standards. However, different database implementations offer different features, and not all of them support the full range of ANSI SQL equally, making writing SQL that can be used equally in many different databases difficult. Another type of database is an object database, although these databases aren't terribly common.

One very common RDBMS in use today in many Web applications is MySQL. Another example of a Web application database is Apache Derby (formerly IBM Cloudscape). To learn more about building Web applications with Derby, see:

Other examples of proprietary databases include IBM DB2®, which is a descendant of the very first relational database product (System R).

Technologies are available that help you connect your server-side Web application code to a database. These technologies are called object-relational mapping (ORM) tools, and they allow you to write code without having to worry about the different SQL implementations, as many of them dynamically generate SQL for you. ORM tools also enable you to write code that maps the data in a database with objects in your code without having to write more code to do it.

Examples of ORM tools include Hibernate and iBATIS. To learn more about ORM tools, see:

In addition to traditional databases, a growing number of people are using databases that are available as cloud databases. Cloud databases run on many machines at once and are accessible from the Internet, offering the advantages of scalability and redundancy. An example of a database that is available for use in a Web application is Amazon SimpleDB.

To learn more about using Amazon SimpleDB, see:

What are JavaScript and Ajax?

JavaScript is a programming language used for client-side programming in Web applications. JavaScript code is executed by the browser and allows Web application programmers to build dynamic Web content such as components that show or are hidden dynamically, change appearance, validate user input, and more.

You can use JavaScript code to modify the HTML inside the browser using the Document Object Model (DOM), which is a set of objects that represents the HTML rendered in the browser.

To learn more about using JavaScript code, see:

In recent years, JavaScript re-usable libraries have become more common. These JavaScript libraries are often tested in the most common browsers. Because the libraries are already tested, you can use them in your Web application without being concerned that they may work in some browsers and not in others: Not all browsers support all JavaScript equally.

Two common examples of JavaScript libraries are jQuery and Prototype, both of which provide very rich functions. For example, they expand and collapse HTML elements, provide dissolve and fade, and offer superior handling of click events.

To learn more about using jQuery and Prototype, see:

You can include JavaScript code in HTML by using the <script> tag. You can also include JavaScript code in a Web application as a separate text file, often with a .js extension. JavaScript libraries such as jQuery and Prototype are often distributed in these files, and using them allows you to share the JavaScript code between the pages of your Web application without having the entire body of JavaScript code included in each HTML file.

Asynchronous JavaScript + XML (Ajax) is a term used to define a special use of JavaScript coding. You can use JavaScript code to make an HTML request to a URL and do something with the response, such as show it to a user or process it. The response is often in valid XML, which can be parsed easily by JavaScript components. Ajax allows Web applications to get information for the user without the need for refreshing the Web page the user is currently viewing. This behavior provides a fluid experience to the user and allows you to build Web applications that provide more information.

Some common uses of Ajax are progress bars, uploading or downloading files, performing validation that requires server interaction, or looking up values from the server and showing them to the user. You can even use Ajax to build online chat applications, where the chat can run entirely inside the browser.

To learn more about developing with Ajax, see:

What are CSS, CSS2, and CSS3?

Cascading style sheets refers to special code that allows Web developers to add colors, change fonts, include images, and position elements in Web applications. Similar to JavaScript code, you can include CSS in plain-text files separate from the HTML. CSS can also be referenced in the HTML files themselves in style tags.

The goal behind CSS is to separate the presentation from the information. Information is in the HTML files, where attributes that dictate positioning, font sizes, colors, and visibility are available, but discouraged. Over the years, the demand for better styling and positioning has required improvements in CSS—hence, CSS2 and CSS3. Each new version of CSS supports more features than the version before it.

CSS3, for example, supports advanced functions for working with images, such as using them as borders and stretching them in the background. Other features include using transparency, better font effects, and multi-column layouts.

To learn more about using CSS3, see Create modern Web sites using HTML5 and CSS3

Are there standards for HTML or XHTML?

The World Wide Web Consortium (W3C), a standards body composed of international members, is dedicated to promoting Web standards. HTML and Extensible HTML (XHTML) are two of these standards.

Over the years, HTML and XHTML standards have been versioned—similar to CSS—to allow improved features. XHTML is an attempt at offering an HTML standard that is also fully XML compliant—tags must be properly nested and properly closed, the case of tags is important, and namespaces are supported. A document type definition (DTD) is available to help validate the XHTML.

HTML5, which is an emerging standard, is the proposed standard to follow HTML version 4.01. HTML5 includes many new elements that extend the current HTML 4.01 standard, including those such as header, footer, and address, which offer new ways of identifying data on the Web page. Also, the proposed HTML5 standard seeks to better support the increasing use of media in Web pages with elements such as video and audio.

To learn more about HTML5, see New elements in HTML 5

Even though HTML and XHTML are published standards, different browsers support them differently. Some vendors offer support for nonstandard, or propriety, HTML attributes and tags. Although support for proprietary HTML tags sometimes offers convenience or richer functions, taking advantage of proprietary HTML tags means breaking the Web application's ability to be used equally in all browsers.

Writing HTML and XHTML that conform to standards as much as possible is the preferred method of building Web applications. Fortunately, many tools are available that help you check your HTML or XHTML to see if it complies with standards. Many of the IDEs discussed in What tools are available? are capable of checking your HTML to make sure that it conforms to W3C standards.

What are CMSs and portals?

A content management system (CMS) Web application is a set of components and features that allows users to administer information on the Web—usually without having to know the details of Web development such as HTML, CSS, or databases. Many CMS solutions for the Web offer fully featured editors, some of them with WYSIWYG functions, that allow users to log in, change content, and publish content without having a knowledge of HTML. If you are planning to build a Web site, consider using a CMS.

Many CMS solutions provide the ability to extend them with custom plug-ins or modules that have additional functions. For example, a plug-in or module might provide the ability for users to vote on content, search the site's contents better, or even provide e-commerce functions.

Like tools, CMSs are available in both free and commercial licensing models and both open source and proprietary solutions. The open source CMS solutions are provided in many different computer languages, including all of the languages discussed in How do I do programming in Web applications. Some examples of open source CMS solutions written in PHP are Joomla, Drupal, and WordPress.

To learn more about using these tools to build a collaborative Web site, see Using open source software to design, develop, and deploy a collaborative Web site

Portals are similar to CMS solutions, but they offer users the ability to build their own Web pages that provide the functions they desire. Often, this means the user assembles a home page using different components that are already available, such as Web components that display Really Simple Syndication (RSS) feeds, the weather, news headlines, and other information. Portals can be developed for internal intranets, offering information about an enterprise or divisions inside the enterprise.

Emerging standards for portals include Java Specification Request (JSR) 168 and JSR 286, which define how Java Portlets work. These standards allow you to build components that can be used inside portals using the Java programming language.

To learn more about portals and portlets, see:

Putting it all together

Web application development encompasses many different technologies, from Web application server software that serves content in HTML, CSS, or JavaScript files to relational databases and server-side programming. These technologies can enable you to build a Web application that users can access on the Internet in their Web browsers.

IBM developerWorks and IBM provide a lot of information and resources for helping you build Web applications as well as products that you can use to build enterprise-ready Web applications.