Download as docx, pdf, or txt
Download as docx, pdf, or txt
You are on page 1of 61

ASSIGNMENT

TECHNOLOGY PARK MALAYSIA


CT050-3-2-WAPP
WEB APPLICATIONS
NP2F1901IT
HAND OUT DATE: 08 AUGUST 2019
HAND IN DATE: 16 JANUARY 2020
WEIGHTAGE: 100%

INSTRUCTIONS TO CANDIDATES:

1 Submit your assignment at the administrative counter.

2 Students are advised to underpin their answers with the use of references
(cited using the Harvard Name System of Referencing).

3 Late submission will be awarded zero (0) unless Extenuating


Circumstances (EC) are upheld.

4 Cases of plagiarism will be penalized.

5 The assignment should be bound in an appropriate style (comb bound or


stapled).

6 Where the assignment should be submitted in both hardcopy and


softcopy, the softcopy of the written assignment and source code (where
appropriate) should be on a CD in an envelope / CD cover and attached to
the hardcopy.

7 You must obtain 50% overall to pass this module.

        
i
ABSTRACT
Online shopping is a service created by internet in the modern world that feature a platform
for carrying out business over the internet for manufacturers and vendors to carry out buying
selling and transactions way easier than the vendor outlets use to and reduce the cost in labor
and still distribution channels saving money and space. The online shopping trend in the
current world aids people in setting up personal business and service under the act of legal
registration and fulfillment of rules of law and ethics.
TechnoWolf website as a project is created as a web application for online shopping that
deals with buying and selling of electronic as distribution vendors for Nepalese users, so that,
consumers in Nepal don’t have to rely on external vendors that are related in frauds and
selling copy products. The site directly contracts goods from respective companies such as
Apple, Samsung, MI and Micromax outlets that distribute mobile phones in Nepal with
guaranteed hardware and service contracts. The site of TechnoWolf promises delivery of
products with the aid of cart that is a collection of a singular user’s warehouse of the data that
has to be stored in a profile for history and legal representation of one’s order. The page is
managed by the Admin and the Manger for sake of management of users and internal
enforcers. The products, users and different sections can be managed relative to the
requirements for addition, subtraction and updating them.
The system of the page is created using HTML5, CSS3, ASP.NET, C#, JS, disqus hosting
and MSSQL server as per the teachings of our lecturer Mr. Jasbir Makkar who I would like to
heartily thank for and also the university APU for this opportunity and courses.

Prashil Khadka

ii
Table of Contents
ABSTRACT...............................................................................................................................ii

Table of Figures.........................................................................................................................v

1. Introduction.........................................................................................................................1

1.1. Objectives of the application.......................................................................................2

1.2. Scope...........................................................................................................................2

1.3. Project Schedules and Briefing...................................................................................3

2. Project Specification...........................................................................................................4

2.1. Profiling Specifications...............................................................................................4

2.2. Feasibility Specifications.............................................................................................5

2.3. Feature Specifications.................................................................................................5

2.4. Hardware and Software specifications........................................................................6

3. Application design and models...........................................................................................7

3.1. Application database...................................................................................................7

3.1.1. Data Schema............................................................................................................7

3.1.2. DFD Diagram........................................................................................................11

3.1.3. ER Diagram...........................................................................................................12

3.2. Interface design.........................................................................................................13

3.2.1. Prototyping.............................................................................................................13

3.3. Website Architecture.................................................................................................20

3.4. Designs and screenshots............................................................................................23

4. Implementation.................................................................................................................41

4.1. Create.........................................................................................................................41

4.2. Read...........................................................................................................................42

4.3. Update........................................................................................................................43

4.4. Delete.........................................................................................................................44

4.5. Log-In........................................................................................................................45
iii
5. Conclusion........................................................................................................................46

6. Appendices........................................................................................................................47

6.1. References.................................................................................................................47

6.2. Gantt Chart................................................................................................................50

