2016
System Application Development WEB DESIGN AND DEVELOPMENT
Task1: Concept Development
of
Web
Application
P1.1 Critically Evaluate the Functions and Advantages of Web Applications Applications that run over internet are called web applications. Such applications or software need not be installed on any particular machine. They are executed in browser. Such applications are not computer or operating system or browser specific. These are designed so that they are functional on various operating systems and browsers. Examples of common web applications are Facebook, Gmail, Google, yahoo, msn chat messenger, GTalk etc. All these are online applications and require internet to get executed. Examples of desktop applications are MS Word, MS Paint, MS Excel etc. These applications do not require internet to get executed but have limited functionality as compared to web applications. Let’s take an example of a typical e-commerce web application:
We can get registered with the system and sign up using valid login credentials. Multiple users can login into the application at a single time. User profiles can be managed; user and admin profiles are separate. There is shopping cart functionality and payment gateway is associated with the web application. Some applications are designed such as they are capable of uploading files. These applications are designed such as content can be managed dynamically. Information comes from database and can be edited, inserted and deleted as and when required. Learn about Newspaper Web Designing.
Advantages of Web Applications
Web applications are not browser or operating system specific. They can work on any system having internet connectivity and with any configuration. As these applications do not have to be installed every time and do not have specific hardware requirement to run, these become cost effective; a computer or mobile environment is required with internet connectivity. Internet applications can work on range of devices like computers, personal data assistants, mobile phones, iPod etc. Web applications are accessible and easily customizable. We can carry laptops and mobiles anywhere (place must have internet connectivity or data must be enabled) and application will work. Web applications are installed on dedicated server computers which are monitored and maintained by experienced server administrators. Therefore there is no need to install the application on multiple client computers.
Applications can be built using any of the core technologies like Sun Microsystems j2EE (JSP and Java Servlet), Microsoft .Net platform (ASP and ASP.net) with SQL server or open source language like PHP with mysql. Web applications are easy to install and maintain. It is easy to secure them against malicious attacks using antivirus and antispyware software. You do not have to release entire software or build for adding new functionality in web application. One web page can be added and integrated to run with the application without touching other functionality. Advertisements and commercials can get displayed on the web pages, increasing the popularity and readability. No additional installer is required. Additional plug-in software and scripts can be enabled in browser itself.
P1.2 Compare Various Types of Client Side and Server Side Scripting Languages Client Side Scripting Language Application programs that run on client computers or browsers are called client side scripting languages
Server Side Scripting Language Scripting languages those run on web server are called client side scripting languages.
To generate dynamic HTML page, user’s When the user requests the page, server request is fulfilled by running script directly in processes this request and sends it to user; page web server; afterwards this HTML is sent to gets displayed in web browser. client browser. These languages are used to enhance the These languages are used to build up the functionality of web applications like adding application as a whole and add basic validations, adding effects, animations, image functionality like search, cart, login, sign up effect etc. etc. Examples: Microsoft ASP.net, Sun Examples: HTML, JavaScript, CSS Microsystems java, open source Php, c# Client side scripting languages depend upon server side scripting languages for completing These can work independently. Client side their functionality. Application program cannot scripting languages are just there to enhance be built alone by the help of client scripting their functionality. language without making use of server scripting language.
P1.3 Discuss Security of Web Applications and Give Suggestions for Improvement Web applications access their data from databases so the need to secure web applications arises. Security testing is done to ensure that confidential data remains confidential and only authorized people are able to access it.
Some security threats to web applications are discussed here: Cracking of passwords: Sometimes hackers may use some password cracking tool or they might simply guess it. Manipulating the URL through HTTP GET methods: Important information in form of parameters is passed via querystring between clients and servers. Parameters can be altered by buggers to check if server accepts that value or not. SQL Injection: Attackers also try to fetch useful information from the database system by the use of SQL injection. User input must not get executed along with the query or characters like single quote must not be allowed within the text box. Attackers can insert SQL statements as user inputs to retrieve vital information from the database. Cross Site Scripting (XSS): Programmers must design the web application such as it does not accept executable files, HTML or scripts. Hackers can make these scripts run on client browsers and fetch valuable information. Spoofing: Attackers can create exact replica of the websites which may prompt users to click over them and enter confidential details. There are many hoax emails used by hackers for stealing user information. Even if you think that your website does not contain any important information that may be useful for hackers, still you have to be careful while building and maintaining them as web applications are never secure enough over internet and are compromised most of the time. Some measures must be taken to safeguard our online application from malicious attacks: Keeping application up to date: Always run up to date antivirus software over server. Error Message: Give only relevant and precise information along with the error messages. Make use of generic messages like ‘username or password incorrect’ instead of ‘password incorrect’. Validation: Apply client side and server side validations, i.e. on server side as well as over browser. Password: Password used for authentication must be a combination of alphabets, numbers and special characters and must be at least 8 characters long. Avoid making use of your name as password. File upload: Programmers must design their websites in manner so that they do not allow uploading files as they might contain malicious scripts which might open up complete website when executed on server. If it is too important to upload files, then they must be fully scanned before getting uploaded. Secured Socket Layer (SSL): This is a protocol which is used to safeguard the applications over internet. While passing confidential information between web server and website, it is good
practice to make use of secured socket layer. These are useful in e-commerce websites, where payment gateway is used. Website Security Tools: After implementing all the website security measures it is essential to check the security of our website. Various tools are available in market for checking this: Netsparker, openVAS etc.
Task-2 P2.1 Design Web Application According To the Given Case Study Story Board –
Flow Diagram –
Use Case Diagram –
P2.2 Describe How the Developed Web Application Incorporates Client Side and Server Side Functionalities The website of ‘Sea Side South Park’ is developed by making use of high level language like PHP and scripting languages like HTML, CSS, JavaScript etc. Developer has made use of word press CMS. We have incorporated sign up, login, various menu items, search, payment, shopping cart facilities with help of PHP and mySQL as database management system. JavaScript, HTML and CSS have been used to insert validations in form fields. (to validate user input).Get more on PHP Assignment Help As user requests some data, that request goes to server and is processed there. The relevant data matching user request is sent to client’s browser. Similarly, when user inputs some data in forms, that data goes via forms to server and then gets stored in the server database.
P2.3 Screenshots of Backend and Front End of Website Here are the screenshots of the website and it’s database:
Figure: Home -1
Figure: Home -2
Figure: Home – 3
Figure: About Us
Figure: Accommodations
Figure: Events
Figure: Blog
Figure: Contact Us
Figure: Booking Steps 1
Figure: Booking Step 2
Figure: Booking Step 3
Figure: Booking Confirmation Database of Sea Side South Park website: Each table has its own unique identifier, i.e primary key. All the tables in the database are normalized up to 3rd normal form.
Table: WP_COMMENTMETA
Table: WP_COMMENTS This table explains all the comments used within the application. Address field is broken down into three separate fields like IP, URL and email.
Table: WP_LINKS This table explains all the links used within the application.
Table: WP_OPTIONS This table is for the menu items used within the application.
Table: WP_POSTMETA
Table: WP_POSTS
Table: WP_QNS_BOOKING This table stores all the details related to booking and reservation of rooms in the hotel.
Table: WP_TERMS
Table: WP_TERM_RELATIONSHIPS
Table: WP_TERM_TAXONOMY This table explains the classification of terms in the website.
Table: WP_USERMETA
Table: WP_USERS This table stores all the information related to login credentials of user of the application like username, password, nickname, email, display name etc.
P2.4 To Meet Given Requirement Evaluate Alternative Design For Website As per the given requirements,
New users have to register into the system and existing users have to login into the system. There is facility to check the room availability before booking. Images if hotel rooms and various facilities are provided. To enable payment by users website integrates payment gateway. This website also provides details about various festivals going in the city. There is contact page and help page for convenience of users. Vision/mission of hotel along with the logo of hotel is displayed on home page.
Along with this, logo of hotel is linked with home page and gets displayed on all the pages of website, so navigation becomes easy. Validations are applied on login, sign up and contact us pages to validate user input. Right now website contains limited web pages, so my SQL as database is sufficient. In future database can be extended and we can think of migrating the database to SQL Server if required.
Currently website contains 5-10 pages, number of pages can be increased to include more functionality and more features like places worth visiting, Google map to guide tourist, shops and market near hotel for tourists and other tourist attractions.
Task3 Implementation of Web Application as Per Case Study P3.1 Implement Web Application for Sea Side South Park In this web application we have made use of PHP as server side scripting language and mysql as database server. Validations are applied over the forms that take user input like sign up, login, contact us, therefore javascript is utilized. To display content dynamically, HTML and CSS are used all over the website. It is taken case that font size and style is same across all pages.[Read about CCL Website Implementation] (Refer screenshots from point 2.3 above.)
P3.2 Implement Web Enabled Database Management System for Sea Side South Park MySql is used as database server and all tables, views and queries are constructed in it. (Refer screenshots from P2.3 above)
P3.3 Error Handling and Reporting Strategy For Given Website Detection and proper communication of errors or bugs within programming applications is called error handling. Special programming structures or commands are available to handle the errors. PHP language has very simple error handling mechanism. A typical error message contains filename, line number and a message describing the error which is then sent to browser. Different error handling methods include:
Using ‘die’ statements Custom errors and error triggers Error reporting
Usage of ‘die’ statements: Basic error handling Let’s take an example of a php program which opens a text file. <?php $file=fopen(“hello.txt”,”h”); ?> Now the above program will give error if it does not exist.
Warning: fopen(hello.txt) [function.fopen]: No such file or directory in D:\firstfile\first.php on line 2
failed
to
open
stream:
Now to avoid getting above warning message, one must make use of ‘Die’ statement in php: <?php if(!file_exists(“hello.txt”)) { die(“File } $file=fopen(“hello.txt”,”h”); } ?>
does
not else
exist”); {
Now if we execute above program, it will give message as – File does not exist. Creating custom Error Handler We can create certain functions in PHP which can be called when any error occurs in php. Every error message must be recorded in the system. All the notifications, errors, warning messages must be sent to system. To describe the nature of the error there are certain built in error reporting levels in PHP. Named constants are used by the programmers and each level is represented by an integer value. Value Constant / Parameter 2 E_WARNING
Description These are non-fatal run-time errors. Script execution is not halted. These are run-time notices. These occur when the script finds 8 E_NOTICE something that might be an error, but this could also happen when the script is running normally These are fatal user-generated error. These are like an E_ERROR 256 E_USER_ERROR set by the programmer using the PHP function trigger_error() These are non-fatal user-generated warning. It is similar to when 512 E_USER_WARNING programmer sets E_WARNING using trigger_error() These are user-generated notice. It is similar to when programmer 1024 E_USER_NOTICE sets E_NOTICE using trigger_error() These are catchable fatal error. These can be caught by a user 4096 E_RECOVERABLE_ERROR defined handle (see also set_error_handler(), but are like E_Error) This enables all errors and warnings in PHP (E_STRICT became a 8191 E_ALL part of E_ALL in PHP 5.4) All these levels can be masked together along with bit operators to add them or subtract them in PHP.
Task4: Testing Of Given Web Application 4.1 Critically Review And Test Web Application For Given Case Study Including Functionality Testing, Acceptance Testing, Compatibility, Functionality And Error Detection. Testing of web application is required to know the state of the product and whether it is fit to be released. It also helps us in finding any risks associated with the software, compliance with known regulations and its usability. Here are some of the types of testing techniques that we must practice over our software before releasing it: Functionality Testing – In this type of testing it is checked that there are no dead pages, all forms, links, buttons are working properly, all validations are working properly, the workflow across the website and data integrity is verified. Usability Testing– Navigation of the website is tested, whether it is easy to move across the pages and get back to home page easily, whether content is readable and proper use of font style, size and colors is there or not, number, shape and size of images is checked. Interface Testing – This is performed to verify the dataflow across the system. Compatibility Testing – Based on the context of the application it is checked whether the application can run on multiple browsers and operating systems. Performance Testing – This type of testing is done to verify the server response time and behavior of application under various conditions. It is to be checked whether multiple users are able to access application at one particular time. Increasing the number of modules or number of users suddenly must not affect the working application. Security Testing – This is performed to check whether the application is secure over web against malicious access and theft of data. It is to be checked whether by changing url parameters hackers are not able to dig into the system or password is strong enough (must be a combination of alphabets, numbers and special characters).
4.2 Identify Actual Test Results against Expected Test Results (Including Test Plan and Findings) There are many ways a website can be and must be tested. Important types of testing that must be applied over a website are:
Usability Testing – This check is composed of testing how user navigates across the web pages. How different links and buttons shift the control from one page to the next. Website must be easy to use and must be understandable by its users. The content of the website must be readable, understandable and lucrative enough to attract more customers.
Functionality testing – This testing is composed of checking whether all links, buttons, forms in a website are working properly or not. This also includes database testing, which is essentially checking whether the values that are entered by form fields are same as the values that gets stored in the database. Interface testing – It must be checked that all interactions between web server, application server and database servers are taking place. All error must be handled properly. It is to be checked that what happens if connections are reset in between or any user interrupts the interactions. Compatibility Testing – Your website must be compatible with multiple operating systems and multiple browsers. It must not lose its resolution if we try to run it over mobile interface. The webpage must be easily printable and the font size, color must not distort if we print the page. Security Testing – There are some tests that must be done for website security testing: If we log into the application by certain username and password and try changing the URL parameters (not related to logged in user) then application must not allow us to access the other page. If we enter invalid inputs into the username and password fields then the application must not allow us to enter into the system. If a user tries to enter internal URL into the browser then he should not be given access into the system. SSL must be used for ecommerce websites that involve transactions. All error messages, transactions must be saved into log files somewhere on the database. Performance Testing – Website must work consistently even if lot many users log into it at a time. The system must not break even if there are many random clicks over it. It must be operable on different operating system and different browsers.
This website is a true reflection of the flourishing tourism industry these days. However there are certain areas of improvements, still this gives us a very good idea about the developments in tourism sector these days. To fulfill the requirements of blooming tourism industry, this website includes the sections where we can check the availability of the rooms online and get rooms reserved (W3SCHOOLS, (n.d.)). By the help of this website, people do not have to search over scattered information on internet. This is one stop solution for people who are seeking to unwind and looking for some place for relaxation. Expected Result
This website will enable new users to sign up and existing users to login into the system. This website gives complete control to the users to check availability, select and book rooms online. It integrates the payment gateway which is SSL secured, for making authentic payments. Website must give information about latest news and events happening in the city. Along with this description of city festivals also gets displayed over the website. It must show details of hotel rooms along with the images of each room. It has social media links and contact us page available.
Home page must have vision/mission of the website. Logo must be clear and appropriately placed. Actual Result –
Right now the home page of the website lacks vision / mission of the hotel. News gets displayed but information about festivals is not getting displayed. It lacks payment gateway right now. Vision and mission of website are not present right now. Logo image is there which is connected with home page, so navigation across the website is easy and convenient. Latest events / conferences / meetings are getting displayed over the website.
Test Plan: Test Steps / Parameters Include Payment gateway Include News section Include vision / mission over the website Include logo image on home page. Include information about festivals happening in the city Include register facility for new users Existing users must be able to login into the system Include contact us page Include help page
Date 18th feb 2015 18th feb 2015 18th feb 2015 18th feb 2015 18th feb 2015 18th feb 2015 18th feb 2015 18th feb 2015 18th feb 2015
Test results: Test Steps Include Payment gateway
Include News section
Include vision / mission over the website
Expected Result Payment Gateway must be present in the web application. There must be a news section over the website which displays all the events, conferences, meetings taking place in hotel. There must be vision and mission statements of hotel over the home page.
Actual Result No, It lacks payment gateway right now. Yes, News section is getting displayed over the website. No, Vision and mission of website are not present right now.
Include logo image on home page.
Logo image must be present over the website and must be linked with home page.
Yes, Logo image is there which is connected with home page, so navigation across the website is easy and convenient.
There must be information Include information about No information about festivals about festivals happening in the festivals happening in the city is there on the website. city over the website. Include register facility for new New users must be able to sign Yes, New users are able to sign users up with the system up with the system Yes, Existing users (who have already registered with the Existing users must be able to Existing users must be able to system) are able to login into login into the system login into the system the website with their credentials There must be a contact us Include contact us page Yes, there is contact us page page Include help page There must be a help page No, help page is missing
4.3 Critically Evaluate Independent Feedback and Recommendations for Improvements (Including Surveys, Questionnaires, Interviews Etc) Website for Sea Side South Park is comprehensive and includes most of the information required for a hotel website. Now people can easily check the availability of the hotel rooms online and go on for booking rooms. Earlier people used to face hardships in booking rooms online, but now with this website this task is made easier. We can enhance this website by adding more modules at later stages. We can describe the activities going on within the hotel, add more pictures, some initiatives like â&#x20AC;&#x2DC;go greenâ&#x20AC;&#x2122; upon environment friendly theme etc. can be added up. Although there are options to connect with friends via social media still we can give a page over website to connect with friends and send website screenshots to them. We can give discount options to new users or to frequent visitors. A page can be added which will include questionnaire and interview excerpts (testimonials is there, it can be enhanced). Also read Web Designing using JSP Architecture.
4.4 User Documentation for Developed Web Application
There are around 11 modules in this website for Sea side South Park. Home page is connected to other sub pages. Logo image is connected to home page and header is static over all the other pages. Upon clicking ‘about us’ we will get all details which will include history of website. Clicking over ‘accommodation’ will show us a page displaying various hotel rooms and facilities. ‘Search’ gives us the facility to find out any content over the website quickly. ‘Check Availability’ option allows us to enter details of adults, number of children and date on which we require booking. ‘Event’ module shows all conferences and meetings held in hotel. ‘Blog’ module gives us all details about hotel, activities, people, accommodation, surroundings, locations, worth visiting places etc. ‘Contact us’ allows us to connect with hotel authorities via post, mail and phone. ‘Testimonials’ records people’s feedback. ‘Social Media’ allow people to connect to hotel staff easily and quickly and know about current happenings and facilities. There is ‘calendar’ for date and time and ‘recent posts’ for news updates. Reference Functions and advantages of web applications [Online].[Accessed on 9 February 2015]. Available on World Wide Web: <http://www.magicwebsolutions.co.uk/blog/the-benefits-ofweb-based-applications.htm> Client side and server side scripting languages [Online].[Accessed on 10 February 2015]. Available on World Wide Web: <http://www.yourwebskills.com/clientserver.php> Client side and server side scripting languages [Online].[Accessed on 10 February 2015]. Available on World Wide Web: < http://www.sqa.org.uk/elearning/ClientSide01CD/page_18.htm> Difference between client side and server side scripting languages [Online].[Accessed on 10 February 2015]. Available on World Wide Web: < http://www.csharpcorner.com/Interviews/answer/7393/explain-the-difference-between-client-side-script-andserver>
Read more about Computer Programming Assignment help Programming Assignments Help is the best assignment help provider in the United Kingdom. Our online assignment writing help UK is especially dedicated for the students studying in all UK colleges and universities. Submit assignment to get the best quality assignment help.