INI BLOG KITA

Friday 10 March 2017

Mewarnai Text dan Background

Perlu diketahui bahawa penentuan warna pada HTML boleh dengan nama warna (dalam bahasa Inggeris) dan boleh pula dengan kod warna. Kod warna ditulis dalam format Heksa #rrggbb. Berikut ini adalah 16 nama warna beserta kodnya dalam format Heksa (harap diingat bahawa tulisan 0 adalah angka sifar, bukan huruf O).

black #000000 blue #0000FF olive #808000

white #FFFFFF fuchsia #FF00FF green #008000

red #FF0000 gray #808080 teal #008080

yellow #FFFF00 silver #C0C0C0 navy #000080

lime #00FF00 maroon #800000 purple #800080

aqua #00FFFF

<HTML>
<BODY BGCOLOR="#FFFF00" TEXT="#FF0000">
Tulisan ini akan tampak dalam browser.
</BODY>
</HTML>

Tambahkanlah tag-tag berikut ini:

<HTML>
<HEAD>
<TITLE></TITLE>
</HEAD>
<BODY BGCOLOR="yellow" TEXT="red">
Tulisan ini akan tampak dalam browser.
</BODY>
</HTML>

Thursday 9 March 2017

Tutorial Background HTML

BACKGROUND

Dengan menggunakan latarbelakang (background) maka website kita akan nampak semakin menarik. Untuk memasukkan latar belakang kita boleh menggunakan pilihan warna dan grafik (gambar).

Sekarang kita mulakan dengan menggunakan pilihan warna:-

<html>
<head></head>
<body bgcolor="#FF99FF">
Hai.. sekarang saya tengah belajar untul menggunakan background warna
Kalau anda kurang suka dengan warnanya... ganti dengan yang baru warnanya
</body>
</html>

Untuk nilai dari sifat-sifat bgcolor diatas anda boleh menggunakan kod hexadecimal, Nilai RGB atau Nama dari warna tersebut. Cuba anda ganti nilai dari sifat-sifat bgcolor dengan contoh dibawah ini:

Hasilnya akan sama. Untuk mengetahui kod Hexadecimal dan Nilai RGB dari suatu warna.

Seterusnya membuat latar belakang dengan grafik atau gambar. Pertama anda harus punya gambar yang ber-extention .gif atau .jpg yang akan dijadikan background, masukkan (copy) gambar tersebut ke folder tempat fail dokumen HTML anda berada, dan harus tahu nama dan perluasan (extention) dari file tersebut, misalnya nama failnya adalah: background.jpg.

<html>
<head></head>
<body background="background.jpg">
<h1 color="red">Selamat datang di Websiteku</h1><hr color="#ff0000" size="2">
Hai.. Saat ini saya sedang belajar membuat latar belakang dengan gambar, 
Biar bagaimanapun anda diwajibkan harus menyukainya...
</body>
</html>

Kemudian latar belakang boleh juga menggunakan gambar yang ada di website orang lain, tapi dengan catatan anda harus sedang bersambung ke internet (online) dan harus tahu alamat url dari gambar tersebut di internet. Untuk mengetahui alamat suatu gambar klik kanan gambar tersebut kemudian pilih properties dan lihat image location, copy alamat tersebut dan ganti kepada contoh dibawah ini bermula dari http:

<html>
<head></head>
<body background="http://i185.photobucket.com/albums/x272/akomara/HeaderLagi.jpg">
Hai.. Saat ini saya sedang belajar membuat latarbelakang dengan menggunakan gambar dari website orang lain! hua ha..ha..ha..
Mudah-mudahan yang punya website ngamuk sekalian deh...siapa takut!!
</body>
</html>

Maksud HTML?

HTML (Hyper Text Markup Language) merupakan bahasa standard pengaturcaraan untuk membuat suatu laman web yang terdiri daripada kod-kod ringkas tertentu, dimana dengan kod-kod tersebut akan memerintahkan Web Browser untuk memaparkan laman web yang terdiri daripada format paparan seperti teks, grafik, animasi link ataupun audio dan video.