iv
Table of Figures
Figure 1 TechnoWolf Logo........................................................................................................1
Figure 2 Project Schedules.........................................................................................................3
Figure 3 Hardware and Software Specifications........................................................................6
Figure 4 Database Schema Structure.........................................................................................8
Figure 5 User table with authorization.......................................................................................8
Figure 6 User Data Schema Script.............................................................................................9
Figure 7 Products Table.............................................................................................................9
Figure 8 Products table Script....................................................................................................9
Figure 9 Product Cart Script....................................................................................................10
Figure 10Product Cart..............................................................................................................10
Figure 11 Order Filled table.....................................................................................................10
Figure 12 Script for Order Filled.............................................................................................11
Figure 13 DFD for Admin........................................................................................................11
Figure 14 ER Diagram.............................................................................................................12
Figure 15 Master Page.............................................................................................................14
Figure 16 Home........................................................................................................................14
Figure 17 Sign Up....................................................................................................................15
Figure 18 Registration Form....................................................................................................15
Figure 19 Product detail Page..................................................................................................16
Figure 20 Cart..........................................................................................................................16
Figure 21 Feedback..................................................................................................................17
Figure 22 Admin Menu............................................................................................................17
Figure 23 Add Product/Admin.................................................................................................18
Figure 24 Editing Product/Admin............................................................................................18
Figure 25 Pop-Ups...................................................................................................................19
Figure 26 Passive Web server Architecture.............................................................................20
Figure 27 Active Web Server Architecture..............................................................................20
Figure 28 ASP. NET architectural design to access database by users...................................21
Figure 29 TechnoWolf Web architecture created by online "Creatly tool".............................22
Figure 30 Home Page...............................................................................................................23
Figure 31 Login Form Validation............................................................................................23
Figure 32 Motorola Product Section........................................................................................24

v
Figure 33 Samsung Product Section........................................................................................24
Figure 34 Tablet section...........................................................................................................25
Figure 35 Apple Products Section............................................................................................25
Figure 36 Laptop Section.........................................................................................................26
Figure 37 Accessories Section.................................................................................................26
Figure 38 Pen drives only Products section.............................................................................27
Figure 39 TV section................................................................................................................27
Figure 40 Sony TV only products section................................................................................28
Figure 41 Page responsiveness on Zoom.................................................................................28
Figure 42 Result of Clicking on ads.........................................................................................29
Figure 43 Registration Form....................................................................................................29
Figure 44 Registration Successful Message.............................................................................30
Figure 45 Validation test on number during registration.........................................................30
Figure 46 Login Incorrect........................................................................................................31
Figure 47 Home button Navigation on Logo...........................................................................31
Figure 48 trying to log in with authorized User.......................................................................31
Figure 49 Account Logged in for Admin.................................................................................32
Figure 50 Editing Profile..........................................................................................................32
Figure 51 Admin Tasks............................................................................................................33
Figure 52 View Order..............................................................................................................33
Figure 53 Adding Admin.........................................................................................................34
Figure 54 User Login...............................................................................................................34
Figure 55 User Login...............................................................................................................34
Figure 56 Product description..................................................................................................35
Figure 57 Product Zoom In......................................................................................................35
Figure 58 Item added to Cart...................................................................................................36
Figure 59 buying the product...................................................................................................36
Figure 60 Successful Order placement display........................................................................37
Figure 61 Search and View......................................................................................................37
Figure 62 After Log Out..........................................................................................................38
Figure 63Admin Viewing User Database................................................................................38
Figure 64 Deleting a Product...................................................................................................38
Figure 65 Editing and Updating Product.................................................................................39
Figure 66 Product Addition Form............................................................................................39
vi
Figure 67 Forget Password.......................................................................................................40
Figure 68Email sent for forget password.................................................................................40
Figure 69 Create User..............................................................................................................41
Figure 70 Reading the database for user details.......................................................................42
Figure 71 Updating Products...................................................................................................43
Figure 72 Deleting Products.....................................................................................................44
Figure 73 Logging in into the User Accounts..........................................................................45

vii
1. Introduction
An online shopping site refers to the modern mode of commercial business media that lets
interaction between a client/ consumer and a store that can either be self-promoted or as a
means of third party sellers to promote sales of any item that can range from physical goods
or services. It is a form of communication medium which we now know as e-commerce that
deals with exchange of goods, transactions and billing purpose.
E-commerce; in the modern world has become a popular advantage of the internet for buying,
selling, financing and trading services, all over the world because of its simplicity in
business, efficiency and advancing technology in terms of communication. Online shopping
has comforted the users as clients and customers can search, enquire, request and order goods
and services with comfort and wide range of selection from the suppliers and vendors. People
can explore for any items and summon goods from any location or operating platform
through a single site: that may be from a direct suppliers or vending agents.
Let us take a few shopping sites for example: Amazon, Alibaba and Daraz for example.
These online shopping sites do not manufacture or assemble goods and lack an inventory,
thus acting as affiliated distributors to giant manufacturing companies ranging from small
items to invaluable goods. They entertain individuals, companies and countries as a medium
of order and delivery to trade goods and business.
The current project of Web Applications inquires the learning of students and requests the use
of knowledge to create a web application by making the use of client scripting languages
such as HTML, ASP .NET, CSS and Bootstrap with server side language: C# integrated with
any SQL database.
The chosen assessment of “TechnoWolf.com” is an online web application that seeks to deal
with clients and vendors stipulating on electronic items, listing: mobile phones, laptops,
computer accessories, tablet devices and TVs. The web application TechnoWolf is created
with HTML, CSS, Bootstrap, JavaScript, ASP. NET, C# , Ajax and MSSQL database infused
with SMTP protocols which has different features such web responsiveness, data storage,
feedback communication, CRUD operations of files plus data, profiled user features,
navigational support and multiple browser support.

