Minggu, 21 Februari 2016

Web Design (PERBEDAAN XAAMP, WAAMP, APP SERV) #sumber kaskus.co.id

mastah2 disini apakah ada yg tau ttg perbedaan xampp dgn wamp dan appserv,
kalo kesamaannya sih ane tau fungsinya untuk mbungkus apache+php+phpmyadmin+mysql jadi satu paket agar mudah proses instalasinya.
nah.. yg ane bingungin kalo nulis
Spoiler for skrip

[PHP][/PHP]
di xampp error, jadi penulisannya harus lengkap [PHP][/PHP]
kalo di appserv gak ada errornya.
mungkin mastah2 disini bisa menjelaskan kelebihan dan kekurangannya. nuhun
Recinay - 08/03/2011 07:11 PM

#2


Quote:
Original Posted By korti
mastah2 disini apakah ada yg tau ttg perbedaan xampp dgn wamp dan appserv,
kalo kesamaannya sih ane tau fungsinya untuk mbungkus apache+php+phpmyadmin+mysql jadi satu paket agar mudah proses instalasinya.
nah.. yg ane bingungin kalo nulis
Spoiler for skrip

[PHP][/PHP]
di xampp error, jadi penulisannya harus lengkap [PHP][/PHP]
kalo di appserv gak ada errornya.
mungkin mastah2 disini bisa menjelaskan kelebihan dan kekurangannya. nuhun

ane juga lagi belajar nie gan, kenapa agan g pake CMS aja, biar lbh gampang bwt web
Jack2001 - 08/03/2011 10:16 PM

#3


sebenarnya solusi yang tepat [/PHP]

dapat digunakan...

semoga membantu.
JamalRahmat - 08/03/2011 10:44 PM

#4


Sebenarnya tidak ada perbedaan tapi dari segi coding yang benar untuk php dimulai dari

Semoga dapat membantu...

Salam Hangat,
Jamal Rahmat
www.JamalRahmat.Com
Sunafets.exe - 08/03/2011 11:26 PM

#5


Quote:
Original Posted By Jack2001
sebenarnya solusi yang tepat bisa memakai short tag/ tag pendek dari penulisan PHP masih bisa digunakan. beberapa website masih mengenabled fungsi ini. untuk dapat menggunakan short tag bisa dilakukan dengan membuka PHP.INI dan bisa mencari tulisan short open tag, lalu jadikan On yang awalnya off. sehingga penulisan

[PHP] [/PHP]

dapat digunakan...


semoga membantu.

klo cara ngerubah php.ini di hostingan, tw caranya ga gan?
my signature can only be seen by those who have IQ below 255
Jack2001 - 09/03/2011 12:02 AM

#6


Quote:
Original Posted By Sunafets.exe
klo cara ngerubah php.ini di hostingan, tw caranya ga gan?
my signature can only be seen by those who have IQ below 255

bisa baca disini http://www.ogameslucky.com/cara-merubah-setting-php-ini-dari-cpanel-hosting,

atau pada cpanel bisa di nyari yang namanya php setting. tapi, kalau hosting gratisan gak ada gan...
Bintang90 - 14/03/2011 01:30 AM

#7


Ijin Nyimakkk sekalian untuk menambah wawasannn...
t.A.k.I.e.N - 14/03/2011 01:35 AM

#8


[FONT="Courier New"]
-xampp, ada ftp servernya, installer gede, bisa portabel
-appserver, bisa portabel
-wamp, ada menu di systray untuk mengakses fitur2 penting (ane pake ini)

kalau masalah
dyel0108 - 24/04/2011 06:45 PM

#9


[QUOTE=t.A.k.I.e.N;385126883][FONT="Courier New"]
-xampp, ada ftp servernya, installer gede, bisa portabel
-appserver, bisa portabel
-wamp, ada menu di systray untuk mengakses fitur2 penting (ane pake ini)

kalau masalah
agungeddy - 26/04/2011 12:10 AM

#10


Quote:
Original Posted By dyel0108
Gan, ane sekalian tanya deh ama mastah..
Hehehe
Gini gan, bisa ga ane pake xampp dan appserv secara bersamaan tapi kedua nya make database sql yang sama??
Mohon perncerahan nya ya gan..
Thanx sebelum nya gan..

