INDIVIDUAL ASSIGNMENT

TECHNOLOGY PARK MALAYSIA

CT050-3-2-WAPP
DATA CENTER INFRASTRUCTURE
NP2F1901IT
HAND OUT DATE: 08 June 2019
HAND IN DATE: 01 December 2019
___________________________________________________________________________
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 submissions will be awarded zero (0) unless extenuating Circumstances (EC) is
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 hard copy 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.
 Table of Contents
1. Introduction..................................................................................................................................1

1.1 Objectives..............................................................................................................................1

1.2 Scope......................................................................................................................................1

1.3 Target Audience.....................................................................................................................2

1.4 Summary of major function...................................................................................................2

1.5 Project schedule.....................................................................................................................2

2. Requirement specification...........................................................................................................3

2.1 Audience modeling................................................................................................................3

2.1.1 Audience classification...................................................................................................3

2.1.2Audience Characterization...............................................................................................3

2.2 Major function of website......................................................................................................4

2.3 Hardware and software requirement......................................................................................4

3. Design and Modeling...................................................................................................................5

3.1 Data dictionary.......................................................................................................................5

3.1.1 Admin data dictionary....................................................................................................5

3.1.2 Product data dictionary...................................................................................................5

3.1.3 Cart data dictionary.........................................................................................................6

3.1.4 Order data dictionary......................................................................................................6

3.1.5 Registration data dictionary............................................................................................7

3.2 Interface Design (Story board)..............................................................................................7

3.3 Website architecture (navigational structure)......................................................................11

3.3.1 Architecture of client panel..........................................................................................12

3.3.2 Architecture of admin panel.........................................................................................12

4. Interface Design (Screenshot)....................................................................................................13

 4.1 Home page...........................................................................................................................13

4.2 About us page......................................................................................................................13

4.3 Product page........................................................................................................................14

4.4 Product details page.............................................................................................................14

4.5 Login page...........................................................................................................................15

4.6 Registration page.................................................................................................................15

4.7 Admin page..........................................................................................................................16

4.8 Shopping cart page..............................................................................................................16

4.9 Admin profile.......................................................................................................................17

5. Implementation of code.............................................................................................................18

5.1 Login....................................................................................................................................18

5.2 Read.....................................................................................................................................18

5.3 Create...................................................................................................................................19

5.4 Delete...................................................................................................................................19

5.5 Edit and update....................................................................................................................20

6. Conclusion.................................................................................................................................21

Reference.......................................................................................................................................22
 Table of figure
Figure 1: Gantt chart........................................................................................................................2
Figure 2: Home page.......................................................................................................................7
Figure 3: About us...........................................................................................................................8
Figure 4: Product.............................................................................................................................8
Figure 5: Login................................................................................................................................9
Figure 6: User Registration.............................................................................................................9
Figure 7: Add Product...................................................................................................................10
Figure 8: Admin panel...................................................................................................................10
Figure 9: Navigational structure....................................................................................................11
Figure 10: Architecture of client panel..........................................................................................12
Figure 11: Architecture of admin panel.........................................................................................12
Figure 12: Home page...................................................................................................................13
Figure 13: About us page...............................................................................................................13
Figure 14: Product page.................................................................................................................14
Figure 15: Product details page.....................................................................................................14
Figure 16: Login page....................................................................................................................15
Figure 17: Registration form page.................................................................................................15
Figure 18: Admin panel.................................................................................................................16
Figure 19: Shopping cart page.......................................................................................................16
Figure 20: Admin profile...............................................................................................................17
Figure 21: Login code....................................................................................................................18
Figure 22: Read code.....................................................................................................................18
Figure 23: Create code...................................................................................................................19
Figure 24: Delete code...................................................................................................................19
Figure 25: Edit and Update code...................................................................................................20
1. Introduction
E-Commerce also known as e-Business and electronic business. E-Commerce is the process of
selling and purchasing the goods and services using an electronic medium like the
internet[ CITATION eco19 \l 1033 ]. It helps to transfer the data between two or more user. So
to give proper online services to the user and clients we have developed G.S.M e-commerce
website. G.S.M is e-commerce website which is developed in asp.net platform. G.S.M online e-
commerce website provides a quality services to its users and where customer can buy different
product such as clothes. G.S.M e-commerce website is online portals which provides a facility of
online transaction. Our G.S.M e-commerce is based on business to consumer (B2C) model.
G.S.M e-commerce provides a latest fashion clothes and foot wear to its user on time. It has also
facility of delivery goods and services to its client without any charge. It also provides a new
about the latest fashion design clothes and foot wear to clients. User can view variety of products
in our e-commerce website. G.S.M e-commerce website also provides online payment system.
User can order different product and add product in cart to place the order. Using G.S.M e-
commerce website user can save their time and money. It also provides a huge discount to its
customer.
1.1 Objectives
 To provide a latest global market reach.
 To provide products in less cost.
 Helps customer to get details knowledge about the latest products.
 To provide satisfaction services to its user.
 It also reduce the employee costs.
