Rahma Bhie

Rabu, 31 Maret 2010

MEMBUAT LOGIN FORM SEDERHANA

Diposting oleh rahma bhie at 06.00

Setelah pada kesempatan terdahulu kita telah belajar berbagai teknik untuk menciptakan halaman web sederhana, kali ini kita akan belajar bagaimana cara membuat sebuah login form sederhana dalam halaman web.
Untuk membuat sebuah login form, kita membutuhkan tiga komponen atau tiga langkah utama, yaitu:
1. Membuat file css
2. Membuat file php
3. Membuat file html

Seperti biasanya file css berguna untuk membuat atau mengatur kerangka utama atau kerangka dasar dari halaman web kita.
Kemudian file php berguna untuk mengatur data yang akan digunakan dalam proses login,misalnya username, passwoed dll.
Sedangkan file html berguna untuk mempublikasikan halaman web yang telah dirancang dalam file scc dan php.

Untuk lebih jelasnya, marilah kita pelajari contoh MEMBUAT LOGIN FORM SEDERHANA dibawah ini..

1. Membuat File css
Buatlah file css seperti contoh di bawah ini:

Simpan file di atas dengan nama bhie.css untuk kemudian dipanggil di file html

2. Buat file php

Buatlah file php sebegaiman contoh di bawah ini:

Simpan file dengan nama admin.php untuk kemudian dipanggil di file html.

3. Membuat file html

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
 <html>
 <head>
 <title>Form Login</title>
 <link rel="stylesheet" href="bhie.css" type="text/css" />
 </head>
 <body onLoad="document.form1.user.focus(); backgroundimage= "tux.jpg">
 <form name="form1" method="post" action="admin.php">
 <div id="apDiv1">
 <div id="header">
 </div>
 <div align="center">
 <img src="LOGIN.jpg" align="center"> 
 
 
 <div align="center"> User Name :
 
 
 <input type="text" name="user" size="40" value="" style="background-color:#00FF00">
 
 
 Password : 
 
 <input type="password" name="pass" size="40" style="background-color:#00FF00">
 
 
 <input type="submit" name="submit" value=" E N T E R " onClick="admin()">
 
 
 </div>
 </div>
 
 <div align="center" id="apDiv3">
 
 </div>
 <div id="footer" align="center"> 
 
 </div>
 </div>
 </form>
 </body>
 </html>

Simpan dengan nama file latihan3.html , semua file disimpan seperti biasa di folder www. beserta komponen-komponen yang digunakan. Kemudian ujicoba project.
Apabila langkah-langkah telah dilakukan dengan baik dan berhasil, maka akan muncul hasil seperti gambar dibawah ini:

Dalam project ini apabila terjadi kesalahan login, maka akan mengarah pada halaman tersendiri yang di dalamnya menyatakan adanya kesalahan login. Dan apabila berhasil akan mengarah pada sebuah halam yang menyatakan selamat telah berhasil melakukan login. Username dan password telah diatur dalam file php, begitu juga apabila terjadi kesalahan dan berhasil login telah diatur dalam file php.

Selamat Mencoba...!!!

Sabtu, 06 Maret 2010

SPECTRUM FREQUENCY

Diposting oleh rahma bhie at 03.15

SPECTRUM FREEQUENCY
Spectrum Frequency dari suatu sinyal merupakan kumpulan dari seluruh komponen frequensiy yang tercakup di dalamnya dan ditunjukkan dengan grafik frequency domain. Selain spectrum frequency, kita juga mengenal intilah bandwith, yaitu lebar dari spectrum frequency. Dari sini dapat kita simpulkan bahwa bandwith itu sendiri mengacu pada range dari komponen frequency-frequency. Sedangkan spectrum frequency itu sendiri mengacu pada elemen-elemen yang ada di dalam range.

Menghitung Bandwith
Untuk mengetahui besarnya bandwith kita dapat melakukan dengan menghitung frequency tertinggi dikurangi dengan frequency terendah.

TRANSFORMASI FOURIER
sebuah transformasi integral yang menyatakan-kembali sebuah fungsi dalam fungsi basis sinusioidal, yaitu sebuah fungsi sinusoidal penjumlahan atau integral dikalikan oleh beberapa koefisien ("amplitudo"). Ada banyak variasi yang berhubungan-dekat dari transformasi ini tergantung jenis fungsi yang ditransformasikan.
Secara sederhananya transformasi fourier dipergunakan untuk mengubah dari kawasan waktu menjadi kawasan frekuensi. Pengubahan itu dimaksudkan untuk mempermudah analisis yang dilakukan. Dalam bidang pengolahan sinyal maka pengubahan tersebut dapat dilakukan terhadap sinyal maupun terhadap sistemnya. Transformasi fourier sinyal akan menghasilkan spektrum sinyal. Sedangkan transformasi fourier terhadap sistem akan menghasilkan tanggapan frekuensi sistem.