Bisa.. bedain dulu port apache-nya...
xmen_tri - 19/05/2011 07:45 PM

#11


thx gan for info.

akhirnya berhasil.

ternyata eh ternyata,
ilovenasgor - 19/05/2011 08:17 PM

#12


[QUOTE=t.A.k.I.e.N;385126883][FONT="Courier New"]
.....
Note: Recommended dan biasakan pake [B]
ganaspati - 13/12/2011 05:09 PM

#13


sini kok sepi yah,,, hmmm mau belajar php nih gan, ,
ADP.Dieci - 13/12/2011 05:25 PM

#14


Quote:
Original Posted By ganaspati
sini kok sepi yah,,, hmmm mau belajar php nih gan, ,


trid lama disundul
lagnarok13 - 20/01/2012 08:06 AM

#15
re

ikut nyundul tread lama..biar rame...
regard

Ellys Directory

Web Design (PENGERTIAN FRAME WORK Yii2)


Ternyata benar kata temen2 di group yii Indonesia, semakin kesini Alhamdulillah saya merasakan bahwa Yii2 lebih mudah dibanding Yii1, Yii2 lebih mirip boilerplate atau web yang udah jadi, so kita tinggal cutomize aja.. Artikel ini merupakan lanjutan dari artikel sebelumnya Instalasi Yii via Composer (baca dulu jika belum). Pada artikel ini saya akan membahas tentang pengaturan dasar yang sebaiknya kita lakukan setelah instalasi Yii (baca disini). 
 

Disini, kita masih akan berhubungan dengan command prompt, dan composer. Dua tools “aneh” yang sepertinya kuno sekali hehe.. Oke tanpa perlu berpanjang kata.. silahkan disimak.
Check Requirement
Sebelum semuanya membuat Anda bingung, pastikan Anda mengecek kebutuhan minimum server untuk bisa menjalankan Yii. Yii telah menyediakan tools bagi Anda untuk melakukan checking secara otomatis.

Caranya via command prompt:
1
php.exe ../htdocs/advanced/requirements.php
Maka akan muncul resume beserta penjelasan (berikut pada pc saya) 

cmdYup ada 1 error, 4 warning, Anda bisa baca apakah signifikan? jika iya maka silahkan di fix dulu (googling yah.. hehe)

Memahami Directory Aplikasi Yii
Ketika kita install yii dengan advanced application template, maka kita akan menjumpai 6 folder utama dan beberapa file, berikut ini kira2 penjelasannya mengenai fungsi masing2 folder itu:
The root directory contains the following subdirectories:
  • backend - backend web application.
  • common - files common to all applications.
  • console - console application.
  • environments - environment configs.
  • frontend - frontend web application.

Root directory contains a set of files.
  • .gitignore contains a list of directories ignored by git version system. If you need something never get to your source code repository, add it there.
  • composer.json - Composer config described in detail below.
  • init - initialization script described in “Composer config described in detail below”.
  • init.bat - same for Windows.
  • LICENSE.md - license info. Put your project license there. Especially when opensourcing.
  • README.md - basic info about installing template. Consider replacing it with information about your project and its installation.
  • requirements.php - Yii requirements checker.
  • yii - console application bootstrap.
  • yii.bat - same for Windows.

Intinya, ada 3 aplikasi yaitu frontend, backend dan console.
  • Frontend adalah aplikasi web yang akan ditampilkan untuk end user.
  • Backend adalah aplikasi web yang berfungsi untuk administrator dalam mengelola aplikasi frontend.
  • Console adalah aplikasi yang digunakan untuk cron jobs and low-level server management. dan juga digunakan selama deployment aplikasi dan menghandle migrations dan assets.
