4 Teknik Komputasional b- Lukis garis penghubung

c- Lukis nod INPUT. Masukkan butiran

1- Teknik leraian
seperti umpukan data
2- Pengecaman corak
d- Lukis garis penghubung
3- Peniskalaan
e- Lukis nod proses. Masukkan butiran
4- Algoritma
seperti ungkapan matematik
Kepentingn strategi penyelesaian mslh f- Lukis garis penghubung
g- Sekiranya perlu, lukis nod proses atau
1- Meningkatkan kemahiran berfikir nod INPUT lain2 yg diprlukan
2- Menggalakkan pembelajaran kendiri h- Sekiranya tidak,lukis nod terminal
3- Membantu perkmbangan sesuatu konsep TAMAT
4- Mewujudkan komunikasi dua hala
Ciri Penyelesaian masalah berkesan Terminal mula/tamat
a- Kos
b- Masa Aliran aktiviti
c- Sumber
Input/output
Proses Penyelesaian masalah
1- Kumpul dan analisis data Proses
2- Tentukan masalah
3- Jana idea - hapus halangan
4- Jana penyelesaian Syarat
5- Tentukan tindakan
6- Laksanakan penyelesaian Penghubung
7- Buat penilaian
8- Buat penambahbaikan Struktur Kawalan

Algoritma 1- Struktur Kawalan urutan

2- Struktur kawalan pilihan
- Siri Arahan langkah demi langkah untuk 3- Struktur kawalan ulangan
menyelesaikan satu
masalah/menyempurnakan satu tugas Struktur kawalan Pilihan
- Ciri2 – boleh dipelajari – boleh dilaksana – a- If-else
mempunyai batasan b- If-else-if
Pseudokod (kod palsu) c- Switch case
d- If
- Siri langkah demi langkah struktur
Struktur kawalan ulangan
kawalan komputer yang tidak formal
menggunakan Bahasa pertuturan a- For
manusia b- While
- Format c- Do-while
a- Tuliskan kenyataan MULA Jenis data
b- Baca INPUT
c- Proses data menggunakan ungkapan 1- Jenis Primitif
2- Jenis bukan primitive
logic atau matematik
d- Papar OUTPUT Jenis Primitif
e- Tulis kenyataan TAMAT
Tidak ada
Integer-int 4/32 bait
Carta alir perpuluhan
Nombor nyata/
- Siri langkah demi langkah struktur kawalan Double 8/64 bait
perpuluhan
computer yang tidak formal secara visual Float Perpuluhan 4/32 bait
menggunakan symbol Boolean True/false 1 bait
- Format Character-
a- Lukis nod terminal MULA Aksara null 2/8 bait
char
Jenis bukan primitif Pernyataan Aritmetik

String semua >10 bait - Boleh terdiri drpd satu atau lebih ungkapan
Sejagat dan setempat aritmetik
- Merujuk kpd operasi aritmetik (+, -, *, /)
Sejagat Setempat Ralat Sintaks
Diisytiharkan di luar Diisytiharkan di dalam 1- Lupa masukkan kenyataan import – import
fungsi fungsi
2- Pernyataan arahan salah ejaan
Boleh diakses oleh Boleh diakses oleh yg
3- Pernyataan arahan tidak ditaip bersama
mana2 fungsi mengistiharkannya shj
Ingatan kekal sehingga Ingatan hilg apabila simbol tertentu
akhir program berada diluar fungsi a- Symbol semicolon ;
Pembolehubah b- Symbol curly bracket }
c- Symbol double double quote “
- Mempunyai nilai yang berubah-ubah di d- Guna symbol yang salah
sepanjang pelaksanaan atur cara
Ralat logik
Contoh : double yuranSekolah = 400.30;
- Formula yang salah
Double yuranSekolah = - Cth: a + b + c/3
Penyataan
400.30; - Pembetulan (a + b + c)/3
Pembolehubah yuranSekolah
Nilai Ralat Masa larian
400.30
pembolehubah - Input data tidak mematuhi jenis atau
Jenis data Double struktur data yang dibenarkan
Pemalar - Terjadi semasa pelaksanaan aturcara
- Nilai yang kekal di sepanjang pelaksanaan atur - Operasi bahagi dijln ttpi sesuatu nombor
cara dibhgi dengan 0

Contoh : final double PI = 3.142; Amalan terbaik pengaturcaraan

- Teknik dibuktikan melalui satu
Penyataan Final double PI = 3.142;
pengalaman/kajian dipercayai utk mndptkn
Pemalar PI hasil yg diinginkan
Nilai pemalar 3.142 - Amalan2 yg biasa diikuti utk mnghasilkan
Jenis data double atur cara yg baik
Operator hubungan a- Inden yang konsisten – cara penulisan atur
cara yg memudahkan pembacaan
== Sama dengan b- Jenis data
!= Tidak sama dengan c- Pembolehubah yang bermakna – ejaan yg
> Lebih besar daripada ringkas & bermakna
Lebih besar daripada/ sama d- Komen - // , /* */, /** */
>=
dengan
Pengisytiharan tatasusunan
< Kurang daripada
<= Kurang/sama dengan JenisData [ ] namaTatasusunan;
Operator logikal
namaTatasusunan = new jenisData
[ saizTatasusunan ];
AND &&
Pengumpukan tatasusunan
OR
senaraiMarkah [0] = 34 ;
NOT !
senaraiMarkah [1] = 56 ;
Pernyataan umpukan
senaraiMarkah [2] = 78 ;
- Boleh terdiri daripada satu /lebih ungkapan
yg lain Kelebihan subatur cara
- Merujuk “sama dengan” atau simbol “=”
1- Mudah digunakan semula
 2- Mudah diuji, dinyahpijat, dibaiki - Bila masukkan data ia akan msuk dlm