GELOMBANG ELEKTROMAGNETIK
Gelombang elektromagnetik merupakan yang berisi dan menghantarkan sinyal-sinyal elektromagnetik di udara. Contoh gelombang televisi, radio, dan lain-lain. Masing-masing jenis gelombang elektromagnetik ini memiliki batas jangkauan sendiri-sendiri, yang disebut dengan spectrum elektromagnetik. Spectrum elektromagnetik meliputi daerah batas gelombang dengan frequency yang rendah sampai frequency yang sangat tinggi.

Pada umumnya gelombang elektromagnetik yang memiliki frequensi tinggi yang dipancarkan oleh pemancar disebut dengangelombang radio (RF). Gelombang RF dibagi menjadi dua golongan, yaitu Gelombang Langit (Sky wave) dan Gelombang Darat (Ground wave).

Jenis-jenis media transmisi radio:
1. Middle Frequency(MF)
 Banyak digunakan pada radio swasta, radio amatir,orari, dsb.
2. High Frequency (HF)
 Dipakai untuk berhubungan dengan tempat-tempat jauh dan terpencil. Penggunaan frequency HF ini sering disebut dengan SSB (Single Side Band atau radio SSB).
3. Very High Frequency (VHF) dan Ultra High Frequency (UHF)
 Banyak digunakan untuk keprluan hubungan jarak dekat, contohnya radio kendaraan bermotor, STJJ, dan lai-lain.
4. Super High Frequency (SHF) dan Extremely High Frequency (EHF)
 Sering diseut dengan gelombang mikro yang banyak digunakakn untuk system gelombang mikro di Telkom dan system satelit termasuk untuk penyiaran program televise.

Selasa, 02 Maret 2010

Desain Layout Web Sederhana dengan code CSS

Diposting oleh rahma bhie at 20.33

Pada kesempatan kali ini, kita akan membahas mengenai pembuatan halaman web sederhana dengan menggunakan code css untuk penyusunan kerangka awal elemen halaman web.
Dengan menggunakan CSS ini, kita dapat dengan mudah mengatur semua elemen halaman web, seperti border, padding, font, spacing, colour, background dan lain-lain dengan simple dalam satu paket code saja.
Langkah-langkah utama dalam pembuatan halaman web sederhana adalah, pertama membuat kerangka Wb dengan kode css, kemudian memperindah halaman dengan kode html.

Untuk lebih mudahnya kita dapat mencoba membuat contoh program 1 di bawah ini:
1. Contoh Membuat Kerangka Halaman Web

#wrapper { 
 
 margin: auto; 
 
 width: 750px; 
 
 border: 0px solid red;
 
 }
 
 #header {
 
 height: 80px;
 
 border: 0px solid blue;
 
 }
 
 #templatemo_menu_panel{
 
 width: 750px;
 
 height: 80px; 
 
 repeat: x;
 
 background: url(tux.jpg);
 
 }
 
 
 
 #templatemo_menu_section ul {
 
 float: right;
 
 width: 350px;
 
 margin: 0;
 
 padding: 0 27px 0 0;
 
 list-style: none;
 
 }
 
 
 
 #templatemo_menu_section ul li a{
 
 float: left;
 
 width: 50px;
 
 font-size: 10px;
 
 font-weight: bold;
 
 text-align: center;
 
 text-decoration: none;
 
 color: #ff00ff;
 
 border-right: 1px solid #5f3b11;
 
 }
 
 
 
 #searchfield{
 
 border: 1px solid #ffffff;
 
 color: #000000;
 
 font-size: 13px;
 
 font-variant: normal;
 
 height: 15px;
 
 line-height: normal;
 
 width: 100px;
 
 }
 
 
 
 #searchbutton{
 
 float: right;
 
 cursor: pointer;
 
 font-size: 10px;
 
 font-weight: bold;
 
 height: 20px;
 
 margin: 0 0 0 7px;
 
 text-align: center;
 
 vertical-align: bottom;
 
 white-space: pre;
 
 width: 50px;
 
 }
 
 #boxImage{
 
 float: left;
 
 margin: 10px;
 
 width: 70px;
 
 height: 50px;
 
 }
 
 
 
 #boxText{
 
 float: left;
 
 margin: 10px;
 
 padding: 10px 0 0 0;
 
 width: 250px;
 
 height: 50px;
 
 font-size: 20px;
 
 font-weight: bold;
 
 text-align: left;
 
 color: solid blue;
 
 }
 
 #boxButton{
 
 float: right;
 
 padding: 30px 0 0 0;
 
 width: 50px;
 
 height: 15px;
 
 }
 
 
 
 #boxTF{
 
 float: right;
 
 padding: 30px 50px 0 0;
 
 width: 170px;
 
 height: 15px;
 
 }
 
 #inner {
 
 float: left;
 
 height:330px;
 
 border: 0px solid black;
 
 }
 
 #sidebar { 
 
 float: left; 
 
 width: 200px; 
 
 height: 330px;
 
 background: #fff000; 
 
 border: 0px solid red;
 
 }
 
 #leftmenu ul{
 
 width:200px;
 
 list-style-type: none;
 
 padding: 0;
 
 margin: 0;
 
 }
 
 #leftmenu a:link, #leftmenu a:visited, leftmenu a:active {
 
 padding-left: 15px;
 
 text-decoration: none;
 
 }
 
 #leftmenu a{
 
 padding: 5px 0px 5px 15px;
 
 display: block;
 
 background: #6cae15 no-repeat left center;
 
 margin: 0px 0px 1px;
 
 color: black;
 
 }
 
 #leftmenu a:hover{
 
 background: blue no-repeat left center;
 
 color: #00ffff;
 
 }
 
 #content1 { 
 
 float: left; 
 
 width: 550px; 
 
 height: 330px; 
 
 border: 0px solid green;
 
 background: yellow;
 
 }
 
 #top { 
 
 float: left; 
 
 width: 550px; 
 
 height: 100px; 
 
 border: 0px solid blue;
 
 }
 
 #content { 
 
 float: left; 
 
 width: 374px; 
 
 height: 230px; 
 
 border: 0px solid red;
 
 background: #fff89d;
 
 }
 
 #right { 
 
 float: right; 
 
 width: 150px; 
 
 height: 150px; 
 
 font-size: 12px;
 
 font-weight: bold;
 
 background: cyan;
 
 border: 0px solid orange;
 
 }
 
 #fontRight{
 
 font-size: 10px;
 
 font-weight: bold;
 
 }
 
 #footer {
 
 clear: both;
 
 text-align: center;
 
 height: 50px;
 
 border: solid blue;
 
 background: yellow;
 
 }