Ada juga folder common yang  berisi file2 yang digunakan oleh lebih dari satu aplikasi, sebagai contoh global configuration seperti pengaturan koneksi database, atau general model seperti model user.
Yii2 sudah memperhitungkan pengembangan aplikasi enterprise, dimana sangat support untuk pengembangan aplikasi secara team menggunakan git. Kalo kita lihat pada Yii2 ini, ada beberapa file yang berakhiran “-local” yaitu main-local.php dan param-local.php, itu adalah file-file yang hanya untuk penggunaan local sehingga dikecualikan untuk diupload ke repository git, silahkan cek file .gitignore.
Terkait dengan parameter dan configuration pada Yii2, berikut ini urutannya yii membacanya:
advanced-app-configs
Predefined path aliases
  • @yii – framework directory.
  • @app – base path of currently running application.
  • @common – common directory.
  • @frontend – frontend web application directory.
  • @backend – backend web application directory.
  • @console – console directory.
  • @runtime – runtime directory of currently running web application.
  • @vendor – Composer vendor directory.
  • @web – base URL of currently running web application.
  • @webroot – web root directory of currently running web application.

Setting Database & Migrate
Yii2 udah nyiapin template database (tabel). Dan kerennya kodenya pun dah dibikinin mulai dari mekanisme login, logout, register dan lupa password, so kita tinggal nonton doang :).
  1. Buatlah database baru,  pada tutorial ini saya membuat database mysql dengan nama: yii2advanced
  2. Hubungkan projek yii Anda dengan database yang baru dibikin tadi, caranya buka file main-local.php yang terletak di directory common/config/main-local.php  pada bagian component.db
    1
    'dsn' => 'mysql:host=localhost;dbname=yii2advanced',
  3.  Jika sudah, maka langkah selanjutnya adalah migrate, gunanya adalah menggenerate tabel yang diperlukan untuk aplikasi kita. Caranya, masih via command prompt
    1
    php.exe ../htdocs/advanced/yii migrate
    migrateYup, si migrate tool ini menggenerate table user.
  4. Selesai deh..

Sekarang kita bisa cobain..
  1. Silahkan buka frontend di http://localhost/advanced/frontend/web/
  2. Silahkan register atau signup, pake data dummy aja
    signup
  3. Dan.. eng ing eng.. habis register otomatis login.
    signup
  4. Ok dengan Yii2 kita sudah nggak perlu puyeng lagi dengan login signup user via database.. bahkan ada fitur lupa password :)

Anda bisa juga mencoba untuk aplikasi backend-nya
Setting Virtual Host di XAMPP
Kalo kita perhatikan, url menuju aplikasi frontend maupun backend terlalu panjang, nah kita bisa sederhanakan,
  • http://localhost/advanced/frontend/web/ menjadi  http://front.end/
  • http://localhost/advanced/backend/web/ menjadi http://back.end/
Kalo kita pake XAMPP kita bisa atur menggunakan virtual host.. caranya
Buka file konfigurasi untuk virtual host, C:\xampp\apache\conf\extra\httpd-vhosts.confTambahkan kode seperti berikut ini

  1. 1
    2
    3
    4
    5
    6
    7
    8
    <VirtualHost *:80>
     DocumentRoot "C:/xampp/htdocs/advanced/frontend/web/"
     ServerName front.end
    </VirtualHost>
    <VirtualHost *:80>
     DocumentRoot "C:/xampp/htdocs/advanced/backend/web/"
     ServerName back.end
    </VirtualHost>
  2. Kemudian edit juga file hosts (local dns windows) yang terletak di C:\Windows\System32\drivers\etc, tambahkan kode berikut
    1
    2
    127.0.0.1 back.end
    127.0.0.1 front.end
  3. Restart Apache,
  4. Done…

Setting URL SEO Friendly
Sebagai mana Yii1, Yii2 juga menyediakan setting untuk url atau permalink yang cantik atau istilah kerennya.. SEO Friendly.. Gimana caranya? gampang kaka…
Gunakan htaccess sebagaimana yang direkomendasikan Yii.. checkout di http://www.yiiframework.com/doc-2.0/guide-installation.html, yaitu buat file dengan nama .htaccess yang berisi
  1. 1
    2
    3
    4
    5
    6
    7
    RewriteEngine on
    # If a directory or a file exists, use the request directly
    RewriteCond %{REQUEST_FILENAME} !-f
    RewriteCond %{REQUEST_FILENAME} !-d
    # Otherwise forward the request to index.php
    RewriteRule . index.php
    Letakkan file ini di directory /frontend/web/ dan /backend/web/.
    Triknya jika di windows, gunakan notepad untuk membuat file htaccess ini, lalu pada saat save gunakan tanda petik dua pada filenamenya untuk mengghindari error “.htaccess”
  2. Kemudian edit file main-local.php yang terletak di directory common/config/main-local.php  , tambahkan kode berikut:
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    return [
    'components' => [
    ...
    ...,
    'urlManager' => [
    'enablePrettyUrl' => true,
    'showScriptName' => false,
    ],
    ],
    ];
  3. Done.. liat bedanya :) Yaitu script index.php dihilangkan dari URL Address, controller URL jadi enak dilihat, dari :
    http://front.end/index.php?r=site%2Fabout menjadi http://front.end/site/about