Sedangkan Web Browser adalah sebuah program yang boleh menterjemahkan kod perintah dari dokumen HTML tersebut sehingga dapat kita melihat dan membaca. Contohnya dari Web Browser, adalah Internet Explorer, Google Chrome, Mozilla Firefox dan lain-lain.

Selain itu, HTML juga mempunyai fail perluasan (extention) "htm" atau "html". Untuk menuliskan kod-kod HTML, anda boleh menggunakan Teks Editor misalnya, Notepad, Word Pad, Microsoft Word dan lain-lain. Di bawah ini adalah contoh suatu dokumen HTML yang sangat sederhana. Start Notepad, sila mula dengan menaip (copy / paste) teks di bawah ini:

<html>

<head>

<title>Nama Website</title>

</head>

<body>

Ini adalah saya

Website pertama

</body>

</html>

Simpan fail dengan pilihan "save as" dengan nama "latihan.htm". Kemudian Start Internet Explorer. Pilih menu File, Open dan tujukan ke C: \ My Documents \ Nama Website.htm "klik Ok, maka laman website pertama anda akan dipaparkan. * Lakukan perkara yang sama untuk contoh-contoh selanjutnya.

Perintah didalam dokumen HTML terdiri dari pelbagai struktur penyusun seperti Tag, elemen, sifat-sifat dan nilai. Tag terdiri dari lambang-lambang khusus seperti: "<", ">" dan "/", untuk menuliskannya di dalam dokumen HTML bermula dengan tag pembuka "<...>" dan diakhiri dengan tag penutup "". Kemudian di dalam tag tersebut terdapat teks seperti contoh diatas: html, head, title, body dan yang lain ini disebut dengan Elemen HTML.

Elemen HTML kemudian ada yang mempunyai sifat-sifat dan nilai tertentu, seperti contoh untuk membuat warna latar belakang (background): <body bgcolort = "0000ff">, body merupakan elemen, bgcolor adalah sifat-sifat dan 0000ff merupakan nilai (value).

Elemen HTML mempunyai tiga perkara penting iaitu: tag pembuka, isi, dan tag penutup. Sebagai contoh: Elemen html mempunyai tag pembuka "; lt & html>" dan tag penutup "; lt & / html>" dan yang berada di antaranya merupakan isi dari elemen html. Untuk menuliskan Elemen HTML boleh menggunakan huruf besar dan huruf kecil. Contoh: <HTML>, <HTML>, <HTML>, <html>, semuanya adalah sama.

Sunday 5 March 2017

Tutorial GIT: Instalasi, Penggunaan dan Upload Projek ke GitHub

GIT merupakan sebuah Version Control System (VCS) yang digunakan dalam pasukan pembangunan perisian untuk bekerja bersama-sama. Version Control maksudnya sistem Git akan mencatat setiap perubahan yang terjadi pada source code kita sehingga membolehkan untuk mengambil kembali source code lama jika suatu saat kita ingin kembali ke versi berapa pun dari aplikasi yang pernah kita tulis.

Image By http://mattbanks.me/wordpress-deployments-with-git/

Contohnya seperti ini. Kita sedang membangunkan sebuah aplikasi web menggunakan PHP. Ketika kita sudah selesai melakukan coding maka kita menyimpannya ke dalam repository Git atau istilahnya commit. Pada langkah ini kita sudah membuat versi source code kita katakanlah versi 1. Esoknya kita melakukan perubahan pada versi 1 kita tadi dan seperti sebelumnya kita juga melakukan commit ke dalam repository, maka versi 2 akan tercipta. Lantas apakah versi 1 akan hilang atau tidak. Setelah kita bekerja beberapa kali memperbaiki atau menambah ciri-ciri pada source code kita sampai 20 versi pun kita akan selalu bisa untuk kembali ke versi lama yang keberapapun begitu juga sebaliknya.

Commit yang tadi kita lakukan hanya akan disimpan pada repository tempatan yang ada pada komputer kita. Lantas bagaimana agar boleh diakses bersama-sama oleh ahli pasukan? maka kita memerlukan sebuah repository central. Website yang menyediakan perkhidmatan repository central untuk Git adalah Github.com. Pada tulisan ini saya akan cuba untuk menjelaskan dari langkah awal pemasangan Git, penggunaan asas hingga mengupload projek kita ke Github.com.