3- Mudah menangani projek computer medan pangkalan data
4- Projek kompleks menjadi kompleks - Berpusat – satu tempat – berdsrkan
5- Bolehkan tugasan dibahagikan kpd ahli pembangunan pangkalan data
kumpulan berbeza - Teragih – google – apa yg dicari mengikut
hos-hos tempat
SDLC – Software development life cycle
Pangkalan data – Jadual dalam sistem
- Model air terjun
- Model Rad Model pangkalan data
- Model lelaran
Hierarki – Struktur berperingkat
- Model lingkaran
- Model tangkas Rangkaian/jaringan – hubungan banyak kepada
- Model hybrid banyak
Pembangunan aplikasi Hubungan – Jadual dan jadual menggunakan kunci
asing
1- Analisis masalah
2- Reka bentuk penyelesaian Berorientasikan objek – objek utk hubungkan
3- Laksana penyelesaian jadual dgn jadual
4- Uji dan nyah ralat
5- Dokumentasi
Pangkalan data
- Data - fakta mengenai suatu benda, perkara,
orang, entiti, kejadian/yg seumpamanya
- Maklumat – data yg telah diproses dan
disusun atur ked lm bentuk yg bermkna
Pangkalan data hubungan
Integriti data – kesempurnaan, ketepatan, kesahan
data yg disimpan dlm pangkalan data
ERD – Entiti
a- Integriti entiti – kunci primer mestilah unik
& xmenerima nilai null
b- Integriti rujukan – kunci asing mestilah Perkara Simbol
mengndungi nilai yang wujud
c- Integriti domain – hanya nilai atau jenis
data tertentu dibnrkan pd stu medan/atribut Entiti Nama entiti

Kepentingan
Associative
- Tidak ada dua rekod yang sama Entity
- Data yg dirujuk pd jadual adalah wujud
- Data yang sah sahaja dimasukkan kedlm Atribut
pngkalan data
Kelewahan data – data yang tidak tepat dan Atribut kunci
tercicir, data berulang primer

- Elakkan pertambahan saiz pada pangkalan

Hubungan
data
- Elakkan data yg tidak konsisten
- Elakkan data menjadi tidak efisien *Satu ke satu (1:1)
*sesiapa blh masuk sistem sesuka hati Kekardinalan *Satu ke banyak (1:M)
*Banyak ke banyak (M:N)
Ketekalan data – keseragaman data mempengaruhi ERD – Entity Relationship Diagram
kebolehpercayaan data
 Grafik

PelajarID<KP
Nama Alamat NoTelefon
>

Kunci hubungan
- Utk kekalkan integriti data hubungan
- (Nama atribut khusus dalam jadual)
Kunci primer
- Atribut dengan nilai unik
- Ciri – mempunyai nilai yg unik (tiada
pengulangan) – tidak boleh dibiarkan kosong
(null)
1- Pstikan tiada pengulangan rekod dlm satu jadual
2- Supaya data yg disimpan adalah kekal
3- Mudahkan proses carian dan capaian ke atas
rekod
Kunci Komposit
- Atribut yg mengandungi nilai kunci primer drpd
jadual sasaran
Kunci Asing
Kebergantungan Separa
Fungsi separa – berlaku apabila satu/ lebih atribut
bergntung pada keseluruhan kunci primer
Fungsi separa
- Hanya berlaku apabila wujudnya kunci
komposit
- Berlaku apabila satu / lebih atribut
bergantung pd salh stu atribut dlm kunci
komposit
Fungsi transitif – berlaku apabila satu / lebih
atribut bergantung pd slh stu atribut dlm kunci
komposit
Penormalan
- Proses menyusun lajur-lajur/ baris-baris
pada beberapa peringkat bg mengelak
kelewahan data dan anomali
- Jenis Anomali – INSERT anomaly,
DELETE anomaly, UPDATE anomaly

- Atribut yg menghubungkan kunci primer dlm

jadual yg lain
- Digunakan untuk menghubungkan dua atau
lebih jadual

Skema hubungan
1- Teks
2- Grafik
Teks
Doktor (DoktorID<KP>, Nama, Kepakaran,
PesakitID<KA>)
 Paparan dan reka bentuk skrin