Setting Composer
Bagian terakhir, adalah setting composer, file composer.json berisi konfigurasi dari projek kita ini, silahkan di edit file ini yang terletak di root directory dari projek kita yaitu C:\xampp\htdocs\advanced\composer.json
Update informasi dasar yaitu namedescriptionkeywordshomepage and support sesuaikan dengan project kita.

Bagian menarik disini adalah kita bisa menambahkan package atau library external yang diperlukan untuk aplikasi kita pada bagian require . Syaratnya, lirary external tersebut harus ada di  packagist.org (gak harus sih.. untuk level advanced :)).
Setelah update composer.json maka untuk mengupdatenya buka kembali command prompt, ketik:
  • Masuk ke directory root projek kita
    1
    cd c:\xampp\htdocs\advanced
  • Update composer
    1
    C:\xampp\php\php.exe  C:\xampp\php\composer.phar update --prefer-dist
  • Tunggu sebentar karena mereka lagi install n update buat kita :)
  • done
signup
Oke saya kira cukup itu dulu (capek nulisnya :) capek juga kan bacanya) mudah2an manfaat..

Web Design (PENGERTIAN FRAME WORK Yii1)

Yii adalah sebuah source framework menggunakan bahasa pemrograman PHP yang dibuat oleh Qiang Xue tanggal 01 Januari 2008. Sebelumnya Qiang juga mengembangkan framework PRADO selama bertahun-tahun. YII secara resmi dirilis untuk maemenuhi kebutuhan para pengembang perangkat lunak berbasis web. Beberapa pengembang perangkat lunak merespon positif atas perkembangan framework PHP. 

Yii merupakan framework (kerangka kerja) PHP berbasis-komponen, berkinerja tinggi untuk pengembangan aplikasi Web berskala-besar. Yii menyediakan reusability maksimum dalam pemrograman Web dan mampu meningkatkan kecepatan pengembangan secara signifikan. Nama Yii (dieja sebagai /i:/) singkatan dari “Yes It Is!“. Aplikasi yang dibangun menggunakan framework YII membutuhkan beberapa file pustaka (lib) yang disediakan dalam framework YII, dan menggunakan metode pemrgoraman berorientasi objek, atau dalam bahasa inggris disebut OOP (Object Oriented Programming) . Membangun sebuah aplikasi dengan framework YII, pengembang cukup menggunakan kelas yang tersedia di PHP sendiri. Semua yang dibangun menggunakan YII menggunakan arsitektur Model-View-Controller (MVC). Framework YII memberlakukan dan mengatur cara penyimpanan kode program yang diletakkan dalam folder model dalam folder/models/, view dalam folder/view, dan controller dalam folder/controller/. Sehingga sangat terstruktur dan efisien dalam penulisan kode program. Berikut merupakan respon yang paling tepat dan akurat untuk yang baru dengan Yii: 

Apakah Yii cepat? … Apakah Yii aman? … Apakah Yii profesional? … Apakah Yii cocok untuk projek saya berikutnya? … Yes, it is!

1. Persyaratan

       Untuk menjalankan aplikasi Web berbasis Yii, Anda memerlukan server Web yang mendukung PHP 5.1.0. Bagi para pengembang yang ingin menggunakan Yii, mengerti pemrograman berorientasi-objek (OOP) akan sangat membantu, karena Yii merupakan framework OOP murni.

2. Yii Paling Cocok untuk Apa?

       Yii adalah framework pemrograman umum Web yang bisa dipakai untuk mengembangkan semua jenis aplikasi Web. Dikarenakan sangat ringan dan dilengkapi dengan mekanisme caching yang canggih, Yii sangat cocok untuk pengembangan aplikasi dengan lalu lintas-tinggi, seperti portal, forum, sistem manajemen konten (CMS), sistem e-commerce, dan lain-lain.

