Trend untuk tahun 2011?

Posted by mkhairul

Apakah trend untuk tahun 2011 ni didalam pembangunan perisian? Yang pasti adalah Javascript, tetapi terdapat banyak lagi yang bakal menjadi trend pada tahun ini, ada yang mengatakan NoSQL, Node.js, dan pelbagai lagi. Nak kejar trend ni memang leceh, tak terkejar bang oi, letih den. Jadi aku try kejar yang utama, Javascript dan pembangunan pada Android, yang lain cuma nak asahkan balik dan perbaiki, terutamanya Python. Lama betul tak develope betul-betul pakai Python, tahun lepas pakai pun sikit sangat.

Lek ah, pelan-pelan kayuh. Hehehe.

Oh, lagi satu, tahun ni nak tulis dengan gaya yang tak formal.

Rujukan

Refresh parent popup window

Posted by mkhairul

Sori la saya tak tau macam mana nak translate title post ni jadi bahasa melayu tanpa mengalami sakit kepala. Buat masa sekarang ni, banyak kod yang diubah daripada pengaturcara sebelum ni. Banyak betul la popup. Kalau banyak popup ni, selalunya org yang banyak buat sistem gomen (atau “enterprise”?). Mengundang bahana betul banyak popup ni, tab pada Chrome dah lebih 20. Takut satgi kejung terus, Hanging by a Moment.

So, flow dia gini, nak edit maklumat pengguna? Click pada nama pengguna, kemudian popup pun muncullah dengan secara mengejut bersama dengan form dan field-field nya. Edit.. edit, pastu UPDATE!
Kemudian, popup pun tutup dan window browser asal yang panggil popup tu pun refresh! Ye la, kalau tak refresh macam mana nak tengok maklumat yang dah dikemaskinikan.

Jadi bagaimana? Simple je, saya tulis ni pun untuk reference pada diri saya untuk masa akan datang.

window.opener.location.reload(false);

Ref: METHOD: Location::reload

Z-Index bug di Microsoft Internet Explorer

Posted by mkhairul

Dah lama betul aku tak buat bahagian UI ni. Kali ni, bug pada dropdown menu. Tak perasan pulak dengan bug (Z-Index bug) ni. Tapi bukan bug ni sahaja, ada yang lain, macam :hover behaviour tak trigger. So aku guna jQuery untuk bug ni seperti berikut

if($.browser.msie)
{
	$('.menu li ul').css('position', 'absolute');
	$('.menu li ul').css('left', '0');
	$('.menu li').css('z-index', '2000');
	$('.menu li ul').css('z-index', '1000');
	$('.menu li').hover(
		function(){
			$(this).find('ul').css('display', 'block');
		},
		function(){
			$(this).find('ul').css('display', 'none');
		}
	)
}

Semoga dapat memperingatkan diri bila terjumpa balik bug ni.

“Lightning Talk”

Posted by mkhairul

Fuh, lama betul tak post.

Baru-baru ni, diadakan sesi “Lightning Talk”, di mana semua kakitangan teknikal diminta membuat satu sesi pembentangan tentang apa sahaja topik yang menarik dan bermanfaat selama 5 minit. Ingin ditekankan, “bermanfaat”, jadi jangan la dok cerita pasal kucing suka berdengkur (kucing saya agak suka berdengkur) ataupun kucing suka kentut dengan selambanya. Takde manfaat pada yang hadir.

Pelbagai topik diperbincangkan dan tahniah diucapkan pada yang terlibat. Moga sesi yang akan datang akan dapat memperbaiki lagi persembahan saya dan rakan-rakan yang lain.

Blur la pulak nak present ape! Huhu!

Apa yang saya bentangkan? Topik yang agak ringkas dan agak umum, kerana ini pilot project dan juga dihadiri oleh mereka daripada management saya bercerita mengenai berkongsi ilmu (“Sharing Knowledge”). Saya takkan ceritakan pasal “Sharing Knowledge” pada post ini kerana ianya agak luas dengan sendirinya, tetapi saya ingin beritahu, tentang manfaat sesi “Lightning Talk” ini pada diri saya.

  • Membuatkan saya berfikir tentang apa yang saya akan persembahkan pada masa akan datang
  • Secara tak langsung memupuk sedikit semangat berinovasi
  • Sebelum ni dok baca je pasal cara nak buat presentation. Sekarang ni boleh la dipraktikkan sedikit
  • Macam-macam lagi..

Mengubahsuai javascript yang telah di minify

Posted by mkhairul

Minify atau lebih dikenali sebagai ‘minification‘ adalah proses membuang segala character yang tak diperlukan tanpa mengubah fungsi skrip tersebut.

Kalau nak tau javascript tu telah di ‘pack‘ (atau minify), bila buka sumber kod dengan menggunakan text editor, dia keluar macam ni…

Ni contoh regex selector untuk jQuery.

jQuery.expr[':'].regex=function(elem,index,match){var matchParams=match[3].split(','),validLabels=/^(data|css):/,attr={method:matchParams[0].match(validLabels)?matchParams[0].split(':')[0]:'attr',property:matchParams.shift().replace(validLabels,'')},regexFlags='ig',regex=new RegExp(matchParams.join('').replace(/^\s+|\s+$/g,''),regexFlags);return regex.test(jQuery(elem)[attr.method](attr.property));}

Susah nak edit kalau dah pack (bukan mustahil, tapi memang susah dan tak disyorkan demi kesihatan jangka masa panjang)

