What is Web Application – Examples – How to Developed

What is a web application or website? When Standalone/desktop applications are already there then why do we need web applications? What are the examples of web applications? What type of technology and frameworks are used to develop a web application. What are the Softwares Required in Web Application Development? Let us start with the need for web applications.

Table Of Contents

Need of Web Application

The data and logic of desktop/standalone applications are specific to one computer, where the application is executing and allows only one user at a time to manipulate or use them. Example:- Core Java Applications (class with the main method), Calculator Applications on a computer, Antivirus software applications on a computer (without internet), VLC, and e.t.c.

The VCL is an example of a desktop application, which is specific to one computer. To use it on another computer we must install them separately. And at a time only one user can manipulate/use them. These are platform-dependent i.e. VLC for windows can’t run on Linux operating systems. To solve these limitations we need web applications.

In client-server applications, the data and logics of server applications are visible and accessible from multiple client applications. Here the data and logic of server applications are specific to one network (LAN) using which the client applications are talking to server applications. 

If we want to provide global visibility and accessibility to data and logics then we need to use a bigger network called WAN(Wide area network i.e. internet). The Internet is a network of networks and looks like a spider’s web, so the internet is also called a web network, and applications running on the internet are called web applications.

We can’t execute the regular desktop/standalone application, client-server application in the internet setup. For that, we need special applications called web applications/websites to execute in internet setup. Now, we can execute standalone, client-server applications directly on the internet. Some examples of web applications are- gmail.com, facebook.com, and e.t.c.

What is Web Application?

A web application (or web app) is application software that runs on a web server, unlike computer-based software programs that are run locally on the operating system (OS) of the device. Web applications are accessed by the user through a web browser with an active network connection.

The web applications also can be defined as:- “A web application is a computer program that utilizes web browsers and web technology to perform tasks over the Internet.

It is a collection of web components having the capability to generate web pages. Web Component:- Any reusable code that is in the form of a class or file is called a component. Example:- HTML file, Servlet component, JSP component, PHP component, asp.net component, and e.t.c.

Web Application Examples

Examples of web applications are:- webmail (Gmail, Yahoo! mail, Outlook.com/Hotmail.com, and e.t.c.), Online shopping (Amazon.com, eBay, Alibaba, and e.t.c.), Online banking, word processors, spreadsheets, video and photo editing, file conversion, file scanning, Google Docs, Google Sheets, Google Slides, online storage, and e.t.c. Examples of popular web apps would be social networking sites such as Facebook, video streaming sites such as Netflix, and photo editing software such as Pixlr.

Advantages of Web Application

The main advantages of web application over desktop/standalone applications are,

  • No separate installation required because it runs through the browser.
  • No compatibility issues, it can work on all operating systems. 
  • Can be easily customised to use on various devices, such as mobile/desktop/tablet.
  • Phones or PCs having low space also can use them.
  • Don’t take space on the hard disk of our computer. 
  • Centralised data is secure and easy to backup. Therefore it provides higher levels of security.
  • Quick and easy maintenance and updates.
  • Always up-to-date.

Static and Dynamic Web Pages

Web applications or websites contain web pages. Based on the content, web pages can be categorized into two types:- static and dynamic web pages. Web applications or websites contain both static and dynamic web pages.

  • Static web pages or Passive web pages:- The content of static web pages remain same for all requests. Example:- About us page, contact us page, terms and condition page, and e.t.c. For every request content of these pages remains the same.
  • Dynamic web pages or Active web pages:- The content of the web page will change based on the time of request generation or based on the input values of the request. Example:- Gmail inbox page, Facebook home page, live game score page, whether report page and e.t.c. 

See more about static and dynamic web pages:- What are the static and dynamic web pages – and their differences.

Static, Dynamic and Helper Web Components

There are three types of web component used to create web pages,

  1. Static Web Components:- These are given to develop static web pages. Example:- HTML, CSS files
  2. Dynamic Web Components:- These are given to develop dynamic web pages. Example:- servlet component (class developed by using servlet technologies), JSP component (file created using JSP technology/tags), asp.net component, PHP component and e.t.c. Servlet, JSP, asp.net, PHP, and e.t.c are web technologies, and their programs or code or files are called web components.
  3. Helper Web Components:- These are web components that don’t generate any web pages directly but they help other components in the generation of web pages. Example:- image files, audio files, video files, JavaScript files, CSS files and flex files, and e.t.c.