3. Bagaimana Yii Dibandingkan dengan Framework Lain?

       Seperti kebanyakan PHP framework, Yii adalah MVC framework. Yii melampaui framework PHP lain dalam hal efisiensi, kekayaan-fitur, dan kejelasan dokumentasi. Yii didesain dengan hati-hati dari awal agar sesuai untuk pengembangan aplikasi Web secara serius. Yii bukan berasal dari produk pada beberapa proyek maupun konglomerasi pekerjaan pihak-ketiga. Yii adalah hasil dari pengalaman kaya para pembuat pada pengembangan aplikasi Web dan investigasi framework pemrograman Web dan aplikasi yang paling populer.

Web Design (PENGERTIAN FRAME WORK CI)

CodeIgniter merupakan salah satu dari sekian banyak framework PHP yang sudah ada. CodeIgniter dikembangkan itu sendiri di kembangkan oles Rick Ellis. CodeIgniter adalah aplikasi open source (Gratis) berupa framework dengan model MVC (Model, View, Controller) yang di fungsikan untuk membuat sebuah website dinamis bebasis PHP. CodeIgniter dirilis pertama kali pada 28-02-2006. Versi stabil yang akhir ialah V 2.1.3.

Selanjutnya sedikit kita bahas mengenai pengertian dari Framework agar kita tidak bertanya-tanya …???
Framework ialah merupakan kumpulan dari fungsi-fungsi atau prosedur-prosedur & class-class yang memiliki tujuan tertentu yang sudah siap dipakai maka dapat lebih mempermudah dan cepat dalam menyelesaikan pekerjaan dari seorang programer, tanpa harus membuat fungsi/class/prosedur dari nol.
Lalu Mengapa Anda memakai Framework …???
Pertama yaitu untuk mempercepat dan mempermudah dalam pembuatan website.
Kedua yaitu Relatif memudahkan dalam proses maintenance karena sudah ada pola tertentu dalam sebuah framework (dengan syarat programmer mengikuti pola standar yang ada).
Ketiga lalu pada umumnya framework menyediakan fasilitas-fasilitas yang umum dipakai sehingga kita tidak perlu lagi membangun dari awal (contohnya validasi, ORM, pagination, multiplet database, pengaturan session, scaffolding, error handling, dan yang lainya).
Ke empat Lebih bebas dalam pengembangan jika dibandingkan dengan CMS (Content Management System).
Sekarang kita lanjudkan lagi membahas apa pengertian dari MVC (Model, View, Controller)…???

Model MVC merupakan konsep yang cukup populer dalam pembangunan aplikasi web. MVC (Model, View, Controller) itu memisahkan antara logika pembuatan kode dengan pembuatan template website/tampilan dari web. Jika kita menggunakan Model-View-Controller (MVC) menjadikan pembuatan sebuah website akan menjadi lebih terstruktur, lebih singkat atau menyingkat koding dalam pengkodingan dan lebih sederhana.
Secara sederhana konsep MVC terdiri dari 3 bagian yaitu bagian pertama yaitu Model, lalu View dan yang terakhir adalah bagian Controller. Di dalam sebuah web yang dinamis paling tidak terdiri dari 3 hal utama yang menyusunya, yaitu basis data, logika aplikasi & cara menampilkan halaman web. 3 hal itu direpresentasikan menggunakan MVC yaitu model untuk basis data lalu controller untuk logika aplikasi, dan view untuk menampilkan halaman website tersebut.

Ketiga jenis baigan itu dapat dijelaskan sebagai berikut:
View merupakan bagian yang menangani proses presentation logic. Pada web bagian ini biasanya berupa file template HTML, yang diatur controller. Sedangkan View berfungsi sebagai penerima dan merepresentasikan data kepada pengguna (user). Nah pada bagian ini tidak memiliki hak akses langsung di bagian model.
Sedangkan Model itu sendiri biasanya berhubungan langsung ke-database untuk memanipulasi data (insert, update, delete, search), menangani validasi dari controller, tetapi tidak controller itu tidak berhubungan langsung dengan bagian view. yang terakhir yaitu Controller yang merupakan bagian pengatur dari bagian model & bagian view, controller memiliki fungsi sebagai penerima request & data dari pengguna (user) kemudian menentukan apa yang akan diproses oleh aplikasi.

