Tag / Notable AngularJS

Macam - macam Tag / Notable AngularJS....!!

Notable AngularJS memungkinkan pengembang untuk menentukan kustom dan tag HTML dapat digunakan kembali yang moderat perilaku unsur-unsur tertentu....!!

ng-app

Menyatakan elemen sebagai elemen root dari aplikasi yang memungkinkan perilaku yang akan diubah melalui tag HTML kustom.

ng-bind

Secara otomatis mengubah teks dari elemen HTML dengan nilai ekspresi yang diberikan.

ng-model

Mirip dengan ng-bind, namun memungkinkan data dua arah mengikat antara tampilan dan ruang lingkup.

ng-class

Memungkinkan atribut kelas yang akan dimuat secara dinamis.

ng-controller

Menentukan JavaScript kontroler kelas yang mengevaluasi ekspresi HTML.

ng-repeat

Instantiate sebuah elemen sekali per item dari koleksi.

ng-show & ng-hide

Persyaratan menampilkan atau menyembunyikan elemen, tergantung pada nilai dari ekspresi boolean.

ng-switch

Persyaratan instantiate satu template dari satu set pilihan, tergantung pada nilai ekspresi seleksi.

ng-view

Basis direktif bertanggung jawab untuk menangani rute yang menyelesaikan JSON sebelum menampilkan template didorong oleh controller.

ng-if

Dasar jika pernyataan direktif yang memungkinkan untuk menampilkan elemen berikut jika kondisi benar.

Pengertian DOM

Apa itu DOM ???

Document Object Model (DOM) adalah rekomendasi dari W3C untuk melakukan proses terhadap dokumen terstruktur seperti XML dan HTML. DOM didefinisikan sebagai sebuah spesifikasi Application Programming Interface (API) yang bebas bahasa dan platform. DOM mendefinisikan struktur lojik dokumen serta cara untuk melakukan manipulasi dan akses terhadap dokumen tersebut. Saat ini W3C telah mengeluarkan tiga buah rekomendasi untuk DOM yaitu DOM Level 1, DOM Level 2 dan DOM Level 3.

DOM akan membentuk representasi logik dokumen terstruktur yang akan dimanipulasi dalam struktur pohon. Manipulasi terhadap bagian isi dari dokumen dilakukan dengan manipulasi terhadap elemen-elemen pohon ini. W3C telah menspesifikasikan beberapa prosedur untuk melakukan manipulasi terhadap struktur pohon DOM. Prosedur tersebut meliputi penambahan (adding), penghapusan (deleting) dan pemutakhiran (updating).

Untuk memanipulasi dokumen dengan DOM, suatu parser akan membentuk representasi logik dari bagian isi dokumen XML dalam bentuk struktur pohon. DOM tidak menjelaskan bagaimana melakukan parsing terhadap dokumen, pembuatan dokumen baru ataupun melakukan serialisasi terhadap dokumen. Hal ini dikarenakan DOM adalah spesifikasi yang bebas bahasa. Untuk melakukan fungsi-fungsi tersebut dibutuhkan DOM parser yang diimplementasikan kedalam berbagai bahasa pemrograman tertentu seperti C, C++, atau Java. Beberapa contoh DOM parser adalah Apache Xerces, Crimson, Oracle XML Parser for Java atau MsXML.

Activitas pengembangan DOM di W3C sudah ditutup sejak tahun 2004 dengan lengkapnya pengembangan DOM Level 3 Recommendations. Tapi saat ini W3C Web Applications Working Group sudah mulai bergerak untuk melakukan revisi. Jika tertari, diskusinya bisa diikuti dipublic-webapps@w3.org atau www-dom@w3.org mailing lists.

Model View Controller (MVC)

saya akan memberikan sedikit tentang gambaran apa itu MVC (Model View Controller)....!!!

Konsep MVC  :

