Seri HTML5 Untuk Aplikasi Mobile

Aloha, para Readers ! Sekian lama saya tidak lagi menggarap tulisan untuk tutorial programming. Yah, memang karena secara tidak sengaja ada beberapa permasalahan internal dan eksternal. Salah satunya adalah musibah yang menimpa server situs ini. Sewaktu itu ada permasalahan di server dan berita buruknya saya tidak membackup update situs terbaru.

HTML5

HTML5

Oke, lupakan. Saat ini saya memang sedang fokus ke sebuah teknologi yang bernama HTML5 for Mobile Applications. Tidak muluk-muluk dan terlalu sulit sebenarnya. Ini merupakan seri pertama dari tutorial step-by-step saya. Jika pembaca sudah pernah atau bahkan berkecimpung di dunia web, mungkin tutorial yang akan saya tulis beberapa seri ini mudah diikuti. Namun, jika pembaca ingin memulai belajar atau bahkan baru mengenal HTML, tak ada salahnya mengikuti tutorial yang akan saya rangkum nanti.

Baik, sesuai judul di atas, saya akan mulai membahas tentang HTML5. Sedikit saja coba saya petik dari Wikipedia, HTML5 adalah revisi ke 5 dari HTML. Yakni bahasa pemrograman yang digunakan untuk membuat struktur dan tampilan dari isi web. Jadi konklusinya di sini, HTML5 adalah teknologi paling anyar dari HTML dengan kelengkapan fitur dan tambahan penataan format baru untuk desain web (red.).

Mengenai kelebihan HTML5, coba kita lihat di bawah ini:

  • For Gaming and Applications. Dengan elemen fitur baru bernama <canvas>, fitur ini memungkinkan kita untuk menggambar 2D di area kerja HTML. Dan masih banyak lagi sebenarnya yang bisa kita lakukan dengan <canvas> ini.
  • Web Storage. Lupakan cache di browser, saat ini sudah banyak situs yang memanfaatkan Web Storage di HTML5 untuk memaksimalkan beberapa fitur untuk sebuah website. Web Storage memungkinkan browser menyimpan secara dinamis data-data dari user yang mengakses situs.
  • Audio and Video. Percaya tidak percaya, jika kita ingin menyajikan suara maupun video di website HTML5 sebenarnya bisa dilakukan dengan sangat mudah. Dengan API (Application Programming Interface) yang dimiliki HTML5, suara dan video dapat ditampilkan dengan menaruh sebuah elemen di HTML5. Meski dengan tambahan Javascript, Overal ! its very easy for beginners !
  • Performance. Pasti pernah kan membuka Google Apps? Baik itu Gmail, Google Drive, maupun sejenisnya. Ternyata mereka menggunakan HTML5, lihat performanya dan bandingkan dengan Gmail di beberapa tahun yang lalu sebelum memakai HTML5. Pasti lebih powerful dan keren. 🙂
  • Masih banyak lagi. Bisa pembaca cek di sini > Html5Rocks.

Nah, sebenarnya ada satu lagi kelebihan yang dimiliki HTML5 selain yang saya tulis di atas, yaitu Cross Platform. Dengan kata lain semua browser dan semua device baik itu mobile maupun desktop, sudah mendukung penggunaan HTML5. Untuk apa? Pastinya untuk membangun sebuah aplikasi. Contoh saja Gmail dan Google Apps lainnya yang dibangun menggunakan HTML5, mereka merupakan sebuah aplikasi (asli) yang hanya bisa dijalankan via browser. Sangat keren menurut saya.

Kemudian ada kabar gembira baru, HTML5 sekarang ini sudah bisa dipakai untuk membangun aplikasi mobile, entah itu untuk platform Android, iOS, bahkan BlackBerry. Its Awesome Guys ! Pernah membuat aplikasi Android? Pusing dengan Java? C++ dan teman-temannya? Kalian sudah bisa HTML, kalian bisa membuat aplikasi Android. Jika tidak percaya, Aplikasi yang saya buat bersama teman-teman ini asli menggunakan HTML5. Cek di sini aplikasinya > Google Play.

Untuk dapat membangun aplikasi mobile menggunakan HTML5, memang ada beberapa tools tambahan yang harus kita pakai. Berikut adalah beberapa tools yang bisa kita pakai untuk membangun aplikasi mobile dengan HTML5,

  • PhoneGap (Apps)

  • Sencha Touch (Apps)

  • Cocos2D Javascript (Games)

  • Cocoon JS, etc. (Games)

  • Construct 2 (Games)

Begitu banyaknya tools yang dapat kita pakai untuk membangun aplikasi mobile dengan HTML5, sampai-sampai saya malas me-list dan menuliskan di sini. Hehe, mungkin lain kali, di seri tutorial selanjutnya saya akan membahas dan menerangkan secara lebih detail tentang HTML5 dan PhoneGap.

Cheers ! 😀

 

Muhammad K Huda

A non exhausted blogger person within fullstack engineer (spicy food), open source religion, self-taught driver and maybe you know or don't like it. Simply says, Hello from Me!

 

14 thoughts on “Seri HTML5 Untuk Aplikasi Mobile

  1. jujur saya masih awam tentang HTML5 tp baca review diatas jadi sedikit faham, tp saya mau tanya dengan fasilitas yang di miliki HTML5 kita untuk membuat sebuah website masih perlu menggunakan css untuk designnya tidak?? thanks

    -Yogi Wijaya

  2. mau nanya. kalo bikin aplikasi html5 pake adobe edge animate. bagaimana caranya convertnya ke mobile (handphone seperti android)? apakah buildnya menggunakan phonegap? atau menggunakan cara lain? jika phonegap, phonegap apakah yang digunakan? adobe phonegap build, atau xdk dari intel?.mohon bantuannya.

    1. pertanyaan bagus ! kita tahu salah satu kelemahan aplikasi android dengan basis phonegap adalah tidak mendukungnya beberapa fitur animasi javascript. NAMUN, perlu diperhatikan adalah sangat memungkinkan jika sebuah project edge animate kita eksport ke Phonegap.

      Tentunya mas/mbak nana bisa menggunakan Phonegap Build atau jika sudah lebih mahir, bisa memanfaatkan Eclipse secara manual instalasi Phonegapnya.

      Silahkan lihat video ini untuk penjelasan eksport edge animate via phonegap Build http://www.youtube.com/watch?v=9sYvqo3zxwg

  3. cara menggunakan HTML5 core gimana ya min? soalnya saya ingin mengconvert aplikasi saya menjadi apk? tlg pencerahannya min..

  4. Mau tanya mas, perkenalkan nama saya hilal…misal kita ingin membuat aplikasi android lewat adobe animate versi 20 dimana kita menginginkan nantinya hasil akhir keluarannya bisa berupa file extension android apk dan html gimana caranya mas?
    Terimakasih atas ilmunya mas, semoga menjadi amal baik masnyaa

Leave a Reply to Anggri Cancel reply

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.