Lalu apa manfaatnya menggunakan CodeIgniter (CI)…….???
Ada beberapa kelebihan CodeIgniter (CI) dibandingkan dengan Framework PHP lain diantaranya :
  1. Performa sangat cepat : salah satu alasan tidak menggunakan framework adalah karena eksekusinya yang lebih lambat daripada PHP from the scracth, tapi Codeigniter sangat cepat bahkan mungkin bisa dibilang codeigniter merupakan framework yang paling cepat dibanding framework yang lain.
  2. Konfigurasi yang sangat minim (nearly zero configuration) : tentu saja untuk menyesuaikan dengan database dan keleluasaan routing tetap diizinkan melakukan konfigurasi dengan mengubah beberapa file konfigurasi seperti routes.php, config.php, namun untuk menggunakan CI dengan settingan yang standar, anda tidak perlu merubah banyak setingan di file yang ada pada folder config.php.
  3. Banyak sekali komunitas : Nah dengan adanya banyaknya komunitas CI ini, memudahkan kita untuk berinteraksi dengan yang lain, baik itu bertanya atau teknologi terbaru.
  4. Dokumentasi yang sangat lengkap : Setiap paket instalasi codeigniter sudah disertai user guide yang sangat bagus dan lengkap untuk permulaan, bahasanya pun juga mudah dipahami. Dan masuh banyak lagi yang lainnya.

Web Design (PENGERTIAN BOOTSTRAP)

Bootstrap adalah sebuah framework CSS yang menyediakan kumpulan komponen-komponen antarmuka dasar pada web yang telah dirancang sedemikian rupa untuk digunakan bersama-sama. Selain komponen antarmuka, Bootstrap juga menyediakan sarana untuk membangunlayout halaman dengan mudah dan rapi, serta modifikasi pada tampilan dasar HTML untuk membuat seluruh halaman web yang dikembangkan senada dengan komponen-komponen lainnya.Bootstrap dibuat untuk memberikan sekumpulan perangkat yang dapat digunakan untuk membangun website sederhana dengan mudah.
Bagaimana Cara instalasi Bootstrap ?
   
    Untuk menggunakan Boostrap pada aplikasi kita, tentunya kita harus memiliki Bootstrap terlebih dahulu. Buka website resmi Bootstrap, http://getbootstrap.com/ dan klik tombol "Download Bootstrap" untuk memulai download bootstrap.


Selesai download, anda akan memiliki file bootstrap.zip  yang berisi file-file yang dibutuhkan untuk menggunakan Bootstrap. Ekstrak file tersebut pada tempat yang sama dengan bootstrap.html , sehingga sekarang kita memiliki file seperti berikut:
 
 




 
Yang masing - masing direktori berisi :
1. direktori "css" memiliki empat buah file didalamnya yaitu :
  • bootstrap.css
  • bootstrap.min.css
  • bootstrap-responsive.css
  • bootstrap-responsive.min.css
2.    direktori "img memiliki dua buah file didalamnya yaitu :
  • glyphicons-halflings.png
  • glyphicons-halflings-white.png
3. direktori "js" memiliki dua buah file didalamnya yaitu :
  • bootstrap.js
  • bootstrap.min.js 

Setelah itu Siapkan Aplikasi Notepad++ jika saudara belum punya maka download dihttp://notepad-plus-plus.org/download/v6.7.4.html setelah itu pilih :