Kita kena mencantikkan kembali kod tersebut (ataupun unpack) dengan menggunakan javascript beautifier.

Bila dah rupa macam ni, senang la kita mengubahsuai.

Cara terbaik untuk menghalang SQL Injection

Posted by mkhairul

Terdapat soalan yang menanyakan, apakah cara terbaik untuk menghalang SQL Injection yang diambil daripada Stack Overflow.

Cara terbaik untuk menghalangnya adalah dengan menggunakan prepared statement. Response tersebut juga menerangkan dengan lebih lanjut mengapa.

CamelCase

Posted by mkhairul

Apa itu CamelCase?
Di wikipedia dia tulis, gabungan perkataan dimana setiap element (perkataan) dicantum tanpa menggunakan ruang kosong (space) dan setiap huruf di permulaan perkataan adalah besar (capital letter).

Contohnya jika anda mempunyai fungsi yang dipanggil..

get_items_in_list

Dalam CamelCase, ia ditulis sebegini,

GetItemsInList

Saya lebih menggemari pemisahan perkataan dengan menggunakan underscore ( _ ), dalam penamaan fungsi (function). Senang nak baca, walaupun agak panjang, tapi senang nak baca tu yang penting.

Tapi yang penting, kena konsisten. Jangan sekejap CamelCase sekejap , sekejap benda lain. Kena ada guideline untuk cara penulisan. Kalau setiap programmer ada style masing-masing (ada yang takdak style, ikut sedap hati dan mood.  Sekejap camelcase, sekejap hungarian notation, etc) haru-biru la gamaknya.  Dan kalau kena maintain sistem, programmer sebelum ni dah pakai CamelCase secara konsisten terpaksa la ikut.

Oleh kerana saya telah menulis pelbagai kod sebagai projek sampingan (pet project) yang tidak dapat disiapkan (tiba-tiba banyak pulak kerja) dan dibiarkan terbengkalai selama 3-6 bulan (ada yang sampai bertahun) dan kemudiannya saya sambung balik, ianya secara tidak langsung melatih saya untuk menulis kod dengan lebih teliti supaya  pada masa akan datang saya dapat memahami kod yang ditulis dan sambung menulis kod tersebut.

Ok, setakat tu sahaja untuk hari ni. Nak kena sambung baca kod orang (dan baiki indentation, *sigh*, masih ramai tak reti guna IDE dengan betul).

Selamat Programming!

Banding antara skema pangkalan data (compare database schema) dalam MSSQL

Posted by mkhairul

Sebelum saya terlupa nak blog pasal benda ni, baik saya post terus.

Memang amat jarang sekali saya menggunakan Microsoft SQL Server (MSSQL). Jadi, bila sampai bab nak bandingkan skema pangkalan data, memang blur sikit.

Bila tanya pakcik G (G untuk Google) kita, memang bertimbun la product sana sini, macam-macam Red-Gate la, dbForge la, dan sebagainya. Ada yang kata Visual Studio Team Edition ada fungsi untuk compare database schema, yang tu saya memang tak tau kerana saya bukan pengguna tegar Visual Studio.

Apa yang saya jumpa agak ringkas dan mudah, percuma dan open source, Open DBDiff.

Memang menepati kehendak dan keperluan saya pada masa ini. Jadi saya harap sedikit sebanyak post ni dapat membantu. Selamat programming!

Clean Code Cheatsheet

Posted by mkhairul

Bagi sesiapa yang mengikut perkembangan Agile Software Development, nama yang sepatutnya tidak asing lagi adalah Robert C. Martin, atau lebih dikenali sebagai Unclebob.

Beliau banyak mengetengahkan mengenai kod yang bersih, untuk maklumat lanjut, bolehlah dapatkan bukuClean Code: A Handbook of Agile Software Craftsmanship.

Ianya telah dirumuskan sebagai rujukan dalam bentuk cheatsheet. Senang la sikit nak rujuk!

Apakah itu cheatsheet?

Posted by mkhairul

Masa peperiksaan atau ujian dibangku sekolah ataupun university, pernahkah anda menggunakan nota kecil yang terselindung sebagai rujukan?

Ha! Itulah cheatsheet. Sekeping kertas yang mempunyai nota ringkas mengenai sesuatu topik. Dalam pembangunan perisian ni, terlalu banyak perkara yang perlu dirujuk (HTML, CSS, Javascript, OOP, Domain Driven Design, dan sebagainya), kalau nak rujuk setiap satu topic pada buku, memang jenuh la nak membelek buku-buku tu.

Sekarang ni, dah banyak cheatsheet yang terdapat di internet, taip je apa kat pakcik Google, mesti ada punya. SVN? Git? Mercurial? CMS kegermaran seperti Drupal? Joomla? Semua ada cheatsheet.

Antara website yang saya selalu pergi untuk mendapatkan cheatsheet adalah Addedbytes (dulu dikenali sebagai ilovejackdaniels.com tapi lawyer Jack Daniels dok hantar cease and desist letter kat owner suruh tukar nama).
Antara Cheatsheet yang ada kat situ:

  • HTML
  • CSS
  • PHP
  • Python
  • Subversion
  • mod_rewrite
  • Regular Expressions
  • Ruby on Rails
  • MySQL

Tak cukup? Nak lagi? Haaa ni dia, RefCardz (Free Cheatsheets for developers)
Print dan letak la kat cubicle anda supaya senang untuk dirujuk.

Selamat programming!