Technology Used to Develop Web Application

Currently, five dominant technologies used to develop web applications/websites,

  • PHP:- It is used for small-scale websites. Example:- Movie promotion websites, car model promotional websites, blogs. WordPress is developed using PHP, and it is the most popular tool to develop a website.
  • asp.net:- It is used for medium-scale websites. Example:- college, university websites
  • Java technologies Servlet, JSP:- They are used for medium and large-scale web application development where security and complexity are involved. Example:- merchant websites like Amazon.com, Banking application like citibank.com
  • NodeJS, ExpressJS:- Used for small and medium-scale web application development. Grabbed PHP and asp.net market. 
  • Django (extension of Python):- It came as alternate to above all but not succeeded because of security and performance issues.

PHP:- Personal home page for hypertext processing/preprocessing
JSP:- Java Server Pages
ASP:- Active Server Pages

Note:- HTML, CSS are used to develop user-interface therefore they are used with every above given technology. 

In all environments (Java, php, asp.net, e.t.c) we use the same helper web component and static web component but the dynamic web components will change environment to environment, technology to technology.

EnvironmentDynamic Web Component
JavaServlet, JSP
PHPPhp component
Asp.netAsp.net component
NodeJS/ExpressJSJavaScript file
DjangoDjango component (.py file)

In modern days we can use JavaScript files as helper web components (form validation) and also as dynamic web components in case of nodeJs/ExpressJS.

Web Application Development in Java

Originally Java is not so strong in user interface development (UI) i.e. we don’t have ready-made advanced GUI components to provide rich GUI, every user interface should be developed from scratch level. And due to this reason, a lot of small and medium scale websites used to avoid the heaviness of Java. 

Initially, Java was used only for large-scale, and complex website development to take the advantage of Java’s performance and security.

But with the arrival of jquery/angularJS/reactJS and e.t.c, the UI development is simplified very much and they can integrate with any environment of website development. We can use them in PHP, Java (Servlet, JSP), asp.net, django, nodeJS and e.t.c. Then industry started using Java with jquery/angularJS/reactJS to develop small and medium scale websites. Now, Java is used for small, medium, and large-scale websites. Mainly Servlet/JSP technologies or Spring MVC framework is used.

Softwares Required in Web Application Development

To develop and execute web application we need, 

  1. Browser Software: Used as an end-user agent to send requests and to gather results.
  2. Web Server or Application Server Softwares:- To automate the execution of web applications and their web components.
  3. Client-Side Web Technology or Framework:- To develop client-side web components.
  4. Server-Side Web Technology or Framework:- To develop server-side web components.
  5. Database Software:- As persistence store.

Note:- Browser software, client-side web technologies/framework, and database software are neutral and can be used with any technology-based web application development, but we must choose server-side web technologies/framework and web/application server having compatibility. If we have chosen server-side web technologies/framework for Java then the web/application server software also should be for Java.

We can decide whether a web application is Java based or .net based or PHP based on the web/application server software and server side web technologies/framework in which the development took place. If both are taken in Java then it is called Java based website. 

To develop and execute web applications/websites we should choose,
a) Any browser software
b) Any database software
c) One or more client-side technology/framework to develop client-side web applications.
d) Any web server or application server to automate the execution.
e) One or more server web technology/framework to develop server-side web components.

The (a), (b), (c) are common for all domains or environments of web applications like Java, .net, PHP, JS, Python and e.t.c. But we must choose web server or application server and server side web technologies and framework having compatibility.

Note

  1. A web application can be developed either as a two-tier application (without database software) or as a three-tier application (with database software).
  2. In one web server, we can deploy multiple web applications.
  3. Server application vs Client application:- If the application or machine is ready to give services to others then it is called server application or machine. If the application/machine is taking services from another application or machine is called a client application. For example- database software can be called server software or application, and browser can be called client application or software.
  4. The process of keeping a developed web application in a web server is called deployment and reverse is called undeployment.

