PENYERAHAN DAN PENILAIAN TUGASAN

ASSIGNMENT SUBMISSION AND ASSESSMENT

_________________________________________________________________________
CBWP2203
WEB PROGRAMMING
JANUARY 2018
_________________________________________________________________________

ARAHAN KEPADA PELAJAR / INSTRUCTIONS TO STUDENTS

1. Tugasan ini mengandungi DUA soalan sahaja yang disediakan dalam Bahasa Melayu dan Bahasa
Inggeris / This assignment contains only TWO question that is set in both Malay and English.

2. Jawab dalam Bahasa Melayu atau Bahasa Inggeris. / Answer in Malay or English.

3. Anda dikehendaki menyerahkan tugasan dalam format MsWord melainkan dinyatakan

sebaliknya. Anda tidak dibenarkan untuk menukar teks/frasa tugasan tersebut kepada format
grafik seperti .jpeg / .gif / print screen / dan lain-lain format berkaitan. /Learners are to submit
assignment only in MsWord format unless specified otherwise. Please refrain from converting
text/phrases into picture format such as .gif / .jpeg / print screen / etc.

4. Muat turunkan templat tugasan versi bahasa yang berkenaan daripada myINSPIRE untuk
penyediaan dan penyerahan tugasan anda. Tugasan anda hendaklah ditaip dengan
menggunakan saiz fon 12 Times New Roman dan langkau baris 1.5. / Download the language
version of the assignment template concerned from the myINSPIRE for preparation and
submission of your assignment. Your assignment should be typed using 12 point Times New
Roman font and 1.5 line spacing.

5. Anda dikehendaki menghantar tugasan SECARA ONLINE melalui myINSPIRE. Sila rujuk kepada
portal untuk arahan mengenai prosedur menghantar tugasan anda secara online. Anda
dinasihatkan menyimpan senaskah tugasan yang diserahkan untuk rujukan sendiri. / You must
submit your assignment ONLINE via the myINSPIRE. Refer to the portal for instructions on the
procedures to submit your assignment online. You are advised to keep a copy of your submitted
assignment for personal reference.

6. Anda hanya boleh menghantar tugas SEKALI sahaja dalam BEBERAPA fail (digalakkan dalam
bentuk zip file). / You can submit your assignment ONCE only in MULTIPLE file (preferable in zip
file).

7. Tugasan anda hendaklah diserahkan antara 5hb Mac 2018 hingga 19hb Mac 2018. Serahan
selepas 19hb Mac 2018 TIDAK akan diterima. / Your assignment must be submitted between 5th
March 2018 until 19th March 2018. Submission after 19th March 2018 will NOT be accepted.
8. Tugasan hendaklah disiapkan secara individu. Anda dilarang meniru tugasan orang lain. Anda
juga dilarang sama sekali memplagiat kerja orang lain sebagai kerja sendiri. /
Your assignment should be prepared individually. You should not copy another person’s
assignment. You should also not plagiarise another person’s work as your own.

9. Sila ambil maklum tentang PENALTI yang akan dikenakan ke atas penghantaran lewat tugasan
seperti yang tertera di pekeliling pejabat Pendaftar 6/2012 (Rujuk Registrar’s Announcement di
myVLE). / Please take note that PENALTY will be imposed on late submission of assignment as
specified in the Registrar’s Office circular 6/2012 (Refer to Registrar’s Announcement in myVLE).

10. Anda perlu memastikan RESIT yang dikeluarkan bagi penghantaran tugasan disimpan sebagai
bukti penghantaran. Kegagalan mengemukakan resit dalam sebarang isu yang timbul berkaitan
penghantaran tugasan akan mengakibatkan tugasan dianggap TIDAK dihantar / Please ensure
that you keep the RECEIPT issued upon submisson of your assignment as proof of submission.
Your assignment is considered as NOT submitted if you fail to produce the submission receipt in
any dispute arises concerning assignment submission.

PENILAIAN / EVALUATION
Tugasan ini menyumbang sehingga 60% daripada jumlah markah kursus berkenaan dan akan dinilai
berdasarkan kepada Rubrik yang dilampirkan. / This assignment accounts for 60% of the total
marks for the course and shall be assessed based on the Rubrics attached.

Anda akan diberikan maklum balas tentang tugasan ini sebelum Peperiksaan Akhir Semester
bermula. / You would be given feedback on the assignment before the Final Semester Examination
commences.

PLAGIARISME: POTONGAN MARKAH / PLAGIARISM: MARKS DEDUCTION

