• Tidak ada hasil yang ditemukan

Cara Membuat Halaman Form Dengan Bootstrap CDN

N/A
N/A
Protected

Academic year: 2021

Membagikan "Cara Membuat Halaman Form Dengan Bootstrap CDN"

Copied!
12
0
0

Teks penuh

(1)

Cara Membuat Halaman Form Dengan Bootstrap CDN

Fitria Arnita

fitriaarnita23@gmail.com

Abstrak

Bootstrap adalah front-end framework yang solek, bagus dan luar

biasa yang mengedapankan tampilan untuk mobile device

(Handphone, smartphone dll.) guna mempercepat dan mempermudah

pengembangan website. Bootstrap menyediakan HTML, CSS dan

Javascript siap pakai dan mudah untuk dikembangkan

.

Bootstrap

merupakan framework untuk membangun desain web secara

responsif. Artinya, tampilan web yang dibuat oleh bootstrap akan

menyesuaikan ukuran layar dari browser yang kita gunakan baik di

desktop, tablet ataupun mobile device. Fitur ini bisa diaktifkan

ataupun dinon-aktifkan sesuai dengan keinginan kita sendiri. CDN

kepanjangan dari Content Delivery Network atau Content Distribution

Network

atau

dalam

bahasa

indonesia

disebut

Jaringan

Pendistribusian Konten. CDN adalah sebuah sistem jaringan server

untuk mendistribusikan konten yang ada dalam sebuah aplikasi/web

ke berbagai pengakses/pengguna di berbagai belahan dunia agar

data/konten yang dikirim diterima lebih cepat. Dalam hal ini saya

(2)

Pendahuluan

Bootstrap merupakan framework gratis front-end untuk pengembangan

web lebih cepat dan lebih mudah, bootstrap termasuk HTML dan CSS

berdasarkan desain template untuk tipografi, bentuk, tombol, tabel, navigasi, kata

modal, komidi putar gambar dan banyak plugin JavaScript opsional lainnya, serta

bootstrap juga memberikan Anda kemampuan untuk dengan mudah membuat

desain responsif.

Keuntungan Menggunakan Bootstrap

Mudah digunakan

: Siapa saja dengan pengetahuan hanya dasar HTML

dan CSS dapat mulai menggunakan Bootstrap

Fitur responsif

: CSS responsif Bootstrap ini menyesuaikan dengan

ponsel, tablet, dan desktop.

Pendekatan ponsel pertama

: Dalam Bootstrap 3, gaya mobile pertama

merupakan bagian dari kerangka inti.

Kompatibilitas

browser: Bootstrap kompatibel dengan semua browser

modern (Chrome, Firefox, Internet Explorer, Safari, dan Opera)

Cara Mendapatkan Bootstrap

Jika kalian ingin mendapatkan Bootstrap kalian bisa mendapatkannya Di

getbootstrap.com.

Atau kalian juga bisa mensertakan saja sebuah CDN Bootstrap.

Apa itu Bootstrap CDN

Jika kalian tidak mau mendownload Bootstrap kalian bisa mendapatkannya

dari CDN.

MaxCDN memberikan dukungan CDN untuk CSS Bootstrap dan JavaScript.

Juga termasuk jQuery:

<!-- Latest compiled and minified CSS -->

<link rel="stylesheet"

(3)

<!-- Latest compiled JavaScript -->

<script

src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script

>

Banyak pengguna sudah download Bootstrap dari MaxCDN ketika

mengunjungi situs lain. Akibatnya, hal itu akan dimuat dari cache ketika mereka

mengunjungi situs Anda, yang mengarah ke waktu loading lebih cepat. Juga,

kebanyakan CDN akan memastikan bahwa sekali pengguna meminta file dari itu,

maka akan dilayani dari server terdekat dengan mereka, yang juga mengarah ke

waktu loading lebih cepat.

(4)

Pembahasan

Sebelum membuat halaman form, saya menggunakan bootstrap CDN.

1.

Buka Notepad++nya, karena saya memakai Notepad++

2.

Buat scriptnya

Yang pertama kita buat script untuk Nama

fitriaarnita

(5)

Yang kedua buat script untuk Email

Yang ketiga buat script untuk Alamat Dan Jenis Kelamin

fitriaarnita

fitriaarnita

(6)

Yang ke empat buat script untuk Agama

Yang ke empat buat script untuk Pekerjaan Dan Status

fitriaarnita