How does Web Application work?

  1. End-User types URL in the browser address and generate the request.
  2. Web Server software that listens to requests continuously takes the requests and maps them to appropriate web components of appropriate deployed web applications.
  3. Web component processes the request.
  4. If necessary then the web component interacts with database software.
  5. The output/results generated by the web component go to the webserver.
  6. The web server sends that output/results to the browser as a response.
  7. The browser receives the response and displays it to the web page.

Browser Softwares

Role of browser software for the web application?
On the behalf of end-user, the browser software gives requests to the web application. The browser provides a platform to end users/visitors to send requests and to receive responses. To reach knowprogram.com and read this tutorial you need browser software to give the request to the web application. It is impossible to reach directly to this page.

Lists of some browser software (or) web clients (or) user-agents:-

Browser SoftwareGiven by
ChromeGoogle
FireFoxMozilla
IE (Internet explorer)Microsoft 
SafariApple
OperaOpera soft
NestScape NavigatorNetscape
Hot JavaRedHat
EdgeMicrosoft

Web Server Softwares

What is the need for Web Server Software?
The desktop/standalone application is specific to one computer and will be operated by one user at a time. Therefore, manual execution is sufficient.

But web applications or websites get requests from multiple clients/browser/users simultaneously from different locations and having different timing (24*7). Here the manual execution of web components is practically impossible. We need to execute the web application in an automated environment by keeping them on special software called web server software. Example:- Tomcat (Java), IIS (.net), AWS(PHP), Node.js(javascript) and e.t.c.

What is Web Server Software?
The webserver is a piece of software that automates the web application and its web component execution i.e. it listens to client requests continuously 24*7. It takes the request, passes them to appropriate web components, executes them dynamically, gathers the result from them, and sends the results as responses to the browser.

We don’t need to develop web server software, already lots of web server softwares is available, but developing web applications having web components and keeping that web application in a web server is our responsibility.

List of Web Server Softwares

Web server software is used to automate the execution of web application and its server-side web components,

Web Server SoftwareGiven byPlatform
TomcatApache Java
PWSMicrosoft   –
IISMicrosoft .net
AWSApche PHP
NodeJSChromeServer side JavaScript
NFTSNetscapeServer side JavaScript
ResinResinSoft Java
JettyEclipseJava

IIS => Internet Information server
AWS => Apache web server
PWS => Personal web server
JWS => Java Web Server
NFTS => Netscape FastTrack server

Java Based Application Servers

Application servers are the extensions of web servers. Web servers can be used only for executing web applications. Application servers can be used to execute web applications and other JEE applications like EJB components and e.t.c. In simple words, ApplicationServer = WebServer++

Some of the popular Java based application servers are:-

Application Server Given by
Widfly RedHat / JBoss
GlassFishSunMicrosystem / Oracle 
WebLogicOracle
WebSphereIBM
JRunAdobe
Oracle10gAsOracle corp.

In Java, when do we use web servers and when do we use application servers?

  • Generally we use Java web servers like Tomcat to automate the execution of Java based small scale web applications. Example:- University web application, collage web application.
  • Use a Java application server like wildfly to automate the execution of Java based large scale or complex web applications. Example:- E-commerce, banking websites and e.t.c.

More on Web Server

A web server is the combination of a computer and the program installed on it. Web server interacts with the client through a web browser. It delivers the web pages to the client and to an application by using the web browser and the HTTP protocols respectively. We can also define the web server as the package of a large number of programs installed on a computer connected to the internet or intranet for downloading the requested files using File Transfer protocol, serving e-mail, and building and publishing web pages. A web server works on a client-server model. A computer connected to the internet or intranet must have a server program. In Java, a web server is used to support the web component like servlet, and JSP.

A computer connected to the internet for providing the services to a small company for a departmental store may contain the HTTP server (to access and store the web pages and files), SMTP server (to support mail services), FTP server (for files downloading), and NNTP server (for newsgroup). The computer containing all the above servers is called the webserver. Internet service providers and large companies may have all the servers like an HTTP server, SMTP server, FTP server, and many more on separate machines. In the case of Java, a web server can be defined as the server that only supports the web component like servlet and JSP.

We discussed web server and web container in detail here:- What is Servlet Container and How It Works.

Server Side vs Client Side Programming

The server side Programming are used to develop server side web components whearas The client side Programming are useful to develop the client side web components.

