Sedikit Kisah Bersama Angular 2

Bintang Adinandra
CICIL Tech
Published in
3 min readOct 22, 2017

Selamat malam semua. Mungkin sebelum kita terjun ke topik, ada beberapa hal yang ingin saya jelaskan. Pertama, siapa saya? Nama saya Bintang, dan saya adalah Front End Engineer di cicil.co.id. Saya bukan front-end yang imba atau jago banget tapi saya suka belajar, keep improving, dan tentu menulis. Teknologi front end yang kami digunakan di Cicil yaitu Angular 2. Mungkin teman-teman semua sudah tidak asing lagi dengan framework yang satu ini.

Logo Perisai Kebanggan Angular 2

Curhat Angular 2

Ya, Angular memang diconsider sebagai framework, tidak sekedar library. Angular 2 memberikan struktur yang cukup solid dengan routing, module, dan service yang sedikit membedakan dengan library lainnya (Saya juga gemar Vue js btw). Salah satu dari pengembangan aplikasi yang paling saya rasakan di Angular adalah sistem modulenya yang membungkus komponen serta service-service yang dibutuhkan. At the first time, memang rasanya ribet dan muncul hal-hal seperti:

  • Ini module katanya diimport di lebih dari satu module?!?… Oh buat levelnya jadi higher. Maksudnya apa ini?!
  • Ini kenapa komponennya belum dideclare! Bukannya sudah saya declare di module….. apa tadi namanya?
  • Damn! Banyak banget filenya!
  • Hmm, kira2 perlu di-service-keun ga ya? Ah ga usahlah buat jadi public var aja.
  • *sesaat setelah ngoding* Hmmmm, harusnya ini gue buat module terpisah untuk fitur ini! Oke masuk to-do list refactoring.
  • Kampret typescript emang harus didefine aja semuanya!, eh bntar…. hmmmm…. enak juga, oke.. gue cinta typescript

Ya, kurang lebih seperti itulah. Namun disisi lain, memang Angular 2 itu memang framework yang cukup luar biasa, dan sangat declarative. Saya sendiri sudah mencoba 2 front-end library/framework — yaitu Vuejs dan Angular js (2 & 4) dan kesimpulan saya masing-masing ada plus-minusnya. Namun sori banget nih temen-temen kayanya ga belum gue share sekarang mungkin next time :)

Other topic coming up!

Serius ni Angular 2 aja untuk tech-stack di Cicil? Wah ngga dong tentunya, kami juga menggunakan beberapa library lain yang mungkin kalian kenal. Apa aja sih kira-kira?

Rxjs

Rxjs

ReactiveX atau lebih dikenal RxJs. Sejujurnya saya belum bisa mengatakan bahwa diri saya menguasai rxjs sepenuhnya. Namun, salah dua fitur subject dan observable-nya, its pretty damn cool and useful! Kamu juga menggunakan rxjs di single store management atau mungkin bahasa terkenalnya adalah flux (ngrx-store untuk Angular 2 — eh bntar buat apa kan ada service! Next topic ya). Mungkin kedepannya saya bisa share ke teman-teman konsep dan kegunaan dari rxjs.

Universal

Banner Angular Universal

Mungkin teman-teman sudah ada yang tau konsep dari universal(isomorphic) web application. Karena kami menggunakan Angular, kami gunakan Angular Universal. Lalu apa sih gunanya universal ini? Serverside rendering? Client Side rendering? What if both?! Boom. Garis besarnya adalah server kerja, dan client juga kerja sehingga first slab ketika membuka website akan sangat cepat. Bagaimana sih seutuhnya universal web app membantu Cicil? Tunggu tulisan selanjutnya ya :)

Hope it helps you in some way!

Ah, sudah sampai sepertinya Saya pada penghujung sedikit sharing ini. Semoga membantu menginspirasi teman-teman dalam membuat web apps! Sekian dan terima kasih.

Happy Coding

--

--