1.2 Scope
 Price will be standard for all the user.
 Provide good interaction between G.S.M e-commerce and its client.
 Commercial transaction like ordering, delivery, payment.
 Product services and maintenance.
 Accounting and financial management.
1.3 Target Audience
Our G.S.M e-commerce website is online website which target all kinds of the audience. Our
website mainly focus on the audience which has more interested on fashion and clothing. Target
audience means the demographic of the people who involved or interested in various product and
services[ CITATION the191 \l 1033 ]. Now a day’s most of the people use online website in
order to save money and time. So to increase our G.S.M e-commerce website we have separate
different audience on the basis of geography, age, sex etc. Target audience helps to develop an
effective marketing strategy[ CITATION fat19 \l 1033 ]. So we have create ads on the basis of e-
commerce website to target the audience.
1.4 Summary of major function
This website is designed for all kinds of the people. The main function of this website is to
provide quality products to the customer and secure online payment system. It also secure the
customer information. Our website avoids data redundancy and provide effective and efficient
data retrieval in time of need. It also provides the information of global market reach.
1.5 Project schedule

Figure 1: Gantt chart

2. Requirement specification
Requirements specification is a set of documentation that describes the features and behavior of a
system or software application[ CITATION www1932 \l 1033 ]. It includes a variety of elements
which define the proposed functionality required by the customer to satisfy their different users
and clients[ CITATION www1932 \l 1033 ]. Before developing any software application it is
necessary to include requirement specification.
2.1 Audience modeling
Audience modeling is important phases of Web Site Design Method. The main purpose of
audience modeling is to identify the set of target users because they are the people who used the
system. G.S.M e-commerce website will be used for the purpose of providing the quality
products and buying the fashion wear on online basis which will be delivered to the customer’s
door. Our online e-commerce website have targeted audience of all Nepal people. Admins have
power to control the administrative functions of the website. There are two phases of audience
modelling. So they are explained below
2.1.1 Audience classification
It means identifying what your audience demographic is and what sort of income they
possess[CITATION pre19 \l 1033 ]. In audience modeling different types of users are identified
and classified in more detail. Whatever the requirement of the audience they are grouped
together in order to provide services. In our online e-commerce website (G.S.M e-commerce),
the major functionality of the e-commerce online website can be used by all the users. So we
classified the audience on the basis of demography. G.S.M e-commerce website provides users
to buy products like clothes, shoes in a systematic way.
2.1.2Audience Characterization
It analysis the audience according to the audience characteristics and each user are classified in
different audience class. Different use has different functionality in a system. We have classified
audience on the basis of technical user and normal user. Technical user has responsibility to
control the work flow of the e-commerce website and maintain it properly where as normal user
can buy a product. All the financial transaction payment is done online banking system.

2.2 Major function of website

Some major function of G.S.M e-commerce website are listed below:
  Normal users can give the order for product. Simply entering the name of product in
search space.
 User can get knowledge of different products in details.
 All the customer data are stored in database.
 For new user there is registration form.
 User can place the order of different products and can view product added by the admin.
 Admin have full control on product manage and user management.
2.3 Hardware and software requirement
The hardware and software which we have used in our e-commerce website (G.S.M e-
commerce) are as follows:
 Operating System: Windows 8, Windows 10, Windows 7, Linux and mac.
 Browsers: Google Chrome/ Mozilla Firefox/ Microsoft Edge/ Internet Explorer
 RAM: At least 500 MB
 Programming Language used:
o Front End: ASP.NET
o Back End: Microsoft SQL Server 2012
 Software Required