End-User types URL in the browser address and generate the request. Web server software listens to that request and maps to appropriate web components of appropriate deployed web applications. Web component processes the request. The output/results generated by the web component go to the webserver.

After requesting a web component, if its code is executing in the web server itself then it is called a server-side web component. Example:- servlet component, JSP component, PHP component, asp.net component and e.t.c. 

After requesting a web component, if its code is coming to the browser from the webserver for execution then it is called a client-side web component. Example:- HTML file (HTML interpreter is available in the browser), Javascript code (JavaScript engine is available in the browser).

Note:- Don’t decide whether the web component is client-side or server-side based on the place where it resides, decide it based on the place where its code executes.

Let us understand it through Gmail. When we try to open the Gmail application from our browser then the browser sends a request to the Gmail web application. In the Gmail web application, some code is there which executes in the server itself to fetch all the mail for your Gmail id from their database. That code is an example of a server-side web component. After fetching the mail it is redecorated to HTML, CSS, javascript files so that end-user can easily read them (this work is also done by server-side web component). Finally, that file comes as a response to the browser and the browser executes them. This file is an example of a client-side web component.

List of Client Side web Technologies/Frameworks

The client side web technologies are useful to develop the client side web components. Some examples of client side web technologies are:-

Client Side language / technologies / frameworksGiven by
HTML W3C
CSSW3C
JavaScript Netscape + SunMicrosystems 
VBScriptMicrosoft
TypeScriptMicrosoft
AjexGoogle
jQueryJhon Resig
Angular/AngularJSGoogle
React/ReactJSFacebook
BootstrapTwitter
VueEvan You

What is a scripting language?
The language whose code can’t be executed directly or independently and must be embedded with other technology or language code is called scripting language. Example:- JS (JavaScript) can’t be executed directly, it must be embedded with HTML tags/code for execution, so it is called scripting language.

Note:- Ajax, Jquery, angular, angular JS, bootstrap, typescript, reactJS, and e.t.c all are extensions of JavaScript.

JavaScript is basically a client-side language or technology because its code executes in the browser by taking the support of the Java engine. We also have server-side javascript that executes in NodeJS server/runtime like express JS component.

List of Server Side Web Technologies/Frameworks

Server-side web technologies are used to develop server-side web components. Examples of Server Side Web Technologies are:-

Server-Side Web TechnologiesGiven byPlatform
Servlet Sun Microsystems / Oracle Java
JSP (Java server pages)Sun Microsystems / Oracle Java
asp (old)Microsoft .net 
asp.NetMicrosoft .net 
PHPApachePHP
SSJSNetscapeJavaScript
NodeJs, ExpressJsJavaScript

PHP => Personal home page for hypertext processing/preprocessing
SSJS => Server side javascript

In the market, we have a framework to develop server-side web applications. Using these frameworks we can develop server-side web applications very easily and fastly. Note that these frameworks are given on top of server-side web technologies.

Sever Side Web FrameworksGiven byPlatform
Spring or Spring-boot MVCinterface21 or pivotal teamJava
WebworkOpenSymphonyJava
ADFOracle Java
Asp.netMicrosoft.net
dhupalApachePHP
DjangoPython vendorPython

In Java, when do we use technologies like Servlet/JSP and when do we use framework?

  • We use Java technology like servlet, JSP to develop Java-based small-scale web applications. Example:- university website, college websites.
  • We use Java frameworks like spring MVC to develop Java-based large-scale and complex web applications. Example:- e-commerce website, banking website, and e.t.c.

Database Softwares

The database software is used as a persistent store for the web application. Database software can be categories into two types:- a) RDBMS b)  NoSQL DB

List of Some RDBMS-SQL  based (Used for structured data),

Database SoftwareGiven by
OracleOracle Corporation
MySQLDevx/Sun Microsystems/Oracle corp.
DB2IBM
PostgreSQLEnterprise DB
Maria DBMariaDB Corporation

List of Some NoSQL DB (for unstructured data),

Database SoftwareGiven by
MongoDBMongoDB Inc.
CouchDBApache Software Foundation

If you enjoyed this post, share it with your friends. Do you want to share more information about the topic discussed above or you find anything incorrect? Let us know in the comments. Thank you!

Leave a Reply