Ini adalah step-step mengunakan git :-

Buat terlebih dahulu akaun di Github.com, caranya sesenang mendaftar Facebook.
Download software Git di http://git-scm.com/downloads, sesuaikan dengan sistem operasi yang digunakan. Saya menggunakan Windows, kemudian install.
Masuk ke direktori tempat projek PHP berada, misalnya “C:/XAMPP/htdocs/ProjekPHP“. Source code yang ada pada projek PHP ini yang akan kita masukkan ke repository Git dan kita akan upload ke GitHub.
Untuk pengguna Windows klik kanan didalam folder projekPHP dan pilih Git Bash. Berikut adalah gambarnya:-

Git Bash

Lakukan installation dengan menekan perintah berikut pada Git Bash tadi :-

git init

Langkah seterusnya, memasukkan file-file source code serta folder pada projek kedalam staging area iaitu suatu keadaan dimana file serta folder source code dimasukkan ke dalam repository namun dalam keadaan temporary, belum disimpan. Untuk melakukannya gunakan perintah berikut:-

git add *

Perintah tersebut akan memasukkan seluruh file dan folder yang ada pada projekPHP. Jika ingin memasukkan satu persatu cukup tuliskan nama file lengkap dengan sambungan atau nama folder jika hanya ingin menambakan folder.

git add index.php

git add nama_folder

Setelah itu kita siap untuk menyimpan source code kita kedalam repository. Taipkan perintah berikut:-

git commit -m "Commit Pertama, Versi 1"

Perintah diatas akan menyimpan source code kita sekaligus memberikan catatan supaya mudah kita ingat

Sekarang login ke Github.com dan buatlah sebuah repository baru dengan klik pada butang yang terletak pada kanan atas. Perhatikan gambar berikut:-

Buat repository dengan nama sendiri. Contohnya:- myPHP.

Setelah itu klik butang "Create repository"

Sekarang kita boleh mengakses remote repository dengan url https://github.com/projekphp/myphp.git misalnya
Kembali ke Git Bash. Tambah remote repository yang baru sahaja kita buat supaya projek kita boleh diupload. Berikut perintahnya: -

git remote add origin https://github.com/projekphp/myphp.git

Seterusnya kita download terlebih dahulu fail readme yang ada secara default apabila kita membuat repository di github dengan menaip perintah :-

git pull origin master

Maka file readme.md akan berada pada folder projek kita

Terakhir adalah mengupload ke Github dengan perintah:-

git push origin master

masukkan username serta password jika diminta

Item pada github maka file ktia sudah berada disana

Cukup mudah bukan :D
Semoga bermanfaat dan jangan lupa fork me!

Thursday 2 March 2017

Manual Pengguna Google Forms

MANUAL PENGGUNA GOOGLE FORMS

Google Forms menyediakan cara cepat untuk membuat sebuah kaji selidik dalam talian, dan maklum balas daripada responden dikumpulkan dalam sebuah spreadsheet secara online.
Memuat kajian anda dan menjemput Responden melalui e-mel.
Responden boleh menjawab soalan anda dari hampir semua jenis pelayar web, termasuk dengan mobile pelayar di telefon pintar dan tablet.
Anda boleh melihat setiap tindak balas dalam satu baris dari spreadsheet, dengan setiap soalan yang dipaparkan dalam ruang.

Berikut adalah langkah- langkah menggunakan Google Forms:

Langkah 1:

Buka Google.com dan tekan simbol “Google Apps”.

Langkah 1a:

Tekan di aplikasi “Drive

Langkah 2:

Langkah 3:

Tekan ”Create” dan pilih “Form”

* Nota: Pengisian ke dalam borang anda akan diisikan ke dalam Google

Spreadsheet. Setelah form dibuat, anda boleh mengakses borang melalui hasil

Spreadsheet.

Langkah 4:

Beri label, identiti atau namakan form anda dan kemudian pilih "Theme".

Langkah 4a:

Tekan “OK” jika sudah selesai.