Simpan code css diatas dengan nama style1.css dan simpan dalam folder wamp/www, untuk kemudian di-load pada file html.

Langkah berikutnya adalah membuat file html.

untuk membuat file html buat code seperti di bawah ini:

Berikut ini adalah layout hasil code program di atas:

Setelah kita berhasil membuat elemen dan kerangka dasar dari halaman web sederhana yang ingin kita buat, sekarang kita kan mencoba membuat halaman web sederhana yang lengkap dengan isi dan tampilan yang menarik.

2. Contoh Membuat Halaman Web Sederhana

Seperti halnya pada contoh pertama, mula-mula kita membuat kerangka web dengan code css.

Simpan code di atas dengan nama styleq.css , untuk kemudian diload pada file html.
Langkah berikutnya adalah menbuat file html.

<!DOCTYPE html 
 
 PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
 
 "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
 
 <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> 
 
 
 
 <head> 
 
 <title>Desain Layout Sederhana</title> 
 
 <link rel="stylesheet" href="styleq.css" type="text/css" /> 
 
 </head> 
 
 
 
 <body> 
 
 
 
 <div id="wrapper"> 
 
 <div id="header"> 
 
 <div id="templatemo_menu_panel">
 
 <div id="boxImage" align="right">
 
 <img src="unm.bmp" height="50" width="50"/>
 
 </div>
 
 
 
 <div id="templatemo_menu_section">
 
 <ul>
 
 <li><a href="#home">Home</a></li>
 
 <li><a href="#Situs_Map">Site Map</a></li>
 
 <li><a href="#RSS">RSS</a></li>
 
 <li><a href="#Contact">Contact</a></li> 
 
 <li><a href="#About_US">About Us</a></li> 
 
 </ul>
 
 </div>
 
 <div id="boxText"> 
 
 TEKNIK ELEKTRO
 
 </div> 
 
 <div id="boxTF">
 
 <input type="text" name="q" size="10" id="searchfield" title="searchfield" />
 
 </div>
 
 <div id="boxButton">
 
 <input type="submit" name="Search" value="Search" alt="Search" id="searchbutton" title="Search" />
 
 </div>
 
 </div> 
 
 </div> 
 
 
 
 <div id="inner"> 
 
 <div id="sidebar"> 
 
 <div id="leftmenu">
 
 <ul>
 
 <li><a href="#home">Home</a></li>
 
 <li><a href="#News_and_Media">News and Media</a></li>
 
 <li><a href="#Tutorials">Tutorials</a></li>
 
 <li><a href="#Tips_and_Tricks">Tips and Tricks</a></li> 
 
 <li><a href="#Downloads">Downloads</a></li> 
 
 </ul>
 
 </div> 
 
 </div> 
 
 
 
 <div id="content1">
 
 <div id="top">
 
 <img src="teknik.jpg" height="100" width="550"/>
 
 </div> 
 
 <div id="content">
 
 <h3 align="center">Pemuda Indonesia Berkarya</h3>
 
 
 
 
 
 "Masa depan bangsa adalah tanggunga jawab para generasi penerus bangsa, yaitu para pemuda yang terus bertumbuh dan berkembang seiring 
 				dengan kemajuan zaman, namun tetap berpegang teguh pada pribadi bangsa yang luhur"
 
 <hr align="right" style="color:yellow" width="130" />
 
 <img src="futsal.jpg" align="right" border="2" style="color:red" width="50" height="30" />
 
 
 
 </div> 
 
 <div id="right">
 
 EVENTS
 
 <div id="fontRight">
 
 <ul>
 
 <li>Kompetisi Basket</li>
 
 <li>Kompetisi Robot</li>
 
 <li>Kompetisi Seni</li>
 				
 </ul>
 
 </div>
 
 </div> 
 
 </div>
 
 </div> 
 
 <div id="footer"> 
 
 © 2010 Teknik Elektro UM Malang, Indonesia
 
 </div> 
 
 </div> 
 
 </body> 
 
 
 </html>

