Pentingnya mempelajari HTML

Pentingnya mempelajari HTML
Most audience in Facebook Groups;
Total liked and shared within Facebook network;

Hari ni aku nak buka 1 rahsia pada students IT / ICT yg rasa susah nak buat web-based application software / system. Mungkin jugak ada yg confuse, tak pasti language mana 1 yg sesuai, PHP ke, ASP ke, JAVA ke.

Hari ni aku nak buka 1 rahsia pada students IT / ICT yg rasa susah nak buat web-based application software / system. Mungkin jugak ada yg confuse, tak pasti language mana 1 yg sesuai, PHP ke, ASP ke, JAVA ke. Kalau tanya aku, confirm aku akan jawab PHP sebab aku banyak explore language ni berbanding yg lain2. Adakah sebab yg lain2 tu tak power? Bukan, tapi sebab aku nak maksimakan fokus pada 1 language je. Bersyukurlah jika korang mampu untuk fokuskan pada banyak language, ia adalah 1 benda yg sangat berharga buat diri korang.

Sebenarnya bila rujuk istilah ‘web-based’, kita kena faham bahawa language yg sepatutnya digunakan adalah HyperText Markup Language (HTML). Tapi dalam programming biasanya kita akan sebut ‘buat guna PHP / ASP / JAVA’ hinggakan disalah tafsir oleh sesetengah students bahawa itulah language utama yg perlu dipelajari. Nak bagi mudah faham lagi, HTML adalah language yg membolehkan user nampak user interfaces (UI) atau dalam istilah teknikal kita sebut front-end atau client-side, manakala PHP / ASP / JAVA adalah language yg membolehkan sesuatu input tu diproses, dalam istilah teknikal kita sebut back-end atau server-side. Contohnya, bila kita buat system biasanya ada login. Login tu adalah form (buat guna HTML), then akan submit ke 1 file untuk nak cek sama ada input tu betul atau tak (buat guna PHP), dan last sekali kita paparkan result pada user sama ada login dia tu success ataupon error (buat guna HTML).

Secara amnya dalam web-based system, ada 3 peringkat iaitu input, process, dan output. Process hanya ada 4 iaitu Create, Read, Update, dan Delete atau singkatannya CRUD. Contohnya create new user, read user details from database, update user data, dan delete user record. Contoh lain yg lebih senang nampak adalah status yg kita post kat Facebook. Kita boleh post new (create), baca post tu (read), edit semula post tu (update), dan delete post tu. Komen dan Share tu adalah jugak melibatkan CRUD yg berasingan, next POST nanti aku cerita. Semua process tu hanya boleh dilakukan menggunakan server-side language (PHP) manakala input dan output perlu dipaparkan menggunakan client-side language (HTML). Cara nak paparkan (layout design) tu bergantung pada kesesuaian dan kreativiti masing2. Jangan pening2 pasal JavaScript (JS) dan Cascading Style Sheet (CSS) buat masa ni, just fokus pada HTML dulu.

HTML ni bagi aku amat penting, tapi agak susah sebab aku tak pernah jumpa error message dia bila tersalah taip. Contohnya bila aku buat <div> tapi tak tutup dengan </div>, takde dipaparkan pon kesalahan tu. So solution dia aku kena gunakan editor macam Dreamweaver atau mana2 yg ada auto-completion features. Features tu akan membantu untuk mengurangkan kesilapan semasa coding. Tambahan pulak dia ada auto-indenting features, korang carilah sendiri ye apa maksudnya tu hehe. Disebabkan benda ni penting tapi susah, bawah ni aku ceritakan tentang cara aku belajar HTML.

1) Guna notepad.2) Buat folder kat desktop.3) Tengok guna Google Chrome dan Mozilla Firefox.4) Rujuk Internet.
Walaupon kat atas tadi aku mention kena gunakan Dreamweaver, tapi untuk tujuan belajar aku cadangkan guna notepad. Sebab nak bagi korang familiar dengan tags2 HTML yg ada. Macam article aku minggu2 sebelum ni, elakkan daripada ‘copy and paste’. Belajar taip setiap satu. Memang pada mulanya agak lambat tapi lama-kelamaan korang akan terbiasa. Aku dulu memang takleh nak copy and paste sebab belajar kat buku. Save file tu nanti jangan lupa letak .htm atau .html . Nak save kat mana? Kat point no. 2 bawah ni.
Dalam web-based environment, biasakan diri untuk gunakan single word pada nama folder dan file. Contohnya, lamanUtama.html . Elakkan daripada save file sebagai laman utama.html sebab web browser tak reti nak baca sempang tu. Korang mungkin akan menghadapi masalah bila guna Ajax + jQuery nanti. So korang buat folder contohnya belajarHTML kat desktop dan save file HTML dalam tu. Bila dah save tu, right click kat file tu dan cari ‘Open with Google Chrome’ atau ‘Open with Mozilla Firefox’.
Kenapa perlu guna kedua2 web browser ni? Sebab kemungkinan besar user akan nampak perbezaan UI (biasanya bila anda gunakan native CSS) antara kedua2 ni. Ini belum lagi masuk Safari, Internet Explorer, dan Microsoft Edge. Sebaik2nya cuba view / tengok menggunakan semua jenis web browser yg biasa user guna termasuklah mobile view. Kat Google Chrome aku biasa guna shortcut key CTRL + Shift + I, kat Mozilla Firefox guna CTRL + Shift + M.
w3schools.com adalah asas permulaan yg sesuai untuk belajar. Baca dan fahamkan semua item kat sub-menu tepi tu. Memang nampak banyak, tapi itulah semua HTML tags yg berguna sebagai asas untuk buat web-based system. Sehebat mana pon korang develop system tapi kalau UI hancur, memang user tak boleh nak gunakan system tu. Ada banyak lagi sumber rujukan lain sebenarnya, tapi berdasarkan isi kandungan dan paparan w3schools ni, aku cadangkan korang gunakan website ni.

Kesimpulannya kita kena faham konsep web-based environment, dan kenalpasti apa setiap komponen yg terlibat. HTML adalah asasnya dan tak memerlukan web server software macam Apache, Nginx, atau Lighttpd.

Sebelum terlupa, aku nak ucapkan Selamat Hari Malaysia pada semua. Bagi yg berkesempatan, kita jumpa kat JomLaunch (https://launch.jomweb.my/) nanti, inshaAllah.

Leave a Reply

This site uses Akismet to reduce spam. Learn how your comment data is processed.

Random posts list

Harapanku untuk pembaca

Harapanku untuk pembaca

Malam ni aku nak declare tentang sebab kenapa aku sanggup...
0 comments
Web Development Security

Web development security

Minggu ni aku nak cerita sikit pasal web development security....
0 comments
Cross platform UI compatibility

Cross platform UI compatibility

Hari ni aku start buat development sample untuk 1 web-based...
0 comments
Belajar CSS dan JS

Belajar CSS dan JS (asas)

Seperti dijanjikan minggu lepas, hari ni aku nak cerita pasal...
0 comments
Jenis-jenis clients dalam bidang ICT

Jenis2 clients dalam ICT

Salam Merdeka 2018! Minggu ni aku nak cerita pengalaman aku...
0 comments