August 2017 ~ Syahril Phantom

Hello Technopreneur!!

Tutorial pertama pemrograman kali ini saya akan menunjukkan bagaimana cara membuat program kalkulator sederhana untuk pemula, Netbeans yang saya gunakan adalah Netbeans IDE 8.2

Sebelumnya install dulu programnya.
Buka Aplikasinya dan buatlah projek baru di tab File > New Project (Ctrl+Shift+N) > pilih Java Application > Next
Isi data nama dan lokasi penyimpanan sesuai kemauan, dan centrang bagian Create Main Class jika kamu ingin membuat main class otomatis, maksud dari nama pada gambar adalah kelas.pkg1.kalkulator merupakan nama package yang akan digunakan dan Kelas1Kalkulator merupakan nama Main Class > lalu klik Finish
Sebelum ke main class, buat JFrame Form dulu untuk membentuk tampilan kalkulator, klik kanan pada package > new > JFrame From
Isi kolom nama, gui merupakan graphical user interface, maksudnya adalah antarmuka antara aplikasi dengan user, atau kita bisa bilang desain aplikasinya > Finish
Untuk memudahkan kita dalam editing desain aplikasi / guinya kita set layout jframenya menjadi absolute layout, klik kanan > set layout > absolute layout
Di bagian kalkulatorgui.java pilih tab Design, dan mulailah mendesain sesuka hati, dibawah ini contoh desain dari saya, gunakan fungsi2 yang ada pada palette disebelah kanan, untuk tulisan tutorial dan by usaha5r.com saya menggunakan label yang di edit dari properties untuk menampilkan border, text keluar nilai menggunakan text field, dan tombol menggunakan button
Edit kata2 pada button dan kawan2nya dengan cara klik kanan > change variable name, kemudian untuk memudahkan dalam kodingan, pada kolom navigator sebelah bawah kiri, ubah nama sesuai dengan keinginan, kalau saya ubah nama sesuai dengan nama dan jenisnya
Kemudian untuk menuliskan kodingnya, cukup klik kanan pada buttonnya > events > action > actionPerformed, kamu akan di alihkan ke bagian kodingan / source dari button tersebut, taruh kodingan setelah kata // TODO add your handling code here :
Lakukan step diatas sampai semua button 0-9 dan koma “,” kita tulis dengan simbol titik “.”
Untuk Clear menggunakan kode dibawah ini :

TFTampilan.setText(“”);
nilai1=0;
nilai2=0;
total=0;
nilai=””;

Untuk Pertambahan gunakan kode :

nilai1=Double.parseDouble(nilai);
TFTampilan.setText(“+”);
nilai=””;
pilih=1;

Pengurangan menggunakan kode :

nilai1=Double.parseDouble(nilai);
TFTampilan.setText(“-“);
nilai=””;
pilih=2;

Pengurangan menggunakan kode :

nilai1=Double.parseDouble(nilai);
TFTampilan.setText(“*”);
nilai=””;
pilih=3;

Pembagian menggunakan kode :

nilai1=Double.parseDouble(nilai);
TFTampilan.setText(“/”);
nilai=””;
pilih=4;

Untuk sama dengan kita menggunakan switch case, itulah kenapa di setiap kabataku kita menggunakan variable pilih 1-4, berikut kode switch case sama dengan :