Figure 1 TechnoWolf Logo

1
1.1. Objectives of the application
Technowolf as an online web application tries to develop the experience of visitors,
users, managers and administrators as an online web shopping applications with adequate
amount of webpages and contents with UX from combination of different scripting
languages and newer security token systems. The application can be used by any of the
multiple browsers: Edge, Chrome, Brave, Opera etc; including or excluding the use of
JavaScript and JS disqus from the settings. Here, is a list of few objectives that the
application aims to cover:
 To give users efficiency of shopping by staying at a place using an OS platform.
 To save user details and cart items within the database that can be backed up and
extracted in need.
 To simplify the User Interaction of the page with basic expertise as well as best User
Experience with simple navigation and guided texts.
 To secure user’s accounts and details with token keys thus, denying access to
unauthorized users.
 To permit the use of navigation and search to unregistered users in required webpages
such as the items section and feedbacks.

1.2. Scope
The web application TechnoWolf as an online shopping web application tends to scale
itself further in the future to be extended to more users, stretched number of items for sale
as well as extension to more platforms such as the console devices and Machintosh. The
project inclines to grow further with newer technologies for custom products and newer
market activities.

2
1.3. Project Schedules and Briefing
The topic here provides a summarized impression of the project TechnoWolf as an
assessment for WAPP by explaining it’s required time and resources including human
resources and feasibilities. The project briefing contains the planned and unplanned tasks,
estimated as well as extended period and description of the project with the objectives and
achievements for project completion.
Listing out the required resources and time limitations are very important points to be
considered while developing a project to create additional backup plans, planning
economy and human resources within the time limitations. Creation of a project plan and
considerations are influential factors that effect a project and its results.[ CITATION
Inl99 \l 1033 ]

Figure 2 Project Schedules

3
2. Project Specification
The project specification defines the requirements and plans of the application to fulfill the
objectives and development in order to cover the necessary conclusions and features of the
proposed system. The topic covers the description of required supplies and conditions that are
required to complete the requirements specifications by stakeholders and users. We model the
spectator profiles, feasibility and features of the project that need to be designed in order to
achieve the goals of the TechnoWolf web application. The main goal of the project is to
create a simple, efficient and accessible we application with adequate authorization and
functions with required limitations.
The project specification thoroughly covers three strategies for the completion of the project:

2.1. Profiling Specifications


Profiling is the process of creating specified user profiles and functions to create the
application according the need of functions, security and navigation for website. It is the
method of specifying constraints, features and extensions of a user to act within the web
page which can either be management, profile extension, database authorization etc.
The profiles listed for TechnoWolf has the following users according to the constraints
and features:
a. Admin and Manager:
The admin profile in the application is given authority to manage databases, items and
users within the web application. The administrator and managers have the authority
to view the cart that has been reserved by the users for items, profiles and information
of different users for management and carrying out the business processes.
b. Users:
The users in the web application refers to the registered users that require to view
products, log in into the accounts and buy items. The registered users have been given
authority to act within the buying, selling and editing their personal information with
the means of registered username and password that also contains a different public
token key to get access into the user accounts.
c. Visitors:
Here, the visitors can refer to as the potential users that are not signed in within the
web application and are as probable addition as buyers and customers for

4
TechnoWolf. The visitors do not require to access sign in authorization in order to
gain view of products, their price and feedback to the managers of the shopping site.

2.2. Feasibility Specifications


A feasibility specification simply refers to the questions and foreseeing the extension and
user experience of the application when they are launched into the market. It is a
concentrated real time observation of the application for implementation and use of the
system: TechnoWolf. It also focuses on the future, results and gains that can be achieved
by the use of application and the use of a digital system.