Hasil dari code di atas adalah:

Itulah tadi beberapa langkah dan contoh membuat halaman web sederhana dengan bantuan code css. Selamat Mencoba..

Rabu, 24 Februari 2010

The Powerfull Bigbang

Diposting oleh rahma bhie at 04.55

Dunia seni musik kini makin diramaikan dengan kehadiran penyanyi-penyanyi muda berbakat.
Dunia seni musik yang selama ini diramaikan dengan berbagai genre musik R&B, hiphop dan freestyle yang didominasi oleh penyanyi dari barat dan group band muda, kini telah berubah.
Berbagai vocal group kini mulai melejit dalam dunia musik. Dan justru banyak didominasi oleh vocalgroup dari negara korea.
berbagai karya apik mulai bermunculan dan digemari oleh pecinta musik dunia. Bukan hanya tenar di negaranya, demam lagu-lagu korea kini telah merajahi pecinta musik di seluruh dunia.
hal ini terbukti dengan semakin meningkatnya ratting lagu-lagu korea bawaan vocalgroup WonderGirl,SNSD,Bigbang,Super Junior,2NE1,2PM dan masih banyak lagi yang lain.

Salah satu boyband korea yang paling diminati adalah Bigbang dengan genre musik pop-R&B-nya yang enak. Meski genre musiknya memiliki rite yang cepat dan keras, namun syair-syair yang disampaikan tetap mengandung makna yang romantis dan penuh cinta.
Salah satu lagu Bigbang terbaru yang telah mampu melejitkan namanya dan paling diminati sekarang ini adalah With YOu.
Berikut ini adalah lirik lagunya,
Oh… Oooooh…
Oh…… Oooooh…
Yeah…

YB:
She stands there looking at me
I know she’s wonderin’
If she should kick it with me
Cuz you all got that somethin’
If she be wanting to freak
The shakin’ thunderin’
And now she’s starting to creep up on me

GD:
Man she looks so good
And she looks so fine
Still it takes me high
Singing ‘My Oh My’
Got to get with her
Have her in my world
Hold her in my arms
That’s forever yo

Chorus:
I wanna rock with u
Dance with u
Do everything with u
Run around in the rain with u
Everyday now only u
Rock with u
Dance with u
Do everything with u
Run around in the rain with u
Everyday now only u….

DS:
It’s getting tough in the scene
The place is jumping now
I grab her hand and proceed
To the crowd that’s tumbling
I really want her with me
Some one-on-one romance
What she keeps doing to me
Got me feelin’…

SR:
Man she looks so good
And she looks so fine
Still it takes me high
Singing ‘My Oh My’
Got to get with her
Have her in my world
Hold her in my arms
That’s forever yo

Repeat Chorus

(Break it down)

YB:
I know that you’re thinking I won’t be right (Oh I can be right)
But it’s you girl now I made up my mind
From here we can start a new wonderful life
Always and forever yo

TOP:
(yo, yo)
I wanna rock
I wanna dance
I wanna do everything with you baby that’s it
Me and you together baby we can be a classic
So we can do those kinda things fantastic
The bombastic
Baby living drastic
But for you anything’s possible Love

GD:
(yea, yea)
I gotta rock
I gotta dance
I gotta do everything with a first glance (that’s me)
Make me wanna get up and run around in my (seat)
Baby got me wilin’ and you know what (I mean)
So fresh, so (clean)
So blessed, so lean
My honey, My Queen

Repeat Chorus x 2

(Ah, yea, that’s right)

Membuat Tabel dan Grafik Sederhana