switch(pilih){

case 1:

nilai2 = Double.parseDouble(nilai);

total = nilai1 + nilai2;

nilai = Double.toString(total);

TFTampilan.setText(nilai);

break;

case 2:

nilai2 = Double.parseDouble(nilai);

total = nilai1 – nilai2;

nilai = Double.toString(total);

TFTampilan.setText(nilai);

break;

case 3:

nilai2 = Double.parseDouble(nilai);

total = nilai1 * nilai2;

nilai = Double.toString(total);

TFTampilan.setText(nilai);

break;

case 4:

nilai2 = Double.parseDouble(nilai);

total = nilai1 / nilai2;

nilai = Double.toString(total);

TFTampilan.setText(nilai);

break;

default:

break;

Klik F6 atau Run dan jalankan programnya, tadaaaa program kalkulator sederhana sudah selesai!!

Gimana Teknopreneur? mudah bukan? Ikuti terus Tutorial selanjutnya, semoga bermanfaat dan Silahkan request di komen bila ada request tutorial yaaa

A. Tool yang digunakan

1. Notepad++

B. DASAR TEORI

Pada hari yang pertama ini kita akan mempelajari HTML. HTML merupakan format tampilan untuk sebuah website. HTML sangat mudah dipelajari karena kita tidak memerlukan programming skill untuk menguasai HTML. Setelah membaca materi ini diharapkan anda dapat menguasai bagaimana:

ƒ Menggunakan HTML

ƒ Manipulasi Font dan Link

ƒ Membuat Tabel

ƒ Membuat Form HTML

1. Menggunakan HTML

Sebuah halaman website yang valid akan selalu diapit tanda <html>...</html>. File-file HTML selalu berakhiran dengan ekstensi *.htm atau *.html. Tag-tag HTML selalu diawali dengan tanda <x> dan diakhiri dengan </x> dimana x adalah nama tag seperti b, i, u dan sebagainya. Namun ada juga tag yang tidak diakhiri dengan </x> seperti <br> dan <input>.

Dibawah ini adalah tabel tag-tag HTML yang sering digunakan.

C. PRATIKUM

Latihan 1 : website pertamaku

Pertama jalankan program Notepad++ , klik FILE lalu klik NEW. Lalu ketikan source code dibawah ini:

Simpan mengklik File-Save lalu simpan dengan nama pertama.html di folder Project WEB. Untuk mengetesnya double klik pada file pertama.html maka akan muncul tampilan seperti di bawah ini:

2. Manipulasi Font dan Link

Untuk memanipulasi font di HTML kita gunakan tag <font></font>. Tag font tidak hanya sesederhana itu. Tag ini memiliki atribut didalamnya. Dimana atribut inilah yang memiliki peranan penting dalam menentukan tampilan teks. Lihat Tabel 1.1 untuk daftar atribut tag font.

Contoh jika kita ingin membuat teks yang menggunakan huruf Arial ukurannya 12pt dan warnanya merah. Kita dapat menuliskannya seperti berikut :

Untuk size 3 sama dengan 12pt, 4 sama dengan 14pt, 5 sama dengan 18pt, 6 sama dengan 24pt dan 7 sama dengan 36pt. Lalu bagaimana jika ingin membuat teks yang hurufnya tebal, miring dan bergaris bawah, kita cukup apit teks tersebut menggunakan tag <b></b>, <i></i> dan <u></u>.

Lihat contoh berikut :

Teks diatas akan mempunyai efek tebal, miring dan bergaris bawah. Selain font ada juga <h1></h1>, <h2></h2>, dan seterusnya yang digunakan untuk mencetak heading. <h1> akan mencetak heading dengan ukuran font yang terbesar, <h2> akan semakin mengecil dan seterusnya.

Anda tentu sering mengklik suatu tulisan atau gambar pada website yang menuju ke halaman lainnya. Yang anda klik itu adalah link. Link merupakan teks atau gambar yang membuka halaman website lainnya. Untuk membuat link kita dapat menggunakan tag <a></a>. Seperti halnya tag font tag a juga memiliki attribut. Tabel 1.2 akan menunjukkan pada anda daftar attribut pada tag a.

Contoh jika kita ingin membuka www.google.com pada window yang sama.

Link diatas akan membuka alamat www.google.com dengan teks Google sebagai teks yang akan diklik.

Latihan 2 : PENERAPAN TEORI MANIPULASI FONT DAN LINK

klik FILE lalu klik NEW. Lalu ketikan source code dibawah ini:

Ketikan source code dibawah ini :

Simpan dengan nama font_link.html.

Hasilnya :

Karena file pertama.html berada satu direktori dengan file font_link.html. Maka isi dari href cukup kita tulis “pertama.html”.

3. Membuat Tabel

Tabel memiliki peranan yang cukup penting dalam pendesainan suatu tampilan. Dengan menggunakan tabel kita dapat dengan mudah menentukan letak suatu objek. Untuk membuat tabel digunakan <table></table>. Atribut dari tag table boleh dibilang cukup banyak. Daftar atribut tag table dapat anda lihat pada table dibawah ini :

Daftar atribut dari tag table

Jika kita hanya menggunakan tag <table></table> saja maka tabel tidak akan pernah terbentuk karena belum memiliki baris dan kolom. Untuk membuat baris kita gunakan tag <tr></tr> dan untuk membuat kolom digunakan tag <td></td>. Terdapat juga tag <th></th> tag ini digunakan untuk membuat header tabel. Ketiga tag tersebut memiliki atribut yang hampir sama.

Daftar atribut tag tr, td, dan th

Contoh dibawah ini mengilustrasikan kita akan membuat tabel dengan dua baris dan satu kolom.

Latihan 3 : PENERAPAN TEORI MEMBUAT TABEL

Simpan dengan nama tabel.html

Hasilnya :

Coba perhatikan pada tag td yang ada pada baris ke tiga. Disini kita menuliskan attribut colspan=”3” yang artinya kita menghilangkan 3 kolom dan menggantinya hanya dengan satu kolom.