Tutorial Implementasi Jquery Mobile dan JSP. 1. Definisi Jquery Mobile

Ukuran: px
Mulai penontonan dengan halaman:

Download "Tutorial Implementasi Jquery Mobile dan JSP. 1. Definisi Jquery Mobile"

Transkripsi

1 Tutorial Implementasi Jquery Mobile dan JSP 1. Definisi Jquery Mobile Jquery mobile : framework tampilan berbasis HTML 5, sehingga situs responsive baik di desktop, tablet atau smarphone. 2. Download Jquery Mobile Download dari web resminya : Klik latest stable, download versi extract file zip yang didownload, maka akan mendapatkan full code Jquery js,css dan demos sample. 1

2 3. Buka Project JSP pada perkuliahan sebelumnya di dalam netbeans anda, copy paste beberapa file/folder di jquery mobile berikut ke project anda : a. Folder demos/_assets, copy semua folder _assets ke project Netbeans b. Folder demos/js, buat folder dengan nama js di project netbeans, kemudian copy 2 file : jquery.min.js dan jquery.mobile min.js c. Folder demos/css/themes, copy folder themes ke dalam project netbeans. 2

3 4. Saat nya mengedit code index.jsp, pertama yang perlu di perhatikan adalah mengimport library js ke dalam index.jsp dengan lokasi yang benar. Diantara <head></head> masukan script berikut : <script src="js/jquery.min.js"></script> <script src="_assets/js/index.js"></script> <script src="js/jquery.mobile min.js"></script> 5. Menambahkan library datepicker apabila suatu saat form anda ingin menggunakan jquery datepicker ( pilihan inputan tanggal ) : 3

4 <script src=" <script id="mobile-datepicker" src=" 6. Menambahkan library css : <link rel="stylesheet" href="themes/default/jquery.mobile min.css"> <link rel="stylesheet" href="_assets/css/jqm-demos.css"> <link rel="stylesheet" href=" <link rel="stylesheet" href=" 7. Sehingga kurang lebih seperti ini : 8. Setelah itu, modifikasi bentuk form agar sesuai dengan jquery mobile, kita tidak perlu lagi menggunakan table,tr dan td. tetapi untuk menuliskan text nya kita perlu menggunakan tag <label> dengan aturan < label for= id objectnya > Tetapi khusus inputan type text dan yang berbentuk textbox kita cukup bermain di atribut placeholder. Kurang lebih menjadi seperti ini : <input type="text" id="txtnim" name="txtnim" placeholder ="Masukkan Nim"/> <input type="text" id="txtnama" name="txtnama" placeholder="masukkan Nama"/> <textarea id="txtalamat" name="txtalamat" placeholder="masukkan Alamat"></textarea> 9. Untuk radio kita perlu memberikan group dan legend, menjadi seperti ini : <fieldset data-role="controlgroup" data-type="horizontal" data-mini="true"> <legend>jenis Kelamin</legend> <input type="radio" id="txtjk1" name="txtjk" value="l" checked /><label for="txtjk1"> Laki-Laki</label> <input type="radio" id="txtjk2" name="txtjk" value="p" /><label for="txtjk2"> Perempuan</label> </fieldset> 4

5 10. Untuk lebih rapi, form di dalam div dengan class ui-corner-all dan custom-corner, header didalam div ui-bar dan ui-bar-a, untuk benda form di dalam div ui-body dan ui-body-a. susunan code seperti berikut : 11. Test running,tampilan sementara akan seperti ini : 12. Jangan lupa, form edit dibuat dengan susunan yang sama, buang format dengan table,tr dan td. Code jadi seperti berikut : 13. Test running, klik button edit, tampilan seperti berikut : 5

6 14. Untuk table data tambahkan data-role= table dan class= ui-responsive table-stroke id="table-data" data-mode="columntoggle" : 15. Untuk tombol edit dan delete tambahkan attribute data-inline= true 16. Tampilan menjadi : 6

7 17. Jika ingin menggunakan inputan tanggal, cukup tambahkan data-role=date di input an text. <input type="text" data-role="date" placeholder="masukkan Tanggal Lahir" > Code index.jsp yang sudah jadi bisa anda download terpisah di postingan blog 7

X/HTML5 Form. Auriza Akbar 25 Mei 2012

X/HTML5 Form. Auriza Akbar 25 Mei 2012 X/HTML5 Form Auriza Akbar auriza.akbar@gmail.com 25 Mei 2012 Form Form Komponen halaman web yang memiliki kontrol-kontrol formulir: text field, text area, button, radio button, checkbox, User dapat berinteraksi

Lebih terperinci

[SANGAT MUDAH] Cara Membuat Tab dengan Bootstrap

[SANGAT MUDAH] Cara Membuat Tab dengan Bootstrap [SANGAT MUDAH] Cara Membuat Tab dengan Bootstrap Oleh: Arinadi Nur Rohmad Asalamualaikum.. Bagi yang seorang yang belum paham betul JQuery seperti saya, membuat Tab adalah pekerjaan yang cukup sulit..

Lebih terperinci

Cara Membuat Halaman Form Dengan Bootstrap CDN