Amaran: Tugasan yang diserahkan, secara automatik, akan disemak untuk menentukan kadar
pertindihan. Jika plagiarisme dikesan, markah akan dipotong seperti berikut: / Warning: The
submitted assignment will automatically undergo a similarity check. If plagiarism is detected,
marks would be deducted as follows:
% Kumpulan Pertindihan (Similarity % Potongan Markah (Marks
No.
Group) Deduction)
1 0 – 30 0
2 30.01 – 50 5
3 50.01 – 70 10
4 70.01 – 100 100

Tugasan yang dikenal pasti mempunyai pertindihan tugasan bagi mana-mana kumpulan pertindihan
di atas tidak dibenarkan untuk rayuan. Bagi pelajar dalam kategori pertindihan tugasan kumpulan
70.01-100, akses online rayuan semakan semula tugasan bagi subjek berkaitan dilupuskan dari
pilihan rayuan. / Assignments found to have similarities under any of the categories above; will not
be entitled to apply for appeal. For learners who fall into the 70.01-100 similarities group, the access
for online appeal for assignment remarking of the subject will be disabled from the appeal options.
 ASSIGNMENT QUESTION

PURPOSE

The purpose of this question is to test learner’s understanding in developing a website using HTML
elements.

Tujuan soalan ini adalah untuk menguji kefahaman pelajar dalam membangunkan sebuah web
menggunakan elemen-elemen HTML.

REQUIREMENT / QUESTION 1

Your friend is a small online entrepreneur selling accessories for phones and gadgets. Usually she
promotes and markets her products through social media such as Facebook, Twitter and other
social related media. Based on the feedback from her friends, she decides to develop her own
online website. They suggested for the website to show her list of products to attract more
customers and also introduce new products. Thus, she has decided to materialize the idea by
requesting you to develop her first online website.

The following are tasks required for the website development:

a. Suggest any attractive name for the website
b. Organize the products offered
c. Use suitable graphics or images, and appropriate colours, texts and fonts
d. Provide your friend's information such as her experience, address, contact number and
other appropriate information
e. Develop the website using HTML in 2-3 pages

Rakan anda adalah seorang usahawan kecil atas talian menjual aksesori untuk telefon dan gajet.
Kebiasaannya dia mempromosi dan memasarkan produk melalui media sosial seperti Facebook,
Twitter dan lain-lain media sosial yang berkaitan. Berdasarkan maklum balas daripada rakan-rakan
beliau, dia memilih untuk membangunkan laman web atas taliannya sendiri. Mereka mencadangkan
laman web untuk menunjukkan senarai produk beliau bagi menarik lebih ramai pelanggan dan
memperkenalkan produk baru. Oleh itu, dia telah membuat keputusan untuk menjadikan idea
tersebut satu kenyataan dengan meminta anda untuk membina laman web pertama atas talian
beliau.

Berikut adalah tugas-tugas yang diperlukan untuk pembangunan laman web:

a. Cadangkan mana-mana nama yang menarik untuk laman web tersebut
b. Susunkan produk yang ditawarkan
c. Gunakan grafik atau imej yang sesuai, dan warna, teks dan fon yang sesuai
d. Sediakan maklumat rakan anda seperti pengalaman beliau, alamat, nombor telefon dan
maklumat lain yang bersesuaian
e. Bangunkan laman web menggunakan HTML dalam 2-3 halaman
[30]
PURPOSE
The purpose of this question is to assess student’s knowledge and skill in writing a code using
HTML and JavaScript.

Soalan ini bertujuan untuk menilai pengetahuan dan kemahiran pelajar dalam menulis suatu kod
yang menggunakan HTML dan JavaScript.

REQUIREMENT / QUESTION 2

Develop an application that will be able to receive the basic salary and the allowance as the input.
The gross salary and net salary calculation is based on the following formula:

Gross Salary = Basic Salary + Allowance

Net Salary = Gross Salary – EPF Deduction

Assume the deduction of EPF is 10 percent of gross salary. The net salary and gross salary will
appear when user click the “Calculate” button and clear the input boxes when they click on the
“Reset” button as shown in the Figure 1.

If the application does not receive any input, either the basic salary or the allowance, you need to
use an alert to request the user to insert the values (refer Figure 2).

You are required to use JavaScript for that purpose.

Figure 1 / Rajah 1

Figure 2 / Rajah 2
Bina satu aplikasi yang boleh menerima gaji pokok dan elaun sebagai input. Pengiraan gaji kasar dan
gaji bersih adalah berdasarkan formula berikut :

Gaji kasar = Gaji pokok + elaun

Gaji bersih = Gaji kasar – Potongan KWSP

