Tampilkan postingan dengan label HTML. Tampilkan semua postingan
Tampilkan postingan dengan label HTML. Tampilkan semua postingan

Kode dasar HTML



HTML merupakan singkatan dari HyperText Markup Language adalah script untuk menyusun dokumen-dokumen Web. Dokumen HTML disimpan dalam format teks reguler dan mengandung tag-tag yang memerintahkan web browser untuk mengeksekusi perintah-perintah yang dispesifikasikan.

Struktur dasar dokumen HTML adalah sebagai berikut:
<html>
<head>
<title>
Disini Judul Dokumen HTML</title>
</head>
<body>
       
Disini penulisan informasi Web
</body>
</html>
Dari struktur dasar HTML di atas dapat dijelaskan sebagai berikut:

a. Tag
Adalah teks khusus (markup) berupa dua karakter "<" dan ">",  sebagai contoh <body> adalah tag dengan nama body.
Secara umum tag ditulis secara berpasangan, yang terdiri atas tag pembuka dan tag penutup (ditambahkan karakter "/" setelah karakter "<"), sebagai contoh <body> ini adalah tag pembuka isi dokumen HTML, dan </body> ini adalah tag penutup isi dokumen HTML.

b. Element
Element terdiri atas tiga bagian, yaitu tag pembuka, isi, dan tag penutup. Sebagai contoh untuk menampilkan judul dokumen HTML pada web browser digunakan element title, dimana:

<title>
ini adalah tag pembuka judul dokumen HTML
Disini Judul Dokumen HTML ini adalah isi judul dokumen HTML
</title> ini adalah tag penutup judul dokumen HTML

Tag-tag yang ditulis secara berpasangan pada suatu element HTML,  tidak boleh saling tumpang tindih dengan pasangan tag-tag lainnya.
Contoh penulisan tag-tag yang benar
<p>
    <b>
       
................
    </b>
</p>

Contoh penulisan tag-tag yang salah
<p>
    <b>
       
................
    </p>
</b>

c. Attribute
Attribute mendefinisikan property dari suatu element HTML, yang terdiri atas nama dan nilai. Penulisannya adalah sebagai berikut:
<TAG>
   nama-attr="nilai-attr"
   nama-attr="nilai-attr"
   .................
>
   .................

</TAG>
Secara umum nilai attribute harus berada dalam tanda petik satu atau dua. Sebagai contoh, untuk membuat warna teks menjadi kuning dan latarbelakang halaman web menjadi hitam, penulisannya adalah <body bgcolor="black" text="yellow">
d. Element HTML
Menyatakan pada browser bahwa dokumen Web yang digunakan adalah HTML.

Sintaks:
<html>
..........
</html>


e. Element HEAD
Merupakan kepala dari dokumen HTML. Tag <head> dan tag </head> terletak di antara tag <html> dan tag </html>.

Sintaks:
<head>
...........
</head>


f. Element TITLE
Merupakan judul dari dokumen HTML yang ditampilkan pada judul jendela browser. Tag <title> dan tag </title> terletak di antara tag <head> dan tag </head>.

Sintaks:
<title>
.........
</title>


g. Element BODY
Element ini untuk menampilkan isi dokumen HTML. Tag <body> dan tag </body> terletak di bawah tag <head> dan tag </head>.
Element BODY mempunyai attribute-attribute yang menspesifikasikan khususnya warna dan latarbelakang dokumen yang akan ditampilkan pada browser.

Sintaks:
<body text="v" bgcolor="w" background="uri" link="x" alink="y" vlink="z">
..............
</body>


Attribute text memberikan warna pada teks, bgcolor memberikan warna pada latarbelakang dokumen HTML, background memberikan latarbelakang dokumen HTML dalam bentuk gambar, link memberikan nilai warna untuk link, alink memberikan warna untuk link yang sedang aktif, vlink memberikan warna untuk link yang telah dikunjungi.
Jika attribute bgcolor dan background keduanya dispesifikasikan maka attribute background yang akan digunakan, akan tetapi jika nilai attribute background (gambar) tidak ditemukan pada dokumen HTML maka attribute bgcolor yang akan digunakan.