1- Memainkan peranan yg pnting dlm
membangunkan sesebuah program atau
peisian
2- Reka bentuk mudah,lengkap dan mesra
pengguna perlu dititikberatkan
Proses reka bentuk interaksi
- Mengenal pasti keperluan interaksi
- Membangunkan reka bentuk alternative
- Membina prototaip interaksi
- Membuat penilaian reka bentuk interaksi
produk
Penilaian kuantitatif
- Penilaian yg dilakukan utk mngukur
keberkesanan sesuatu produk secara
statistic
Skala likert
- Bentuk soalselidik utk melihat prsetujuan
pengguna trhdp produk interaksi
Skala Guttman
- Bentuk soalselidik untuk mndptkan data yg
tegas, jelas dan konsisten
Kesan positif
1- Inovasi teknologi rangkaian
- Stand alone
- Wujud hubungan antara computer dengan
Prinsip reka bentuk computer yg lain (ada internet)
- Rangkaian kwsn temptn (LAN), rangkaian
- Konsistensi kawsn luar (WAN)
- Boleh dipelajari 2- Inovasi teknologi storan
- Kebolehan membuat pemerhatian - Hard disk kpd cakera liut (floppy disk),
- Kebolehan menjangka cakera optik (optical disk), pemacu pena
- Maklum balas (pendrive)
- Wujud (cloud storage) boleh simpan di
Interaksi antara manusia & computer
cloud
- Mendpt permintaan dlm pasaran 3- Inovasi sistem pengoperasian
- Meningkatkan produktiviti - Sentiasa ada talian internet
- Mengurangkan kos selepas jualan - Ada (operating system-os) utk (server)
- Mengurangkan kos pembangunan mengawal rangkaian
- Mengembangkan aktiviti & menambahkan - Alatan mudah alih (mobile devices), cth :
pengalaman manusia Android, ios, Blackberry
- Pengkomputeran social 4- Perkembangan sistem dalam talian
- Wujud sistem e-perbankan, e-dagang,
Kaedah menilai produk
sistem hiburan elektronik, e-pembelajaran
- Temu bual
Kesan Negatif
- Pemerhatian
- Soal selidik - Pornografi
- Perbincangan ahli kumpulan - Penipuan
- Refleksi - Serangan virus
 - Penggodaman - Salah satu bentuk penyulitan yg paling
- Ugutan mudah
- Pelanggaran - Formula : En(X) = (X + n) mod 26
7 etika dlm pengkomputeran Penggodaman
1- Tanggungjawab - Hacker
2- Keyakinan - Penjenayah siber yg bertindk memintas
3- Profesional komunikasi rangkaian bg memperoleh data
4- Kejujuran penting pengguna utk dieksploitasikan
5- Patuh undang2
Cetak rompak
6- Komunikasi
7- Hormat - Perbuatan menyalin semula, bahan bercetak
atau bahan rakaman digital tanpa kebenaran
Langkah keselamatan data
utk mengaut keuntungan
- Penyulitan emel – dihantar melalui emel – - Implikasi
sensitive atau peribadi – cth : Rmail, a- Menjejaskan kestabilan ekonomi
SafeGmail negara
- Dua Pengesahan – Lapisan pengesahan b- Pengeluaran produk asli berkurg
tambahan – langkah pengesahan utk c- Hilangnya keyakinan pelabur kpd
mengakses data menjadi lebih sukar – negara
semakin banyak lapisan pengesahan, d- Wujud pengangguran dlm industri
semakin sukar data utk diceroboh kreatif dan perisian
- Kata laluan – Kata laluan yg baik dibina
drpd gabungan huruf , symbol dan nombor
iaitu antara 8 hingga 12 aksara
Kriptografi
- Proses penyulitan data bagi melindungi
privasi data pengguna
Penyulitan
- Proses penterjemahan data kpd bentuk kod
rahsia yg tidk difahami
- Merupakan satu cara yg berkesan untuk
melindungi data
- Teks biasa (plaintext) : data yg belum
melalui proses penyulitan
- Teks sifer (Ciphertext) : data yg telah
melalui proses penyulitan
Seni bina computer
1- Unit pemprosesan pusat
 Terdiri dr 3 komponen
 Unit aritmetik logic (ALU)
 Unit kawalan
 Daftar (Register)
- PC (Program Counter)
- ACC (Accumulator)
- MAR (Memory Address Register)
- MDR (Memory Data Register)
- IR (Instruction Register)
2- Unit ingatan (RAM)
Caesar Cipher
 Memegang data secara sementara
- Julius Caesar menciptanya beroperasi
  Bersifat meruap : hilg kandungannya jika - Bas dalaman – Menghubungkan
bekalan elektrik terputus komponen2 dalaman pemproses &
3- Peranti input dan output membenarkan komponen trsebut bertukar2
 Input – papan kekunci , skrin maklumat
 Output – pencetak, monitor, pembesar
suara
Kitaran mesin
- Capai (Fetch) – memberi isyarat supaya
pemproses mencpi data & arahan dr ingtn
utama & disimpn dlm dftr smntara
mnunggu utk diproses
- Nyahkod (Decode) – menyahkod atau
menterjemah arhn bg mnntukan jenis
operasi yg akn dilksanakan oleh ALU
- Laksana (Execute) – pemproses
- Bas luaran – Menghubungkan pemproses
melaksnakn operasi aritmetik & logic trhdp
dgn komponen luaran sprit ingatan dan
data sprti yg dinyatakn olh arahn
peranti input & output

Digunakan untuk memindahkan

 Antara pemproses, ingatan
Bas Data dan peranti input/output
 Antara daftar,unit kawln &
ALU
Digunakan bagi
 Membawa alamat lokasi yg
menempatkan data dan
Bas Alamat
arahan dlm ingatan utama
 Mengandungi alamat peranti
input/output
Bas yg mengandungi isyarat
Bas kawalan yg digunakan bagi
Kawalan mengawal operasi keseluruhan
sistem
Sistem jam (clock system)

Seni bina von neuman - Satu peranti cip dlm pemproses yg menjana
denyutan elektronik pd kadar yg tetap bg
- 3 komponen utama – CPU, Ingatan dan menyeragamkan semua operasi computer
peranti input dan output - Hertz – unit yg digunakan utk menghitung
kadar kelajuan jam dlm pemproses
- 1 Hertz = 1 denyutan / kitaran per saat
- Cth : 160 MHz = 160,000,000
denyutan/kiraan saat
- Lebih laju kelajuan hertz, lebih laju
komputer tersebut