Cara Membuat Halaman Form Dengan Bootstrap CDN Cara Membuat Halaman Form Dengan Bootstrap CDN Fitria Arnita 23@gmail.com Abstrak Bootstrap adalah front-end framework yang solek, bagus dan luar biasa yang mengedapankan tampilan untuk mobile device (Handphone,

Lebih terperinci

Otodidak Desain dan Pemrograman Website

Otodidak Desain dan Pemrograman Website Otodidak Desain dan Pemrograman Website Sanksi Pelanggaran Pasal 113 Undang-Undang Nomor 28 Tahun 2014 tentang Hak Cipta 1. Setiap Orang yang dengan tanpa hak melakukan pelanggaran hak ekonomi sebagaimana

Lebih terperinci

KURSUS ONLINE JASA WEBMASTERS

KURSUS ONLINE JASA WEBMASTERS KURSUS ONLINE JASA WEBMASTERS HTML FORM JASA WEBMASTERS Jl. Ringin Raya No 124A Condong Catur, Sleman, Yogyakarta FORM 9.1 Form Input HTML Form digunakan untuk mengumpulkan data dari user atau pengguna

Lebih terperinci

WELCOME MESSAGE WE STARTED AT. 10 March 2016 dimana komunitas ini didirikan

WELCOME MESSAGE WE STARTED AT. 10 March 2016 dimana komunitas ini didirikan WELCOME MESSAGE 10 March 2016 dimana komunitas ini didirikan dari ide mahasiswa STMIK Indonesia Jakarta dan mulai mengadakan Workshop dan bimbingan pembelajaran dari tempat ke tempat dengan tujuan memajukan,

Lebih terperinci

Desain Web. MODUL 2 Desain Form

Desain Web. MODUL 2 Desain Form 1 MODUL 2 Desain Form A. TUJUAN 1. Mampu membuat form dalam HTML 2. Mampu menggunakan input dalam HTML 3. Mampu menggunakan select dalam HTML 4. Mampu menggunakan textarea dalam HTML B. PETUNJUK 1. Awali

Lebih terperinci

Ruang Kerja DREAMWEAVER MX 2004 :

Ruang Kerja DREAMWEAVER MX 2004 : 1.1 Pengertian Macromedia Dreamweaver : merupakan sebuah HTML editor Profesional untuk mendesain secara visual dan mengelola situs web beserta halaman- web. 1.2 Spesifikasi PC untuk menjalankan DREAMWEAVER

Lebih terperinci

Panduan Web Desain Menggunakan Editor Macromedia Dreamweaver 8

Panduan Web Desain Menggunakan Editor Macromedia Dreamweaver 8 Panduan Web Desain Menggunakan Editor Macromedia Dreamweaver 8 Oleh Angga Radhitya Rachmat, S.Kom radhizu05@gmail.com 0882 6801 9510 0819 5724 1619 KATA PENGANTAR Puji syukur penulis panjatkan kehadirat

Lebih terperinci

Tag dasar yang akan kita gunakan untuk membuat form di HTML adalah tag form, input, textarea, select dan option.

Tag dasar yang akan kita gunakan untuk membuat form di HTML adalah tag form, input, textarea, select dan option. Form Form biasanya digunakan untuk mengumpulkan data dari pengunjung web kita. Mulai dari form untuk login, form kontak, form untuk pendaftaran user, bahkan untuk mengirimkan data antar halaman web Tag

Lebih terperinci

Nama: ahmad edi purwanto. Nim: Tugas uts web statis. Tutorial cara penggunaan suatu framework CSS

Nama: ahmad edi purwanto. Nim: Tugas uts web statis. Tutorial cara penggunaan suatu framework CSS Nama: ahmad edi purwanto Nim:12111027 Tugas uts web statis. Tutorial cara penggunaan suatu framework CSS Pengertian dasar dari Framework itu sendiri adalah; sebuah konsep yang memiliki struktur serta terorganisir

Lebih terperinci

PRAKTIKUM PEMROGRAMAN WEB MODUL 7 TWITTER BOOTSTRAP

PRAKTIKUM PEMROGRAMAN WEB MODUL 7 TWITTER BOOTSTRAP PRAKTIKUM PEMROGRAMAN WEB MODUL 7 TWITTER BOOTSTRAP Disusun oleh: (Nama) (NIM) PROGRAM STUDI TEKNIK INFORMATIKA FAKULTAS TEKNIK UNIVERSITAS MUHAMMADIYAH JEMBER 2015 Modul 7 Twitter Bootstrap I. Tujuan:

Lebih terperinci

MODUL 1 PENGENALAN HTML

MODUL 1 PENGENALAN HTML MODUL 1 PENGENALAN HTML TUJUAN PRAKTIKUM : 1. Praktikan memahami tentang HTML, CSS, frame dan JS pada HTML serta kegunaannya. 2. Praktikan memahami bagaimana cara membuat web menggunakan HTML, CSS dan

Lebih terperinci

PELATIHAN PHP ALUMNI DAN CALON ALUMNI INSTITUT BISNIS DAN INFORMATIKA STIKOM SURABAYA. By: Julianto Lemantara, S,Kom., M.Eng

PELATIHAN PHP ALUMNI DAN CALON ALUMNI INSTITUT BISNIS DAN INFORMATIKA STIKOM SURABAYA. By: Julianto Lemantara, S,Kom., M.Eng PELATIHAN PHP ALUMNI DAN CALON ALUMNI INSTITUT BISNIS DAN INFORMATIKA STIKOM SURABAYA By: Julianto Lemantara, S,Kom., M.Eng LATAR BELAKANG PELATIHAN Coba simak beberapa lowongan PHP programmer berikut:

Lebih terperinci

Menggunakan Vibration pada Cordova

Menggunakan Vibration pada Cordova Menggunakan Vibration pada Cordova Juli 2015 Tingkat: Oleh : Feri Djuandi Pemula Menengah Mahir Artikel kali ini akan menjelaskan cara menggetarkan perangkat mobile dengan menggunakan API Cordova. Teknik

Lebih terperinci

Tugas uts web statis

Tugas uts web statis Tugas uts web statis Nama :Tri subadar NIM :12141388 Prodi :Teknik informatika S1 (malam) Mata kuliah :Perogram web setatis METRO UI METRO UI CSS Fremwork yang dapat di gunakan untuk membuat websait dengan

Lebih terperinci

AJAX Framework. Pemrograman Web 1. Genap

AJAX Framework. Pemrograman Web 1. Genap AJAX Framework Pemrograman Web 1 Genap 2011-2012 Framework Apa itu Framework (Software Framework)? Kumpulan pustaka-pustaka (library) perangkat lunak yang script-nya dapat digunakan kembali (reusable)

Lebih terperinci

Tabel dan Form HTML. Kuliah #2. Dept. Ilmu Komputer IPB 2016

Tabel dan Form HTML. Kuliah #2. Dept. Ilmu Komputer IPB 2016 Tabel dan Form HTML Kuliah #2 Dept. Ilmu Komputer IPB 2016 Tabel Table Elemen table digunakan untuk membuat tabel Tabel: representasi data tabular dalam baris dan kolom. Caption Elemen caption digunakan

Lebih terperinci

TUTORIAL JQUERY Langkah Tepat menjadi Web Designer Handal, menguasai JQuery JavaScript Library, jalan membuat halaman website lebih atraktif

TUTORIAL JQUERY Langkah Tepat menjadi Web Designer Handal, menguasai JQuery JavaScript Library, jalan membuat halaman website lebih atraktif TUTORIAL JQUERY Langkah Tepat menjadi Web Designer Handal, menguasai JQuery JavaScript Library, jalan membuat halaman website lebih atraktif www.ilmuwebsite.com Bagian 4. Menggunakan Selector JQuery 1

Lebih terperinci

Membuat Form Dinamis dengan HTML & Javascript.

Membuat Form Dinamis dengan HTML & Javascript. Membuat Form Dinamis dengan HTML & Javascript. Oleh: d-newbie Assalamualaikum wr.wb. Form tentunya sudah tidak asing lagi bagi para developer web, element html yg satu ini seolah-olah merupakan element

Lebih terperinci

Web Programming (WP) Step 2 [ HTML & PHP BASIC]

Web Programming (WP) Step 2 [ HTML & PHP BASIC] Web Programming (WP) Step 2 [ HTML & PHP BASIC] Created By Rolly Yesputra, M.Kom rollyyp.wordpress.com rollyyesputra1@gmail.com 082391177785 767E4C4D 4 March 2015 rollyyp.wordpress.com 1 HTML (Hypertext

Lebih terperinci

Lisensi Dokumen: Uraian Kasus :

Lisensi Dokumen: Uraian Kasus : Uraian Kasus : Pada kasus ini seorang mahasiswa ingin membuat Program sederhana tentang Nomor Handphone teman-temannya untuk mengantisipasi kehilangan HPnya atau HP Error sehingga perlu di Flash ulang

Lebih terperinci

SMH2D3 Web Programming. 3 BAB III TABLE & FORM INPUT DATA HTML5. H a l IDENTITAS. Kajian Web Design menggunakan HTML5 dan CSS3

SMH2D3 Web Programming. 3 BAB III TABLE & FORM INPUT DATA HTML5. H a l IDENTITAS. Kajian Web Design menggunakan HTML5 dan CSS3 3 BAB III TABLE & FORM INPUT DATA HTML5 31 IDENTITAS Kajian Web Design menggunakan HTML5 dan CSS3 Topik Scripting tingkat lanjut, Tabel dan Form HTML5 Kompetensi Utama 3 Mengetahui penggunaan script HTML5

Lebih terperinci

TUTORIAL CSS FRAMEWORK

TUTORIAL CSS FRAMEWORK 11/13/2014 TUTORIAL CSS FRAMEWORK NAMA : DUWI PARYANTO NIM : 12141367 MATA KULIAH : PEMROGRAMAN WEB STATIS DOSEN : WAHYU WIDODO CSS FRAMEWORK FONT AWESOME A. Pengertian Framework Sebelum mempelajari bagaimana

Lebih terperinci

Membuat Duplikasi Form dengan Jquery (Dynamic Form)

Membuat Duplikasi Form dengan Jquery (Dynamic Form) Membuat Duplikasi Form dengan Jquery (Dynamic Form) Oleh: Dimas Agung Noviyanto Membuat dynamic field mungkin bukan hal baru bagi seorang web programmer, field inputan yang dapat ditambah maupun di hapus

Lebih terperinci

C. Ms Powerpoint D. Notepad E. Ms Acces

C. Ms Powerpoint D. Notepad E. Ms Acces 1. Apakah kepanjangan dari HTML? A. Hyper Text Mark Up Language B. Hyper Text Mark Language C. Hight Text Mark Up Language D. Hight Text Mark Language 2. Berikut ini adalah termasuk Software Browser, Kecuali:

Lebih terperinci

PRAKTIKUM SISTEM INFORMASI MANAJEMEN

PRAKTIKUM SISTEM INFORMASI MANAJEMEN MODUL V DREAMWEAVER 5.1 Tujuan Praktikum Setelah menyelesaikan modul ini, mahasiswa diharapkan mampu : 1. Mengenal komponen aplikasi Macromedia Dreamweaver 2. Membuat template website offline sederhana

Lebih terperinci

Pertemuan IV. Semester 1

Pertemuan IV. Semester 1 Tables dan Forms Pertemuan IV Pemrograman Web Dasar Semester 1 Tabel HTML Tag digunakan untuk mengawali sebuah tabel. Di dalam elemen table, terdapat tag (table rows) dan tag (table

Lebih terperinci

Persiapan. File latihan.rar diekstrak. Contoh apabila Bahan diekstrak di d:\

Persiapan. File latihan.rar diekstrak. Contoh apabila Bahan diekstrak di d:\ CSS & CSS Framework CSS Cascading Style Sheets (CSS) adalah sebuah bahasa yang digunakan untuk menampilkan style dari sebuah dokumen HTML. CSS menjelaskan bagaimana elemen HTML harus ditampilkan. Persiapan

Lebih terperinci

Syntax HTML. Biasanya digunakan untuk menulis komentar, tidak akan timbul dihalaman web.

Syntax HTML. Biasanya digunakan untuk menulis komentar, tidak akan timbul dihalaman web. Syntax HTML Pada tulisan Saya kali ini, Saya memberikannya beserta contoh kode dan gambar, ada beberapa yang Saya tidak beri kode dan gambar, kode, dan gambar sekalipun karena beberapa alasan : Kurangnya

Lebih terperinci

BAB 2 TINJAUAN PUSTAKA DAN DASAR TEORI

BAB 2 TINJAUAN PUSTAKA DAN DASAR TEORI BAB 2 TINJAUAN PUSTAKA DAN DASAR TEORI 2.1 Tinjauan Pustaka Penelitian sejenis pernah dilakukan oleh Kresno Fransiscus Xaverius Dwi (2017), dengan judul Sistem Informasi Penggajian Dosen di STMIK AKAKOM

Lebih terperinci

Pemrograman Web Week 4. Team Teaching

Pemrograman Web Week 4. Team Teaching Pemrograman Web Week 4 Team Teaching Peran Masing-masing Bahasa HTML => Mengatur Struktur CSS => Mengatur tampilan JSS => Mengatur interaktifitas Penggunaan Javascript Sama seperti pada CSS, ada 3 cara

Lebih terperinci

MODUL 7 JavaScript pada Form HTML

MODUL 7 JavaScript pada Form HTML 1 MODUL 7 JavaScript pada Form HTML A. TUJUAN 1. Mampu memahami konsep JavaScript pada HTML 2. Mampu memahami penggunaan JavaScript pada HTML 3. Mampu memproses form HTML menggunakan JavaScript B. PETUNJUK

Lebih terperinci

Pemrograman Web Week 2. Team Teaching

Pemrograman Web Week 2. Team Teaching Pemrograman Web Week 2 Team Teaching WEEK 2 HTML IKG2I4 Software Project I Persiapan Instalasi Editor Download dan Install apilkasi editor (mis. Notepad++) Karena membantu dalam pengembangan syntax highlighting

Lebih terperinci

Menampilkan Battery Status pada Cordova

Menampilkan Battery Status pada Cordova Menampilkan Battery Status pada Cordova Juli 2015 Tingkat: Oleh : Feri Djuandi Pemula Menengah Mahir Artikel kali ini akan menjelaskan cara menampilkan status baterai (battery status) pada perangkat mobile

Lebih terperinci

TUTORIAL MEMBUAT SNIPPET TAB BOOTSNIPP UNTUK BOOTSTRAP

TUTORIAL MEMBUAT SNIPPET TAB BOOTSNIPP UNTUK BOOTSTRAP TUTORIAL MEMBUAT SNIPPET TAB BOOTSNIPP UNTUK BOOTSTRAP Oleh : Nama : Badiah Setyowati Nim : 12141363 Prodi : Teknik Informatika - Malam Bootsnipp A. Pengertian Bootsnip Bootsnipp. Apa sih itu Bootsnipp?

Lebih terperinci

Membuat Responsive dan Fleksibel Image Gallery dengan JQuery Fleximage

Membuat Responsive dan Fleksibel Image Gallery dengan JQuery Fleximage Membuat Responsive dan Fleksibel Image Gallery dengan JQuery Fleximage Oleh: Christian Rosandhy Siapa bilang bikin galeri gambar yang responsive itu susah? Di tutorial kali ini kita akan belajar membuat

Lebih terperinci

Atribut ACTION tempat menspesifikasikan URL yang akan digunakan sebagai pemroses field input form.

Atribut ACTION tempat menspesifikasikan URL yang akan digunakan sebagai pemroses field input form. FORM DAN INPUT HTML Elemen HTML yang digunakan untuk mendapatkan masukan dari pengguna web. Pengguna web dapat memasukkan input melalui halaman-halaman HTML. Elemen/ TAG ini digunakan membatasi input.

Lebih terperinci

Dasar Pemrograman Web. Pemrograman Web. Adam Hendra Brata

Dasar Pemrograman Web. Pemrograman Web. Adam Hendra Brata Dasar Pemrograman Web Pemrograman Web Adam Hendra Brata Konsep Dasar Desain Web HTML CSS HTML HTML (HyperText Markup Language) Bahasa standar yang digunakan untuk menampilkan document web. Mengontrol tampilan

Lebih terperinci

BAB 2 TINJAUAN TEORI

BAB 2 TINJAUAN TEORI BAB 2 TINJAUAN TEORI 2.1. Pengenalan HTML 2.1.1. Pendahuluan HTML Hypertext Markup Language merupakan kepanjangan dari kata HTML. Adalah script dimana kita bisa menampilkan informasi dan daya kreasi kita

Lebih terperinci

TUGAS UTS WEB STATIS. : Apriyanto Wibowo NIM : : Teknik Informatika S1 (Malam) Pengertian framework

TUGAS UTS WEB STATIS. : Apriyanto Wibowo NIM : : Teknik Informatika S1 (Malam) Pengertian framework TUGAS UTS WEB STATIS Nama : Apriyanto Wibowo NIM : 12141362 Prodi Mata Kuliah : Teknik Informatika S1 (Malam) : Pemrograman Web Statis Pengertian framework Framework adalah kerangka kerja. Framework juga

Lebih terperinci

Halaman Pada website builder sitepad

Halaman Pada website builder sitepad Tambahkan Background ke Halaman Pada website builder sitepad Menggunakan Top Up Row Setting 1) Buka Halaman yang ingin Anda edit dalam editor. Untuk melakukan itu Klik pada icon Edit pada salah satu halaman

Lebih terperinci

2011 Ahmad Amarullah

2011 Ahmad Amarullah 1 Silabus Mata Kuliah Program Studi : Sistem Informasi Kode Mata Kuliah : Nama Mata Kuliah : Komputer Aplikasi IT ( XHTML & CSS ) Jumlah SKS : 2 SKS Semester : 1 Deskripsi Mata Kuliah : Mata kuliah ini

Lebih terperinci

1. Mahasiswa mampu membuat form pada dokumen HTML. 2. Mahasiswa memahami cara penggunaan dari fasilitas Form pada halaman dokumen HTML

1. Mahasiswa mampu membuat form pada dokumen HTML. 2. Mahasiswa memahami cara penggunaan dari fasilitas Form pada halaman dokumen HTML Bab 4. Form Overview Salah satu fasilitas yang disediakan oleh dokumen HTML memungkinkan kita untuk melakukan interaksi lebih terhadap halaman dokumen tersebut. Semisal, kemampuan dokumen HTML mampu menyediakan

Lebih terperinci

BAB 2 TINJAUAN PUSTAKA DAN DASAR TEORI

BAB 2 TINJAUAN PUSTAKA DAN DASAR TEORI BAB 2 TINJAUAN PUSTAKA DAN DASAR TEORI 2.1. Tinjauan Pustaka Penelitian yang dilakukan oleh Irma Eka Ayu Novita dan Hernawan Sulistyanto (2015) dengan judul Pengembangan Aplikasi Untuk Mengetahui Kebutuhan

Lebih terperinci

BAB III Validasi HTML5

BAB III Validasi HTML5 1 Modul Praktikum Pemprograman Web BAB III Validasi HTML5 A. Tujuan Memahami konsep dasar active web page, Mampu menghasilkan halaman web yang interaktif, Mampu memanfaatkan validasi data menggunakan HTML5.

Lebih terperinci

MAKALAH MODUL ADOBE DREAMWEAVER CREATIVE SUITE 5

MAKALAH MODUL ADOBE DREAMWEAVER CREATIVE SUITE 5 MAKALAH Makalah Ini Disusun Untuk Memenuhi Tugas Mata Pelajaran Pemrograman Web Design. Guru Pengampu : Yenny Oktafitriana Arbi, S.Pd Agus Giyanto, A.Md MODUL ADOBE DREAMWEAVER CREATIVE SUITE 5 Disusun

Lebih terperinci

[FORM AND FRAME] PEMROGRAMAN WEB MODUL [ O L E H : Y U N I T A P R A S T Y N I N G S I H, S. K O M ]

[FORM AND FRAME] PEMROGRAMAN WEB MODUL [ O L E H : Y U N I T A P R A S T Y N I N G S I H, S. K O M ] [FORM AND FRAME] PEMROGRAMAN WEB MODUL [ O L E H : Y U N I T A P R A S T Y N I N G S I H, S. K O M ] Modul FORM DAN FRAME 1. TEORI DASAR FORM Form identik dengan formulir. Form sangat dibutuhkan pada saat

Lebih terperinci

Pemograman Swing. Netbeans:

Pemograman Swing. Netbeans: Pemograman Swing Topics: Cara Menggunakan Netbeans Java Application Java Desktop Application Materi Tambahan Netbeans: Pada pertemuan kali ini, kita akan membahas lebih jauh mengenai swing. Swing adalah

Lebih terperinci

Membuat Carousel Dengan Bootstrap CDN

Membuat Carousel Dengan Bootstrap CDN Membuat Carousel Dengan Bootstrap CDN Fitria Arnita 23@gmail.com Abstrak Bootstrap adalah framework CSS yang dibuat khusus para designer web. Bootstrap digunakan untuk membuat sebuah templates web atau

Lebih terperinci

Pengenalan HTML dan CSS

Pengenalan HTML dan CSS Pengenalan HTML dan CSS Pengenalan HTML dan CSS Jubilee Enterprise PENERBIT PT ELEX MEDIA KOMPUTINDO Pengenalan HTML dan CSS Jubilee Enterprise 2016, PT Elex Media Komputindo, Jakarta Hak cipta dilindungi

Lebih terperinci

MODUL PRAKTIKUM SISTEM TERDISTRIBUSI

MODUL PRAKTIKUM SISTEM TERDISTRIBUSI MODUL PRAKTIKUM SISTEM TERDISTRIBUSI WEB API Yuli Purwati, M.Kom Praktikum 8 7 Juni 2017 Aplikasi ASP.NET Web Api 1. Pembuatan Web Api Buat project baru pada Visual Studio, File New Project. Lalu, pilih

Lebih terperinci

CHAPTER 6. Sebelum membuat starter data, kita perlu meng-create collections terlebih dahulu. Buat folder lib pada folder aplikasi.

CHAPTER 6. Sebelum membuat starter data, kita perlu meng-create collections terlebih dahulu. Buat folder lib pada folder aplikasi. CHAPTER 6 Untuk membuat collections, hal pertama yang dilakukan adalah menambahkan baris baru ke dalam file Javascript yang memungkinkan user untuk membuat collections. Sebelumnya, image tersimpan dalam

Lebih terperinci

CARA MEMBUAT CSS DENGAN DREAMWEAVER

CARA MEMBUAT CSS DENGAN DREAMWEAVER CARA MEMBUAT CSS DENGAN DREAMWEAVER Dewi Wijayanti dewiwijayanti@raharja.info Abstrak Dreamweaver adalah sebuah perangkat lunak yang digunakan untuk membuat atau menyunting halaman web yang dinamis maupun

Lebih terperinci

BAB III FORMULIR. <input type='text' name='...' size='40' maxlength='..'>

BAB III FORMULIR. <input type='text' name='...' size='40' maxlength='..'> BAB III FORMULIR Formulir dalam halaman html merupakan komponen input, yaitu bagian yang berfungsi sebagai tempat memasukkan data dari penggunanya. Dengan formulir, halaman web bisa menjadi lebih interaktif.

Lebih terperinci

Pemrograman Web PRAKTIKUM 6. Query Data 2. TUJUAN BELAJAR Mahasiswa dapat menggunakan PHP dan MySQL untuk mengupdate data

Pemrograman Web PRAKTIKUM 6. Query Data 2. TUJUAN BELAJAR Mahasiswa dapat menggunakan PHP dan MySQL untuk mengupdate data PRAKTIKUM 6 Query Data 2 TUJUAN BELAJAR Mahasiswa dapat menggunakan PHP dan MySQL untuk mengupdate data MATERI Program edit dan hapus TUGAS Menambahkan fitur edit dan hapus untuk semua form input data

Lebih terperinci

Beralih dari Input Submit ke Button dan Cara Mudah Membuat Button Bootstrap

Beralih dari Input Submit ke Button dan Cara Mudah Membuat Button Bootstrap Beralih dari Input Submit ke Button dan Cara Mudah Membuat Button Bootstrap Oleh: Arinadi Nur Rohmad Kenapa beralih dari Input Submit ke Button? Ya, menurut saya button lebih Power Full dari pada Input

Lebih terperinci

STMIK DIKTAT SINGKAT MACROMEDIA DREAMWEAVER 8 SEKOLAH TINGGI MANAJEMEN INFORMATIKA DAN KOMPUTER TASIKMALAYA.

STMIK DIKTAT SINGKAT MACROMEDIA DREAMWEAVER 8 SEKOLAH TINGGI MANAJEMEN INFORMATIKA DAN KOMPUTER TASIKMALAYA. STMIK SEKOLAH TINGGI MANAJEMEN INFORMATIKA DAN KOMPUTER TASIKMALAYA DIKTAT SINGKAT MACROMEDIA DREAMWEAVER 8 PENDAHULUAN Dreamweaver adalah sebuah program website editor yang berfungsi untuk membuat dan

Lebih terperinci

Pengenalan JavaScript

Pengenalan JavaScript Pengenalan JavaScript Tujuan - Mahasiswa memahami konsep dasar Javascript - Mahasiswa mampu memahami cara menggunakan Javascript - Mahasiswa mampu memahami dasar variabel di Javascript - Mahasiswa mampu

Lebih terperinci

Praktikum 1. Mata Kuliah : Tugas Pemrograman Visual. Dosen : Nandang Hermanto

Praktikum 1. Mata Kuliah : Tugas Pemrograman Visual. Dosen : Nandang Hermanto Praktikum 1 Mata Kuliah : Tugas Pemrograman Visual Dosen : Nandang Hermanto Latihan 1 Membuat Aplikasi Console Langkah Pengerjaan : 1. 2. Jalankan Visual Studio 2010 dengan cara Cara 1 : Start All Programs

Lebih terperinci

Membuat Top Fixed Responsive Navbar Twitter Bootstrap

Membuat Top Fixed Responsive Navbar Twitter Bootstrap Membuat Top Fixed Responsive Navbar Twitter Bootstrap Oleh: ricky orlando napitupulu Salam bro and sis :), selamat datang di tulisan tutorial pertama ane ni, makasi da mau singga disini ye walopun kesasar

Lebih terperinci

MEMBUAT CRUD (CREATE, READ, UPDATE & DELETE) DENGAN CODEIGNITER

MEMBUAT CRUD (CREATE, READ, UPDATE & DELETE) DENGAN CODEIGNITER MEMBUAT CRUD (CREATE, READ, UPDATE & DELETE) DENGAN CODEIGNITER Pepen Aandrian Syah pepenaan@gmail.com Abstrak Didalam dunia pemograman CRUD atau Create, Read, Update dan Delete adalah hal dasar bisa dibilang

Lebih terperinci

Gambar 1. Pendaftaran anggota baru. Gambar 2. Petunjuk pendaftaraan anggota baru MOHON ANDA INGAT!!!!

Gambar 1. Pendaftaran anggota baru. Gambar 2. Petunjuk pendaftaraan anggota baru MOHON ANDA INGAT!!!! :: Proses Pendaftaran Proses pendaftaran diperlukan agar pengguna dapat mengakses penuh seluruh content sipoel. Untuk itu para pengguna harus terlebih dahulu melakukan proses registrasi, dengan mengikuti

Lebih terperinci

BAB 2 LANDASAN TEORI

BAB 2 LANDASAN TEORI BAB 2 LANDASAN TEORI 2.1 Pengenalan HTML 2.1.1 Pengertian Dokumen HTML HTML ( Hypertext Markup Language ) adalah suatu bahasa yang digunakan untuk menulis halaman web. HTML dirancang untuk digunakan tanpa

Lebih terperinci

[SANGAT MUDAH] Cara Membuat Slide Show dengan Bootstrap 3

[SANGAT MUDAH] Cara Membuat Slide Show dengan Bootstrap 3 [SANGAT MUDAH] Cara Membuat Slide Show dengan Bootstrap 3 Oleh: Arinadi Nur Rohmad Oke, Membuat slide show adalah pekerjaan yang sulit untuk yang baru belajar CSS karena pada dasarnya Slide Show dibuat

Lebih terperinci

Tutorial Mengedit Halaman HTML dengan Dreamweaver

Tutorial Mengedit Halaman HTML dengan Dreamweaver Tutorial Mengedit Halaman HTML dengan Dreamweaver Oleh : Ruth Ema Febrita Pada tutorial sebelumnya, kita sudah berhasil melakukan konversi dari desain website yang kita buat menggunakan Photoshop menjadi

Lebih terperinci

HTML5 Komplet. Jubilee Enterprise PENERBIT PT ELEX MEDIA KOMPUTINDO

HTML5 Komplet. Jubilee Enterprise PENERBIT PT ELEX MEDIA KOMPUTINDO HTML5 Komplet HTML5 Komplet Jubilee Enterprise PENERBIT PT ELEX MEDIA KOMPUTINDO HTML5 Komplet Jubilee Enterprise 2017, PT. Elex Media Komputindo, Jakarta Hak cipta dilindungi undang-undang Diterbitkan

Lebih terperinci

Pertemuan Ke-4 (Peggunaan XHTML) D3 Manajemen Informatika - Unijoyo 1

Pertemuan Ke-4 (Peggunaan XHTML) D3 Manajemen Informatika - Unijoyo 1 Pertemuan Ke-4 (Peggunaan XHTML) D3 Manajemen Informatika - Unijoyo 1 XHTML Mobile Profile Perbedaan antara HTML dan XHTML Kesalahan Pada XHTML D3 Manajemen Informatika - Unijoyo 2 XHTML MP (extensible

Lebih terperinci

Pemrograman Web. HTML Lanjut. Indrato, S.Kom List. Ordered Lists (OL) Ordered List (OL) Ordered List (OL) PemrogramanWeb.

Pemrograman Web. HTML Lanjut. Indrato, S.Kom List. Ordered Lists (OL) Ordered List (OL) Ordered List (OL) PemrogramanWeb. Pemrograman Web Indrato, S.Kom indra.ndr7@gmail.com HTML Lanjut Page 2 List Digunakan untuk membuat daftar, terdiriatas: Ordered List (Numbering) Unordered List (Bullet) Definition List Ordered Lists (OL)

Lebih terperinci

HTML5. HTML Links Link Images HTML Plug-ins HTML Youtube HTML Input HTML Input Attribute

HTML5. HTML Links Link Images HTML Plug-ins HTML Youtube HTML Input HTML Input Attribute Author : Minarni, S.Kom.,MM Mata Kuliah : Internet Multimedia Lanjut HTML5 HTML Links Link Images HTML Plug-ins HTML Youtube HTML Input HTML Input Attribute HTML5 HTML Links Link digunakan hampir di semua

Lebih terperinci

Perkenalan Glyphicon Bootstrap dan Cara Mudah Menggunakannya

Perkenalan Glyphicon Bootstrap dan Cara Mudah Menggunakannya Perkenalan Glyphicon Bootstrap dan Cara Mudah Menggunakannya Oleh: Arinadi Nur Rohmad Glyphicon ini berbasis text jadi lebih ringan dan biasa diganti warna seperti huruf pada umumnya yang berbeda dari

Lebih terperinci

IV. Form. A. Pengenalan Form. B. HTML Input Element

IV. Form. A. Pengenalan Form. B. HTML Input Element IV. Form A. Pengenalan Form Kegunaan Form Berikut ini beberapa contoh kegunaan Form dalam web: memperoleh data-data user baik nama, alamat dan data lainnya untuk mendaftar pada service yang di sediakan.

Lebih terperinci

membuat website dengan bootstrap v3.0.0

membuat website dengan bootstrap v3.0.0 membuat website dengan bootstrap v3.0.0 Oleh: reski hamsah Belakangan ini, bootstrap telah merilis versi terbarunya dengan berbagai tawaran menarik mulai dari desain, fitur, dan customizer terbaru untuk

Lebih terperinci

Modul 3 CSS CASCADE STYLE SHEET

Modul 3 CSS CASCADE STYLE SHEET Modul 3 CSS CASCADE STYLE SHEET Fungsi: Mengatur style elemen yang ada di halaman web, mulai dari memformat text dan format layout. Mengatur kekonsistenan style pada elemen tertentu Keuntungan CSS: Ukuran

Lebih terperinci

Dasar Pemrograman Web. Pemrograman Web. Adam Hendra Brata

Dasar Pemrograman Web. Pemrograman Web. Adam Hendra Brata Dasar Pemrograman Web 2 Pemrograman Web Adam Hendra Brata Teknologi Client Server Konsep Dasar Desain Web Teknologi Client Server Arsitektur Client Server Model komunikasi yang terdiri server sebagai pemberi

Lebih terperinci

Membuat Layout Desain Awal dengan Photoshop

Membuat Layout Desain Awal dengan Photoshop 2 Websiteku Membuat Layout Desain Awal dengan Photoshop jalankan aplikasi photoshop anda dan siapkan sebuah kanvas baru, caranya pilih file - new lalu gunakan setting berikut: Width : 700 pixel Height

Lebih terperinci

IKG3A3 / Software Project II

IKG3A3 / Software Project II IKG3A3 / Software Project II Mahmud Imrona, M.T. Izzatul Ummah, M.T. Kelompok Keahlian Algoritma dan Komputasi LECTURE NOTE WEEK 2 1 8/25/2015 WEEK 2 HTML 2 8/25/2015 IKG3A3 - Software Project II HTML

Lebih terperinci

Bab III PERANCANGAN SISTEM

Bab III PERANCANGAN SISTEM Bab III PERANCANGAN SISTEM 1.1 Analisa Kebutuhan Telah dijelaskan dibab satu tentang masalah yang muncul dalam proses pemesanan tiket bus, dengan memanfaatkan fasilitas internet yaitu website. Penulis

Lebih terperinci

Modul Pembuatan Website Menggunakan

Modul Pembuatan Website Menggunakan Design : www.mhdsyarif.p.ht Modul Pembuatan Website Menggunakan Versi 3.5.1 07-08 Mei 2013 Oleh : Divisi Web Puskom UR http://puskom.unri.ac.id Daftar Isi Daftar Isi...i A. Install XAMPP... 1 B. Install

Lebih terperinci

MEMBUAT LAYOUT DENGAN CONTAINER BOOTSTRAP

MEMBUAT LAYOUT DENGAN CONTAINER BOOTSTRAP MEMBUAT LAYOUT DENGAN CONTAINER BOOTSTRAP NURLITA nurlita.icha@gmail.com Abstrak Kali ini kita akan membahas cara membuat layout dengan container bootstrap. Bootstrap adalah suatu framework front-end yang

Lebih terperinci

Pemrograman Web. Page 188

Pemrograman Web. Page 188 Page 188 15. Kegiatan Belajar 15 : Mengolah Interaksi User a. Tujuan Pembelajaran. Setelah mengikuti kegiatan belajar 15 ini siswa diharapkan dapat : 1) Mengetahui bentuk penanganan interaksi user pada

Lebih terperinci

HTML. ( HyperText Markup Language) Pertemuan 2 Oleh : Nufan Balafif. Mata Kuliah : Pemrograman Berbasis Web

HTML. ( HyperText Markup Language) Pertemuan 2 Oleh : Nufan Balafif. Mata Kuliah : Pemrograman Berbasis Web HTML ( HyperText Markup Language) Mata Kuliah : Pemrograman Berbasis Web Pertemuan 2 Oleh : Nufan Balafif html (hypertext markup language) Adalah bahasa pemrograman Web (client) yang dikhususkan untuk

Lebih terperinci

4. Tambahkan dukungan untuk platform Android. Silakan masuk ke folder..\cordova\workshop\ accelerometer dan jalankan perintah:

4. Tambahkan dukungan untuk platform Android. Silakan masuk ke folder..\cordova\workshop\ accelerometer dan jalankan perintah: Menggunakan Accelerometer pada Cordova Juli 2015 Tingkat: Oleh : Feri Djuandi Pemula Menengah Mahir Accelerometer adalah sensor gerak yang mendeteksi perubahan (delta) dalam gerakan relatif terhadap posisi

Lebih terperinci

FAKULTAS TEKNOLOGI INFORMASI UNISKA. Modul NetBeans 8.1. Disusun oleh: Mirza Yogy Kurniawan. Modul Praktek NetBeans 8.1 Studi Kasus Perpustakaan

FAKULTAS TEKNOLOGI INFORMASI UNISKA. Modul NetBeans 8.1. Disusun oleh: Mirza Yogy Kurniawan. Modul Praktek NetBeans 8.1 Studi Kasus Perpustakaan FAKULTAS TEKNOLOGI INFORMASI UNISKA Modul NetBeans 8.1 Disusun oleh: Mirza Yogy Kurniawan Modul Praktek NetBeans 8.1 Studi Kasus Perpustakaan FAKULTAS TEKNOLOGI INFORM ASI UNISKA Daftar Isi BAB I KONEKSI

Lebih terperinci

Intro To JQuery Training Online Ilmuwebsite

Intro To JQuery Training Online Ilmuwebsite MODUL I JQUERY KELAS ZEROZERO Intro To JQuery Training Online Ilmuwebsite http://www.ilmuwebsite.com Lisensi Dokumen: Copyright 2014-2015 Ilmuwebsite.Com Untuk semua kalangan, silahkan menyebarluaskan

Lebih terperinci

Pelatihan Intel XDK. Modul 5 Pengembangan Aplikasi Mobile Learning Menggunakan Intel XDK Sesi 2. Dikembangkan oleh Intel Software.

Pelatihan Intel XDK. Modul 5 Pengembangan Aplikasi Mobile Learning Menggunakan Intel XDK Sesi 2. Dikembangkan oleh Intel Software. Pelatihan Intel XDK Modul 5 Pengembangan Aplikasi Mobile Learning Menggunakan Intel XDK Sesi 2 Dikembangkan oleh Intel Software. 1 Versi 1.0. September 2013. Hak Cipta (C) 2013 Intel Software.. Adobe,

Lebih terperinci

3. Tambahakn framework JavaServer Faces dan gunakan default library JSF 2.0

3. Tambahakn framework JavaServer Faces dan gunakan default library JSF 2.0 PRAKTIKUM 3 DATA TABLE (TUTORIAL) FORMAT PENGUMPULAN HARI INI: NRP-NAMA-Praktikum-3-DataTable.rar 1. Buatlah sebuah project JSF baru Tutorial-DataTable-01 2. Karena kita akan menggunakan JSF2, maka untuk

Lebih terperinci

USER GUIDE BLOG MAHASISWA

USER GUIDE BLOG MAHASISWA USER GUIDE BLOG MAHASISWA LOGIN Akses URL login blog mahasiswa di alamat [namablog]/wp-admin semisal : randy./wpadmin. Masukkan username dan password BASIC SETTING PERMALINK Agar memudahkan mesin pencari

Lebih terperinci

PERTEMUAN 1. Kompetensi Dasar : Menjelaskan konsep dasar dan teknologi Webpage

PERTEMUAN 1. Kompetensi Dasar : Menjelaskan konsep dasar dan teknologi Webpage PERTEMUAN 1 Kompetensi Dasar : Menjelaskan konsep dasar dan teknologi Webpage Materi yang akan dibahas : 1. Kegunaan dari dokumen dan audiens 2. Bahasa HTML 3. Struktur dasar penulisan dokumen 4. Site

Lebih terperinci

Koneksi SQL Server dan Penerapan Template CSS Masterpage pada ASP.NET

Koneksi SQL Server dan Penerapan Template CSS Masterpage pada ASP.NET Koneksi SQL Server dan Penerapan Template CSS Masterpage pada ASP.NET Beberapa pembahasan sebelumnya, saya pernah posting mengenai pembuatan form pada web form ASP.NET. Pada kesempatan ini saya kembali

Lebih terperinci

Modul 5. Membuat Formulir Pada Template. Disusun oleh. Sri Siska Wirdaniyati JURUSAN STATISTIKA FAKULTAS MATEMATIKA DAN ILMU PENGETAHUAN ALAM

Modul 5. Membuat Formulir Pada Template. Disusun oleh. Sri Siska Wirdaniyati JURUSAN STATISTIKA FAKULTAS MATEMATIKA DAN ILMU PENGETAHUAN ALAM Modul 5 Membuat Formulir Pada Template Disusun oleh Sri Siska Wirdaniyati JURUSAN STATISTIKA FAKULTAS MATEMATIKA DAN ILMU PENGETAHUAN ALAM UNIVERSITAS ISLAM INDONESIA YOGYAKARTA 2013 1 BAB I PENDAHULUAN

Lebih terperinci

PENGANTAR KOMPUTER DAN TI 2C PERTEMUAN 6 FORM & INPUT HTML

PENGANTAR KOMPUTER DAN TI 2C PERTEMUAN 6 FORM & INPUT HTML PENGANTAR KOMPUTER DAN TI 2C PERTEMUAN 6 FORM & INPUT HTML FORM Elemen HTML yang digunakan untuk mendapatkan masukan dari pengguna web. Pengguna web dapat memasukkan input melalui halaman-halaman HTML.

Lebih terperinci

Mengenal Dreamweaver MX 2004

Mengenal Dreamweaver MX 2004 Mengenal Dreamweaver MX 2004 Macromedia Dreamweaver MX merupakan software yang dikenal sebagai software web authoring tool, yaitu software untuk desain dan layout halaman web. Versi terbaru Dreamweaver

Lebih terperinci

BAB IV HASIL DAN ANALISIS

BAB IV HASIL DAN ANALISIS BAB IV HASIL DAN ANALISIS 4.1. Hasil Karya/Implementasi Kegiatan implementasi atau penerapan dilakukan dengan dasar yang telah direncanakan dalam rencana implementasi. Pada penerapan sistem yang diusulkan

Lebih terperinci

JEN Archive Tutorial Mambo by IT-Community (1)

JEN Archive Tutorial Mambo by IT-Community (1) JEN Archive Tutorial Mambo by IT-Community (1) 1. JEN Archive Tutorial Mambo by IT-Community (2) Halaman home situs anda http://www.domain.sch.id/ 2. Login a. login user & register new account as member

Lebih terperinci

Aplikasi Komputer. Bekerja Dengan Microsoft Excel Access (1) Ita Novita, S.Kom, M.T.I. Modul ke: Fakultas ILMU KOMPUTER. Program Studi Informatika

Aplikasi Komputer. Bekerja Dengan Microsoft Excel Access (1) Ita Novita, S.Kom, M.T.I. Modul ke: Fakultas ILMU KOMPUTER. Program Studi Informatika Modul ke: Aplikasi Komputer Bekerja Dengan Microsoft Excel Access (1) Fakultas ILMU KOMPUTER Ita Novita, S.Kom, M.T.I Program Studi Informatika www.mercubuana.ac.id Pengenalan MS. Access 2010 Aplikasi

Lebih terperinci

Image Slider 3D. Oleh: Anthonius

Image Slider 3D. Oleh: Anthonius Image Slider 3D Oleh: Anthonius Kali ini saya akan berbagi cara membuat image slider dengan tampilan 3D. Cara ini sangat efisien karena hanya menggunakan sedikit script. Untuk CSS nya agan bisa copy langsung

Lebih terperinci

Pengenalan Script. Definisi HTML

Pengenalan Script. Definisi HTML 1 Pengenalan Script Pada bab ini akan dibahas bahasa script yang dapat digunakan untuk membuat halaman web. Untuk dapat membuat halaman web bahasa script pertama yang harus anda kenal adalah HTML. HTML

Lebih terperinci

PANDUAN PENGGUNAAN. Joomla! Versi 1.5. Oleh: Anon Kuncoro Widigdo

PANDUAN PENGGUNAAN. Joomla! Versi 1.5. Oleh: Anon Kuncoro Widigdo PANDUAN PENGGUNAAN Joomla! Versi 1.5 Oleh: Anon Kuncoro Widigdo anonkuncoro@yahoo.com Kendari 2009-2010 MODUL I Pendahuluan Joomla adalah sebuah aplikasi sistim manajemen konten atau Content Management

Lebih terperinci

Menciptakan Form dalam Web

Menciptakan Form dalam Web Menciptakan Form dalam Web STMIK AKAKOM YOGYAKARTA Click to edit Master subtitle style Contoh sebuah Form Komponen dan elemen dalam Form Input box First Name Address #1 Address #2 Last Name radio button

Lebih terperinci