kemudian download dan apliksi langsung bisa digunakan.
Berikut contoh script html untuk membuat tampilan seperti facebook :

  1. buka aplikasi notepad++  
  2. kemudian klik file new atau Ctrl + n
  3. beri nama latihanbootstrap.html
  4. kemudian ketikkan program ini

    <!DOCTYPE html>

    <html lang="en">

    <head>

    <link rel="shortcut icon" href="icon.png" />

    <title>Face-mu</title>

    <link rel="stylesheet" href="facemu.css" type="text/css" />

    </style>

    </head>

    <body>

    <div class="header">

    <div class="logo"><img src="facemu.png"></div>

    <div class="kotak">

    <br />

    <input type="button" value="Masuk" id="button_masuk">

    <br />

    </div>

    <div class="kotak">

    Password :

    <br />

    <input type="text" size=20>

    <br />

     Lupa kata sandi Anda?

    </div>

    <div class="kotak">

     Email :

     <br />

     <input type="text" size=30>

     <br />

     <input type="checkbox">Biarkan saya tetap masuk

     </div>

     </div>

     <div class="isi">

     <div class="isi_kiri">

     <br />

     <br />

     <br />

     Face-mu membantu Anda terhubung dan berbagi<br />

     dengan orang-orang dalam kehidupan Anda di<br />

     Indonesia.

     <br />

     <br />

     <br />

     <img src="indonesia.png" width=400>

     </div>

     <div class="isi_kanan">

     <br />

     <font size=5><b>Mendaftar</b></font><br />

     Gratis, sampai kapanpun

     <hr color="#4283d4" width=400 align="left"/>

     <table cellpadding=5>

     <tr>

     <td>Nama Depan</td>

     <td> : <input type="text" size=25 /></td>

     </tr>

     <tr>

     <td>Nama Belakang</td>

     <td> : <input type="text" size=25 /></td>

     </tr>

     <tr>

    <td>Email Anda</td>

    <td> : <input type="text" size=25 /></td>

    </tr>

    <tr>

    <td>Masukkan Ulang Email</td>

    <td> : <input type="text" size=25 /></td>

    </tr>

    <tr>

    <td>Kata Sandi Baru</td>

    <td> : <input type="text" size=25 /></td>

    </tr>

    <tr>

    <td>Saya Seorang</td>

    <td> : <select name="kelamin">

    <option>Wanita</option>

    <option>Pria</option>

    </select></td>

    </tr>

    <tr>

    <td>Tanggal Lahir</td>

    <td> : <select name="tanggal">

    <option>01</option>

    <option>02</option>

    <option>03</option>

    <option>04</option>

    <option>05</option>

    <option>06</option>

    <option>07</option>

    <option>08</option>

    <option>09</option>

    <option>10</option>

    <option>11</option>

   <option>12</option>

   <option>13</option>

   <option>14</option>

   <option>15</option>

   <option>16</option>

   <option>17</option>

   <option>18</option>

   <option>19</option>

   <option>20</option>

   <option>21</option>

  <option>22</option>

  <option>23</option>

  <option>24</option>

  <option>25</option>

  <option>26</option>

  <option>27</option>

  <option>28</option>

  <option>29</option>

  <option>30</option>

  <option>31</option>

  </select>

  <select name="bulan">

  <option>Januari</option>

  <option>Februari</option>

  <option>Maret</option>

  <option>April</option>

  <option>Mei</option>

  <option>Juni</option>

  <option>Juli</option>

  <option>Agustus</option>

  <option>September</option>

  <option>Oktober</option>

  <option>November</option>

  <option>Desember</option>

  </select>

  <select name="tahun">

  <option>1980</option>

  <option>1981</option>

  <option>1982</option>

  <option>1983</option>

  <option>1984</option>

  <option>1985</option>

  <option>1986</option>

  <option>1987</option>

  <option>1988</option>

  <option>1989</option>

 <option>1990</option>

  <option>1991</option>

  <option>1992</option>

  <option>1993</option>

  <option>1994</option>

  <option>1995</option>

  <option>1996</option>

  <option>1997</option>

  <option>1998</option>

  <option>1999</option>

  <option>2000</option>

  </select>

  </td>

  </tr>

   <tr>

   <td></td>

   <td><font size=1>Mengapa saya perlu mengisinya?</font></td>

  </tr>

  </table>


  <center><input type="button" value="Mendaftar" id="button_masuk"></center>

  <hr color=#4283d4 width=400 align="left"/>

  <font size=1>Buat halaman <font color="black">untuk selebritis, grup musik, atau bisnis</font></font>

  </div>

  </div>

  <div class="footer" align="center">

 <marquee onmouseover="this.stop()" onmouseout="this.start()" behavior="scroll" direction="left"      bgcolor="#4283d4">Belajar Boostrap</marquee>

  </div>

  
Setelah itu simpan file tersebut dan jalankan . jika benar maka hasil Outputnya Seperti ini.

s












Terima Kasih dan semoga bermanfaat