Code Juices

Kenapa jangan Pixel?

karena pixel tiap device itu berbeda, pixelnya web lebih besar dari pixelnya mobile. dulu saat pertama belajar web kita sering menggunakan px sebagai acuan untuk ukuran, namun semenjak adanya mobile dengan pixel yang lebih tinggi dari komputer membuat px tidak cocok dipakai sebagai ukuran. Contoh lain juga karena di beberapa browser ada fitur untuk mengubah ukuran font. kalau kita menggunakan px maka ukuran padding atau margin yang menggunakan px tidak akan berubah. Solusinya adalah REM dan EM.

Hai REM

ketika kita mengubah ukuran font pada browser, maka ukuran margin dan padding yang kita set menggunakan REM akan ikut berubah menyesuaikan dengan ukuran dasar dari root font-size.

Berikut adalah contoh bagaimana kita bisa melihat kalau px, rem dan em sangat berpengaruh.

Setting ukuran font pada Chrome

Jika ingin pixel kita sama maka kita bisa memaksa Chrome dengan menentukan ukuran font dasar lewat css menggunakan pixel seperti:
{ font-size: 10px; }

// TODO : membuat code pen untuk menunjukan perbedaan px, REM dan EM.

Octoverse, menjawab dilema memulai belajar bahasa pemrograman

Octoverse

#github #program #code #webdeveloper #vcs #android #ios #appdeveloper #app #programmer

https://octoverse.github.com

😋 Kayaknya enak bisa bikin program. tapi bingung mulai dari mana ya? terus apakah bahasa pemrograman yang kita pelajari saat ini bakal dipakai untuk kedepannya? fenomena yang terjadi di Indonesia adalah mulai ditinggalkannya bahasa php. why? dulunya dengan php saja kita sudah bisa membuat sebuah website. dengan template wordpress kita sudah bisa membuat blog. namun zaman sudah berubah.

Saat ini dunia terbagi menjadi 2 ✌ bagian yaitu frontend 💅 dan backend 🖥. analoginya itu frontend merupakan petarung terdepan dalam menghadapi klien, dan backend adalah penyedia senjata. keduanya sama penting saat ini. Masih ingatkah kalian saat frontend cuma html css js dan backend hanya CRUD saja. ternyata dunia sudah tidak sesimpel itu.

Biar tidak bingung ingin belajar apa ayo kita tanya anaknya Github bernama Octoverse yang akan memberi tau kita trend pemrograman saat ini.

Gambar Header Octoverse

Hai, Aku Octoverse

Octoverse merupakan kumpulan statistik dari Github. tau sendiri kalau Github itu open source git terbesar di dunia saat ini hehehe. Zaman saya dulu Github hanya bisa public dan yang private berbayar sehingga akhirnya semua pindah ke Gitlab atau Bitbucket untuk private repository namun semenjak github sudah menyediakan private gratis akhirnya saya sendiri pindah ke github.

Grafik negara penyumbang open source terbesar

Indonesia urutan ke 4 tuh. tidak kalah netizen nya hahaha.

Cek yang banyak anggota Komunitas nya

Kenapa Octoverse bisa menjadi acuan kita dalam belajar bahasa pemrograman mana? karena bahasa pemrograman yang paling berkembang adalah yang banyak komunitas dan kontributornya. Siapa juga yang tidak mau pakai produk dengan library yang sudah sangat banyak dan disediakan umum hahaha.

Banyak Library mengurangi Mikir

Don't repeat yourself(DRY/ Jangan Bikin yang sudah ada), IT itu tinggal copas gaes. kalau kalian buat sesuatu yang sudah ada itu buang - buang waktu kecuali kalian memang ingin membuat yang lebih baik atau library itu tidak sesuai keinginan. Library menjadi kunci untuk pembuatan software ala Bandung Bondowoso (semalam jadi). Sayangnya PHP yang populer di negara Indonesia kita tercinta ternyata tidak menduduki peringkat dengan library terbesar. Ternyata peringkat pertama di raih oleh npm atau nodejs. sata urutkan dulu ya.

Statistik 5 Penyedia Library Terbanyak

Peringkat bahasa pemrograman berdasarkan jumlah library :

NPM - javascript
RubyGems - Ruby
Maven - Java
NuGet - .NET
pip - python

Saat ini Javascript Juaranya

Bukan main ternyata javascript mejadi juara 5 tahun berturut - turut. Saya sendiri pertama mengenal javascript lewat Web hingga sekarang bisa merambah ke backend express, PWA, desktop Elektron, mobile React Native & Ionic.

Statistik Pengguna Bahasa Pemrograman Terbanyak

Meskipun javascript merupakan bahasa paling banyak penggunanya ternyata javascript tidak menduduki posisi pertama sebagai bahasa paling berkembang. Dart menjadi juara untuk bahasa paling berkembang, menurut pengetahuanku sih karena Dart yang merupakan bahasa utama di Flutter sudah multi platform baik Web, iOS, dan Android. Mungkin kedepan akan merambah ke desktop juga. Kemudian ada Rust dan HCL yang perlu kita pelajari juga. Go lang sekarang juga merupakan bahasa paling cepat untuk akses ke backend.