a. Technical feasibility:
Technical feasibility refers to consequences and probability of technological
components such as the hardware, scripting languages, support of platform, security
and dependency ratio that can be reinforced to the application and the users in order to
gain functions and actions. The technological components used are C#, ASP.NET, JS,
CSS, Bootstrap, MSSQL database (adding its server), web browser and security
essentials, that have been applied to give user the best UI and UX in required
platforms.
b. Economic feasibility:
Economic feasibility refers the study of existing and potential financial requirements
that is required to be spent by the stakeholders and users in the real world. It deals
with the expense and required costs to maintain, saved including its gains and profits.
The use of a shopping site helps in decreasing the visiting area which decreases the
cost for the stakeholders considerably in the modern times.
c. Operational feasibility:
Operational feasibility refers to the observation and forecasting of the use,
maintenance and operations that are required for implementing the system. The web
application is easy to use and can be accessed with constraints and expected results
providing its users with the best experience with minimal knowledge.

2.3. Feature Specifications


Feature specifications are the components that need to be included in order to build the
application of TechnoWolf. Here, we enlist few but the basic requirements of the online
shopping web site for essential assessment fulfillment:

5
 Application needs to be responsive in any browser, size and platform; desktop,
mobile and consoles.
 The application pages must have navigation feature to visit different pages according
to authorized signings.
 CRUD function for different products and profile information.
 The products and contents of the page must be simple and qualitative with efficient
description.
 Validations and error popups must occur in case of wrong input and actions.
 Application design must be attractive and simple with ease in navigation.
 Secure information and user modules for each profiles with token generation.
 Feedback section to aid users and visitors for questions and suggestions.

2.4. Hardware and Software specifications


The hardware and software specifications are the list of required tools and applications
that are required by the developers in order to create the scripts, UI, UX, data access and
security essentials required by the users. Here, we have created a list of hardware and
software that are required in the creation of TechnoWolf web application:

Hardware Specifications Software Specifications


 Basic Computer System.  Visual Studio 15 or higher
 Processor i5 or higher  SQL server and Tools
 RAM: 4GB-8 GB  Multiple Browsers
 Internet Connection  Access to Bootstrap, CSS, JS and
ASP.NET and C# packages
 Photo editing applications.
 Access to the stakeholder e-mail
service.
Figure 3 Hardware and Software Specifications

6
3. Application design and models
The application’s designs and models are what we perceive as the mode of planning and
extraction of information about the web application which includes its model, prototype,
database schema, user interface and its architecture in order to achieve the final product and
documentation. The documents of includes the specifications of components such as the
database schema which denotes how the database is created, edited, secured and accessed.

3.1. Application database


The database refers to the physical and logical representation of the data which is
accessed by the ASP.NET scripts using the C# language in the web application. These
databases contains data, schema, relations and keys which store, process and give out
results to the developers, users and program to fetch specific datas such as name, price,
address, description and images from a database management applications such as
MSSQL, MYSQL, Oracle and MongoDB.

3.1.1. Data Schema


A data schema is what we refer to as a logical structure of a database where different data
are stored in the form of tables and have relationships with other different data and
servers. It is the description of database structure from a view point of logic and
association with an applied set of rules and controls over a system through predefined
scripts and their organization.

This schema script defines how the organization of data is made including limitations,
rules, accessibility and key operations. These limitations are what we call integrity or
credit constraints which are executed on a data division in tables, ensuring composition
and security. Schemas can either be physical optical argument or even be logical scripted
rules in different queries and definitions. The database schemas can also be invisible to
the post users depending upon the rules and limitations used in the data dictionary. A data
dictionary is what defines the relation of different databases, schemas and structures in
order to fulfill operations required by the users.

7
Figure 4 Database Schema Structure

a. User data dictionary:

Figure 5 User table with authorization

8
Figure 6 User Data Schema Script

b. Products:

Figure 7 Products Table

Figure 8 Products table Script

9
c. Product Cart

Figure 9 Product Cart Script

Figure 10Product Cart

d. Order filled

Figure 11 Order Filled table

10
Figure 12 Script for Order Filled

3.1.2. DFD Diagram


A DFD diagram is the representation of database structure on how the data is extracted
from and towards into the application for the use of certain data by users for
implementation and flow. Here, we represent a level 1 diagram of DFD for admin in
TechnoWolf web application.

Figure 13 DFD-0 for Admin

11
3.1.3. ER Diagram
An ER diagram is a representation of relationships between numerous entities within the
database and schemas created in order to acknowledge all of the entities within the
database in each data dictionaries

Figure 14 ER Diagram

