Mengenal Yeoman !

Apa itu Yeoman?

Yeoman adalah generator untuk aplikasi web, berbicara tentang generator generator ini mendukung banyak aplikasi project web modern seperti Angular, EmberJS dll.

Kenapa harus Yeoman?

Nah.. kita sudah tau kalau Yeoman adalah generator untuk aplikasi web, dengan Yeoman aplikasi web yang kita buat akan secara otomatis di generate oleh Yoeman jadi kita gak perlu pusing masalah struktur folder, alur kerja, paket pendukung dll, karena Yoeman bertujuan untuk mempermudah masalah pembuatan website yang rumit dengan alur kerja the scaffolding workflow.

Alur kerja (Workflow) Yeoman terdiri dari tiga tools utama untuk meningkatkan produktivitas dan kepuasan ketika membangun aplikasi web. Tools tersebut adalah:

  • yo - scaffolding dari Yeoman

  • Paket manager bower atau npm - untuk mendownload paket kebutuhan dalam project Yeoman

  • Build tool grunt atau gulp - untuk melakukan building aplikasi web Yeoman

Masing-masing projet tools diatas dikelola oleh komunitas masing-masing, tapi bekerja sama dengan baik sesuai alur kerja untuk menjaga project Yeoman tetap efektif untuk digunakan. Berikut alur binary Yeoman

Alur Yeoman

sumber gambar disini

Install prerequisites

Sebelum menginstall Yeoman pastikan aplikasi dibawah ini sudah terinstall dengan baik :

yo

Yo dikelola oleh Yeoman project dan menawarkan aplikasi web scaffolding, memanfaatkan scaffolding template kita sebut sebagai generator. Kita bisa menginstal yo dan setiap generator dengan menggunakan npm.

Install yo dan generator pendukung

$ npm install -g yo bower grunt-cli gulp

Install Basic scaffolding

Untuk menginstall scaffold web application , kita perlu menginstall generator-webapp generator. Paket ini adalah default untuk pembuatan web application generator, paket ini sudah termasuk didalamnya HTML5 Boilerplate, jQuery,Modernizr, dan Bootstrap.

$ npm install -g generator-webapp

Membuat folder project

$ mkdir latihan-yeoman
$ cd latihan-yeoman

jalankan

$ yo webapp

Secara otomatis Yeoman akan menginstall paket-paket pendukung, jadi sediakan koneksi internet yang mumpuni yah… :D

Install Scaffolding AngularJS app

Untuk menginstall paket Yeoman untuk generator AngularJS pakai perintah dibawah ini

$ npm install -g generator-angular

jika berhasil buat folder baru seperti contoh sebelumnya dan jalankan perintah di bawah ini

$ yo angular

Grunt

Menjalankan aplikasi dengan grunt

$ grunt serve

output

Running "serve" task

Running "clean:server" (clean) task
 1 path cleaned.

Running "wiredep:app" (wiredep) task

Running "wiredep:test" (wiredep) task

Running "concurrent:server" (concurrent) task

Running "copy:styles" (copy) task
Copied 1 file

Done, without errors.


Execution Time (2015-11-04 05:52:41 UTC)
loading tasks               196ms  █████████████████████████████ 85%
loading grunt-contrib-copy   19ms  ███ 8%
copy:styles                  15ms  ███ 7%
Total 230ms

Running "articlecss:server" (articlecss) task
 1 processed stylesheet created.

Running "connect:livereload" (connect) task
Started connect web server on http://localhost:9000

Running "watch" task
Waiting...

jika berhasil buka browser, url defaultnya http://localhost:9000/#/

yeoman preview

Referensi


Related Post