Sistem bas
 - Cobol
- Fotran
Bahasa aras rendah

 ADD (tambah)
 MULL/MPY (darab)
 SUB (tolak)
Bahasa Himpunan  DIV (bahagi)
(Assembler language)  OR,NOT,AND (Fungsi logic
dlm Boolean)
 LOAD (capai data dr ingtn)
 STORE (simpan hsil ke ingtn)
 Bahasa yg sukar difhmi dn
dimanipulasi
Bahasa mesin  Aturcara dlm Bahasa mesin
Pemprosesan dibina drpd jujukan digit
Linear perduaan (0,1)
Tugas penterjemah
- Dikenali sebagai pemprosesan bersiri
- Pemproses (CPU) memproses data & - Menukarkan arahan yg difahami manusia
arahan scara berjujukan kpd bentuk yg difahami oleh mesin
- Mengikut kitaran mesin : Capai (IF) – - Bahasa aras tinggi, Bahasa aras rendah
Nyahkod (ID) – Laksana (EX) kpd Bahasa mesin
- Hanya sesuai untuk melaksanakan arhn yg Pengkompil
ringkas
- Compiler
Semasa - Menukarkan seluruh kod sumber atur cara
- Dikenali sebagai pemprosesan tidak ke kod mesin sebelum dilaksanakan
linear/pemprosesan selari Pentafsir
- Mampu melksanakan beberapa arahan
secara serentak dengan menggunakan - Interpreter
Teknik talian paip (pipelining) - Menukar kod sumber atur cara mengikut
- Digunakan utk mempertingkatkan prestasi baris demi baris dengan satu baris dlm satu
pemproses semasa masa
- Teknik ini membenarkan pemprosesan
arahan2 secara bertindih (overlapping)
Perbezaan

Pemprosesan Linear Pemprosesan semasa

Kurang efektif dlm pemproses
data dan arahan yg pnjng dn
kompleks
Hanya boleh melakukan satu
tugas pada satu masa
Efektif dlm pemprosesan data
& arahan yg pnjng dn
kompleks
Arahan2 dibhgikan kpd
beberapa bahgian & dilksnkan
secara berasingan.
Melaksanakan pelbagai tugas
dlm satu masa

Proses lebih perlahan Proses lebih cepat

Kategori bhs pengaturcaraan

Bahasa aras tinggi

- Java
Bhs berasaskan objek & - Phyton
visual - Visual basic
- Php Get logic
- Pascal - Merupakan blok binaan asas litar bersepadu
Bahasa berstruktur
- C - Mempunyai 2 input dan 1 output
 - Logic perduaan menggunakan 2 keadaan
- 0 = tiada arus @ arus rendah
- 1 = ada arus @ arus tinggi

Litar bersepadu
- Komponen elektronik (transistor, diod,
kapasitor dan perintang)
- Semakin banyak pin pada litar bersepadu,
semakin banyak fungsinya
- Cip litar bersepadu terbahagi kepada beberapa
jenis berdasarkan bilangan get di dalmnya

Jadual kebenaran
- Digunakan utk mmbuktikan teorem algebra
Boolean
- Input boleh diwakilkan dlm bntuk pemboleh
ubah (A, B, C … X, Y, Z)

Bilgn pemboleh ubh Jumlah kebarangkalian

input input
1 21 = 2
2 22 = 4
3 23 = 8
4 24 = 16

Komponen ERD
- Entiti – objek/ konsep yg unik –
diwakilkan dlm bentuk segi 4 tepat
- Atribut – sifat yg memerihalkn sesuatu set
entity – diwakilkan dlm bentuk bujur –
setiap entity hnya ada stu kunci primer shj
- Hubungan – digunakan utk menyatukan
stu / lebih entity yg trdpt dlm ERD –
hubungn dilabelkn dgn kata kerja
Jenis atribut
1- Atribut mudah
2- Atribut nilai gandaan
3- Atribut terbitan
4- Atribut kunci
5- Atribut komposit
 Model hubungan data
- Menyimpan data dalam bentuk jadual
hubungan
- Dibina selepas melakar ERD
- Gambaran tentg struktur jadual dlm sistem
pngkalan data yg ingin dibngunkn
Kunci hubungan
Kunci primer
- Atribut unik yg dipilih utk mengenal psti
rekod dlm hubungan
- Kunci primer digariskan
Kunci asing

Kekardinalan - Kunci primer sesuatu hubungan yg muncul

dlm hubungan lain dlm pangkalan data yg
- Kekardinalan minimum sama
a- Minimum data suatu entity berkait - Kunci ditandakan dgn garis putus-putus
dengan entity lain
b- Cth – seorang GURU mengajar Ciri-ciri model hubungan data
sekurang-kurangnya satu
1- Setiap hubungan mempunyai nama yg
MATAPELAJARAN
berbeza
c- Maka kekardinalan minimum ialah satu
2- Setiap data mempunyai 1 nilai shj
kerana seorang guru mesti mengajar
3- Setiap atribut mempunyai nama berbeza
sekurg-kurgnya satu matapelajaran
4- Susunan atribut tidak mempunyai
d- Tidak ada guru yg tidak akan mengajar
kpntingan
- Kekardinalan maksimum
5- Susunan rekod tidak mempunyai kpntingn
a- Maksimum data suatu entity berkait
6- Setiap rekod berbeza
dengan entity lain
b- Cth – satu MATAPELAJARAN boleh Pemetaan ERD kpd skema hubungan
diajra oleh seorg GURU atau lebih.
Seorang guru boleh mengajar  Entiti ditukarkan menjadi nama hubungan
maksimum lebih dari satu mata  Atribut akan menjadi nama medan
pelajran  Jenis hubungan dlm ERD akn menentukan
c- Maka kekardinalan maksimum adalah pemilihan kunci asing
bnyak