12
3.2. Interface design
Interface design is the blueprint of the webpages of the site dealing with interaction model
between the user and the system that is to be used to define function and feature of an
action. Interaction designs are based on the basis of user profiling and architecture to
provide constraints, capabilities and foreseeing results of actions. Generally, interface
designs tend to mean GUIs but also contains other design developments such as CLI,
gestures and voice controls. [ CITATION Int19 \l 1033 ]
Building an interface design generally consists of creating prototypes, selecting parallel
designs and selection of graphics and other pictorial creations. The interaction design
development deals with designers or front-end scripters to create a design through a
development tool or a designated scripting IDE to write lines of codes on how they look,
respond and react to the users.

3.2.1. Prototyping
Prototyping can be defined as a phase of interface design where few models of the
website are designed in the form of rough and generally uncolored layout. The prototype
page of a website generally consists of basics of a page and the placement of contents
within the page to give a basic sketch and knowledge about the page. Prototyping plays a
very crucial role in creation of a web-page design since the reference of content
placement and logical navigation runs on the basis of prototyping. A stronger and clearer
prototype explains the functions and features of the webpage and gives out all kinds of
front-end knowledge that a designer requires to build a webpage. Each pages co-relates to
one another and to the master or main page of the website. Prototyping defines a page
construction and handles errors o usability and gives a quicker documentation response
from a stakeholder’s point of view so that the project development can head towards
upper phases and side by side direction. [ CITATION Exp19 \l 1033 ]

13
Figure 15 Master Page

Figure 16 Home

14
Figure 17 Sign Up

Figure 18 Registration Form

15
Figure 19 Product detail Page

Figure 20 Cart

16
Figure 21 Feedback

Figure 22 Admin Menu

17
Figure 23 Add Product/Admin

Figure 24 Editing Product/Admin

18
Figure 25 Pop-Ups

19
3.3. Website Architecture
A website architecture refers to the pre-planned and post results of a website for
navigation and running of the website in order to fulfill its directional process that has to
be used by the users in order to achieve a goal. A website architecture is a rational/logical
structure of a website for moving between web pages according to the functions and
objectives [ CITATION Tec19 \l 1033 ]

Figure 26 Passive Web server Architecture

Figure 27 Active Web Server Architecture

Website architecture is the combination of different individual components such as its logical
design, servers, browsers and interfaces created in order to run a whole site as one.
The website architecture is comprised of the following components:
a. Interface designs
b. Processes and features
c. Servers and communication medium
d. Security and Control design[ CITATION Tec19 \l 1033 ]

20
Figure 28 ASP. NET architectural design to access database by users

21
Figure 29 TechnoWolf Web architecture created by online "Creatly tool"

The figure displayed in the page above displays the website architecture of TechnoWolf. The
Default page is set as the Home page which features other page links of products are
electronic items ranging from computer accessories to LED TVs by manufactured by
various companies such as Apple and Samsung. The products are sanctioned according to
the types of electronics and then their respective companies. The basics of the page include:
cart, log-in and register. Each singular product page consists of the individual product and
in them consist of product image, description and comment box developed by
disqus[ CITATION dis19 \l 1033 ] which works as the feedback section for visitors and
logged users.
The figure has been created with an online tool called: creately.[ CITATION Cre19 \l 1033 ]
The tool can be accessed by using a web browser and can be made for free.

22
3.4. Designs and screenshots
The following images represent the screen shots and designs of the web application:
TecnhoWolf. Each webpages are defined and designed by the use of .NET script and are
made responsive with Bootstrap and CSS.

Figure 30 Home Page

Figure 31 Login Form Validation

23
Figure 32 Motorola Product Section

Figure 33 Samsung Product Section

24
Figure 34 Tablet section

Figure 35 Apple Products Section

25
Figure 36 Laptop Section

Figure 37 Accessories Section

26
Figure 38 Pen drives only Products section

Figure 39 TV section

27
Figure 40 Sony TV only products section

Figure 41 Page responsiveness on Zoom

28
Figure 42 Result of Clicking on ads.

Figure 43 Registration Form

29
Figure 44 Registration Successful Message

Figure 45 Validation test on number during registration

30
Figure 46 Login Incorrect

Figure 47 Home button Navigation on Logo

Figure 48 trying to log in with authorized User

31
Figure 49 Account Logged in for Admin

Figure 50 Editing Profile

32
Figure 51 Admin Tasks

Figure 52 View Order

33
Figure 53 Adding Admin

Figure 54 User Login

