web application development

Web Application Development


2

Section 1 Task 1: understand the concept of web application 1. Briefly evaluate the functions and advantages of web applications A Web application is an application that is accessed via web over a network such as the Internet or an intranet. Functions Web applications are very popular because of the ubiquity of a client. The ability to update and maintain Web applications without distributing and installing software on potentially thousands of client computers is a key reason for their popularity. The uses of Web applications are to implement Webmail, online auctions, online retail sales, discussion boards, wikis, Weblogs, MMORPGs and many other functions. In early days the types of client-server computing, each application had its own client program which served as its user interface and had to be separately installed on each user's personal computer. An upgrade to the server part of the application would typically require an upgrade to the clients installed on each user workstation, adding to the support cost and decreasing productivity. In contrast, Web applications dynamically generate a series of Web documents in a standard format supported by common browsers such as HTML/XHTML. Client-side scripting in a standard language such as JavaScript is commonly included to add dynamic elements to the user interface. Generally, each individual Web page is delivered to the client as a static document, but the sequence of pages can provide an interactive experience, as user input is returned through Web form elements embedded in the page markup. During the session, the Web browser interprets and displays the pages, and acts as the universal client for any Web application. The advantages of web applications are web applications do not require any complex "roll out" procedure to deploy in large organizations. A compatible web browser is all that is needed and browser applications typically require little or no disk space on the client. They require no upgrade procedure since all new features are implemented on the server and automatically delivered to the users. Web applications integrate easily into other server-side web procedures, such as email and searching. They also provide cross-platform compatibility in most cases (i.e., Windows, Mac, Linux, etc.) because they operate within a web browser window. With the advent of HTML5, programmers can create richly interactive environments natively within browsers. Included in the list of new features are native audio, video and animations, as well as improved error handling. Modern web applications support greater interactivity and greatly improved usability through technologies such as AJAX that efficiently exchange data between the browser and the server. Web applications allow for easier introduction of new user devices (e.g. smartphones, tablets) because they have built-in browsers. 2. Briefly compare different types client side and server side scripting languages The client is the system on which the Web browser is running. JavaScript is the main client-side scripting language for the Web. Client-side scripts are interpreted by the browser. The process with client-side scripting is:


3

 the user requests a Web page from the server  the server finds the page and sends it to the user  the page is displayed on the browser with any scripts running during or after display Client-side scripting is used to make Web pages change after they arrive at the browser. It is useful for making pages a bit more interesting and user-friendly. It can also provide useful gadgets such as calculators, clocks etc. but on the whole is used for appearance and interaction. Client-side scripts rely on the user's computer. If that computer is slow they may run slowly. They may not run at all if the browser does not understand the scripting language. As they have to run on the user's system the code which makes up the script is there in the HTML for the user to look at (and copy or change). Some Client-Side Scripting Languages  JavaScript  Action Script (used to create animated interactive web applications for Adobe Flash Player using Adobe Flash Pro)  Dart  VBScript (Correction: VBScript is not client-side. All processing is done on the server. It may appear to be client-side because the processing is done in tags inside the HTML.)  Typescript The server is where the Web page and other content lives. The server sends pages to the user/client on request. The process is:  the user requests a Web page from the server  the script in the page is interpreted by the server creating or changing the page content to suit the user and the occasion and/or passing data around  the page in its final form is sent to the user and then cannot be changed using serverside scripting The use of HTML forms or clever links allow data to be sent to the server and processed. The results may come back as a second Web page. Server-side scripting tends to be used for allowing users to have individual accounts and providing data from databases. It allows a level of privacy, personalisation and provision of information that is very powerful. E-commerce, MMORPGs and social networking sites all rely heavily on server-side scripting. PHP and ASP.net are the two main technologies for server-side scripting. The script is interpreted by the server meaning that it will always work the same way. Server-side scripts are never seen by the user (so they can't copy your code). They run on the server and generate results which are sent to the user. Running all these scripts puts a lot of load onto a server but none on the user's system.

Web Application Development                   

4

ASP (*.asp) ActiveVFP (*.avfp) ASP.NET (*.aspx) C (*.c, *.csp) via CGI ColdFusion Markup Language (*.cfm) Groovy Server Pages (*.gsp) Java (*.jsp) via JavaServer Pages JavaScript using Server-side JavaScript (*.ssjs, *.js) (example: Node.js) Lua (*.lp *.op *.lua) Perl CGI (*.cgi, *.ipl, *.pl) PHP (*.php) R (*.rhtml) - (example: rApache) Python (*.py) (examples: Pyramid, Flask, Django) Ruby (*.rb, *.rbw) (example: Ruby on Rails) SMX (*.smx) Lasso (*.lasso) Tcl (*.tcl) WebDNA (*.dna,*.tpl) Progress WebSpeed (*.r,*.w)

A site such as Google, Amazon, Facebook or Hobowars will use both types of scripting: 

server-side handles logging in, personal information and preferences and provides the specific data which the user wants (and allows new data to be stored)  client-side makes the page interactive, displaying or sorting data in different ways if the user asks for that by clicking on elements with event triggers 3. Examine web security concerns and make recommendations for security improvements for your web application. To improve the security of web applications, an open and freely-accessible community called the Open Web Application Security Project (OWASP) has been established to coordinate worldwide efforts aimed at reducing the risks associated with web application software. A number of major organisations and government departments have also devoted resources themselves to develop strategies, policies and guidelines aimed at managing the risks from the open nature of web applications. To ensure a minimum level of assurance of web application security, some organisations have developed checklists designed to assess overall web application security before final production launch. The US Department of Defence has developed their own Application Security Checklist2 as one example, designed just for this purpose. This section focuses on areas that need to be observed from a technical perspective, in order to increase the reliability and security of all programs and systems involved. A typical web application architecture contains 3 tiers, separating the externally-facing web server from the internal application server and database server. With a tier-based architecture such as this, even if an attacker compromises an externally-facing web server from the outside, they still have to find ways to gain access and attack the internal network. This is the principle of defence-in-depth protection. Defence-in-Depth is a practical approach to information


5

security. The fundamental concept always centres on the idea of multiple layers of security to protect vital assets. Layers of security include input validation, database layer abstraction, server configuration, proxies, web application firewalls, data encryption, OS hardening, and so on. The Development Stage This is one of the most important stages in terms of mitigating security issues within the code. Observing secure coding standards certainly helps improving security and reducing the number of common mistakes that result in security breaches. In addition, performing security risk assessments during the development stage also helps to identify the security controls required. The Testing and Quality Assurance Stage Before any application is launched for production, the need for comprehensive testing is paramount. In addition to user acceptance tests, there are others, such as system tests, stress tests, regression tests and unit tests that are useful in validating the performance and accuracy of system functionalities. This section describes some of the tests that can be carried out in order to increase the reliability and security of the program/systems being developed. Web Application Firewalls Standard firewalls can help restrict or permit network access to network ports authorised by the organisation. Although application proxy firewalls exist, they cannot understand the specific content of all web applications being run by the organisation. According to the Web Application Security Consortium, a web application firewall (WAF) is “an intermediary device, sitting between a web-client and a web server, analysing OSI Layer7 messages for violations in the programmed security policy” Usually, web application firewalls are installed in front of a web server. Like standard firewalls, these can be software or hardware based, but always with the purpose of protecting the web server from attack. There are two protection approaches:  Signature based: The WAF identifies attacks by checking web request against an “attack signature” file.  Abnormal behaviour based: The WAF identifies attacks by detecting abnormal traffic patterns. The potential advantages for nonprofits in integrating their donor database with their web site are significant. However, the security risks presented by online database access are potentially very serious – and these risks are the same whether you are a small nonprofit staffed by volunteers or a Fortune 500 corporation. These risks can be greatly reduced, and in many cases, eliminated altogether, when secure data access is a priority in the design, implementation, and maintenance of your online access portal. In this article, we’d like to address some common security risks associated with online database transactions, explain some of the technology behind these interactions, and then describe steps that can be taken to mitigate the risks involved.

Task 2: Design web applications


6

1. Design a web application to meet the given requirements in the scenario above. Use all relevant techniques such as wireframing, storyboarding and sitemap. Your website should have at least five pages including homepage, a login/ registration page, search/rate book page, make reservation page and web map. The header and the footer design should be the same in all pages. A Web application is an application that can be accessed by the users through a Web browser or a specialized user agent. The browser creates HTTP requests for specific URLs that map to resources on a Web server. The server renders and returns HTML pages to the client, which the browser can display. The core of a Web application is its server-side logic. The application can contain several distinct layers. The typical example is a three-layered architecture comprised of presentation, business, and data layers. Figure 1 illustrates a typical Web application architecture with common components grouped by different areas of concern.

The presentation layer usually includes UI and presentation logic components; the business layer usually includes business logic, business workflow and business entities components, and optionally a façade; and the data layer usually includes data access and service agent components. General Design Considerations When designing a Web application, the goal of the software architect is to minimize the complexity by separating tasks into different areas of concern while designing a secure, high performance application. Follow these guidelines to ensure that your application meets your requirements, and performs efficiently in scenarios common to Web applications: 

Partition your application logically. Use layering to partition your application logically into presentation, business, and data access layers. This helps you to create


7

maintainable code and allows you to monitor and optimize the performance of each layer separately. A clear logical separation also offers more choices for scaling your application. 

Use abstraction to implement loose coupling between layers. This can be accomplished by defining interface components, such as a façade with well known inputs and outputs that translates requests into a format understood by components within the layer. In addition, you can also use Interface types or abstract base classes to define a shared abstraction that interface components must implement.



Understand how components will communicate with each other. This requires an understanding of the deployment scenarios your application must support. You must determine if communication across physical boundaries or process boundaries should be supported, or if all components will run within the same process.



Consider caching to minimize server round trips. When designing a Web application, consider using techniques such as caching and output buffering to reduce round trips between the browser and the Web server, and between the Web server and downstream servers. A well designed caching strategy is probably the single most important performance related design consideration. ASP.NET caching features include output caching, partial page caching, and the Cache API. Design your application to take advantage of these features.



Consider logging and instrumentation. You should audit and log activities across the layers and tiers of your application. These logs can be used to detect suspicious activity, which frequently provides early indications of an attack on the system. Keep in mind that it can be difficult to log problems that occur with script code running in the browser.



Consider authenticating users across trust boundaries. You should design your application to authenticate users whenever they cross a trust boundary; for example, when accessing a remote business layer from the presentation layer.



Do not pass sensitive data in plaintext across the network. Whenever you must pass sensitive data such as a password or authentication cookie across the network, consider encrypting and signing the data or using Secure Sockets Layer (SSL) encryption.



Design your Web application to run using a least-privileged account. If an attacker manages to take control of a process, the process identity should have restricted access to the file system and other system resources in order to limit the possible damage.

2. Design client-side and server-side (client –server architecture) functionality in your web application Market analysts have noticed a trend toward developing multitier applications that are distributed over Internet-standard networks, and predict rapid growth in these distributed systems in the coming years. Some predict that, by 2005, the familiar architecture of client/server applications will be replaced by "super-suites" of interconnected components, operating in frameworks of widely-available distributed systems. In other words, applications will be assembled from reusable building blocks, by using a variety of cooperating subsystems.


8

Before delving into the implementation details of building Web applications, it might be helpful to take a brief look at the architecture of the Web from a historical perspective, beginning with the traditional client/server architecture. Client/server (two-tier) architecture have usually performed many of the functions of stand-alone systems; that is, they present a user interface, gather and process user input, perform the requested processing, and report the status of the request. Because servers only provide access to the data, the client uses its local resources to process it. Out of necessity, the client application can tell where the data resides and how it is laid out in the database. Once the server transmits the data, the client is responsible for formatting and displaying it to the user. 3. Design your web application database system Application of computers certainly has improved the ways in which we acquire, process, store and disseminate information in libraries. Web enabled database have certain advantages over other means of sharing/ publishing information over internet. The following ER diagram will descried the database functionalities of the online library system

4. Evaluate alternatives designs and solutions to meet a given requirements


9

Alternative design solutions are designing the dataflow diagram for the given online library management system to create the architectural view of the system and making the desining the flow charts and procedure oriented design for the given domain.

Task 3: Implement web applications 1. Implement a proposed wireframe and client –server architecture introduced in task 2 using scripting languages as appropriate html for web pages, css for presentation style, javascript for client side script, php for server side script and sql for database query. Creating the required pages and relevant functionalities Javascript implementation of online library managemenr system: import javax.servlet.*; import java.sql.*; public class books extends GenericServlet { Connection con; ResultSet rs; Statement st ; public void init(ServletConfig sc) { try { super.init(sc); Class.forName("sun.jdbc.odbc.JdbcOdbcDriver"); con = DriverManager.getConnection("jdbc:odbc:sri","gscl","granada"); } catch(Exception e){e.printStackTrace();} }

public void service(ServletRequest req,ServletResponse res) { try


10

{ st=con.createStatement(); rs = st.executeQuery("select * from addbooks"); ServletOutputStream sos = res.getOutputStream(); sos.println("Currently existing books are"); if(rs.next()) sos.println("< /tr>"); while(rs.next()) { sos.println(""); } sos.println("
BNAME BCODE AUTHOR DATEOFARR PRICE RACKNO NOOFBOOKS SUBJCODE
"+rs.getString(1)+" "+rs.getString(2)+" "+rs.getStrin g(3)+" "+rs.getString(4)+" "+rs.getString(5)+" "+rs.getString(6) +" "+rs.getString(7)+" "+rs.getString(8)+"
"); st.close(); rs.close(); } catch(Exception ex){ex.printStackTrace();} } } public class addbooks extends GenericServlet { Connection con; public void init(ServletConfig sc) { try { super.init(sc); Class.forName("sun.jdbc.odbc.JdbcOdbcDriver"); con = DriverManager.getConnection("jdbc:odbc:sri","gscl","granada"); } catch(Exception e){e.printStackTrace();}


11

} public void service(ServletRequest req,ServletResponse res) { try { Statement st = con.createStatement(); String str1 = req.getParameter("bn"); String str2 = req.getParameter("bc"); String str3 = req.getParameter("aut"); String str4 = req.getParameter("doa"); String str5 = req.getParameter("pr"); String str6 = req.getParameter("rn"); String str7 = req.getParameter("nob"); String str8 = req.getParameter("sc"); ServletOutputStream sos = res.getOutputStream(); INT k = st.executeUpdate("insert into addbooks values('"+str1+"','"+str2+"','"+str3+"','"+str4+"','"+str5+"','"+str6+"','"+str7+"','"+str8+"')"); IF(k>0) sos.println("books are added successfully"); ELSE sos.println("books are not added"); } catch(Exception ex){ex.printStackTrace();} } } 2. Implement a web-enabled database management system to store, retrieve and manipulate data in the web application In the General Database Access area, any table in the database can be viewed or manipulated through a standardized interface. Common activities in this area include adding new item formats and adding terms. MySQL is an industrial-grade database management system (DBMS). The IS is driven by a MySQL database hosted on an OIT MySQL server. It is defined by a collection of MySQL scripts. These scripts contain MySQL statements that, when executed by the DBMS, create the tables required by the IS. After the database is created, another collection of MySQL scripts migrate the data from the old database to the new. The database is solely responsible for representing the state of the library and is the only way in which data is stored within the IS. 3. Identify and implement opportunities for error handling and reporting Error handlings are implemented which will be executed when an expected error occurred. And produce status reports to provide information on the progress of resolving the problems found. An electronic system supports easy production of various reports on the status of the recorded problems, (e.g., a report sorted by date, status, or priority). Summary totals can also be produced readily, such as the number of problems resolved and the number unresolved.


12

Status reports must also be produced for manual Fault Reporting Systems, but are more time consuming and prone to error.

Task 4: test web applications 4.1 review and test your web application on front end and back end levels Generally the testing levels are Integrity checks: Ensure that the data has not been tampered with and is the same as before Integrity checks must be included wherever data passes from a trusted to a less trusted boundary, such as from the application to the user's browser in a hidden field, or to a third party payment gateway, such as a transaction ID used internally upon return. The type of integrity control (checksum, HMAC, encryption, digital signature) should be directly related to the risk of the data transiting the trust boundary. Validation: Ensure that the data is strongly typed, correct syntax, within length boundaries, contains only permitted characters, or that numbers are correctly signed and within range boundaries Validation must be performed on every tier. However, validation should be performed as per the function of the server executing the code. For example, the web / presentation tier should validate for web related issues, persistence layers should validate for persistence issues such as SQL / HQL injection, directory lookups should check for LDAP injection, and so on.; Business rules Business rules are known during design, and they influence implementation. However, there are bad, good and "best" approaches. Often the best approach is the simplest in terms of code. Business rules are known during design, and they influence implementation. However, there are bad, good and "best" approaches. Often the best approach is the simplest in terms of code. Ensure that data is not only validated, but business rule correct. For example, interest rates fall within permitted boundaries. Some documentation and references interchangeably use the various meanings, which is very confusing to all concerned. This confusion directly causes continuing financial loss to the organization. It is not easier to understand and verify a back end than a front end because a front end usually has friendly and intuitive user interfaces.


13

A back end has its own objects, such as, tables, stored procedures and triggers. Data integrity and protection is critical. Performance and multi-user support are big issues. Slowness in operation can be vital to the project’s future. There are no sufficient tools for back end testing. SQL language is mainly a testing tool. MS Access and MS Excel can be used to verify data but they are not perfect for testing. However, there are a large number of test tools available for front end testing. To be able to do back end testing, a tester must have strong background in SQL server and SQL language. It is relatively difficult to find testers who understand both SQL server and SQL testing. This causes a shortage of back end testers. A back end is the engine of any client/server system. If the back end malfunctions, it may cause system deadlock, data corruption, data loss and bad performance. Many front ends log on to a single SQL server. A bug in a back end may put serious impact on the whole system. Too many bugs in a back end will cost tremendous resources to find and fix bugs and delay the system developments. It is very likely that many tests in a front end only hit a small portion of a back end. Many bugs in a back end cannot be easily discovered without direct testing. Back end testing has several advantages: The back end is no longer a "black box" to testers. We have full control of test coverage and depth. Many bugs can be effectively found and fixed in the early development stage. Take Forecast LRS as an example; the number of bugs in a back end was more than 30% of total number of bugs in the project. When back end bugs are fixed, the system quality is dramatically increased. This testing approach document is designed for Information and Technology Services’ upgrades to PeopleSoft. The document contains an overview of the testing activities to be performed when an upgrade or enhancement is made, or a module is added to an existing application. The emphasis is on testing critical business processes, while minimizing the time necessary for testing while also mitigating risks. It’s important to note that reducing the amount of testing done in an upgrade increases the potential for problems after go-live. Management will need to determine how much risk is acceptable on an upgrade by upgrade basis. 4.2 analyse actual results against expected results to identify discrepancies After conducting the test, compare the actual result to the expected result. Various testing methods can be used to review the results. If there is no difference, record the test as non-discrepant on the test scenario test script. If there is a difference, record the discrepancy on the test scenario test script, and determine if the discrepancy is the result of an error in the code or an error in the expected result. The sample of a completed test scenario illustrates the process of documenting the testing as it is conducted. If the code is in error: 

Use the Guidelines for Preparing a Fault Report to prepare the Fault Report.


 

14

Follow the Fault Report Tracking Procedures defined in the Test Plan. Use an automated fault tracking system or a manual error tracking system to track the Fault Report.

If the expected result is in error, correct the expected result, and rerun the test. When all tests have been executed and errors corrected, conduct regression testing to ensure that no new errors were created during error correction. Tools that capture and playback screen activity, can be used to assist with the process of running regression tests. Record any metrics as required by the test procedures, (e.g., the types of errors found, such as logic errors and documentation errors). Use evaluating test metrics to assist with the process of identifying and gathering test metrics. 4.3 Critically evaluate independent feedback on a developed web application and make recommendations for improvements After evaluating the functionalities of the system the online library web application system finally given to a set of individual customers to get their feedback about that web application. Finally the feedbacks are recorded and the additional requirements to improve the system are also recorded which will leads to the improvement of the whole web application 4.4 create user documentation for a developed web application The end user documentation process contains the information about the system which includes what are all the functionalities of the system, and how to handle the system in an optimized way. Generally it will act as a guide which helps the user to become more familiar with the web application system tutorial. The user documentation describes each feature of the application. A good user documentation can also go far as to provide trouble shooting assistance. Documentation:   

Register your mail id to get continuous access to the online web application Search for the book by giving any of the metadata of the book (such as title, author, genre, year of publication) you are looking for. Receive the book online and rate them

These are the some guidance given to the user in the user documentation.


15

References: 1. Kozlowski, P. and Darwin, P. (2013). Mastering web application development with AngularJS. 1st ed. Birmingham, U.K.: Packt Pub. 2. Grove, R. (2010). Web-based application development. 1st ed. Sudbury, Mass.: Jones and Bartlett Publishers. 3. Fowler, S. and Stanwick, V. (2004). Web application design handbook. 1st ed. San Francisco: Morgan Kaufmann. 4. Oberg, R., Thorsteinson, P. and Wyatt, D. (2003). Application development using Visual Basic and .NET. 1st ed. Upper Saddle River, NJ: Prentice Hall PTR. 5. Conallen, J. (2003). Building Web applications with UML. 1st ed. Boston: AddisonWesley. 6. MacCaw, A. (2011). JavaScript web applications. 1st ed. Sebastopol, CA: O'Reilly. 7. Radaideh, M. and Al-Ameed, H. (2007). Architecture of reliable Web applications software. 1st ed. Hershey, PA: Idea Group Pub. 8. Reese, G. (2009). Cloud application architectures. 1st ed. Sebastopol, Calif.: O'Reilly.

web application development

Recommend Documents