fitriaarnita

(7)

Yang ke lima buat script untuk Jenjang

Yang terakhir buat script untuk Sign Up

fitriaarnita

(8)

Kemudian

Save

Klik

localdisk C

(karena folder saya berada di disk C)

Kemudian buka folder

Xampp

fitriaarnita

fitriaarnita

(9)

Lalu save di folder

Htdoc

Karena saya mempunyai folder khusus, saya menyimpan di folder

cyber dengan nama file

hal form.html

(bisa dengan nama lain,

yang penting .html dan type filenya all files jika tidak ada bisa

dengan html) klik Save.

fitriaarnita

fitriaarnita

(10)

Dan hasilnya seperti ini

(11)

Penutup

Bootstrap merupakan framework gratis front-end untuk pengembangan

web lebih cepat dan lebih mudah, bootstrap termasuk HTML dan CSS

berdasarkan desain template untuk tipografi, bentuk, tombol, tabel, navigasi, kata

modal, komidi putar gambar dan banyak plugin JavaScript opsional lainnya, serta

bootstrap juga memberikan Anda kemampuan untuk dengan mudah membuat

desain responsif.

Keuntungan Menggunakan Bootstrap

Mudah digunakan

: Siapa saja dengan pengetahuan hanya dasar HTML

dan CSS dapat mulai menggunakan Bootstrap

Fitur responsif

: CSS responsif Bootstrap ini menyesuaikan dengan

ponsel, tablet, dan desktop.

Pendekatan ponsel pertama

: Dalam Bootstrap 3, gaya mobile pertama

merupakan bagian dari kerangka inti.

Kompatibilitas

browser: Bootstrap kompatibel dengan semua browser

modern (Chrome, Firefox, Internet Explorer, Safari, dan Opera).

CDN adalah sebuah sistem jaringan server untuk mendistribusikan konten

yang ada dalam sebuah aplikasi/web ke berbagai pengakses/pengguna di

berbagai belahan dunia agar data/konten yang dikirim diterima lebih cepat.

Sekian tutorial dari saya dan selamat mencoba ya

(12)

Referensi

Pengalaman Pribadi

Biografi

hai hai nama saya Fitria Arnita, saat ini saya sibuk kuliah dan

bekerja. Saya kuliah di salah satu Perguruan Tinggi ilmu komputer di

Tangerang angkatan 2014 sampai saat ini. Rumah saya berada di daerah

Kabupaten Tangerang beralamat Dasana Indah. Kalo dengan hobi, saya lebih

menyukai anime (kartun jepang), saya sampai saat ini belum pernah mengikuti

organisasi, saya jurusan Sistem Informasi dan konsentrasinya Sistem Informasi

Manajemen. Terima kasih ya semoga bermanfaat

Referensi

Dokumen terkait

Fungsi Pelaksana sebagaimana dimaksud dalam Pasal 8 merupakan fungsi Pelaksana BPBD dilaksanakan secara terkoordinasi dan terintegrasi dengan satuan kerja perangkat

Berdasarkan dari uraian diatas, maka adapun tujuan dari penelitian ini, yaitu (1) untuk mengetahui kompetensi pengetahuan IPA kelompok siswa yang dibelajarkan melalui

Pada saat Peraturan Daerah ini berlaku, Pajak yang masih terutang berdasarkan Peraturan Daerah mengenai Pajak Bea Perolehan Hak atas Tanah dan Bangunan sebagaimana dimaksud

Sebuah studi yang dilakukan oleh Needle dan Donherry (Santrock, 2003) menemukan bahwa perceraian orang tua yang terjadi saat anak berusia remaja menunjukkan

Hasil penelitian yang dicapai, disimpulkan bahwa sistem ini sudah membantu dalam perencanaan risiko dengan dapat melakukan analisa risiko yang mungkin terjadi pada

Penelitian ini menunjukkan bahwa terdapat hubungan antara pengetahuan tentang K3 dengan kejadian kecelakaan kerja pada kelompok nelayan (p=0,000), terdapat hubungan antara

Laporan tugas akhir ini membahas tentang proses perancangan dan pembangunan sistem informasi laboratorium untuk melayani pelanggan laboratorium MIPA Terpadu secara

Karena jika level tie beam dibawah tanah dan harus kita gali kembali, akan memakan waktu yang tidak sedikit, terlebih lagi harus mengurug tie beam tersebut lagi, jadi ada