Diposting oleh rahma bhie at 04.16

Salah satu hal yang penting dalam pembuatan komponen pada halaman web adalah pembuatan tabel dan grafik.
Tabel dan grafik sangat dibutuhkan untuk menyampaikan informasi data dalam bentuk tabel agar mudah dipahami.
Dengan tabel, kita dapat menyampaikan sejumlah data-data tertentu dalam kemasan yang ringkas dan mudah dipahami.Sedangkan grafik dibuat untuk mengemas informasi dan data dalam bentuk grafik agar mudah dipahai juga.
Berikut ini salah satu contoh membuat tabel dan grafik secara sederhana.

Contoh 1. Pembuatan Grafik Batang Sederhana

<!DOCTYPE htmlPUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
 <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
 
 <head><title>Grafik Tabel</title></head>
 
 <body>
 
 <table width="65%" cellpadding="0" cellspacing="0" bgcolor="#FFFFFF">
 <tr>
 <th width="144" height="24" align="center">
 <hr noshade="noshade" />Perusahaan<hr noshade="noshade" /></th>
 <th colspan="7" align="center" >
 <hr noshade="noshade"/>Pendapatan<hr noshade="noshade" /></th>
 </tr>
 
 <tr>
 <td height="27">Angin Reboot Ltd</td>
 <td colspan="3"> </td>
 <td colspan="2" align="left" bgcolor="#FFFFFF">
 <table width="300" border="1" cellspacing="0" bgcolor="#F11145">
 <tr>
 <th width="286" height="23"> </th>
 </tr>
 </table>
 </td>
 <td width="10" align="left" bgcolor="#FFFFFF">+150%</td>
 <td width="11" colspan="1" align="left" valign="bottom" > </td>
 </tr>
 
 <tr>
 <td height="33" >Command Prompt, Inc</td>
 <td colspan="3" > </td>
 <td width="200" align="left" bgcolor="#FFFFFF">
 <table width="110" border="1" cellspacing="0" bgcolor="#0F1256">
 <tr>
 <th align="left" > </th>
 </tr>
 </table>
 </td>
 <td width="70" align="left" valign="bottom" bgcolor="#FFFFFF">+55%</td>
 <td colspan="3" align="left" > </td>
 </tr>
 
 <tr>
 <td height="36" >Hibernate Ltd</td>
 <td width="100" align="right" valign="bottom" > </td>
 <td width="51" align="right">-23%</td>
 <td width="10" align="right" bgcolor="#FFFFFF">
 <table width="23" border="2" cellspacing="0" bgcolor="#00FFF0">
 <tr>
 <th > </th>
 </tr>
 </table>
 </td>
 <td colspan="5" > </td>
 </tr>
 
 <tr>
 <td height="27" >Shutdown Ltd</td>
 <td align="right" valign="bottom" >-75%</td>
 <td colspan="2" align="right" valign="bottom" bgcolor="#FFFFFF" >
 <table width="100" border="2" cellspacing="0" bgcolor="#0000FF">
 <tr>
 <th > </th>
 </tr>
 </table>
 </td>
 <td colspan="5" > </td>
 </tr>
 <tr>
 <td height="27" >
 <hr noshade="noshade" /> </td>
 <td align="right" valign="bottom" >
 <hr noshade="noshade" /> </td>
 <td colspan="2" align="right" valign="bottom" bgcolor="#FFFFFF" >
 <hr noshade="noshade" /> </td>
 <td colspan="5" >
 <hr noshade="noshade" /> </td>
 </tr>
 
 </table>
 
 </body>
 </html>

Hasil dari codding di atas adalah sebagai berikut:

Contoh 2. Pembuatan Tabel Sederhana

<!DOCTYPE htmlPUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
 <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
 
 <head><title>Tabel Klasifikasi Data</title></head>
 
 <body>
 
 <h4>Perbandingan Fitur</h4>
 
 <table border="2" rules="groups" cellspacing="1" cellpadding="2" frame="hsides"><colgroup align="center"></colgroup><colgroup align="left"></colgroup><colgroup align="center"></colgroup><colgroup align="center"></colgroup><tbody>
 
 <tr>
 <th width="25">No </th>
 <th width="200">Fitur </th>
 <th width="75">Enterprise </th>
 <th width="40">Pro </th>
 <th width="40">Free</th>
 
 </tr>
 </tbody><tbody>
 
 <tr>
 <td align="center">1 </td>
 
 <td>Garansi Seumur Hidup </td>
 <td align="center">X </td>
 <td align="center">- </td>
 <td align="center">- </td>
 </tr>
 
 <tr>
 <td align="center">2 </td>
 <td>Multi User </td>
 <td align="center">X </td>
 <td align="center">- </td>
 <td align="center">- </td>
 </tr>
 
 <tr>
 <td align="center">3 </td>
 <td>Update Otomatis </td>
 <td align="center">X </td>
 <td align="center">X </td>
 <td align="center">- </td>
 </tr>
 
 <tr>
 <td align="center">4 </td>
 <td>Cetak Laporan </td>
 <td align="center">X </td>
 <td align="center">X </td>
 <td align="center">- </td>
 </tr>
 
 <tr>
 <td align="center">5 </td>
 <td>Notifikasi Error </td>
 <td align="center">X </td>
 <td align="center">X </td>
 <td align="center">X </td>
 </tr>
 
 </tbody><tbody>
 
 <tr>
 <td align="center">6 </td>
 <td>Ubah Tema </td>
 <td align="center">X </td>
 <td align="center">X </td>
 <td align="center">X </td>
 </tr>
 
 <tr>
 <td align="center">7 </td>
 <td>Try Ikon </td>
 <td align="center">X </td>
 <td align="center">X </td>
 <td align="center">X </td>
 </tr>
 
 </tbody></table>
 </body>
 </html>