Langkah melakar ERD

1- Senaraikan entity dan atribut
2- Kenal pasti kunci primer SQL
3- Kenal pasti hubungan antara entity :
meminjam - Structured Query Language / Bahasa
4- Lakarkan ERD dan kenal pasti Pertanyaan Berstruktur : Digunakn utk
kekardinalan
 mencpi & mengemaskini data dlm
pangkalan data
Bahasa arahan SQL

 untuk mencipta &

Bahasa takrifan data mengubah struktur pangkalan
(Data Definition data
Language - DDL)  cth : CREATE, ALTER,
DROP

 utk memanipulasi data dlm

Bahasa pengolahan dara
jadual
(Data Manipulation
 cth : SELECT, INSERT,
Language - DML)
UPDATE, DELETE
Bahasa Kawalan Data  utk mengawal capaian data
(Data Control Language pangkalan data
- DCL)  cth : GRANT, REVOKE
HTML
Jenis2 data
- Hypertext markup language : Bahasa yg
markup standard yg digunakan oleh pereka
web bg mereka bentuk laman web
- Elemen teks, audio, video serta grafik
disusun agr mudah dibaca & difhmi olh
pelawat laman web
- Utk mnrgkan struktur bg setiap laman web,
kod HTML / elemen HTML
- Terdiri drpd 2 tag berpsgn : start tag dan
close tag
- 2 bhgian atribut : Atribut nama (href) dan
atribut nilai (.com)
CSS
- Cascading Style Sheet : salah satu Bahasa
pengaturcaraan yg merupakan tambahan
(extension) kpd HTML
- Membenarkan peubahan kpd gaya sesuatu
halaman web dn menergkn persmbahan bg
sesuatu dokumen HTML
Javascript
- Menyediakan keupayaan utk memproses
sesuatu tugas berdsrkan permohonan yg
diterima drpd klien
- Kod Javasript akan ditulis besama2 kod
HTML
- Kod Javascript ditulis diantara tag <script>
dengan </script>
- 2 cara Kod Javasript ditulis : Explicit
embedding dan Implicit embedding
Pelanggan (CLIENT) / Pelayan (SERVER)
- Pelanggan biasanya ialah pelayar
(browser) yg digunakan olh pengguna bg
melayari web
- Pelayan blh berada di mana-mana jua di
seluruh dunia bertindak utk memproses
 permintaan / mnghntar laman web yg  Sesuai digunakan utk bilgn unsur yg kecil
diminta oleh klien  Sesuai utk tujuan pembelajaran
 Kurg sesuai utk aplikasi sbnr
Bahasa Penskripan
Isihan pilih (selection sort)
- Penskripan klien
a- Bekerja di bahagian hadapan
pembangnan web Banding satu unsur
Tukar kedudukan
b- Dilaksanakn oleh pelayar web dgn unsur terkecil
jika tururtan salah
/terbesar drpd unsur
- Penskripan pelayan lain dlm senrai
a- Program yg dilksanakan di pihk
pelayan web iaitu menterjemahkan kod
aturcara utk memaparkan maklumat Proses perbandingan
suapaya difahmi olh pengguna
b- Bekerja di bahagian belakang
Turutan menurun Turutan menaik
pembangunan web
c- Dilaksanakan olh pelayan web Banding unsur dirujuk Banding unsur dirujuk
sama ada lebih besar drpd sama ada lebih kecil drpd
Kelebihan Bahasa penskripan unsur terkecil unsur terbesar
- Laman menjadi interaktif Kelebihan isihan pilih
- Pembangunan web berkeupayaan
 Kurg sesuai utk aplikasi sebenar
menentukan reka bentuk dn ciri2 web
 Sesuai utk tujuan pembelajaran
- Meningkatkan kebolehgunaan web bagi
 Mudah dibina dn difhmi
pelayar yg menyokong pelbagai jenis
 Sesuai digunakan utk bilgn unsur yg kecil
Bahasa penskripan klien
- Pelaksanaan tugas yg pantas tanpa Carian perduaan (BINARY SEARCH)
penglibtn computer pelayan
Cari lokasi di Dapatkan unsur di
Prose pengisihan tengah senarai tgh2 unsur

- Isihan buih (Bubble sort)

- Isihan pilih (Selection sort)
Teruskan proses
- Pengisihan boleh berlaku secara menaik dn pencarian drpd
Bandingkan dgn
unsur yg dicari
menurun sub-senarai

Isihan buih (Bubble sort)