Secara sederhana konsep MVC terdiri dari tiga bagian yaitu bagian Model, bagian View dan bagian Controller. Didalam website dinamis setidaknya terdiri dari 3 hal yang paling pokok, yaitu basis data, logika aplikasi dan cara menampilkan halaman wesite. 3 hal tersebut direpresentasikan dengan MVC yaitu model untuk basis data, view untuk cara menampilkan halaman website dan controller untuk logika aplikasi.

1. Model

Merepresantiskan struktur data dari website yang bisa berupa basis data maupun data lain, misalnya dalam bentuk file teks atau file xml. Biasanya didalam model akan berisi class dan fungsi untuk mengambil, melakukan update dan menghapus data website. Karena sebuah website biasanya menggunakan basis data dalam menyimpan data maka bagian Model biasanya akan berhubungan dengan perintah-perintah query SQL. Model bisa dibilang khusus digunakan untuk melakukan koneksi ke basis data oleh karena itu logika-logika pemrograman yang berada didalam model juga harus yang berhubungan dengan basis data. Misalnya saja pemilihan kondisi tetapi untuk memilih melakukan query yang mana.

2. View

Merupakan informasi yang ditampilkan kepada pengunjung website. Sebisa mungkin didalam View tidak berisi logika-logika kode tetapi hanya berisi variabel-variabel yang berisi data yang siap ditampilkan. View bisa dibilang adalah halaman website yang dibuat menggunakan HTML dengan bantuan CSS atau JavaScript. Didalam view jangan pernah ada kode untuk melakukan koneksi ke basis data. View hanya dikhususkan untuk menampilkan data-data hasil dari model dan controller.

3. Controller

Controller merupakan penghubung antara Model dan View. Didalam Controller inilah terdapat class dan fungsi-fungsi yang memproses permintaan dari View kedalam struktur data didalam Model. Controller juga tidak boleh berisi kode untuk mengakses basis data. Tugas controller adalah menyediakan berbagai variabel yang akan ditampilkan di view, memanggil model untuk melakukan akses ke basis data, menyediakan penanganan error, mengerjakan proses logika dari aplikasi serta melakukan validasi atau cek terhadap input

Elemen - Elemen HTML 5

Pada artikel serial html5 kali ini kita akan membahas tentang elemen – elemen yang ada pada html5.

Elemen Markup

Tag	Penjelasan
<article>	Untuk konten eksternal, seperti teks dari artikel-berita, blog, forum, atau konten lain dari sumber eksternal
<aside>	Untuk konten selain konten itu ditempatkan di samping konten yang masuk harus berkaitan dengan isi sekitarnya
<command>	Sebuah tombol, atau radiobutton, atau sebuah kotak centang
<details>	Untuk rincian menggambarkan tentang sebuah dokumen, atau bagian dari dokumen
<summary>	Sebuah keterangan, atau ringkasan, dalam rincian elemen
<figure>	Untuk pengelompokan bagian dari konten berdiri sendiri, bisa video
<figcaption>	Keterangan dari tokoh bagian
<footer>	Untuk footer dari dokumen atau bagian, dapat meliputi nama penulis, tanggal dokumen, informasi kontak, atau informasi hak cipta
<header>	Untuk penerapan suatu dokumen atau bagian, dapat mencakup navigasi
<hgroup>	Untuk bagian dari pos, menggunakan <h1> untuk <h6>, di mana yang terbesar adalah pos utama bagian tersebut, dan yang lainnya sub-judul
<mark>	Untuk teks yang harus disorot
<meter>	Untuk pengukuran, digunakan hanya jika nilai-nilai maksimum dan minimum diketahui
<nav>	Untuk bagian navigasi atau menu
<progress>	Keadaan pekerjaan berlangsung
<ruby>	Untuk penjelasan ruby (catatan Cina atau karakter)
<rt>	Untuk penjelasan tentang penjelasan ruby
<rp>	Apa untuk menunjukkan browser yang tidak mendukung elemen ruby
<section>	Untuk bagian dalam dokumen. Seperti bab, header, footer, atau bagian lain dari dokumen
<time>	Untuk menentukan waktu atau tanggal, atau keduanya