Hasil dari codding di atas adalah sebagai berikut:

Beberapa contoh di atas adalah contoh pembuatan Grafik dan tabel sederhana dalam halaman web. Contoh-contoh di atas merupakan contoh dalam bentuk sederhana yang masih dapat dikembangkan lagi menjadi tampilan yang lebih indah dan menarik.
Selamat Mencoba..

Sabtu, 20 Februari 2010

REKAYASA PERANGKAT LUNAK

Diposting oleh rahma bhie at 18.35

PERANGKAT LUNAK
Perangkat lunak adalah perangkat yang menghubungkan atau mengkomunikasikan antara perangkat keras dengan pengguna.
Perangkat lunak dapat dikategorikan menjadi tiga, yaitu:
1.Perangkat lunak system
Perangkat lunak system adalah perangkat lunak yang mengelola perangkat keras dan perangkat lunak yang digunakan oleh komputer. Contoh perangkat lunak system yaitu sistemoperasi, seperti Windows,Linux,Leopard, dll.
2.Perangkat lunak aplikasi
Perangkat lunak aplikasi adalah perangkat lunak yang berfungsi untuk membantu melakukan berbagai tugas sehari-hari, misalnya Microsoft Office, Open Office, dll.
3.Bahasa pemrograman
Bahasa pemrograman merupakan perangkat lunak yang berfungsi mengkonversikan arsitektur dan algoritma yang dirancang manusia ke dalam format yang dapat dijalankan komputer. Contoh bahasa pemrograman yaitu VB, Pascal, Delphi,dll.
Karakteristik perangkat lunak:
1.Perangkat lunak merupakan produk yang lebih menekankan pada kegiatan rekayasa dibandingkan kegiatan manufacturing.
2.Perangkat lunak bukanlah produk yang dapat usan untuk kemudian dibuang seperti perangkat keras.
3.Kebanyakan perangkat lunak tidak dibangun dari perangkat lunak yang sudah ada.

REAKAYASA PERANGKAT LUNAK
Rekayasa perangkat lunak merupakan teknik pengembangan perangkat lunak yang telah ada untuk kemudian dihasilkan sebuah perangkat lunak yang lebih efektif, efisien, dan memudahkan penggunaannya.
rekayasa perangkat lunak dapat juga diartikan sebagai satu bidang profesi yang mendalami cara-cara pengembangan perangkat lunak termasuk pembuatan, pemeliharaan, manajemen organisasi pengembanganan perangkat lunak dan sebagainya.

MITOS PERANGKAT LUNAK
Perangkat lunak kini merupakan suatu hal yang sudah tidak asing lagi dalam kehidupan manusia. Hampir tiap orang kini telah menggunakan teknologi komputer dan memanfaatkan bantuan berbagai perangkat lunak untuk membantu menyelesaikan berbagai aktivitas sehari-hari. Namun demikian, perangkat lunak tersebut tidak luput daru berbagai mitos-mitos atau isu-isu yang beredar, yaitu diantaranya:
1.Mitos : Kebutuhan proyek berubah terus, tapi perubahan tersebut bisa diakomodasi dengan mudah karena perangkat lunak bersifat fleksibel.
Fakta : ika ada perhatian serius pada definisi awal, perubahan dapat diakomodasi dengan mudah. Jika perubahan terjadi selama proses perancangan, biaya meningkat dengan cepat. Jika perubahan setelah launching, biayanya bisa lebih mahal daripada membuat baru.
2.Mitos : Tidak ada cara untuk menilai kualitas program, kecuali program itu berjalan (running).
Fakta : Salah satu mekanisme jaminan mutu PL yang paling efektif dapat diperkirakan di awal proyek (Formal Technical Review). Software review merupakan “filter mutu” yang lebih efektif daripada testing untuk menemukan kesalahan pada PL.
3.Mitos : Satu-satunya yang dapat disampaikan untuk sebuah proyek yang sukses adalah program yang berjalan.
Fakta : Program yang berjalan hanya merupakan salah satu bagian dari konfigurasi PL yang meliputi program, dokumen, dan data. Dokumentasi membentuk pondasi bagi perkembangan yang sukses dan memberikan tuntunan pada pemeliharaan PL.