Proses perbandingan
- Satu algoritma mudah dlm pengisihan suatu
senarai yg prosesnya dilksanakan satu Bandingkan unsur ditengh sama ada
Sama dengan
persatu scra berturutan dgn sama dengan unsur yang dicari
membandingkan unsur2 bersblhn & akan Bandingkan unsur ditengh sama ada
menukar kedudukan (swap) sekiranya Lebih kecil
lebih kecil unsur yang dicari
berlaku turutan yg slh
Bandingkan unsur ditengh sama ada
- Proses isihan buih Lebih besar
lebih besar unsur yang dicari
Mendapatkan nilai maksimum
Banding satu
Tukar kedudukan - Nilai maksimum merujuk nilai trbesr dlm
persatu unsur
bersebelahan jika kedudukan suatu senarai nilai
slh - Trdpt hanya stu proses perbandingan :
bandingkan nilai yg dirujuk dlm senarai
Proses perbndingan
sama ada lebih besar drpd nilai maksimum
Turutan menurun Turutan menaik Beri nilai awal Bandingkan nilai dalam senarai
maksimum dgn nilai awal maksimum
Banding unsur pertama Banding unsur pertama
sama ada lebih kecil drpd sama ada lebih besar drpd
unsur kedua unsur kedua
Kelebihan isihan buih Dapat nilai maksimum
terkini
 Mudah dibina dan difahami
 Keempat2 fungsi ini sgt mudh
Kelebihan
digunakan
Mendapatkan nilai minimum
Tidak sesuai digunakan jika mempunyai
- Nilai minimum merujuk nilai trkecil dlm queue yg besar / panjang / banyak atau
suatu senarai nilai Kekangan
nilai2 prlu digerakkan kedudukannya
- Trdpt hanya stu proses perbandingan : setiap kli fungsi shift ( ) digunakan
bandingkan nilai yg dirujuk dlm senarai Standard library
sama ada lebih kecil drpd nilai minimum
- Perlu ditakrif dlm spesifikasi Bahasa
Beri nilai awal minimum Bandingkan nilai dalam senarai pengaturcaraan
dgn nilai awal minimum - Merupakan sebhgian drpd arahn dlm atur
cara termsuk definisi bg algoritma yg biasa
digunakan, struktur data dan mekanisme bg
Dapat nilai minimum terkini input dn output

Mendapatkan nilai mean Kelebihan

- Mean : merjuk purata nilai dlm suatu  Tak perlu tahu cara pelaksanaanya
senarai nilai  Mengurangkan masa pembangunan atur
cara
Jumlah nilai2 dlm Dapatkan bilgn nilai yg  Boleh digunakan berulang kali
senarai nilai terdpt dlm senarai
Math.js

Formula : Mean =
- Standard library yg kerap digunakan dalam
Jumlah/bilangan Javascript
- Terdiri drpd fungsi build-in dan pemalar
Mendapatkan nilai count dgn pelbagai jenis data sprti nmbor
- Standard library dlm Javascript berada
- Count : mengira bilgn nilai yg terdpt dlm pakej “.js” dan perlu disimpn dhulu
suatu nilai - Seterusnya math.js akan dimuatkan dn
Guna satu perwakilan
seterusnya blh digunakan dlm atur cara
Tambah pembilang dengan 1 bg
sbgi pembilg & berikan
setiap nilai yg dicpi / dirujuk
nilai awalan 1
(pembilang = pembilang =+ 1)

Memaparkan nilai akhir

pembilang,iaitu nilai count
Pengumpukan nilai dlm struktur giliran
- Queue : merupakan struktur data linear –
pengumpukan nilai dlm ruang ingtn secara
teratur
- Queue bolh mmbuang nilai lama – nilai yg
terawal dimasukkan
Date.js
- Kaedah ini dipnggil FIFO – First-In, First-
Out
Operasi Queue

Enqueue Memasukkan data kedalam queue

Dequeue Membuang data lama dalam queue Subatur cara

Fungsi - Satu atur cara Javascript mempunyai byk
- Push ( ) brisan arahan yg dihimpunkan dlm stu blok
- Shift ( ) kod yg dikenali sebagai modul
- Unshift ( ) - Barisan arahan tersebut blh dipechkan
- Pop ( ) mengikut tugas msing2 & dihimpunkan
 dlm modul yg berasingan yg dipanggil
subatur cara
Perbezaan antara prosedur dn fungsi
Cara memanggil/menggunakan
- Subatur cara akan menggunakan subatur
cara lain bertujuan supaya kod penyataan-
pernyataan dlm subatur cara lain akn
dilaksanakan
Subatur cara (Pemanggil) Subatur cara
(Dipanggil)
Parameter
- Parameter atau argument membolehkan
prosedur dn fungsi menghantar nilai
(pemanggil) dan diterima olh prosedur dan
fungsi yg dipanggil
- Parameter rasmi (formal parameter)
digunakan utk merujuk parameter bg
subatur cara yg dipanggil
- Parameter sebnr (actual parameter)
digunakan utk merujuk pemboleh ubah
didlm subatur cara pemanggil
Memulangkan nilai
- Fungsi (function) akan mengembalikan
kawalan kpd pemanggil
- Sesetengah Fungsi (function) juga
mengembalikan nilai
Tatasusunan
- Penggunaan tatasusunan adalah utk
menyimpan satu senarai nilai dalam stu
pemboleh ubah
Tag HTML <button>
- Tag HTML <button> bolh digunakan utk
laman web interaktif, iaitu butang akan
terhasil dalam dokumen HTML (laman
web)
Tag HTML <button> (memanggil prosedur/fungsi)
- Setelah butang diklik, suatu
procedure/function akan dipanggil utk
melaksanakan sesuatu tugasan/arahan
Tag HTML <a>…</a> (hyperlink)
- Digunakan supaya pengguna dpt
berinteraksi dgn laman web
Keperluan laman web
- Kewujudan laman web utk mnjdi perantara
dlm mnntukn bagaimana pengguna blh
berinteraksi dgn sesuatu sistem dlm internet
Konsep pelayan
- Brasaskan pengagihan fungsi antara klien
dan pelayan
- Klien : apa2 mesin atau proses yg
memohon servis yg spesifik drpd pelayan
- Pelayan : mesin atau proses yg
memberikan servis kpd klien
- Dalam persekitaran internet dan rangkaian,
pelayar web (web browser) akan bertindak
sbgi klien manakala pelayan web (web
server) pula adalah pelayan
Bahasa penskripan pelayan
- Fungsinya ialah mengakses data drpd
pangkalan data
- Antara Bahasa penskripan pelayan : ASP,
Javascript, PHP, Phyton, Perl
Penghasilan dan pnyimpanan data dlm fail teks
 - Cth : apabila pengguna memasukkan nama