Andaikan potongan KWSP adalah sebanyak 10 peratus daripada gaji kasar. Gaji bersih dan gaji kasar
akan terpapar apabila pengguna menekan butang “Calculate” dan kotak input akan dikosongkan
apabila pengguna menekan butang ”Reset”, seperti yang ditunjukkan pada Rajah 1.

Sekiranya aplikasi tidak menerima sebarang input sama ada gaji pokok atau elaun, anda dikehendaki
menggunakan ‘alert’ untuk meminta pengguna memasukkan input tersebut (rujuk Rajah 2).

Anda diminta menggunakan JavaScript bagi tujuan tersebut.

[30]
[Total/Jumlah : 60 marks/markah]

MUKA SURAT TAMAT / END OF PAGE

 ATTACHMENT
ASSIGNMENT RUBRICS
CBWP2203 WEB PROGRAMMING / JAN 2018

QUESTION 1

Unsatisfactory/
Tidak memuaskan
Excellent/
Good/Baik Fair/Sederhana Poor/Lemah Or/atau
Weightage/ Cemerlang Max
Criteria/Kriteria No response/ Tiada
Pemberat Marks
respons
4 3 2 1 0
Program completion for task: 4.0 The task was Most of the task Moderate Implemented only a No implementation 16
a) Suggestion of website implemented was implementation of small chunk of this of the tasks
name. successfully implemented the task correctly task
b) Products organised on correctly
webpage.
c) Suitable graphics, images,
appropriate colours, texts
and fonts.
d) Information on webpage –
experience, address,
contacts number, etc.
e) 2-3 page website
Kesempurnaan aturcara bagi Arahan Kebanyakan Perlaksanaan arahan Hanya sebahagian Tiada perlaksanaan
tugas: dilaksanakan arahan yang sederhana kecil arahan arahan
a) Cadangan nama website. dengan dilaksanakan secara betul dilaksanakan
b) Produk disusun dalam laman cemerlang dengan betul
web.
c) Graphic dan imej yang
sesuai, warna, teks dan fon
yang sesuai.
d) Maklumat dalam laman web
– pengalaman, alamat,
nombor telefon, dll.
e) Laman web 2-3 muka.

Coding Standards Codes written Codes were Codes were Codes were not well Wrong coding
were very well organised organised in organised
structured and properly moderate manner
creatively
Piawaian Kod organised
1.0 4
Kod ditulis Kod disusun Kod disusun dengan Kod tidak disusun Pengekodan yang
dengan sangat dengan baik cara sederhana dengan sempurna salah
berstruktur dan
disusun dengan
kreatif
Runtime 1.0  The program  The program  The program was  The program was The program could 4
was executed was executed executed but not executed due not be executed at
with all the mostly with mostly with to errors all
correct output the correct incorrect output  OR the program
 AND the output  OR the program was executed
program was was executed with the correct
executed by with the correct output but the
fulfilling all output but the written coding did
the written coding did not fulfil all the
requirements not fulfil few of question’s
as stated in the question’s requirements
the question requirements
 Aturcara ini tidak
Masa Larian  Aturcara ini  Aturcara ini dilaksanakan Aturcara tidak dapat
dilaksanakan Aturcara ini dilaksanakan disebabkan ralat dilaksanakan
dengan semua dilaksanakan tetapi kebanyakan  ATAU aturcara ini langsung
output yang dengan output adalah dilaksanakan
betul kebanyakan salah dengan output
 DAN aturcara output yang betul yang betul tetapi
ini  ATAU aturcara ini kod ditulis tidak
dilaksanakan dilaksanakan memenuhi
dengan dengan output keperluan soalan
memenuhi yang betul tetapi
semua kodnya ditulis
keperluan tanpa memenuhi
yang beberapa
dinyatakan keperluan soalan
dalam soalan

Efficiency Solution is Solution is A logical solution A difficult and Wrong solution

efficient, efficient and easy that is easy to follow inefficient solution
understandable to follow but it is not the most
and easy to efficient
maintain

Efisiensi 1.0 Penyelesaian Penyelesaian logikal Penyelesaian yang Penyelesaian yang 4

adalah berkesan, Penyelesaian yang senang diikuti sukar dan tidak salah
boleh difahami adalah berkesan tetapi ianya bukanlah berkesan
dan senang dan senang penyelesaian paling
diselenggara diikuti berkesan
Requirement of Documentation Excellent Good Brief documentation Incomplete No documentation &
(Source Code files & Document documentation documentation with source code file documentation & source code file
file. Document file has copy of and complete together with without source code
codes, screenshots of the with source code source code file file
program output and program file
comments)

Keperluan Dokumentasi Dokumentasi yang

