React Native

I admit it, React Native is good enough.

HAHAHA

I Hate JavaScript. Not because "JavaScript", because I hate everything.

Kalau enggak mau baca basa-bashit, langsung ke Tentang React Native aja. Tapi gue harap lu baca basa-basi nya dulu

Gue benci JavaScript karena electron. Rangorang mulai pada bikin desktop app (pseudo maksud gue) menggunakan JavaScript, via Electron. Oke lah electron mungkin bisa berinteraksi dengan beberapa API di desktop, tapi bundle size kayak enggak bismillah dulu. Jujur gue lebih suka dengan Desktop App yang meskipun dibuat "Native", tapi hanya embed web via WebView.

Setidaknya lebih rasional.

Seperti mobile apps nya Basecamp dulu, meskipun hanya embed via WebView, tapi untuk navigasi menggunakan native component. Perpaduan web ui yang telah dimodifikasi dengan turbolink membuat mobile app nya basecamp memiliki pengalaman "hampir native".

Tapi itu 20114, mungkin sekarang sudah full native.


Lu bayangin, Slack yang engineer nya ratusan (atau ribuan?), yang valuasi perusahaan nya kurang lebih $5.1B, tapi membuat aplikasi desktop masih menggunakan Electron.

Hire desktop engineer yang tau API di desktop, tapi masih menggunakan teknologi web. Mungkin yang gue dapet si Slack ini memang pengen bener-bener mengubah pandangan orang lain tentang teknologi web, alias "Always bet in JavaScript", tapi ada banyak customer yang mengeluarkan $$ untuk menggunakan Slack. Mungkin mereka enggak peduli, entah karena lebih menggunakan Web App nya, atau mobile app nya, tapi gue? Developer lain 'yang peduli'?

Join with us, and solve this problem! Bacot doang lu riz

Bahkan gue enggak tau cara bikin segway di desktop. Debugging aja masih pakai print().

Liat telegram. Engineer nya berapa? Desktop & mobile app nya native and so smooth as fuc... frappucino. bundle size nya bahkan enggak menyentuh 60MB. Yaa itukan telegram bukan slack, yaga?

Balik lagi ke React Native.

Mati-matian gue mempelajari pembuatan iOS app atau MacOS app, dari mempelajari Objective-C (yang akhirnya langsung ke Swift, gegara ini), sampai ke pembuatan layount menggunakan Auto Layout alias tanpa StoryBoard. Gue enggak tau sebelumnya apa itu constraints, @IBOutlet, @IBAction, dll. Yang gue tau padding, margin, onPress atau onClick, dll. Karena background gue adalah Frontend Web Engineer.

Bukan Mobile Engineer. Yang berarti gue harus mempelajari dari nol alias buta banget. Gue jadi keinget ketika gue mempelajari React, JavaScript Library untuk membuat UI.

Sebelum menggunakan Vue, gue menggunakan React. Belajar React ini gue ribet banget, karena dulu gue masih menggunakan paradigma template-based, bukan component-based. Terlebih belum pernah mengatur state di Component, mungkin dulu nyimpen nya di DOM (hello <div data-whatever="value">). Karena tuntutan pasar, gue harus mempelajari React.

Mati-matian gue belajar React, dari Thinking in React nya, sampai ke Higher-order Component nya.

Dan sekarang udah bisa! Lu bisa cek Kelas Bekraf sebagai hasil nya di Production, meskipun udah lama enggak gue maintenance, setidaknya versi React udah Fiber (v16.x.x)

Dari belajar React ini gue udah paham ke Vue, gue cuma mempelajari Component Lifecycle di Vue (yang lebih kompleks dari React menurut gue), sampai ke API yang ditawarkan oleh Vue. Dulu gue enggak ngerti tentang Vue, karena di Vue kita cuma bikin 1 instance Vue yang di bungkus dalam satu Object new Vue({}). Dan what the fuck Single-file Component? Gue milih Vue karena bundle size nya lebih lightweight, enggak milih Preact karena ekosistem nya yang kurang rame kek React. Dan Vue ini asiknya ada di Single File Component nya. Intinya berkat React, gue bisa dan paham menggunakan Vue.

Tentang React Native

Dari Web, ke Mobile. Enggak segampang ngatur viewport di web. Ketika kita membuat sebuah Web App kita harus tau Browser API dan arsitektur browser nya (berlebihan sih, tapi ini serius), berarti di mobile kita harus tau API nya dan arsitektur nya juga.

Serupa, tapi tak sama. Mungkin idle di Web App ketika user berganti tab, tapi tidak mengclose halaman kita. Dan di mobile, paling ketika minimize atau back to home. atau lock screen.

Behaviour sama, tapi API nya beda.

Gue enggak paham cara mobile app development, terus langsung mempelajari pembuatan iOS app menggunakan Swift. Setidaknya gue bisa dari bootstrapping sampai build walau cuma "Hello World" atau lainnya.

Karena ingin "kelar cepet", gue mau enggak mau harus menggunakan teknologi yang udah familiar dengan gue, yaitu the fucking JavaScript. Sebuah markup language yang ["1","2","3"] == ["1","2","3"] false tapi ["1","2","3"] == "1,2,3", this why we should use reference equality (===).

Gue familiar dengan JavaScript, familiar dengan React, familiar dengan Styling di DOM. Mungkin membuat mobile app bisa lebih cepat menggunakan React Native. Hal yang paling gue khawatirkan dalam pembuatan app adalah "bundle size", dan you know lah bundle size aplikasi yang dibuat bukan menggunakan bahasa pemrograman OS asalnya pasti gimana.

Tapi pemikiran gue berubah, setelah agensi yg bernama Evil Martians ngetweet ini:

Lalu gue tanya "How about with bundle size?", dan intinya kata mereka "Nope. I would assume it'd shrink the bundle size significantly, but then again, everything that's under 100 MB is fine." Karena bundle size app nya 42MB.

agensi yang gue seganin yang salah satu nya karena kalau membuat mobile app selalu native, ternyata mencoba membuat mobile app menggunakan React Native. Dan client nya pun selalu brand besar, untuk kasus ini Podium. Ya, 42MB lumayan rasional untuk aplikasi seperti messaging.

Kesimpulan: I re-learn React Native, finally. Secara Developer Experience lebih nyaman, karena gue familiar dengan JavaScript. Kita lihat nanti ini bundle size nya berapa, kalau udah di optimasi mentok nya berapa.

"Always bet in JavaScript". Semoga ada project di KickStarter untuk menyelesaikan masalah yang Electron punya sekarang.

Show Comments

Get the latest posts delivered right to your inbox.