serta kata laluan, maklumat tersebut blh
disimpan dlm fail teks dlm computer
pelayan
- Fungsi “fopen” akan digunakan sbgi arahan
yg akan dilksanakan dlm pelayan
Operasi asas fail teks
1- Menyunting
2- Membaca data
3- Menulis data
4- Mencipta data Melaksanakn pertanyaan (QUERY)

Mencapai data dari pangkalan data

Pengemaskinian data

Melakukan pengesahihan (VALIDATION)

- Pada input drpd pengguna adalh untuk
mengelakkan terjadinya ralat semasa proses
Prinsip reka bentuk laman web
penyimpanan data ke dalam pangkalan data
 - Mereka bentuk laman web blh diibaratkan
sprit proses merancang, membina dan
mengubahsuai
- Beberapa prinsip atau elemen reka bentuk
lama web prlu diberi perhatian agar laman
web yg dibina tidk kelihtn pelik atau
memberikan pengalaman yg tidk
menyenangkan kpd pengguna
Jenis persekitaran web yg dibina
- Factor teknikal mengenai persekitaran
laman web yg perlu diambil kira
 Kesesuaian penggunaan pelbagai jenis
pelayar
 Kelajuan capaian internet
 Keperluan perisian sokongan utk paparan
 Kepelbagaian sistem computer dn peranti
mudh alih yg digunakan olh pengguna
 Kepelbagaian saiz paparan monitor yg
digunkan
Penekanan maklumat dalam web
- Merujuk kpd maklumat / kandungan yg
ingin diberikn perhtian dlm laman web
trsebut
Perbezaan elemen dlm web
Typography
- Merujuk kpd penyusunan teks yg akan
dipaprkan dlm laman web
- Pemilihan jenis font juga penting
Warna & grafik
- Mampu menonjolkan imej dan identity
sesebuah laman web
- Penggunaan warna yg bijak mmpu menarik
perhtian serta meningkatkan kebolehbacaan
Navigasi
- Merujuk kpd struktur laman web yg akan
memudhkan seseorg pengguna melayarinya
- Navigasi web yg bagus seharusnya
memberikan petunjuk kpd pelawat laman
web tntg kedudukan /lokasi semasa
pengguna
Keseimbangan visual
- Elemen visual sprit garisan ,imej , teks,
bentuk dn warna dlm lmn web
- Pereka laman web perlu peka tentang
pengguna sasaran laman web tersebut
Reka bentuk berasaskan pengguna
- Pereka laman web harus mengenali
pengguna sasaran dan perkara yg diingini
olh pengguna apabila mereka melayari
laman web
Penstrukturan kandungan
 - Kunci kejayaan penghasilan suatu laman
web bergantung kpd cara laman web itu
berfungsi
Reka bentuk antara muka
Penstrukturan kandungan/maklumat
- Setiap reka bentuk yg bakal dihsilkan prlu
berasaskan pengguna/pengalaman
pengguna semasa melayari laman web
- Penglibatan pengguna semasa proses
pengumpulan maklumat sgt penting
Membentuk inventori maklumat
 Senaraikan semua maklumat yg bakal
dimasukkan kedlm laman web
 Senaraikan semua perkara yg blh dilkukan
olh pengguna
Pengelasan maklumat
 Mengelaskan senarai maklumat kpd
beberapa kategori
 Pereka bentuk maklumat blh meliht
persamaan maklumat yg ada bagi
mewujudkn kemungkinan2 kategori yg
perlu ada
Penstrukturan halaman
- Menekankan cara setiap halaman dalam
laman web dihubungkan
Reka bentuk navigasi
- Kebiasaannya pereka bentuk akan
menggunakan gambar rajah tapak (site
diagram) sbgi alat utk menyampaikan
struktur laman web kpd klien & sebgi
panduan sepnjng proses pembangunan
laman web
- Gambar rajah tapak : diagram yg
mnggunakan symbol kotak bagi mewkili
setiap laman web dgn garis / anakn panah
bg mewakli hubungan antara laman web
 Setelah halaman dalam laman web
distrukturkan, fasa seterusnya adlh utk
mnntukan bagaimana pengguna laman web
dpt mencapai mklumt tersbut
 Reka bntuk antara muka : menntukan
bagaimana struktur laman web secara
logikalnya digmbrkan termsuk teknik
navigasi yg memndu kpd pergerkn
pengguna dlm lmn web
 Pereka bentuk antara muka biasanya akn