Tutorial Membuat Form dalam Netbeans


1. Sebelumnya  kita install dulu netbeans5.5 atau versi diatasnya dengan jdk 1.5.0_7 atau
versi diatasnya.
2. lalu kalau sudah terinstall, pilih File->New Project.
Disini kita akan bikin project dan otomatis akan terbentuk Main.java
3. klo sudah kita pilih File ->New File ada banyak tipe java disitu,kita pilih 
      Java GUI Form ->  sesuai anak panah. 
4. lalu isi nama Classnya dan pilih packagenya sesuai anak panah.
5. kalau sudah pilih Finish.kita akan mulai membuat Form seperti pada tampilan di      
bawah ini
       :: Tutorial Membuat Tabel ::
1. Pertama kita membuat Table dengan Mendrag JTable pada Palette. Kita beri nama dgn
klik kanan pilih “change variable name”,kita beri nama misal : “table”
2. Pilih Table klik kanan Properties,seperti gambar dibawah ini :
-Pilih
Inspector lalu
-pilih
JScrollpane1
- pilih JTable. 
Utk
Pengeditan
Tablenya 3.kita buat kolom dengan klik Model lalu isi nama kolom – kolomnya seperti gambar
dibawah ini sesuai anak panah  :4. Kalau sudah klik OK tinggal kita setting di source code nya.
Pada baris paling akhir di sourcenya  sebelum } paling akhir kita bikin objek untuk
TableModel langsung ketik coding dibawah ini :
private javax.swing.table.DefaultTableModel tblModel = getDefaultTabelModel();

5. lalu kita buat fungsi getDefaultTabelModel(); dan Tabel  untuk pengaturan table
nya seperti pada gambar dibawah ini, juga diketik secara manual:

6. Setelah itu kita setting di konstruktornya,untuk pengaturan lebar kolomnya :
Tambahin source code berikut :

     // kita modelkan tablenya sesuai dgn objek tblModel
tabel.setModel(tblModel); 

     // kita kirim data ke fungsi Tabel :nama tabelnya,dan lebar tiap kolom2nya