*Nota: Anda akan mempunyai pilihan untuk memasukkan gambar atau video ke dalam form anda nanti.

Langkah 5:

Sekarang anda mempunyai pilihan untuk memasukkan keterangan form anda dan mula membuat soalan.

Langkah 6:

Anda mempunyai pilihan 9 jenis pertanyaan untuk dipilih.

Catatan: Tips pertanyaan yang anda pilih adalah bergantung pada data yang ingin anda kumpulkan dari form anda.

Deskripsi Pertanyaan :

Text : Responden memberikan jawapan pendek·
Paragraph Text : Responden memberikan jawapan yang lebih panjang ·
Multiple Choice : Responden memilih satu pilihan dari sekian opsyen yang anda sediakan
Checkboxes: Responden memilih opsyen sebanyak yang mereka inginkan.
Choose
from a list: Self-Explanatory, Responden memilih satu opsyen dari dropdown menu.
Scale: Responden memberikan ranking pada sesuatu melalui skala dalam bentuk angka ( Misal 1 -5 )
Grid: Responden memilih point dari Grid 2-dimensi.
Date: Responden menggunakan penanda kalendar untuk memilih tarikh.
Time: Responden memilih waktu dan durasi waktu yang tertentu.

Ø Langkah 7:

Memasukkan item

Deskripsi Item : Layout

Section Header: Membahagikan form anda menjadi sesi-sesi untuk membuatnya menjadi lebih mudah dibaca dan diisi.
Page Break: Ia boleh digunakan untuk memisahkan survey yang anda buat supaya lebih mudah untuk diisi.
Image: Untuk memasukkan gambar ke dalam form anda. Teks yang dimasukkan akan muncul di atas gambar jika mouse diarahkan.
Video: Memasukkan video clip ke dalam form anda. Video dari YouTube juga boleh digunakan untuk ciri-ciri ini.

Langkah 8:

Ciri- ciri Tambahan

Panah Ungu = View live form:

Digunakan sebagai preview form anda seperti bagaimana responden melihatnya.

Panah Hijau = Menunjukkan progress bar di bawah form.
Panah Biru = Continue to next page:

Dengan klik continue to next page anda boleh mendesign pertanyaan hingga jawapan tertentu untuk membawa responden ke halaman berbeza di dalam form.

Panah Oren = Advanced settings:

Dengan sesi ini anda memiliki opsyen untuk membuat pilihan rawak. Ini berkemungkinan peserta melihat respon dalam urutan yang rawak.

Panah Coklat = Required questions:

Butang ini untuk memvuat pertanyaan yang diperlukan sebelum form boleh di hantar.

Ø Sila melihat gambar di atas untuk melihat keterangan dari opsyen yang anda miliki di dalam ciri-ciri tambahan.

- Langkah 9:
 Langkah 9a:

Pandangan ini akan muncul setelah anda klik "Send Form", simple masukkan link form dan hantar ke Responden kajian atau Responden anda!

Langkah 10 : Hasil Review
*Nota: Hasil Survey akan muncul dan dikategorikan di dalam Spreadsheet seperti di gambar di bawah ini
Langkah 10a: Rangkuman Hasil Dari Responden kajian atau Responden. Arahkan tetikus ke tab "Form" dan klik "Show summary of responses". Ini akan membuka pandangan yang memunculkan grafik dan analisis data yang masuk dari Responden kajian atau Responden.

Penggunaan Lain Untuk Google Forms

o Google Forms juga boleh diintegrasikan (Embed), yang itu bererti anda boleh menggunakan Google Forms di website anda. Pengunjung web boleh memasukkan nama dan maklumat dan data itu akan terus masuk ke spreadsheet yang telah di setting sebelumnya.

o Atau boleh juga menggunakan Google Forms untuk membuat kaji selidik setelah anda membuat sebuah sesi Hangout atau Event di Google+. Kerana Google Forms juga boleh dikongsi di Google+. Jadi anda boleh membuat kajian dengan komuniti atau lingkaran akaun Google+ anda. Google Forms membuat survey online boleh dilakukan dengan simple, mudah dan sederhana.