menggunakan diagram atau carta alir bg
menggambarkan reka bentuknya
 Salah satu rajah yg digunakan dlm proses
reka bentuk antara muka ialah wireframe
 Tujuan rangka wayar untuk mnyusun
elemen2 yg akn dimsukkn dlm lmn web bg
mnepati konsep lmn web trsebut
 Navigasi web merujuk kpd proses objek2
dlm lamn web yg trdiri drpd teks, rajah,
audio, video dihubungkan antara stu sme
lain dgn menggunakan pautan hiperteks
atau hypermedia
 Konsep navigasi web memberikan
pengalaman kpd pelawat laman web utk
mengemudi laman web trsebut mengikut
kecekapan msing2
 Navigasi web yg bgus sehrusnya
memberikan ptunjuk kpd pelawat laman
 web tntg kedudukan atau lokasi semsa
pengguna
 Fungsi : membantu pengguna / pelawat
mengetahui kedudukan semasa mereka dn
memndu pelawat tntg pilihan yg disediakan
utk mereka menerokai laman web trsbut
Hypertext markup language (HTML)
 Setiap laman web ialah fail teks yg ditulis
menggunakan Hypertext markup language
(HTML)
 Markup language : Bahasa yg
menghuraikan kandungan & struktur
dokumen
-Bagi menulis dokumen,HTML editor
diperlukan
Elemen dan -Slh stu HTML editor ialah test editor
atribut cth notepad
-utk mnrgkan struktur bg setiap lmn
web
-Elemen yg digunakan bg menakrifkan
Elemen
“tajuk” dalm laman web
heading
-Terdpt 6 peringkat heading
-Digunakan utk memprkan pengenlan
Elemen header kandungan bg suatu laman web atau
pautan navigasi
Elemen -Digunakan bg menyusun teks dalam
paraghraph bentuk perenggan
Elemen line -Untuk memaparkan teks dibaris
break baharu, elemen <br> digunakan
-Bg memparkn grafik dlm laman web,
elemen <img> digunakan
-Elemen <img> ialah empty element,
tidak memerlukan close tag
-Atribut src digunakan bersama <img>
Elemen image tag utk menentukan URL atau alamat
imej tersebut diambil
-Atribut width dan height juga blh
digunakan utk menetapkn saiz paparan
grafik
-untuk memaparkan dokumen HTML
lain dlm dokumen HTML semasa yg
dipaparkan
Elemen frame
-Atribut src, height dan width
digunakan bg menentukan saiz paparan
pada iframe
Cascading Style Sheet (CSS)
 Salah satu Bahasa pengaturcaraan
tambahan (extension) bg HTML
 Membenarkan perubahan kpd gaya sesuatu
laman web dn menerangkan persembahan
bg sesuatu dokumen HTML
Helaian gaya Tag gaya akan ditulis & disimpn di
luar (External dlm stu fail & fail itu msti
Style Sheet) mempunyai extension “CSS”
Helaian gaya
dalaman Tag gaya blh ditulis sama ada di
(Internal Style dlm kwsn “<head>” / “<body>”
Sheet)
Gaya dalam
Tag gaya akan ditulis pada
barisan
bahgian/elemen tag
(Inline Style)
-Warna text (Colour)
Gaya pada
-Jajaran teks (Text alignment)
text
-Bayang text (Text shadow)
-Keluarga font (Font family)
Gaya pada
-Saiz fon (Font size)
fon (Font)
-Stail fon (Font style)
-Warna latar belakang
Gaya pada
-Imej/gambar sebagai latar
backgroud
belakang
Gaya pada
tables
Gaya pada
border
Gaya pada position
- Static
a- Kedudukan lalai dlm setiap elemen
HTML yg trdpt dlm dokumen
b- Kedudukan dokumen akan mengikut
turutan ataun susunan
c- Kedudukan elemen tidk akan berubh
atau tidk akan mengkut ketetapan
- Fixed
a- Kedudukan elemen HTML bergantung
pada browser viewpoint iaitu pndgn
pengguna kpd pelayar web
 b- Kedudukan elemen akn ttp Membolehkan pentadbir
dikedudukan yg sma wlupun pengguna sistem mndftrkan nama
scroll pd halaman web pengguna yg blh
- Relative mencapai data dlm
a- Kedudukan elemen diubah diubah pangkalan data
bergantung atau berkait trhdp
kedudukan normalnya atau kedudukan
awalnya
- Absolute
a- Kedudukan element tidk akan mengikut
turutan atau susunan pd laman web lg
dn akan ditempatkan mengikut
kedudukan yg dikehendaki
Bahasa penskripan klien untk bina laman web
pengguna
 Fitur pengesahan data
 Fitur butang pilihan
- Butang radio
- Butang checkbox
 Fitur kotak popup
- Kotak Alert
- Kotak Confirm

Laman web interaktif

- Suatu laman web yg mmpunyai kndungan
yg dinamik & sesuai atas sesuatu carian/
permintaan drpd pengguna
- Data yg disimpan dlm pangkalan data dgn
menggunakan MySQL blh dicpi dn
dikemas kini melalui laman web
- Tujuan : sambungan kpd pangkalan data
perlu dilkukn trlebih dhulu sblum data dapt
dicpi & dikemskini

Pengguna dan pentadbir sistem

- Sesetgh laman web mempunyai antara
muka yg berbeza, utk pengguna biasa &
pentadbir sistem

Laman web utk

lama
pentadbir