Statistik Perkembangan Bahasa Pemrograman

Kesimpulan

Jadi menurut saya, kita harus belajar banyak bahasa. Bahasa tidak diciptakan untuk bersaing namun karena masing - masing memiliki keunggulannya sendiri. Saya dulu memulai dari Java sehingga saya kebingungan dengan Python yang bisa mengembalikan 2 variabel dan juga kotlin yang punya tanda tanya untuk null exception dan Golang yang tidak punya class. Boleh jadi master di satu bahasa pemrograman, tapi kita juga harus membuka telinga untuk bahasa pemrograman yang mungkin memiliki fitur yang sesuai dengan kebutuhan kita untuk kedepannya. Namun kita bisa melihat grafik diatas untuk memilih bahasa mana. Saran saya yaitu Typescript dan Dart. Typescript merupakan versi lanjutan dari Javascript dan Dart merupakan bahasa paling berkembang, lowongan pekerjaan yang paling sering saya temui yaitu 2 bahasa ini karena keduanya mencakup Frontend dan Backend(kecuali Dart). Kalau kalian punya pendapat lain silahkan tulis di kolom komentar. Matur Suwun 💙💚

React (eps 1.0) Membangun Create React App + Typescript

Saya mulai belajar React tahun ini, saya memiliki pengalaman membangun web menggunakan Laravel. kalau di Laravel, mereka juga punya kemampuan manajemen komponen yang disebut blade. Perbedaannya di React menggunakan kustom tag seperti HTML sehingga lebih mudah dibaca. saya pernah menggunakan Angular sekali, sayangnya angular memiliki aturan sendiri seperti *ngIf and *ngFor while in React we can still use normal if and for statement. Typescript have been fill something missing in javascript. Seperti namanya, Type + script. yaitu javascript yang diberi tipe data. jadi mari kita membuat aplikasi React menggunakan typescript.

Command untuk membuat react-app dengan template typescript. :

yarn create react-app my-app — template typescript

Selanjutnya kita akan mempelajari konfigurasi kekinian seperti

SCSS (css yang bisa diisi logic dan variabel)
ESLINT & PRETTIER (pengaturan untuk membuat code anda tetap rapi)
WEBPACK (membungkus semua source javascript anda agar bisa dibuka di web)
JEST + ENZYME (test aplikasi anda)

Telling Story using Data

Into :
Terminator. Public said we will create them someday. Today is 2018, The hypest topic in technology is Machine Learning, Data Science, and Internet of Think. Our every activites is recorded and become data but how is our knowledge is result from brainwash? Have you ever heard the job about Driving Public Opini.

I wanna share knowlegde which I got from seminar yesterday. The Topic is "Telling Story using Data". I can say if we make analogical how data works like how to cook.

We have a customer, he has bunch of data but he don't know what to do with it. Imagine the data is egg from poultry farm.

Data Flow

What do you want to Eat? (Introduction)

What we want to make.

Let's define what is our goal.

Where we can get the Ingredient? (Data Gathering)

Let find which egg we should use, duck or chicken.

then you will know what kind of data you'll need to gather. What technique method to understand it and what informations you'd like to get, best way to visualize

What can we do with the Ingredient? (Data Visualisation & Analytics)

We can create omelet and fried egg.

Enjoy it! (Business Implementation)

Let me try it taste.

Let see the story result

An e-commerce must care about their conversion rate, customer rate, customer lifetime value, retention rate

usually we should have north star metric, what is that? The North Star Metric is the single metric that best captures the core value that your product delivers to customers

Metrics

Here are list of metric that can be matter.

Acquisition

Function : Generate attention through a variety of means

Relevant metric : Traffic, mentions, cost per click, search results, cost of acquisition, open rate

Activation

Function : Turn the resulting drive-by visitors into users who are somehow enrolled

Relevant metric : Enrollments, signups, completed, onboarding process, used the service at least once, subscriptions

Retention

Function : Convince users to come back repeatedly

Relevant metric : Engagement, time since last visit, daily and monthly active use, churns

Revenue

Function : Business outcomes (purchases, ad clicks, content creation, subscriptions, etc)

Relevant metric : Customer lifetime value, conversion rate, shopping cart, size, click-through-revenue

Learn Java Stream from SQL Query : Distinct

Sometimes there is some duplicate data that we think not important. Like Students in Scholl have address data but we only need from where they comes. So we want to distinct that data. I have 2 distinct type. First is get only unique data from subdata like address, or we want to keep distinct returning full Model data like representation only.

Code :
___________

result :

Ricoaw
Arisandy
Wijaya
Soekarno
Diponegoro
Patimura
Fatmawati
Hatta

You should put distinct after map to only get single subdata(field).

Pages