o Microsoft Visual Studio 2017
o Microsoft SQL Server 2012
3. Design and Modeling
Design and modeling is one of important phase in developing software application. Before
develop any application we need to make model then we can design application. Before we
developed G.S.M e-commerce website we prepare all the necessary model and changed into
design.
3.1 Data dictionary
Data dictionary is very important because it contains information what is in the database and
who can access it. It also contains metadata. Normally database user don’t interact with the data
dictionary but it is handled by the database administration[ CITATION www1933 \l 1033 ].
Some of data dictionary of G.S.M e-commerce website are listed below
3.1.1 Admin data dictionary
Variable Field Type Field Description Example
Name Length
username varchar 50 username of admin madanghale

password varchar 50 password of admin ghale

3.1.2 Product data dictionary

Variable Field Type Field Description Example
Name Length
id integer - Unique id of product 1

name varchar 50 Name of prouduct T-shirt

price varchar 50 Price of product $10

img varchar 50 Img of product

3.1.3 Cart data dictionary
Variable Field Type Field Description Example
Name Length
Id Integer - Unique id of cart 1

Product_id Integer - Unique id of product

Session_id Varchar 50 Cart session_id 2

3.1.4 Order data dictionary

Variable Field Type Field Description Example
Name Length
Id Integer - Unique id of order 1

Cart_id Integer Unique id of cart

Customer_name Varchar 50 Customer name Sandesh gurung

Customer_phone Varchar 50 Customer phone 984566544

number

Customer_addres Varchar 50 Customer address Gorkha, Nepal

s
3.1.5 Registration data dictionary
Variable Field Type Field Description Example
Name Length
Username Varchar 50 Username of user Demonrai

First name Varchar 50 First name of user Sanju

Last name Varchar 50 Last name of user Gurung

Password Varchar 50 Password of user ******

3.2 Interface Design (Story board)

Interface design means the visual layout of the elements where the user can interact with in a
website or technological product[ CITATION pid19 \l 1033 ]. Interface design helps the user to
understand the whole operation of system. Some of the interface design are listed below:

Figure 2: Home page

Figure 3: About us

Figure 4: Product
 Figure 5: Login

Figure 6: User Registration

Figure 7: Add Product

Figure 8: Admin panel

3.3 Website architecture (navigational structure)
Website architecture is the process of planning and designing the functional, technical and visual
component of a website and it also refers the structure of website[ CITATION tec191 \l 1033 ].
Website architecture is helps customer to find the information of webpages quickly. So we have
created navigational structure of the G.S.M. e-Commerce website. This is the navigation
structure of the G.S.M e-Commerce website where users can visit different pages like home
page, about us page, product page, cart, login and user registration page.

Figure 9: Navigational structure

3.3.1 Architecture of client panel
This architecture helps the user to understand the funcationality of G.S.M e-Commerce. In ths
architecture user can visit different pages.

Figure 10: Architecture of client panel

3.3.2 Architecture of admin panel

This is the architecture of Admin panel which provides overview of Admin control. Here, Admin
can add product, view members, view product and manage the order.

Figure 11: Architecture of admin panel

4. Interface Design (Screenshot)
4.1 Home page
Home page is the main page of the website. In this page user can see all the information of the
website.

Figure 12: Home page

4.2 About us page

This page shows the information about the G.S.M e-commerce website. It also provides the
detail knowledge about the website.

Figure 13: About us page

4.3 Product page
Product page shows the information about the product which are added by the admin. In this
product page user can buy the product and can place the order of the product..

Figure 14: Product page

4.4 Product details page
This page shows the G.S.M e-commerce product details. Product details page shows the
information of product name, product price, and product color and product type.

Figure 15: Product details page

4.5 Login page
Login page provides authorization to the user to control the work flow of the system. The normal
user view the product and buy the product. Admin control the entire function of the website.

Figure 16: Login page

4.6 Registration page

It is the page where user can register their all the information in a required form. This page the
store the user information in a database.

Figure 17: Registration form page

4.7 Admin page
Admin has right to control all the work flow of the website. Admin can view, update, delete and
edit the product. It also manage the order of the product and manage the user.

Figure 18: Admin panel

4.8 Shopping cart page

When the user press the button called add to cart then it takes to another page. Where user can
buy the product and they can add the product in cart to buy the items.

Figure 19: Shopping cart page

4.9 Admin profile
Admin profile page shows the profile of the admin. Admin can manage their account.

Figure 20: Admin profile

5. Implementation of code
5.1 Login

Figure 21: Login code

5.2 Read

Figure 22: Read code

5.3 Create

Figure 23: Create code

5.4 Delete

Figure 24: Delete code

5.5 Edit and update

Figure 25: Edit and Update code