Elemen Media

Tag	Penjelasan
<audio>	Untuk konten multimedia , suara, musik atau streaming audio lainya
<video>	Untuk konten video , seperti klip film atau Streaming video lainya
<source>	Untuk sumber suatu media pada elemen media, menjelaskan didalam video atau media audio
<embed>	Untuk mengisi embedded , contohnya seperti plug-in atau mengambil video dari Youtube.

Elemen Kanvas

Elemen kanvas menggunakan JavaScript untuk membuat gambar pada halaman web.

Tag	Penjelasan
<canvas>	Untuk membuat gambar pada halaman web

Elemen Form

Tag	Penjelasan
<datalist>	Daftar pilihan untuk nilai input
<keygen>	Hasilkan kunci untuk mengotentikasi pengguna
<output>	Untuk berbagai jenis output, seperti output yang ditulis oleh script

Input Type Attribute Values

Untuk kontrol input yang lebih baik sebelum mengirimnya ke server:

Tipe	Penjelasan
tel	Nilai input untuk nomor telepon
search	Untuk bidang pencarian
url	Nilai input untuk memasukkan URL
email	Untuk mengisi email atau lebih dari 1 email
datetime	Untuk pengisian waktu dan tanggal
date	Untuk pengisian tanggal
month	Untuk pengisian bulan
week	Untuk pengisian minggu
time	Untuk pengisian waktu
datetime-local	Untuk pengisian lokal waktu/tanggal
number	Untuk pengisian nomer
range	Untuk pengisian rentang waktu
color	Untuk pengisian heksadesimal sebuah warna, contohnya #FF8800

HTML 5 ????

Pengertian HTML5

Dari penjelasan yang ada di wikipedia : HTML5 merupakan sebuah bahasa markah untuk menstrukturkan dan menampilkan isi dari World Wide Web, sebuah teknologi inti dari Internet. HTML5 adalah revisi kelima dari HTML dan hingga bulan Juni 2011 masih dalam pengembangan.

Dimana tujuan utama pengembangan HTML5 adalah untuk memperbaiki teknologi HTML agar mendukung teknologi multimedia terbaru, mudah dibaca oleh manusia dan juga mudah dimengerti oleh mesin.