Beberapa mitos diatas merupakan contoh mitos perangkat lunak yang sering beredar baik di kalangan user ataupun programmer. Namun masih banyak lagi mitos-mitos perangkat lunak lain yang beredar seiring dengan perkembangan perangkat lunak yang semakin maju.

EVOLUSI PERANGKAT LUNAK
1. Era Pioner
Pada era ini, perangkat lunak merupakan satu kesatuan dengan perangkat kerasnya. Penggunaan komputer oleh user dilakukan secara langsung. semua hasil proses yang dikerjakan oleh komputer diprint out.
2. Era Stabil
Pada era ini mulai di kenal sistem basis data, yang memisahkan antara program (pemroses) dengan data (yang di proses). Pada era ini sebuah perangkat lunak yang dijalankan oleh komputer sudah bisa menjalankan perintah multitasking dan mampu melayani multi user.
3. Era Mikro
pada era ini sudah mulai muncul perangkat lunak sistem, yang mampu menangani perangkat lunak aplikasi yang digunakan dalam komputer untuk membantu melakukan suatu pekerjaan tertentu dan dapat digunakan oleh user secara langsung. pada era ini, sudah mulai kelihatan tanda-tanda berkembangnya kecerdasan buatan.
4. Era Modern
Pada era ini, perangkat lunak sudah digunakan oleh banyak orang. Pembuatan perangkat lunak juga bukan hanya kegiatan yang khusus dilakukan oleh beberapa orang ahli saja, namun juga telah mulai banyak dipelajari dan dilakukan oleh banyak orang. Sehingga perkembangan dan kreatifitas di bidang perangkat lunak juga terus berkembang dengan cepat, diantaranya perangkat lunak telah mampu mengenali suara, gambar, gerak, dll.

MODEL-MODEL PERANGKAT LUNAK
1.Model konvensional
model konvensional diartikan sebagai sebuah pemodelan perangkat lunak yang telah ditemukan terdahulu. Namun demikian bukan berarti model-model konvensional ini tidak dapat digunakan lagi. Model-model konvensional ini tetap dapat digunakan, namun mungkin memiliki beberapa kekurangan dibandingkan model evolusioner yang telah diperbaharui.
Model-model konvensinal ini terdiri dari:
a. Model Waterfall
Model ini mengusulkan sebuah pendekatan kepada perkembangan software yang sistematik dan sekuensial yang mulai pada tingkat dan kemajuan sistem pada seluruh analisis, desain, kode, pengujian, dan pemeliharaan. Dimodelkan setelah siklus rekayasa konvensional, model waterfall melingkupi aktivitas-aktivitas sebagai berikut:rekayasa dan pemodelan sistem, analisis kebutuhan software, desain, generalisasi kode, pengujian, pemeliharaan.
b. Model Spiral
Model spiral adalah model proses software yang evolusioner yang merangkai sifat iteratif dari prototipe dengan cara kontrol dan aspek sistematis dari model waterfall. Model ini berpotensi untuk pengembangan versi pertambahan software secara cepat. Di dalam model spiral, software dikembangkan di dalam suatu deretan pertambahan. Selama awal iterasi, rilis inkremental bisa merupakan sebuah model atau prototipe kertas. Selama iterasi berikutnya, sedikit demi sedikit dihasilkan versi sistem rekayasa yang lebih lengkap. Model spiral dibagi menjadi sejumlah aktifitas kerangka kerja, disebut juga wilayah tugas, di antara tiga sampai enam wilayah tugas, yaitu:Komunikasi pelanggan,Perencanaan,Analisis Resiko,Perekayasaan,Konstruksi dan peluncuran,Evaluasi pelanggan.
c. Rapid Application Development
Rapid Application Development
Model RAD adalah model proses pembangunan perangkat lunak yang tergolong dalam teknik increment (bertingkat). RAD menekankan pada siklus pembangunan pendek/singkat/cepat. Waktu yang singkat adalah batasan yang penting untuk model ini. Karena dipakai terutama pada aplikasi sistem konstruksi, pendekatan RAD melingkupi fase-fase sebagai berikut:Business modeling,Data modeling,Proses modeling,Application Generation,Testing dan turnover.

