Bikin Project JavaScript (Webpack) dengan Poi

Yang udah pernah bikin project pake Webpack, Babel, dll. pasti setuju kalo initial setup-nya agak ribet. Kadang rasanya terlalu ribet kalo cuma untuk bikin project-2 kecil.

Ini ada tool namanya Poi yang bisa bantu setup Webpack dkk secara “otomatis”.

Kalo untuk project beneran saya masih lebih sreg pake manual setup. Utamanya karena saya kurang suka kalo ada tambahan layer lagi krn biasanya malah bikin susah. Tapi kalo untuk project kecil buat tutorial atau eksperimen, bolehlah pake Poi.

Instalasi

Karena tujuannya pake Poi buat bantu bikin project, baiknya instal secara global aja.

$ yarn global add poi
#atau
$ npm install -g poi

Continue reading →

ReactJS : Server & Client Routing

Pada dasarnya, ada tiga macem Routing dalam aplikasi web: Server-side ,Client-side, & kombinasi keduanya. Dalam tutorial ini saya akan bahas tentang routing di sisi klien & server pake React Router.

Sedikit info buat yang belum tau routing .

Server-side Routing

Dalam Server-side Routing semua rekues dihandel server yang akan kirim HTML sebagai respon ke browser.

Jadi misalnya dari home page: www.tiket.com kita buka www.tiket.com/pesawat, rekues dikirim ke server yg kemudian kirim respon HTML yg berisi halaman /pesawat ke browser.

Jadi ini model konvensional. Rekues -> server -> browser refresh.

Ini routing untuk web page ya. Kalo routing untuk REST API, ya nggak perlu browser refresh.

Client-side Routing

Client-side Routing mulai populer dengan adanya dukungan browser utk History API dari spesifikasi HTML5 & munculnya Single-page Application (SPA). Jadi waktu kita buka /pesawat, nggak ada rekues yg dikirim ke server. Rekues dihandel oleh kode JavaScript yang kemudian menampilkan komponen Flight di browser. Kalo kita pindah ke /train , ya yang ditampilin adalah komponen Train.

Continue reading →

Git Flow 02 – Release

Lanjutan dari:
Git Flow 01 – Intro

Sebelum rilis, kita bikin dulu release-branch dari develop, pake perintah:

git flow release start (nama rilis/versi)

Contohnya begini:

$ git flow release start v1.0
Switched to a new branch 'release/v1.0'

Summary of actions:
- A new branch 'release/v1.0' was created, based on 'develop'
- You are now on branch 'release/v1.0'

Follow-up actions:
- Bump the version number now!
- Start committing last-minute fixes in preparing your release
- When done, run:

     git flow release finish 'v1.0'

Di branch release/v1.0 ini kita jalanin proses-proses yg perlu buat rilis, misalnya:

Continue reading →

Git Flow 01 – Intro

Ada beberapa metode branching Git yang bisa kita praktekin. Ada model Centralized, Environment Branching, dan lain-lain. Git Flow adalah salah satu yang populer.

Di dalam metode Git-Flow, ada dua long-lived branch (cabang yang ga pernah dihapus) yaitu:
master
develop

master berisi kode yang di-deploy ke production-server. Jadi hanya kode yang sudah dites, lolos QA & dirilis yang ada di sini.

develop, sesuai namanya, dipake untuk development. Untuk sinkronisasi kode antara satu developer dengan yang lain. Penambahan fitur baru atau perbaikan kode selalu berbasis branch ini.

Instalasi

Ini opsional, kita bisa pake metode Git Flow pake perintah-perintah standar Git, tanpa command-line tool tapi rawan error karena lupa, dll. Jadi mending instal CLI-nya.

Ada dua macam CLI yang populer, satu yang Git Flow yg asli/vanilla & yg satu fork-nya git-flow-avh. Versi AVH lebih baru daripada yg vanilla & ada beberapa perintah tambahan.

  • Windows: git-flow-avh udah termasuk di dalam paket Git for Windows. Kalo pake Chocolatey, choco install git.
  • Mac: brew install git-flow-avh
  • Linux: di sini.

Continue reading →