HTML5 merupakan hasil proyek dari W3C (World Wide Web Consortium dan WHATWG ( Web Hypertext Application Technology Working Group ). Dimana WHATWG bekerja dengan bentuk web dan aplikasi dan W3C merupakan pengembang dari XHTML 2.0 pada tahun 2006, kemudian mereka memutuskan untuk bekerja sama dan membentuk versi baru dari HTML.



Sejarah HTML 5
Kelompok Kerja Teknologi Aplikasi Web Hyperteks (Web Hypertext Application Technology Working Group, WHATWG) mulai membuat standar baru ini pada tahun 2004 ketika Konsortium W3C sedang fokus pada pengembangan XHTML 2.0 di masa depan, sementara HTML 4.01 belum pernah diperbarui sejak tahun 2000. Sejak tahun 2009, W3C dan WHATWG bekerja sama dalam pengembangan HTML5 setelah W3C mengakhiri Kelompok Kerja Pengembangan XHTML 2.0.
Meskipun HTML5 telah dikenal luas oleh para pengembang web sejak lama, HTML5 baru mencuat pada April 2010 setelah CEO Apple Inc., Steve Jobs, mengatakan bahwa dengan pengembangan HTML5, "Adobe Flash sudah tidak dibutuhkan lagi untuk menyaksikan video atau menyaksikan konten apapun di web."(Dikutip dari wikipedia)

Berikut tujuan dibuatnya HTML5 :

• Fitur baru harus didasarkan pada HTML, CSS, DOM, dan JavaScript
• Mengurangi kebutuhan untuk plugin eksternal ( Seperti Flash )
• Penanagan kesalahan yang lebih baik
• Lebih markup untuk menggantikan scripting
• HTML5 merupakan perangkat mandiri
• Proses pembangunan dapat terlihat untuk umum

Fitur baru dalam HTML5 :

• Unsur kanvas untuk menggambar
• Video dan elemen audio untuk media pemutaran
• Dukungan yang lebih baik untuk penyimpanan secara offline
• Elemen konten yang lebih spesifik, seperti artikel, footer, header, nav, section
• Bentuk kontrol form seperti kalender, tanggal, waktu, email, url, search.

Beberapa browser sudah mendukung HTML5 seperti safari, chrome, firefox, dan opera. Kabarnya IE9 ( Internet Explorer ) akan mendukung beberapa fitur dari HTML5.

Pembuatan HTML5 juga di karenakan Standard HTML4 yang dijumpai banyak memiliki kelemahan untuk mendukung aplikasi web yang interaktif. Akibat hal ini banyak orang menambahkan fitur baru baik disisi aplikasi web ataupun disisi browser. Solusi ini dikenal dengan plugin dan salah satunya adalah Flash dan Silverlight.

Semakin menjamurnya plugin didalam aplikasi atau browser membuat aplikasi web ini susah untuk menembus banyak browser. Hal ini dikarenakan setiap plugin mempunyai cara yang berbeda-beda, sebagai contoh kita ingin memasang plugin flash untuk sharing video maka pada halaman web kita harus ditulis sebagai berikut

<object type="application/x-shockwave-flash" width="400" height="220" wmode="transparent" data="flvplayer.swf?file=movies/holiday.flv">
<param name="movie" value="flvplayer.swf?file=movies/holiday.flv" />
<param name="wmode" value="transparent" />
</object>

Contoh diatas menggunakan plugin Flash dari Adobe untuk menjalankan aplikasi web pada browser maka lain caranya bila kita menggunakan Silverlight. Teknologi Silverlight dikembangkan oleh Microsoft. Contoh penggunaan Silverlight pada halaman web dapat dilihat pada HTML dibawah ini

<object width="300" height="300" data="data:application/x-silverlight-2," type="application/x-silverlight-2" >
<param name="source" value="SilverlightApplication1.xap"/>
</object>

HTML5 ini dibuat menyederhanakan kompleksitas penggunaan media video dengan standard baru yaitu penggunaan tag <video>. Dengan fitur baru ini maka kita cukup menulis script untuk menjalankan file video sebagai berikut

<video src=tutorialku.mp4>
</video>

Isu bagaimana menjalankan file video pada aplikasi web merupakan salah satu contoh bagaimana HTML4 tidak dapat mencakup masalah ini dan masih banyak lagi isu pada HTML4. Oleh karena itu, kita sudah saatnya memanfaatkan HTML5 sebagai standard aplikasi web kita.

Apakah Browser Saya Support HTML5?

Bagaimana caranya untuk menguji apakah browser yang anda install itu sudah support HTML5 atau tidak dan seberapa banyak fitur HTML5 yang disupport? Caranya cukup mudah, pertama-tama pastikan komputer anda sudah terhubung dengan internet dan arahkan ke alamat web sebagai berikut:

http://html5test.com

Dari data yang ada pada website itu browser Maxthon 3.4.1 merupakan browser terbaik dalam hal mendukung bahasa HTML5 dengan 422 total skor diikuti kemudian dengan google Chrome 20 dengan 414 total skor kemudian berturut-turut Opera 12.00 dengan 385, Firefox 13 dengan 345, Safari 5.1 dengan 317 dan Internet Explorer 9 dengan 138 point.

Sedikit pemahaman tentang framework???

Definisi Frameworks

Frameworks atau kerangka kerja digunakan untuk membangun aplikasi, dimana aturan-aturan dalam proses pengembangan aplikasi mengikuti ketetapan yang ada pada kerangka kerja. Aturan-aturan dalam kerangka kerja meliputi kode standar, konfigurasi program, dan alur kerja framework.

Frameworks adalah kumpulan dari file-file pustaka (libraries) atau class-class yang terdapat dalam suatu kerangka kerja yang mendukung dalam pengembangan aplikasi secara terstruktur dan independent terhadap aplikasi.

Software Framework adalah sebuah desain yang bisa digunakan berulang-ulang (re-usable design) untuk sebuah sistem atau sub sistem piranti lunak.

Didalam software frameworks mungkin terdapat bagian-bagian berikut :

• Program-program pendukung
• Kode pustaka (libraries)
• Skrip bahasa pemrograman
• Software lain yang membantu pengembangan aplikasi.

Kesemua bagian bekerja sama menyatukan komponen-komponen yang berbeda pada sebuah aplikasi yang dikembangkan.

Beberapa bagian frameworks dijelaskan melalui dokumentasi tentang class-class pada aplikasi yang berisi variabel dan fungsi-fungsi atau disebut API (Application Program Interfaces).

Manfaat Frameworks

Dalam mengembangkan program aplikasi dengan pendekatan RAD (Rapid Application Development), seharusnya programmer dalam membuat kode program tidak berulang-ulang. Programmer dapat membuat metode atau fungsi yang dapat di kustomisasi dan kelak program tersebut dapat digunakan kembali (re-usable program). Programmer dapat membuat komponen-komponen program yang dapat digunakan pada beberapa project yang berbeda.

Tren pengembangan software saat ini menghendaki program yang re-usable, berbasis komponen dan program berorientasi object. Paradigma praktisi IT kini berubah dari yang awalnya melakukan peng-kodean (coding) dari awal “code from stretch” menjadi pengembang (developers) yang cenderung membangun sesuatu dari sesuatu, membangun sebuah aplikasi berdasarkan kerangka kerja atau frameworks.

Programmer atau developers dapat menggunakan frameworks yang sudah ada dalam pembuatan suatu aplikasi program. Dengan menggunakan frameworks akan didapat banyak manfaat diantaranya :

1. Speed of Development : Mempercepat pengembangan aplikasi.
2. Robustness: Aplikasi yang mempunyai performa dan keamanan yang tangguh.
3. Simple : Kode dan logika yang terdapat dalam aplikasi tertata dengan rapi, terjaga tetap teratur, mudah dibaca sehingga akan mempermudah proses maintenance-nya.

Namun demikian ada juga hal-hal yang perlu diperhatikan dalam menggunakan frameworks, diantaranya :

1. High Curve of Learning : Untuk mempelajari sebuah frameworks diperlukan energi yang cukup besar, proses awal belajar akan menemui banyak kendala dan kesulitan, dibeberapa kasus frameworks didapatkan minimnya dokumentasi dan contoh program, namun demikian biasanya terdapat komunitas atau forum yang dapat membantu mempelajari frameworks. Semua hal ini akan terbayarkan oleh kecepatan dan kemudahan pada saat anda telah menguasai frameworks.
2. Large Resouces : Beberapa pihak mengklaim penggunaan frameworks dapat berpengaruh pada performa aplikasi karena banyaknya kode pustaka (libraries) yang dibutuhkan oleh sebuah arsitektur frameworks yang komplek. Hal ini masih dalam perdebatan, namun dengan memahami kekurangan framework yang berakibat pada performa aplikasi, programmer dapat melakukan tuning atau menyempurnakan kekurangan program, karena sesuatu hal tidak ada yang sempurna, demikian halnya dengan framework. Perbaikan dengan melaporkan bugs ke forum atau milis dan melakukan patch dapat membuat frameworks lebih baik dari sebelumnya.