2.Model evolusioner
Model ini berdasarkan pada ide pengembangan pada implementasi awal yang akan menghasilkan komentar pemakai sehingga dapat dilakukan perbaikan melalui banyak versi sampai sistem yang mencukupi dapat dikembangan. Selain memiliki aktivitas-aktivitas yang terpisah model ini memberikan feedback dengan cepat dan serentak.
Tipe Model Evolusioner
a.Pemrograman Evolusioner
bekerjasama dengan user untuk menghasilkan kebutuhan-kebutuhan dan menyampaikan sistem akhir kepada user.
b.Pemodelan
Model/contoh difokuskan pada penelitian bagian-bagian kebutuhan user yang kurang dimengerti.
Kelebihan
Lebih efektif daripada pendekatan waterfall untuk hal pengembangan perangkat lunak yang harus dengan segera dapat memenuhi kebutuhan costumer.
Kekurangan (dari segi teknik) :
1. proses tidak visibel
2. sistem biasanya kurang terstruktur
3. ketrampilan khusus jarang dimiliki

Spiral Boehm
Pendekatan alternatif diusulkan oleh Boehm (1988). Boehm mengusulkan sebuah model yang secara eksplisit menjelaskan bahwa resiko yang disadari mungkin membentuk dasar model proses umum.Model Boehm bebrbentuk spiral. Setiap loop mewakili sebuah tahap dari proses perangkat lunak.
Tidak ada tahap yang tetap dalam model ini. Manajemen harus memutuskan bagaimana membentuk proyek kedalam tahap-tahap. Perusahaan biasanya bekerja dengan beberapa model umum dengan tahap tambahan untuk proyek khusus atau ketika masala-masalah ditemukan selama pembuatan proyek.
Setiap loop dibagi dalam 4 sektor,yaitu:Pembuatan tujuan,Perkiraan dan pengurangan resiko,Pengembangan dan validasi,Perencanaan.

Prototipe
Prototipe dimulai dengan pengumpulan kebutuhan. Pengembang dan pelanggan bertemu dan mendefinisikan objektif keseluruh dari software, mengidentifikasi segala kebutuhan yang diketahui, dan area garis besar dimana definisi lebih jauh merupakan keharusan kemudian dilakukan ”perancangan kilat”. Perancangan kilat berfokus pada penyajian dari aspek-aspek software tersebut yang akan nampak bagi pelanggan. Perancangan kilat membawa kepada konstruksi sebuah prototipe. Prototipe tersebut dievaluasi oleh pelanggan dan dipakai untuk menyaring kebutuhan pengembangan software. Iterasi terjadi pada saat prototipe disetel untuk memenuhi kebutuhan pelanggan, dan pada saat yang sama memungkinkan pengembang untuk secara lebih baik memahami apa yang harus dilakukannya.

Selasa, 16 Februari 2010

MEMBUAT HALAMAN WEB SEDERHANA

Diposting oleh rahma bhie at 18.19

Untuk membuat sebuah halaman web sederhana dibutuhkan beberada komponen dasar, yaitu:
1. Wamp server
2. Web browser
3. Teks Editor
4. HTML Validator
Setelah Wamp server dan HTML Validator selesai diinstal, maka proses pembuatan halaman web sederhana dapat mulai dibuat, dengan langkah-langkah sebagai berikut:
1. Buka teks editor
2. Ketikkan kode-kode program untuk membuat halaman web sederhana
3. Simpan file menjadi satu folder dengan folder www pada direktori C:\wamp\www , dengan ekstensi .html
Contoh coding untuk membuat halaman web sederhana

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
 <html xmlns="http://www.w3.org/1999/xhtml"xml:lang="en"lang="en"> 
 <head><title>STUDI KASUS MODUL 1</title></head>
 <body background ="ibot.jpg">
 <h2> Halaman Web Sederhana </h2>
 <hr style = "color:#0000FF" />
 
 Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. 
 Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. 
 Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. 
 
 Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. 
 Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. 
 Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. 
 <hr style = "color:#FF0000" />
 
 
 <hr style = "color:#0000FF" align="right" width="200" />
 
 
 Diafrahma
 207533408582
 <img src="fun.jpg" align="right" border="20/" />
 </body>
 </html>

Hasil

Rahma Bhie

Mengenai Saya

Welcome

Blog Archive

Labels

Rabu, 31 Maret 2010

MEMBUAT LOGIN FORM SEDERHANA

Sabtu, 06 Maret 2010

SPECTRUM FREQUENCY

Selasa, 02 Maret 2010

Desain Layout Web Sederhana dengan code CSS

Rabu, 24 Februari 2010

The Powerfull Bigbang

Membuat Tabel dan Grafik Sederhana

Sabtu, 20 Februari 2010

REKAYASA PERANGKAT LUNAK

Selasa, 16 Februari 2010

MEMBUAT HALAMAN WEB SEDERHANA

Followers

My Blog List

Calendar

Clock