BAIT2173 Web Programming Assignment
AMIT2043 Web Systems and Technologies
Group Assignment
ADVICE: Read the assignment specifications and requirements thoroughly.
Start to work on the assignment as early as possible. Complete the
parts that you know first. Do self study and research on the areas
which have not yet been covered in the formal lesson.
1.0 General Information
Objective:
At the end of this assignment, the student should be able to:
(i.) CLO 1: Demonstrate dynamic and interactive web pages by adopting current
emerging web technologies. (C3, PLO1)
(ii.) CLO 2: Produce data-driven web application using client-side and server-side
scripting. ( P4, PLO2)
(iii.) CLO3: Present web application development solution based on given scenario in the
practice of professionalism. (A2, PLO6)
Assessment Weight: This project contributes 100% to the coursework component.
Group Size: 2 members in a team.
Submission Mode: Softcopy. Refer to Section 4.0.
Submission Date: Prototype Week 8, System Week 13
Feedback to Student: Week 14.
2.0 Assignment Specifications
The Covid-19 outbreak and movement control order in Malaysia has extremely hit the
Malaysia SME business. You are required to develop a web application for a SME company
by using client-side and server-side technology. The web application implements the online
store concepts. The system includes the basic online store features, for example, an
administrator able to add new categories and product, edit existing products, view orders
and etc. Customers are able to register and log in, browse for products, search for products,
purchase, check out and view order’s status.
The web application should be able to capture the following information about:-
? Products and Categories
? Customer
? Order
The web application should provide the features as follows:-
Academic Year 2020/2021 Page 1 of 7
BAIT2173 Web Programming Assignment
? An administrator should able to :
o Add new products
o Edit existing products
o Update product availability
o View orders
o Fulfill orders
? Customer should be able to:
o Register and log in
o Possibly purchase without registration
o Browse for products
o Search for products
o Add products to a shopping cart
o Check out to complete an order
o View an order’s status
The web application allows user to maintain their records in MariaDB/MySQL, an open
source database tool. The web application should support the basic CRUD (Create, Read,
Update and Delete) operations to the database table.
There are NO minimum and maximum limits to the number of web pages you should create.
3.0 Assessment Criteria
Web Prototype
No Criteria Marks
1. Web and Navigation Design, HTML Form Controls,
System Prototype
30%
TOTAL : 30%
Web System
No Criteria Marks
1. Database 5%
2. Functionality: Record Adding, Listing, Updating,
Deleting, Search and Filter
30%
3. Usability 5%
4. Programming Logic and Style 5%
5. Additional Features 5%
TOTAL : 50%
Documentation, team work and presentation
No Criteria Marks
1. Presentation 5%
2. Team Work 5%
3. Documentation 10%
Academic Year 2020/2021 Page 2 of 7
BAIT2173 Web Programming Assignment
TOTAL : 20%
For detailed assessment criteria, and learn how marks are to be awarded, refer to the Group
Assignment: Marking Rubric as attached with this assignment specification.
3.1. Database Programming
Students are required to use Maria DB/MySQL database tool to create their database. In
the database, example of tables that can be included are Customers, Orders, Order_Details,
Categories, and Products to store relevant records.
3.2. Fundamentals of Web Development
A. Record Adding
The web pages allow user to add record by entering necessary details. The requirements are
as follows:
? Use appropriate GUI components to design the web pages. Try to use GUI
components that can minimize user input and input error whenever possible. Using
text fields for all input fields is a very BAD idea.
? Include input features:-
o Admin to add a new product / category.
o Customer to register and log in.
o Customer to add product to a shopping cart.
o Customer checkout to complete an order.
? Perform input validations and confirmation message before data is submitted
(simple or complex). Display appropriate error message if an input error is detected.
B. Record Listing
? Features Includes:
o Product catalog. Customer able to browse the product categories view the
products based on the specific category.
o Customer records and Order list. Admin able to browse and view the full
customer record and order list.
o Shopping cart. Display the contents of the shopping cart in detail and give
the customer the option of updating the cart by changing the quantity or
remove the items.
? Display a count that indicates the number of records in the list.
? The output should be NEATLY formatted.
? Include buttons or hyperlink that allow user to:-
o View Remove all records from the list.
o Navigate to other web pages.
Academic Year 2020/2021 Page 3 of 7
BAIT2173 Web Programming Assignment
C. Customer to search product, Admin to search order record
The web page allows customer to enter a target product searches through the product list
for matching products record. If there is a match, the details of the matched record will be
displayed on the web page. Otherwise, display a message to indicate the product is not
found. Admin panel should allow admin to search order details and customer record by
specific orderID or other specific like date or customer name.
The requirements are as follows:-
? Use appropriate GUI components to capture the product/order and display the
matched product/order records.
? Include buttons that allow user to:
o Search the product or order record based on the given search specific.
o Navigate to other web pages.
D. Updating product, category, customer and order details
UPDATE an existing product, customer, and order record. This operation is based on the
primary key (ProductID, CustomerID, OrderID) provided.
Create web pages that are able to retrieve and display product information, customer details
and order details by a search on valid primary key.
Basic requirements include:
? Update an existing record based on the primary key (ProductID, CustomerID,
OrderID) provided.
? If primary key is valid, display forms with relevant HTML input controls and prepopulate
these controls with the original record’s field values. Use appropriate
HTML input controls for each field (except ProductID, CustomerID, and OrderID
which should not be changed).
Enhancement (optional):
? Perform as much as input validations as you can. Display appropriate error
messages and reject the update operation if input errors are detected.
? If you are good in JavaScript, perform appropriate client-side input validation too.
E. Record deleting
DELETE an existing product, customer, and order record.
Basic requirements include:
? Delete an existing record based on the primary key (ProductID, CustomerID, or
OrderID) provided.
? Ask for user confirmation before the operation takes place. Use JavaScript code to
achieve this.
Academic Year 2020/2021 Page 4 of 7
BAIT2173 Web Programming Assignment
Optional:
? In a real online store system, is not a wise decision to delete completely the record
from database/ system. An alternate way is to hide from front end but still keep the
data in database, or provide alternate log data to keep record on deleted data.
F. Additional Features
? Covers additional features for advanced users. Additional features should be very
useful and implemented perfectly and completely.
G. Web Design and Form Controls
? Create a clean, simple, consistent and appropriate web site. A good and attractive
website gets more traffic to generate revenue. Use right color, font size and other
relevant elements to ensure that visitors easy to view the product details and the
information they are looking for.
? Use the right HTML controls for validation purpose. The right HTML controls should
be able to minimize the input errors and provide the necessary feedbacks to user if
the inputs inserted by users are invalid. All the HTML controls should be well
structured.
H. Usability
? Improve user experience in online shopping from browsing to confirm a purchase
and payment.
? E.g. Create neat and smooth navigation to ensure that participants are able to locate
information, register, purchase items, buy ticket, and make payment with minimal
click.
? E.g. Add functions which will ease customer purchase action like stock availability,
shopping cart, wish list, compare items, promotion notification, etc.
I. Programming Logic and Style
? The student should develop the online application in logical manner.
? Source codes are indented properly and highly readable.
? The variable names used should be meaningful.
? Standard and convention are followed strictly.
? Comments are used appropriately.
J. Other General Requirements
? Try your best to make the online store application easy to use and easy to navigate.
? Make your source codes easy to read and understand. Use comments to provide
brief description to a complex logic. Format your source codes with appropriate
spaces and line breaks.
3.3 Cross Device and Cross-Browser Compatibilities
? The student is required to implement the web application using at least TWO web
technologies.
? Web pages must be displayed properly across different browsers and devices with
different screen sizes.
Academic Year 2020/2021 Page 5 of 7
BAIT2173 Web Programming Assignment
4.0 Deliverables
The assignment is to be submitted in SOFTCOPY format for both Report and Source Code.
For Report, introduce the selected Malaysia SME company affected by the Covid-19
outbreak and movement control order, state the problem and propose to develop a web
application to help the SME company to start an online store/marketplace.
Draw the hierarchy diagram to proper indicate and describe the web application structure
and all functional modules. You may have brief explanation on each module. Prepare a user
manual, which includes print screens for all the pages of your web application either in color
(recommended) or black and white (cleared) copy.
Submit the final report together with the source codes.
The final report should be arranged as follows:
1. Cover page
2. Company Introduction and problem
3. Web Application structure and functional modules (Hierarchy chart + Description)
4. Web Application User Manual
5. References
Include page header and footer in your report.
Page header: Couse code and title + Group Assignment
Page footer: Your full name and Programme + Page number of total page number (e.g. Page
1 of 10)
(or as recommended by your lecturer)
For Source Code, you must include the project source codes. Arrange and submit your files
according to the following file and folder structure:
Web Projects that CANNOT be opened in NetBeans and interpreted successfully will be
REJECTED. You are advised to comment out the section contains errors which you cannot
solve, so that your application can run successfully. Indicate those errors left unsolved in the
Readme.txt file so that the lecturer is aware of it.
5.0 Student Ethics
5.1 Plagiarism
YourName
Project
Readme.txt
The top-most folder, named with your full name.
The entire NetBeans IDE project folder contains the
project source codes. The project folder must be able to
be opened in NetBeans IDE without any problem.
Briefly describe the additional features you added to
the application (which you do not want the lecturer to
miss) in the Readme.txt file.
Academic Year 2020/2021 Page 6 of 7
BAIT2173 Web Programming Assignment
Works submitted must be ORIGINAL. You can discuss with your friends. You can research
from web resources. However, the program must be your own work. You can teach your
friends how to solve a certain programming problem, but not to program for them. Do not
share your program and source codes with other teams.
The student who copies AND the student who provides an opportunity for others to copy
his/her programs, will both be penalized. BOTH PARTIES will receive ZERO (0) MARK for this
assignment. The matter will also be brought to the school for further disciplinary action.
5.2 Late Submission
Late submission which does not supported by VALID and CONCRETE reason will be penalized
according to the following:
No. of Day Late Deduction
1 to 3 days 10% from the assignment marks earned
4 to 7 days 20% from the assignment marks earned
more than 7 days 100% from the assignment marks earned
Academic Year 2020/2021 Page 7 of 7
版权所有：留学生编程辅导网 2020 All Rights Reserved 联系方式：QQ:99515681 微信：codinghelp 电子信箱：99515681@qq.com
免责声明：本站部分内容从网络整理而来，只供参考！如有版权问题可联系本站删除。