Tabel(tabel,new int[]{120,180,120,120});
7. Cara menginput data kedalam ke JTable :
Pertama kali kita deklarasikan dulu variable array satu dimensi diluar fungsi supaya
dikenal disemua fungsi yang lain.
String data[] = new String [4];
Didalam fungsi  private void cmdsimpanactionperformed..
Nama Kolom di Tabel
4 adalah jumlah kolom dalam tabelTambahkan coding seperti dibawah ini :
8. Cara Menampilkan Data dari Jtable kedalam Form di Netbeans:
Nanti kita akan mengklik 2x baris dalam JTable yang berisi data yang akan ditampilkan
kedalam Form di Netbeans, caranya :
Pilih Inspector kemudian ikuti petunjuk dibawah ini :
Setelah itu akan muncul Fungsi :
private void tabelMouseClicked(java.awt.event.MouseEvent evt) {
 {
Kita modifikasi Fungsi tersebut sehingga menjadi seperti dibawah ini : Dengan coding diatas maka secara otomatis jika kita klik 2x baris dalam JTable maka
data dalam baris terpilih akan muncul dalam Form kemudian bisa kita edit dan delete.
9. Cara Mengedit Data Dalam JTable
Setelah data muncul dalam Form untuk mengeditnya ikuti coding dibawah ini :
10. Cara Menghapus Data Dalam JTable 
Ketikan Coding Dibawah Ini :
private void cmdhapusActionPerformed(java.awt.event.ActionEvent evt) {
tblModel.removeRow(row);
 {Belajar SQL(Structured Query Language)
1 Untuk belajar SQL bisa menggunakan MysQL Server di Dos untuk menjalankan Querynya atau
dengan editor dari suatu MySQL  yaitu MySQL Front,SQL Yog, dll.
2 SQL adalah standarisasi
SQL adalah sebuah ANSI (American National Standards Institute) yaitu standar bahasa komputer
yang digunakan untuk mengakses dan memanipulasi sebuah database. Perintah SQL ini di
gunakan untuk menemukan dan merubah data di dalam database. SQL bekerja dengan program
database seperti MS Access, DB2, Informix, MS SQL Server, Oracle, Sybase, dll.
Dalam banyak hal, terdapat perbedaan di dalam setiap versi dari Bahasa SQL ini, tetapi
perbedaan tersebut tetap harus mengacu kepada standar ANSI. Yaitu perbedaan tersebut tidak
menghilangkan perintah standar yang sudah ada sebelumnya seperti SELECT, UPDATE, DELETE,
INSERT, WHERE, and others.
3 SQL sebagai tabel basis data
Sebuah database selalu terdiri dari satu atau  lebih tabel. Sebuah tabel diidentifikasi dengan
sebuah nama seperti “Customers” atau “Orders”. Tabel terdiri dari record-record (rows) dengan
data didalamnya.
Sebagai contoh dapat kita lihat tabel “Peserta” dibawah ini :

nm_dpn nm_blkg Alamat Kota
Parto Listio JL.Bungur 10 Ulujami
Sandi Puspita Jl.Merdeka IX Pesanggrahan
Mira Dahlia Jl.Sabar 19 Pesanggrahan
Pada contoh di atas diperlihatkan satu buah table yang berisi tiga buah record dimana satu
record memiliki empat buah kolom yang nantinya kita sebut sebagai Field yaitu : nm_dpn,
nm_blkg, alamat dan kota.
4 Komponen Sistem Basis Data
Ada beberapa komponen yang berurutan dalam Database :
1. Database
2. Tabel
3. Field (kolom)
4. Rows (Baris)
5. Data
Pembahasan SQL terdiri dari 2 bagian yaitu DML dan DDL.akan lebih dijelaskan dibawah ini 5 Data Manipulation Language (DML)
SQL (Structured Query Language) adalah sebuah syntax untuk melakukan eksekusi terhadap
sebuah query. Tetapi bahasa SQL harus selalu ada syntak untuk melakukan update, insert, and
delete dari pada sebuah records atau lebih.
Query dan perintah update ini bersamaan muncul dari Data Manipulation Language (DML) yang
merupakan bagian dari SQL diantaranya :
− SELECT  : mengelompokkan data terpilih dari sebuah tabel 
− UPDATE  : ubah/perbaiki dari sebuah tabel basis data
− DELETE  : hapus data dari sebuah tabel basis data
− INSERT INTO : input data baru ke dalam sebuah tabel basis data
6 Data Definition Language (DDL)
Data Definition Language (DDL) juga merupakan bagian dari  SQL yang berfungsi untuk untuk
membuat dan menghapur tabel dari sebuah database. Kita juga dapat mendefinisikan indexes
(keys) untuk mencirikan dan membuat hubungan antar tabel.
Yang terpenting dari perintah DDL didalam SQL adalah:
− CREATE TABLE  : perintah untuk membuat tabel
− ALTER TABLE  : perintah untuk mengubah tabel
− DROP TABLE  : perintah untuk menghapus tabel
− CREATE INDEX  : perintah untuk membuat index suatu tabel
− DROP INDEX  : perintah untuk menghapus index dari suatu tabel
7 Perintah CREATE  dalam SQL
CREATE digunakan untuk membuat suatu database/table dalam SQL.
> Syntax Create Database :
CREATE DATABASE nama_database;
Contoh :
Kita akan membuat database dalam SQL dengan nama system_akademik, dapat digunakan
perintah CREATE seperti berikut :
CREATE DATABASE system_akademik;
> Syntax Create Tabel :
CREATE TABLE nama_tabel(
  Nama_field1 tipe(panjang),
  Nama_field2 tipe(panjang),
 . 
 . 
  Nama_fieldn tipe(panjang),
  Primary Key(field_key)
 ;(
Contoh :
Sebelum membuat table kita harus memilih database yang akan kita pakai caranya ketik :
USE SYSTEM_AKADEMIK;
Setelah kita melakukan perintah diatas maka ada pesan :
DATABASE Changed
Kita akan membuat database dalam SQL dengan nama system_akademik, dapat digunakan
perintah CREATE seperti berikut : CREATE TABLE MAHASISWA(
  Nim varchar(10),
  Nama varchar(60),
  Jenkel varchar(20),
  Jurusan varchar(30),
  PRIMARY KEY(NIM)
 ;(
8 Perintah INSERT INTO
Perintah INSERT INTO digunakan untuk menambahkan data ke baris baru dalam suatu tabel.
Syntax :
INSERT INTO table_name VALUES (value1, value2, ..... )
Kita juga dapat menspesifikasikan kolom yang akan dimasukkan data terbaru
INSERT INTO table_name (column1, column2, ……)
VALUES (value1, value2, ………)
Contoh Input data ke baris baru
Tabel Peserta
nim nama Jenkel Jurusan 
0411500349 Pradana Laki-Laki Tekhnik Informatika
Perintah SQL :
INSERT INTO mahasiswa VALUES (‘0411500349’, ’Pradana’, ’Laki-Laki’, ’Tekhnik Informatika’)
Contoh Input Data ke kolom spesifik
Tabel Peserta
nim nama Jenkel Jurusan  
0411500349 Pradana Laki-Laki Tekhnik Informatika

Perintah SQL
INSERT INTO mahasiswa (nim,Jurusan) VALUES (‘0411500258’, ‘Sistem Informasi’)
Hasil :
nim nama Jenkel Jurusan 
0411500349 Pradana Laki-Laki Tekhnik Informatika
0411500258   Sistem Informasi

9 Perintah SELECT dalam SQL
SELECT statemen digunakan untuk memilih data dari suatu tabel. hasil dalam bentuk tabel  yang
disimpan di dalam suatu tabel hasil  yang disebut result-set
Syntax :
SELECT column_name(s) FROM table_name
Contoh :
Memilih beberapa kolom dengan nama “nim” dan “nama”, dapat digunakan perintah SELECT
seperti berikut : SELECT nim, nama from mahasiswa
 Tabel Peserta
nim nama Jenkel Jurusan 
0411500349 Pradana Laki-Laki Tekhnik Informatika
0411500258   Sistem Informasi

Hasil :
nim nama
0411500349 Parto
0411500258 

A. Memilih Seluruh Kolom
Memilih semua kolom pada table Peserta, dapat digunakan tanda *, seperti contoh
berikut :
SELECT * FROM  mahasiswa
Hasil :
nim nama Jenkel Jurusan 
0411500349 Pradana Laki-Laki Tekhnik Informatika
0411500258   Sistem Informasi

B. Klausa Where pada SQL
Klausa Where digunakan untuk memilih data yang lebih spesifik dengan sebuah
persyaratan atau lebih
Syntax :
SELECT column FROM table WHERE column operator value
Terdapat beberapa operator pada klausa WHERE yang bisa digunakan antara lain :
Operator Deskripsi
= Sama dengan
<> Tidak sama dengan
> Lebih besar dari
< Lebih kecil dari
>= Lebih besar dari atau
sama dengan
<= Lebih kecil dari atau
sama dengan
BETWEEN Diantara range inklusif
LIKE Mencari sesuai pattern
Catatan : Dalam beberapa versi dari SQL operator <> ini dituliskan seperti !=
C. Menggunakan Klausa WHERE
Mencari data dengan memilih mahasiwa yang Jurusannya “Sistem Informasi", kita dapat
menambahkan WHERE clause dalam perintah SELECT sebagai berikut :
SELECT * FROM Mahasiswa WHERE Jurusan=’Sistem Informasi’ Tabel Peserta
nim nama Jenkel Jurusan 
0411500349 Pradana Laki-Laki Tekhnik Informatika
0411500258   Sistem Informasi
Hasil :
nim nama Jenkel Jurusan 
0411500258   Sistem Informasi

SQL menggunakan tanda kutip tunggal  untuk data bertipe teks (namun adakalanya
database  lain memperbolehkan menggunakan tanda kutip ganda). Sedangkan pada data
bertipe numerik tidak diperbolehkan menggunakan tanda kutip.
Contoh :
SELECT * FROM Mahasiswa where nsms=’Pradana’ ‘ pernyataan yang benar
SELECT * FROM Mahasiswa where nsms=’Pradana’ ‘ pernyataan yang salah (tanpa
kutip tunggal)
SELECT * FROM Persons WHERE Year>1965   ‘ pernyataan yang benar
SELECT * FROM Persons WHERE Year>’1965’ ‘ pernyataan yang salah 
D. Kondisi LIKE
LIKE digunakan untuk memilih data dengan kondisi yang spesifik untuk pencarian dalam
sebuah kolom pada tabel.
Syntax :
SELECT column FROM table WHERE column LIKE pattern
Symbol “%” yang digunakan untuk persyaratan yang akan dicari di awal ataudiakhir dari
yang dicari.
Penggunaan klausa LIKE
Perintah berikut akan menghasilkan data peserta dengan nama depan yang diawali
dengan  ‘M’ :
SELECT * From  Mahasiswa WHERE nama LIKE ‘P%’
Perintah berikut akan menghasilkan Peserta dengan nama yang diakhiri dengan ‘a’ :
SELECT * From  Mahasiswa WHERE nama LIKE ‘%a’
Perintah berikut akan menghasilkan Peserta dengan nama yang memiliki huruf “la” :
SELECT * From  Mahasiswa WHERE nama LIKE ‘%la%’
10 Perintah UPDATE
Perintah UPDATE digunakan untuk mengubah data dalam suatu tabel.
Syntax :
UPDATE table_name SET column_name = new_value 
WHERE column_name=some value
Tabel Peserta :
Update field untuk sebuah record
Contoh :
UPDATE Mahasiswa SET nama=’Joko’, Jenkel=’Laki-Laki’  WHERE nim=’ 0411500258’ Hasil :
nim nama Jenkel Jurusan 
0411500349 Pradana Laki-Laki Tekhnik Informatika
0411500258 Joko Laki-Laki Sistem Informasi

11 Perintah DELETE
Perintah delete digunakan untuk menghapus baris dari suatu tabel.
Syntax :
DELETE FROM table_name WHERE column_name=some value
Tabel Peserta :
nim nama Jenkel Jurusan 
0411500349 Pradana Laki-Laki Tekhnik Informatika
0411500258 Joko  Sistem Informasi
Menghapus sebuah baris 
Contoh :
DELETE FROM Mahasiswa WHERE nim=’ 0411500349’
Hasil :
nim nama Jenkel Jurusan 
0411500258 Joko Laki-Laki Sistem Informasi

Menghapus semua baris 
Contoh :
DELETE FROM table_name  Tutorial Koneksi Netbeans ke Mysql
1. Pertama kita buat file dengan exetention .ini pada folder lib dengan terlebih dahulu
membuat folder lib(misal : database.ini). yang misal isinya seperti dibawah ini :

2. Lalu kita buat file Database.java untuk melakukan relasi dengan file Database.ini yang
isinya sbb:    
3. Kita tinggal memanggil class Database.java(gb diatas) jika kita ingin melakukan
pemrosesan data yang berhubungan ke database. Untuk mengambil data dari file
database.ini kita akan memodifikasi program seperti dibawah ini pada sebelum dan
dalam Konstruktor :
Mengolah file database.ini 4. Lalu kita buat Function setDefaultTable(); yang isinya sbb: 5. Setelah coding diatas selesai. Maka data dari mysql akan tertampil pada table di Form
javanya seperti gambar dibawah ini:
      Pemrosesan Data Dengan Java dan Mysql
1. Menu Input :
Untuk pembuatan menu input .klik kanan tombol “Input” lalu pilih 
Event ->action->Action Performed
Setelah itu buatlah coding dalam function yg baru terbentuk seperti dibawah ini : 2. Menu Cari
Untuk pembuatan menu cari .klik kanan tabel di Netbeans lalu pilih 
Event ->Mouse->Mouse Click.
Kita menggunakan metode “klik”,jika tablenya diklik maka data dari table akan tertampil
di Formnya.Lalu tambahkan coding dalam Fungsi tabelMouseClicked seperti coding
dibawah ini : 3. Menu Edit 
Untuk pembuatan menu edit .klik kanan tombol ”ubah” di Netbeans lalu pilih 
Event ->Action->ActionPerformed.
Data setelah tertampil di Form maka baru kita edit :
Untuk lebih jelasnya lihat coding sbb: 4. Menu Delete 
Untuk pembuatan menu Hapus . klik kanan tombol ”Hapus” di Netbeans lalu pilih 
Event ->Action->ActionPerformed.
Setelah data dicari, Menu yang terakhir adalah delete (untuk menghapus data):

Pengenalan HTML



Pengertian singkat tentang HTML
HTML (Hyper Text Markup Language) merupakan bahasa standar untuk membuat suatu dokumen HTML (halaman web) yang terdiri dari kode-kode singkat tertentu, dimana dengan kode-kode tersebut akan memerintahkan Web browser bagaimana untuk menampilkan halaman Web yang terdiri dari berbagai macam format file seperti texs, grafik, animasi link maupun audio-video.
Sedangkan Web browser adalah sebuah progam yang dapat menterjemahkan kode perintah dari dokumen HTML tersebut sehingga dapat kita lihat, baca dan dengar.Contoh dari Web Browser adalah Internet Exsplorer, Netscape Navigator, Mozilla Firefox, Opera, Safari dll.
HTML mempunyai file perluasan (extention) htm atau html. Dimana kedua perluasan tersebut adalah sama, jadi anda boleh menyimpan file dokumen HTML dengan extention ".htm" atau ".html".
Untuk mulai belajar HTML kita akan menggunakan Texs Editor, Notepad. Di bawah ini adalah contoh suatu dokumen HTML yang sangat sederhana. Buka Notepad, silahkan mulai dengan mengetikkan (copy/paste) texs di bawah ini:
<html>
<head>
<title>Titel Websiteku</title>
</head>
<body>
Ini adalah dokumen HTML pertamaku
</body>
</html>
Simpan file tersebut ke C:\My Documents dengan nama "websiteku.htm." Ketika menyimpan file tersebut dengan Notepad ganti "save as type"-nya dengan "all files". Kemudian buka browser dari menu File, klik Open dan tujukan ke C:\My Documents\websiteku.htm "klik Ok" maka halaman website pertama anda akan ditampilkan.
*Lakukan hal yang sama untuk contoh-contoh selanjutnya.
Perintah didalam dokumen HTML terdiri dari berbagai struktur penyusun seperti tag, elemen, atribut dan nilai. Tag terdiri dari lambang-lambang khusus seperti: " <", " >" dan "/", untuk menuliskannya di dalam dokumen HTML dimulai dengan tag pembuka " <…>"dan diakhiri dengan tag penutup " </…>". Kemudian di dalam tag tersebut terdapat teks seperti contoh diatas :html, head, title,body dan yang lainnya ini disebut dengan Elemen HTML.
Elemen HTML kemudian ada yang memiliki atribut dan nilai tertentu, seperti contoh untuk membuat warna latar belakang (background):<body bgcolor="0000ff">, body merupakan elemen, bgcolor adalah atribut dan 0000ff merupakan nilai (value).
Elemen HTML mempunyai tiga hal penting yaitu: tag pembuka, isi, dan tag penutup. Sebagai contoh: Elemen html mempunyai tag pembuka " <html>" dan tag penutup "</html>" dan yang berada diantaranya merupakan isi dari elemen html. Untuk menuliskan Elemen HTML bisa menggunakan huruf besar maupun huruf kecil. Contoh: <HTML>, <HtMl>, <HTml>, <html>, semuanya adalah sama.
Tag Dasar HTML
Komponen dasar dari suatu dokumen HTML terdiri dari tag elemen HTML, HEAD dan BODY. Berikut ini adalah penjelasan dari Tag Elemen tersebut:
<html>
<head>
<title>Disini titel websiteku</title>
</head>
<body>
Disini adalah konten yang tampil di browser
</body>
</html>