(fail sumber & fail dokumen. Fail 0.5 ringkas bersama 2
dokumen mengandungi salinan Dokumentasi dengan fail kod Dokumentasi yang Tiada dokumentasi
kod, imbasan skrin output Dokumentasi yang memuaskan sumber tidak lengkap dan dan fail kod sumber
aturcara dan komen aturcara) yang cemerlang bersama dengan tanpa fail kod sumber
dan lengkap fail kod sumber
dengan fail kod
sumber

TOTAL 7.5 30
QUESTION 2

Unsatisfactory/
Tidak memuaskan
Excellent/
Good/Baik Fair/Sederhana Poor/Lemah Or/atau
Weightage/ Cemerlang Max
Criteria/Kriteria No response/
Pemberat Tiada respons Marks
4 3 2 1 0
Program completion for task: The task was Most of the task was Moderate Implemented only a No
a) Appropriate form for implemented implemented implementation of small chunk of this implementation of
input entry. successfully correctly the task correctly task the tasks
b) Calculation of gross salary
and net salary.
c) Results must meet the
requirements of the
question.
d) Alert window for validate
input.

Kesempurnaan aturcara bagi 4.0 Arahan dilaksanakan Kebanyakan arahan Perlaksanaan arahan Hanya sebahagian Tiada perlaksanaan 16
tugas: dengan cemerlang dilaksanakan dengan yang sederhana s kecil arahan arahan
a) Borang yang bersesuaian betul ecara betul dilaksanakan
untuk kemasukkan input.
b) Pengiraan gaji kasar dan
gaji bersih.
c) Hasil kiraan mestilah
memenuhi kehendak
soalan.
d) Tetingkap alert untuk
pengesahan input.
Coding Standards Codes written were Codes were Codes were Codes were not well Wrong coding
very well structured organised properly organised in organised
and creatively moderate manner
organised
1.0 4
Piawaian Kod Kod ditulis dengan Kod disusun dengan Kod disusun dengan Kod tidak disusun Pengekodan yang
sangat berstruktur baik cara sederhana dengan sempurna salah
dan disusun dengan
kreatif
Runtime  The program was  The program was  The program was  The program was The program could
executed with all executed mostly executed but not executed due not be executed at
the correct output with the correct mostly with to errors all
 AND the program output incorrect output  OR the program
was executed by  OR the program was executed
fulfilling all the was executed with the correct
requirements as with the correct output but the
stated in the output but the written coding did
question written coding did not fulfil all the
not fulfil few of question’s
the question’s requirements
requirements
1.0 4
 Aturcara ini Aturcara ini  Aturcara ini  Aturcara ini tidak Aturcara tidak
dilaksanakan dilaksanakan dengan dilaksanakan dilaksanakan dapat dilaksanakan
dengan semua kebanyakan output tetapi kebanyakan disebabkan ralat langsung
Masa Larian output yang betul yang betul output adalah  ATAU aturcara ini
 DAN aturcara ini salah dilaksanakan
dilaksanakan  ATAU aturcara ini dengan output
dengan memenuhi dilaksanakan yang betul tetapi
semua keperluan dengan output kod ditulis tidak
yang dinyatakan yang betul tetapi memenuhi
dalam soalan kodnya ditulis keperluan soalan
tanpa memenuhi
beberapa
keperluan soalan
Efficiency
Efisiensi
Requirement of
Documentation (Source Code
files & Document file.
Document file has copy of
codes, screenshots of the
program output and program
comments)
Keperluan Dokumentasi
(fail sumber & fail dokumen.
Fail dokumen mengandungi
salinan kod, imbasan skrin
output aturcara dan komen
aturcara)
TOTAL
Solution is efficient, Solution is efficient A logical solution A difficult and Wrong solution
understandable and and easy to follow that is easy to follow inefficient solution
easy to maintain but it is not the most
efficient
1.0 Penyelesaian adalah Penyelesaian adalah Penyelesaian logikal Penyelesaian yang Penyelesaian yang
berkesan, boleh berkesan dan senang yang senang diikuti sukar dan tidak salah
difahami dan senang diikuti tetapi ianya bukanlah berkesan 4
diselenggara penyelesaian paling
berkesan
Excellent Good Brief documentation Incomplete No documentation
documentation and documentation with source code file documentation & & source code file
complete with together with source without source code
source code file code file file
0.5 2
Dokumentasi yang Dokumentasi yang Dokumentasi yang Dokumentasi yang Tiada dokumentasi
cemerlang dan memuaskan bersama ringkas bersama tidak lengkap dan dan fail kod sumber
lengkap dengan fail dengan fail kod dengan fail kod tanpa fail kod sumber
kod sumber sumber sumber
7.5 30