6. Conclusion
This website is designed and developed to provide easy and convenient access of online
transaction for the customers who are in need. The main objective of this website is to deliver the
required product to those who have problem because of being at remote places. In this
assignment we represented G.S.M e-Commerce website for providing information about the
product and recent post of the latest product to the general public and clients via internet where
the clients can have access to the online shopping. We have efficiently analyzed and researched
countless factors to create this website. With the help different programming language we
developed our website. Such as HTML, CSS, JavaScript, and asp.net are the elements which are
used in our website. To provide facility for different users, this website has been designed so that
there will be no difficulty to run in different OS i.e. Linux, Windows, Mac OS etc. Coding has
been done in Visual Studio where as connection has been done with SQL Server.
With proper coordination among the team members, project has been successfully completed
within the time meeting all the requirements.
For the future use, the website can be upgraded, and various kind of new features can be added
so that it could bring positive effect in the life style of people. As the website only works for
computers, later it can be made workable for mobile devices too so that every data stored in the
website can be synced and people could access this website with the mobile phone also along
with more security features added on it.
 Reference
I. ecommerce-platforms, 2019. ecommerce-platforms. [Online]
Available at: https://ecommerce-platforms.com/glossary/ecommerce
[Accessed 20 9 2019].
II. fatguymedia, 2019. fatguymedia. [Online]
Available at: https://fatguymedia.com/inbound-marketing/target-audience/
[Accessed 11 11 2019].
III. pidoco.com, 2019. pidoco.com. [Online]
Available at: https://pidoco.com/en/help/ux/user-interface-design
[Accessed 19 11 2019].
IV. prezi.com, 2019. prezi.com. [Online]
Available at: https://prezi.com/-cvvezsqaxsa/classification-of-audiences/
[Accessed 11 2019].
V. techopedia.com, 2019. techopedia.com. [Online]
Available at: https://www.techopedia.com/definition/30409/
[Accessed 19 11 2019].
VI. thebalancesmb, 2019. thebalancesmb. [Online]
Available at: https://www.thebalancesmb.com/what-is-a-target-audience-2295567
[Accessed 21 11 2019].
VII. www.inflectra.com, 2019. www.inflectra.com. [Online]
Available at: https://www.inflectra.com/ideas/topic/requirements-definition.aspx
[Accessed 21 11 2019].
VIII. www.tutorialspoint.com, 2019. www.tutorialspoint.com. [Online]
Available at: https://www.tutorialspoint.com/What-is-Data-Dictionary
[Accessed 11 11 2019].
Student Name: Madan Babu Ghale TP Number :

No. Learning Outcome Assessment

LO1 Show a design solution which provide a systematic way to develop web application(A3, PLO4) Presentation
LO2 Develop a web application which is connected to a well-designed database by using server and Assignment
client side scripting language based on the current web standards. (C4,PLO3)
LO3 Demonstrate web usability and accessibilty concepts and their application in interactive web Assignment
application(A3,PLO7)

Assignment:
Question Vs Taxonomy
Cognitive Level
Question No. PLO
1 2 3 4 5 6
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
Requirement 0-1 2 3 4 5
  Poor elaborations of  Average elaborations of  Satisfactory  Good elaborations of  Excellent
audience modeling audience modeling and elaborations of audience audience modeling and elaborations of
Specification and major functions major functions modeling and major major functions audience
(5 %) functions modeling and
major functions

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

0-3 4 5-6 7 8 - 10

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

0-1 2 3 4 5

 No submission of  More than 30% of the  More than 50% of the  More than 70% of the  Contains all of
Content & format report required contents. required contents. required contents. the required
OR  Improper writing format  Shows moderate  Shows sufficient level contents.
 Less than 30% of the & structure. attention to writing attention to writing  Shows high
(5 %) required contents. format & structure. format & structure. degree attention
 Improper writing to writing format
format & structure. & structure
IMPLEMENTATION (40%)
Very Poor Poor Adequate Good Excellent
0-1 2 3 4 5
Web Page Design  Poor web page  Average web page layout  Satisfactory web page  Good web page layout  Excellent web
layout design and design and structure layout design and design and structure page layout
(5 %) structure structure design and
structure

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

Database not Database included. Database included. Database included. Database

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

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

Form & 0-1 2 3 4 5

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

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

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

Demonstration 0-3 4 5-6 7 8 - 10

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

Remarks:

_________________________________________________________________________________________________________________________________

_________________________________________________________________________________________________________________________________

_________________________________________________________________________________________________________________________________

_________________________________________________________________________________________________________________________________