Figure 55 User Login

34
Figure 56 Product description

Figure 57 Product Zoom In

35
Figure 58 Item added to Cart

Figure 59 buying the product

36
Figure 60 Successful Order placement display

Figure 61 Search and View

37
Figure 62 After Log Out

Figure 63Admin Viewing User Database

Figure 64 Deleting a Product

38
Figure 65 Editing and Updating Product

Figure 66 Product Addition Form

39
Figure 67 Forget Password

Figure 68Email sent for forget password

40
4. Implementation
4.1. Create

Figure 69 Create User

The code above displays the creation of a user through registration form in C# which is
created to develop the back-end or the server scripting in the ASP.NET page of TechnoWolf
web application. The server site of C# scripting enables the page to access the MSSQL
database named “shopping.mdf” in the database which is now set as a string connection in the
scripts. The web form asks for data input into the web application and then sends the data
accordingly to the relation of placeholders and entities of the database. The lines of codes
now fill in the data into the table login_data included inside the database and save itself and
navigating to the successful task page by itself.

41
4.2. Read

Figure 70 Reading the database for user details

The code snip displayed above displays the working of ASP.NET scripts to display the data
of each individual cells of a registered user: be it admin or the consumer. The ASP sets a
grid-view of all the data so that they can be displayed in the form of table and can be read by
the admin so that they can be edited and updated by the admin as long as they choose the
action to do so. The data-fields are called upon by the scripts from the database as they are
called by their specific IDs in the string connection.

42
4.3. Update

Figure 71 Updating Products

The figure here represents the codes of ASP.NET which shows the working of editing and
deleting the table data in the connection string of the database “Shopping.mdf” according to
the IDs displayed in the scripts to create a grid and edit it in the same time for each products
referred by the id inside the main-product table saved in the database. Each of the database
items are first converted into strings and integers so that they can be edited by the VS IDE
and later converted back during the transmission of the data into the tables.

43
4.4. Delete

Figure 72 Deleting Products

The codes above described in the scripts relates to deleting the rows of database in MSSQL.
The <DeleteParameters> tag here define the deletion items of the database rows which are
selected from the grids of the ASP.NET resultant web application. The commands created
through buttons of bootstrap are connected to the ID of delete button which in turn tells the
ASP.NET to give out commands to delete the rows from selected MSSQL sections.

44
4.5. Log-In

Figure 73 Logging in into the User Accounts

The figure 33 shows the working of C# as back end to push the ASP.NET the command of
logging in into a customer’s account in order to use the user accounts, cart and buying
products. The connection in btn_submit has the commands to check the user’s inserted values
into the login section which are username and the password. In case the user fails to enter
correct username and password, the page displays a pop-up for the user asking to enter
correct username and password.

45
5. Conclusion
The web application TechnoWolf is a hybrid website that is created with multiple scripts in
each back end and front end workings for the users. The web site is designed for efficient
working and provides user with an interactive UI design as well as manageable and ease in
user experience for both of the registered clients and administration of the page. The
motivation of the page is to deliver a platform where users can enjoy the use of internet
application to surf and select products that they need in order to buy and use products in
discounted price, even staying with communication and full profits given by the company,
where we act as a vendor to the buyers.
The web application can be supported by any browsers and have been tested in various OS
platforms. The web application can be used by basic users both on the side of clients as well
as the administrators with efficiency in business and management of products. The feedback
and forget password section are connected to the mail technowolf3210@gmail.com, such
that the messenger and the administrator can directly communicate with one another for
further support.
We expect further development of online shopping platforms and web applications with
newer technologies of security and scripting and hope decency for the project in advancing
days.

46
6. Appendices
6.1. References
Agrahari, M., 2013 june 4. Polymorphism in .NET. [Online]
Available at: https://www.codeproject.com/Articles/602141/Polymorphism-in-NET
[Accessed April 2018].

Alen Dix, J. F. G. D. A. R. B., 2004. Human-Computer Interaction. 3rd ed. Essex: Pearson
Prentice Hall.

Angel, E., 2011. Interactive Computer Graphics. 5th ed. New Delhi: Dorling Kindersley
India Pvt.Ltd.

Anon., n.d. Classes (C# Programming Guide). [Online]


Available at: https://docs.microsoft.com/en-us/dotnet/csharp/programming-guide/classes-and-
structs/classes
[Accessed April 2018].

Anon., n.d. Classes and Structs (C# Programming Guide). [Online]


Available at: https://docs.microsoft.com/en-us/dotnet/csharp/programming-guide/classes-and-
structs/
[Accessed April 2018].

Anon., n.d. What is Agile model – advantages, disadvantages and when to use it?. [Online]
Available at: http://istqbexamcertification.com/what-is-agile-model-advantages-
disadvantages-and-when-to-use-it/
[Accessed April 2018].

Bentley, J. L. W. &. L. D., 2007. System Analysis and Design Methods. 7 ed. New Delhi:
Tata Mc Graw-Hill.

Creately, 2019. Creately.com. [Online]


Available at: www.creately.com
[Accessed 1 12 2019].

disqus, 2019. disqus. [Online]


Available at: www.disqus.com
[Accessed 1 12 2019].

47
Elsevier, 2020. ScienceDirect. [Online]
Available at: https://www.sciencedirect.com/topics/computer-science/interface-design
[Accessed 6 Janauary 2020].

Encapsulation, n.d. C# - Encapsulation. [Online]


Available at: https://www.tutorialspoint.com/csharp/csharp_encapsulation.htm
[Accessed April 2018].

ExperienceUX, 2019. ExperienceUX: What is website prototype?. [Online]


Available at: https://www.experienceux.co.uk/faqs/what-is-a-website-prototype/
[Accessed 1 12 2019].

Inlook, Inc., 1999. Inlook. [Online]


Available at: https://www.inloox.com/project-management-glossary/project-schedule/
[Accessed 5 January 2020].

Interaction-design.org, 2019. Interaction-design.org/Interaction Designs. [Online]


Available at: https://www.interaction-design.org/literature/topics/ui-design
[Accessed 1 12 2019].

Lee, K. V., 1994. Information System Engineering. 2 ed. New York: Cambridge Universtity
Press.

Lucidchart Software Inc., 2019. Lucidchart. [Online]


Available at: http://https://www.lucidchart.com/pages/database-diagram/database-schema
[Accessed 5 January 2020].

Marketing91, 2008. Marketing91. [Online]


Available at: https://www.marketing91.com/what-is-website-architecture/
[Accessed 5 January 2020].

Patton, R., n.d. Software testing. 2nd ed. s.l.:s.n.

Preece, J. R. Y. S. H., 2002. Interaction Design: Beyond Human-Computer Interaction. New


York: Wiley.

study, F., 2018. Feasibility study. [Online]


Available at: http://www.businessdictionary.com/definition/feasibility-study.html

48
Techopedia, 2019. Techopedia: Website Architechture. [Online]
Available at: https://www.techopedia.com/definition/30409/website-architecture
[Accessed 1 12 2019].

TwoBenches, 2008. DECIDE: A framework to guide evaluation. [Online]


Available at: https://twobenches.wordpress.com/2008/06/06/decide-a-framework-to-guide-
evaluation/
[Accessed 5 11 2019].

49
6.2. Gantt Chart

50
Marking Scheme:
Student Name: Prashil Khadka TP Number: NP000202
No. Learning Outcome Assessment
LO Show a design solution which provide a systematic way to develop Presentation
1 web application(A3, PLO4)
LO Develop a web application which is connected to a well-designed Assignment
2 database by using server and client side scripting language based on
the current web standards. (C4,PLO3)
LO Demonstrate web usability and accessibilty concepts and their Assignment
3 application in interactive web application(A3,PLO7)
Assignment:
Question Vs Taxonomy
Cognitive Level
Question PLO
1 2 3 4 5 6
No.
SQ SQ SQ SQ SQ SQ
Q1 40% 3

Total 40%
Assignment:
Question Vs Taxonomy
Affective Level
Question PLO
1 2 3 4 5 6
No.
SQ SQ SQ SQ SQ SQ
Q1 30% 7

Total 30%
Presentation:
Question Vs Taxonomy
Affective Level
Question PLO
1 2 3 4 5 6
No.
SQ SQ SQ SQ SQ SQ
Q1 30% 4

Total 30%

PERFORMANCE CRITERIA:
REPORT (30%)
Very Poor Poor Adequate Good Excellent

51
0-1 2 3 4 5

Requirement  Poor  Average  Satisfactory  Good  Excellent


Specification elaborations elaborations elaborations of elaborations of elaborations of
of audience of audience audience audience audience
(5 %)
modeling and modeling and modeling and modeling and modeling and
major major major functions major major functions
functions functions functions

0-3 4 5-6 7 8 - 10
 Poor interface  Average  Satisfactory  Good interface  Excellent
design & interface interface design & interface design
navigational design & design & navigational & navigational
Design structure. navigational navigational structure. structure.
 Less than structure. structure. More than 70%  All required
(10 %) 30% of the  More than More than of the required diagrams
required 30% of the 50% of the diagrams included.
diagrams required required included.
included diagrams diagrams
included. included.

0-3 4 5-6 7 8 - 10

 No code  Only few code  Moderate  Most of the  All / almost all
snippets snippets amount of code snippets of the code
included included code snippets included snippet
 No  Least amount included  Substantial included
Code explanation of explanation  Moderate amount of  Comprehensive
Snippets given on given on amount of given on explanation
(10 %) application’s application’s explanation application’s given on
functionalities functionalities given on functionalities application’s
application’s functionalities
functionalities

0-1 2 3 4 5

 No submission  More than  More than  More than 70%  Contains all of
of report 30% of the 50% of the of the required the required
Content & OR required required contents. contents.
format  Less than 30% contents. contents.  Shows  Shows high
of the required  Improper  Shows sufficient level degree attention
(5 %) contents. writing format moderate attention to to writing
 Improper & structure. attention to writing format format &
writing format writing format & structure. structure
& structure. & structure.

IMPLEMENTATION (40%)
Very Poor Poor Adequate Good Excellent
0-1 2 3 4 5
Web Page  Poor web page  Average web  Satisfactory  Good web page  Excellent web
Design layout design page layout web page layout design page layout
and structure design and layout design and structure design and
(5 %) structure and structure structure

52
0–7 8–9 10 - 12 13 - 14 15 - 20

Database not Database Database Database Database


included. included. included. included. included.
OR Average Satisfactory Good database Excellent
Database database database implementation. database
included. implementatio implementatio More than 70% implementation.
CRUD Poor database n. n. of CRUD All CRUD
(20 %) implementatio More than 30% More than 50% implemented as implemented as
n. of CRUD of CRUD per requirement per requirement
Less than 30% implemented implemented
of CRUD as per as per
implemented requirement requirement
as per
requirement

0-1 2 3 4 5
 Poor  Average  Satisfactory  Good  Excellent
implementatio implementatio implementatio implementation implementation
n of n of n of s of s of
Authenticatio authentication authentication authentication authentication authentication
n & & & & & authorization
(5 %) authorization authorization authorization authorization  All the
 Less than 30%  More than  More than  More than 70% requirements
of the 30% of the 50% of the of the are fulfilled.
requirements requirements requirements requirements
fulfilled. fulfilled. implemented. implemented.

0-1 2 3 4 5

Form &  Poor  Average  Satisfactory  Good  Excellent


Validation implementatio implementatio implementatio implementation implementation
n of form & n of form & n of form & s of form & s of form &
(5 %)
validations. validations. validations. validations. validations.

0-1 2 3 4 5
Contents,
Innovation,  Poor list of  Average list  Satisfactory  Good list of  Excellent list of
functionalities of list of functionalities functionalities
Originality
and content. functionalities functionalities and content. and quality
(5 %) and content. and content. content.

PRESENTATION (30%)
Very Poor Poor Adequate Good Excellent
0–7 8–9 10 - 12 13 - 14 15 - 20
Technical Skill

53
 Not able to  Able to  Able to provide  Able to provide  Able to provide
explain own provide some most of all information
component of minimal information / information and and / or answer
the project. information answer some / or answer all questions
 Unable to and / or questions posed most of the with regards to
provide answer to on the questions with the component
answers to minimal component of regards to the of the project.
any questions questions the project. component of  Answers
posed with related to the  Some answers the project. questions
regards to components given accurate  Answers most accurately and
(20 %) own of the project. but with some of questions confidently.
component of  Some hesitation. accurately.
the project. inaccurate /
 Mostly illogical
inaccurate / answers /
illogical explanation
answers / provided.
explanation
provided.

0-3 4 5-6 7 8 - 10

 Did not turn  Barely able to  Able to explain  Able to explain  Excellent and
up for explain and and shows and shows a in depth
presentation show work some good understanding
Demonstratio  Unable to done understanding understanding of the work
explain and  Had difficulty of the work of the work done
n
the work in executing done done  Able to execute
(10 %) done the system  Able to  Able to execute the application
 Did not know execute the the application  Show
how to application additional
execute the concepts / new
system ideas used in
the solution

Remarks:

__________________________________________________________________________________________

__________________________________________________________________________________________

__________________________________________________________________________________________

__________________________________________________________________________________________

_______________________________________

54

You might also like