Belajar JavaScript - Penjelasan Async/Await, Callbacks dan Promises pada JavaScript

Belajar JavaScript - Penjelasan Async/Await, Callbacks dan Promises pada JavaScript

Belajar JavaScript - Penjelasan Async/Await, Callbacks dan Promises pada JavaScript

Ngulik Kode - Jika kalian sebelumnya pernah belajar JavaScript, pasti kalian pernah mendengar istilah "asynchronous" sebelumnya.

Ini karena JavaScript merupakan bahasa yang bersifat asynchronous; Tapi apa maksudnya? Ok, dalam artikel kali ini saya akan menunjukkan bahwa konsepnya tidak sesulit kedengerannya.


Synchronous vs Asynchronous

Secara default, JavaScript adalah asynchronous, bahasa pemrograman single threaded. Ini berarti bahwa instruksinya hanya dapat berjalan satu per satu, dan tidak secara paralel. Contohnya begini:
Kode di atas cukup sederhana ⎼ menjumlahkan dua angka dan kemudian mencatat jumlah tersebut ke konsol. Interpreter (penerjemah) mengeksekusi instruksi ini satu demi satu dalam urutan itu sampai selesai.

Tapi ada beberapa kekurangan pada metode ini. Katakanlah kita ingin mengambil sejumlah besar data dari database dan kemudian kita tampilkan di browser. Ketika interpreter sedang menjalankan instruksi, contoh mengambil data database dan misal membutuhkan beberapa waktu, maka kode berikutnya harus menunggu sampai interpreter ini selesai menjalan instruksi yang tadi.

Sekarang mungkin kalian bilang bahwa data yang diambil tidak terlalu besar dan tidak akan memakan waktu lama. Bayangkan kalian harus fetching/mengambil data dibeberapa API yang berbeda. Dan harus menunggu antrean satu per satu hingga selesai. Seperti hal yang melelahkan ya?

Nah untungnya JavaScript telah mempunyai solusi dari masalah synchronous ini dengan memperkenalkan asynchronous JavaScript.

Dengan asynchronous ini, kode dapat dijalankan sekarang, selesainya nanti. JavaScript kan berjalan secara synchronous/berurutan nih, sekarang instruksinya tidak harus berurutan atau dieksekusi satu per satu seperti yang kita bahas sebelumnya.

Untuk lebih memahami sifat asynchronous JavaScript, kita akan bahas dengan callback functions, promises, dan async/await.

Apa itu Callback pada JavaScript?

Callback adalah function yang dilewatkan dalam function lain, dan kemudian dipanggil dalam function itu untuk melakukan tugas.

Bingung? Oke, mari kita uraikan.
Kode di atas adalah program kecil yang mencatat log ke konsol. Tapi, ada yang baru di sini. Interpreter akan mengeksekusi instruksi pertama, kemudian yang kedua, tetapi akan melewati yang ketiga dan mengeksekusi yang terakhir.

setTimeout adalah function javascript yang mengambil dua parameter. Parameter pertama adalah function yang akan dijalankan, dan yang kedua adalah waktu untuk menjalankan function tersebut dalam milidetik. Sekarang kalian melihat bagaimana callback berjalan.

Function di dalam setTimeout di atas diperlukan untuk berjalan setelah dua detik (2000 milidetik). Bayangkan itu digunakan untuk dieksekusi dibeberapa bagian yang terpisah, sementara instruksi lainnya terus dieksekusi. Setelah dua detik, hasil function tersebut kemudian dikembalikan.

Itulah sebabnya jika kita menjalankan kode di atas, kita akan mendapatkan output seperti ini:
Kalian lihat instruksi terakhir dipanggil sebelum function setTimeout mengembalikan hasilnya. Katakanlah kita menggunakan metode ini untuk mengambil data dari database. Sementara user menunggu panggilan database untuk mengembalikan hasilnya, alur dalam eksekusi ini tidak akan terganggu.

Metode ini sangat efisien, tetapi hanya sampai titik tertentu. Terkadang, developer harus melakukan multiple calls ke sumber yang berbeda dalam kode mereka. Untuk melakukan panggilan ini, callback akan menjadi berantai hingga menjadi sulit dibaca atau dimantain. Ini disebut juga sebagai Callback Hell.

Untuk mengatasi masalah ini, dikenalkanlah promises pada JavaScript.

Apa itu Promises pada JavaScript?

Kita pasti pernah mendengar orang membuat janji. Kakakmu yang berjanji akan menjaga adikmu ketika ibumu pergi ke pasar, seorang teman yang berjanji akan melunasi hutangnya tapi pas ditagih malah marahan dia.. eaaa..😂

Tapi janji di JavaScript ini sedikit berbeda.

Sebuah janji dalam konteks kita adalah sesuatu yang membutuhkan waktu untuk dilakukan. Ada dua kemungkinan hasil dari sebuah janji:
  1. Menjalankan dan menyelesaikan janji, atau
  2. Beberapa kesalahan terjadi dan janji ditolak
Promises datang untuk memecahkan masalah dari callback function. Promises mengambil dua function sebagai parameter. Yaitu, resolve dan reject. Ingatlah ketika resolve berarti sukses, dan reject adalah ketika terjadi kesalahan.

Mari kita buat contoh promises:
Kode di atas adalah sebuah promises, diapit oleh request ke beberapa endpoint. Promises itu akan melakukan resolve dan reject seperti yang kita bahas di atas.

Setelah melakukan pemanggilan ke endpoint misalnya, jika request berhasil, kita akan resolve (menyelesaikan) promise tersbut dan melanjutkan untuk melakukan apa pun yang kita ingikan dengan responsnya. Tetapi jika ada kesalahan, promise itu akan reject (ditolak).

Promise adalah cara yang rapi untuk mengatasi masalah yang disebabkan oleh callback hell, dalam metode yang dikenal sebagai promise chaining. Kalian bisa menggunakan metode ini untuk mendapatkan data secara berurutan dari beberapa endpoint, tetapi dengan kode yang lebih sedikit dan metode yang lebih mudah.

Tapi ada cara yang lebih baik lagi! Kalian mungkin akrab dengan metode berikut ini, karena ini adalah cara yang lebih disukai untuk mengatasi handling data dan API dalam JavaScript.

Apa itu Async dan Await pada JavaScript?

Masalahnya, merangkai promise bersama seperti callback bisa menjadi sangat besar dan membingungkan. Itu sebabnya Async dan Await ada.

Untuk membuat async function, kalian lakukan ini:
Perhatikan bahwa memanggil async function akan selalu mengembalikan promise.
Kita melihat bahwa asyncFunc mengembalikan promise. Mari kita memecah beberapa kode sekarang:
Kata kunci async adalah apa yang akan kita gunakan untuk membuat async function seperti yang kita bahas di atas. Tapi bagaimana dengan await? Yah, itu menghentikan JavaScript dari proses fetch (pengambilan) ke variabel respons hingga promise selesai. Jika promise sudah selesai, hasil dari fetch method (metode pengambilan) sekarang dapat diassign ke respons variabel.

Hal yang sama terjadi pada baris ke 3. Metode .json mengembalikan promise, dan kita dapat menggunakan await untuk menunda proses sampai promise selesai.

Kode yang ada di dalam async function bersifat memblokir, tetapi itu tidak mempengaruhi eksekusi program dengan cara apa pun. Eksekusi kode kita sama seperti asynchronous biasanya. Untuk menunjukkan ini,
Di konsol browser kita, output di atas akan terlihat seperti ini:
Kalian lihat saat kita memanggil asyncFunc, kode kita terus berjalan hingga tiba waktunya bagi function untuk mengembalikan hasil.

Kesimpulan

Artikel ini tidak membahas konsep-konsep ini secara mendalam, tetapi saya harap ini menunjukkan kepada kalian bagaimana JavaScript Asynchronous bekerja dan beberapa hal yang harus diwaspadai.

Ini adalah salah satu bagian yang penting dari JavaScript, dan artikel ini hanya membahas sedikit saja dari dasarnya. Semoga bermanfaat dan kalian semua menikmatinya!





Belajar JavaScript - Best Practices

Belajar JavaScript - Best Practices

Belajar JavaScript - Best Practices

Ngulik Kode - Kita akan membahas beberapa cara koding atau praktik terbaik dalam menulis koding dengan JavaScript. Ini adalah hal-hal dasar yang akan sering kita gunakan dalam pemrograman kita sehari-hari.

Mari kita mulai!


Selalu Definisikan Variabel Menggunakan let atau const

Dengan mendefinisikan variabel menggunakan let atau const kita akan menghindari masalah seperti

  1. Variabel global dan namespaces: Katakanlah aplikasi kalian menggunakan variabel global title. Lalu dibeberapa bagian lain dari kode kalian, ternyata ada juga variabel title lagi tanpa menggunakan let atau const, tapi variabel ini khusus untuk suatu fungsi dan tidak ada hubungannya dengan variabel global title. Maka besar kemungkinan variabel title ini akan berubah nilai globalnglobal variable

  2. Jika kita membuat variabel menggunakan let atau const di dalam sebuah fungsi, maka variabel akan membatasi cakupannya pada blok kode tersebut. Dan global variabelnya tidak akan tergangg

  3. Mengekspos data sensitif:  Katakanlah kalian menyimpan API Key di sebuah global variable (tanpa menggunakan let atau const), lalu API Key ini akan tersimpan di global object (window) dan dapat dengan mudahnya diakses oleh siapapun yang mengunjungi website kalian.

  4. Sekali lagi, jika kita membuat variabel menggunakan let atau const, barulah variabel tersebut akan dibatasi cakupannya pada blok kode tertentu dan tidak akan terekspos ke global object (window)


Buatlah Kondisi Dengan Baik

  1. Jika kalian ingin mengecek variabel untuk value yang salah (undefined, null, string kosong), gunakanlah NOT operator (!) dari pada mengecek setiap value yang salah.

  2. Jika kalian ingin mengecek sebuah key/value ada di dalam objek. Kalian dapat mengeceknya satu persatu apakah key/value tersebut ada menggunakan AND operator (&&).

  3. Kalian juga bisa menggunakan optional chaining untuk mengecek apakah key/value ada dalam suatu objek atau tidak.

Semicolon

Sebelum kita lanjut lebih dalam, ada sebuah pertanyaan untuk kalian. Bisakah kalian tebak apa output dari function di bawah ini?
Jawaban: Outputnya akan menghasilkan undefined. Kenapa? Ini karena automatic semicolon insertion dari JavaScript Engine ketika mem-parsing kode. Ketika kode tidak terformat dengan benar seperti contoh di atas, JavaScript Engine akan menambahkan sebuah semicolon(;) ke akhir return statement (return;) dan berpikir bahwa tidak value yang dikembalikan. Jadi mengembalikan value sebagai undefined.
Automatic Semicolon Insertion (ASI): Pada saat mengurai kode, JavaScript Engine secara otomatis menyisipkan titik koma di akhir setiap token. Ini terkadang dapat menyebabkan perilaku kode yang tidak terduga. Anda dapat membaca lebih lanjut tentang itu di sini

Dan juga direkomendasikan untuk menambahkan semicolon disetiap akhir statement kode untuk menhindari masalah ASI.

Brackets

  1. Jangan memulai curly brackets ({}) di line selanjutnya. Karena ASI, code kalian mungkin akan berperilaku tidak terduga. 

  2. Selalu memulai curly brackets setelah akhir dari statement (di line yang sama)
Kita bisa menghindari masalah ini, dengan code formatter seperti Prettier atau tools formatting lainnya 

Template Literals

Template literal digunakan untuk membuat sebuah value string. Template literals diapit oleh backtick dan nilai/placeholder dinamis lalu diterukan menggunakan simbol dolar ${dynamicValue}.
Dibawah ini adalah contoh kasus penggunaan template literals.
  1. Template literals bisa digunakan untuk membuat konten HTML yang dinamis

  2. Template literals bisa juga digunakan untuk membuat query database

  3. Template literals bisa juga digunakan untuk membuat URL dinamis (satu baris).

  4. Jangan menggunakan template literals untuk membuat URL yang panjang dengan multi-baris. Karena API tidak mendukung multi-baris. Ada banyak solusi yang tersedia untuk mengatasi beberapa parameter dalam satu baris, tetapi kita tidak akan membahas semuanya di sini.
Kita bisa menghindari sebagian besar masalah yang dibahas dalam artikel ini dengan menggunakan linter dan code formatter. Berikut adalah beberapa linter dan code formatter yang populer.
Linters: ESLint, JSLint
Code Formatters: Prettier

Itu saja pembahasan untuk JavaScript Best Practices kali ini, semoga bermanfaat dan kalian semua menikmatinya!

Cara Membuat Atau Menambahkan Folder Assets Pada Project Android Studio

Cara Membuat Atau Menambahkan Folder Assets Pada Project Android Studio

Cara Membuat Atau Menambahkan Folder Assets Pada Project Android Studio

Ngulik Kode - Assalamu'alaikum, pada kesempatan kali ini saya ingin membagikan sebuah tutorial cara membuat folder assets pada project android studio sangat mudah bagi teman-teman, kalian pasti bisa membuatnya dengan mengikuti langkah-langkah pada tutorial ini.

Folder assets ini sangat berguna sekali bagi teman-teman yang ingin menyimpan file seperti doc, pdf, html .dll. tidak hanya itu pada android studio ini juga bisa menambahkan folder lainya seperti menu, anim, font, raw dll. untuk folder lainnya nanti kita bahas juga secara terpisah di postingan.

Dalam bembuat folder assets ini berbeda dengan membuat folder lainnya seperti folder, maka dari itu saya memcoba membuatkan tutorialnya untuk temen-temen. Langsung saja kita mulai langkah-langkahnya seperti dibawah :

Membuat Directory/Folder Assets

  1. Langkah pertama teman-teman buka terlebih dahulu project Android Studio yang ingin di tambahkan folder assets.
  2. Lalu klik kanan pada folder app > New > Folder > Assets Folder ikuti langkah langkahnya seperti gambar dibwah ini.


  3. Kemudian akan muncul jendela seperti gambar dibawah ini, lalu teman-teman cukup klik tombol Finish.


  4. Maka folder assets akan muncul pada project Android Studio di sebelah kiri pada bagian struktur project teman-teman.



Gimana ? cukup mudah bukan, untuk membuat folder assets ini, jika teman-teman masih terkendala dalam membuat folder assets ini teman-teman bisa komentar di bawah ini.

Sekian yang bisa saya berikan, kurang lebihnya mohon maaf dan semoga apa yang saya berikan melalui tulisan ini dapat bermanfaat bagi teman-teman dan sampai bertemu lagi di artikel lainnya.

Menampilkan File PDF Pada Apalikasi Android Dengan Android Studio

Menampilkan File PDF Pada Apalikasi Android Dengan Android Studio

Menampilkan File PDF Pada Apalikasi Android Dengan Android Studio


Ngulik Kode - Pada kesempatan kali ini saya ingin mencoba memberikan tutorial kembali kepada taman-teman cara menampilkan file PDF pada aplikasi android dengan menggunakan Android Studio. Langsung saja kita mulai tutorialnya.

Langkah pertama membuat project baru pada android studio teman-teman lalu tambahkan build.gradle seperti dibawah ini, library yang akan kita gunakan untuk menampilkan file PDFnya nanti.
implementation 'com.github.barteksc:android-pdf-viewer:3.2.0-beta.1'

Jika sudah lalu teman-teman lakukan sync pada project android studio agar bisa menggunakan librarynya.


Membuat Folder Asses

Langkah pertama teman-teman bikin dulu folder assets pada android studionya, jika teman-teman belum tau cara membuat folder assets pada android studio teman-teman bisa mengikutinya dengan membaca tutorial pada link dibawah :

Tambahkan File PDF Pada Folder Assets

Kemudian tambahkan file dengan format PDF ke folder assets yang sudah di buat, pada tutorial ini saya akan menambahkan file dokument Mata Kuliah dengan nama file matakuliah_reguler_2.pdf. teman-teman bisa menggunakan file lainya dengan format PDF.

Kita Mulai Koding

Kemudian teman-teman masuk ke file layout activity_main.xml kemudian ketikkan seperti kode dibawah ini :


Kemudian teman-teman masuk ke file java MainActivity.java lalu ketikkan hingga menjadi seperti kode dibawah ini :

Setelah semua sudah di lakukan dan tidak ada error pada baris kode teman-teman bisa langsung jalankan project android studionya dan lihat hasilnya akan seperti gambar dibawah :


Sekian tutorial yang bisa saya berikan pada kesempatan kali ini, semoga teman-teman bisa memahami tulisan yang saya berikan, jika teman-teman ada pertanyaan bisa langsung komentar di kolam komentar dibawah. Terima Kasih

Keep Ngulik Kode ✊
Tutorial Membuat Project Aplikasi Android Petunjuk Arah Kiblat Sederhana

Tutorial Membuat Project Aplikasi Android Petunjuk Arah Kiblat Sederhana

Tutorial Membuat Project Aplikasi Android Petunjuk Arah Kiblat Sederhana

Ngulik Kode - Halo, kembali lagi dengan saya untuk membahas tutorial membuat aplikasi petunjuk arah kiblat pada aplikasi android dengan memanfaatkan sensor pada perangkat android yang sudah saya bahas pada tutorial sebelumnya, anda bisa membacanya pada link dibawah.

Baca Selengkapnya disini :
Tutorial Membuat Project Aplikasi Kompas Pada Android

Saya sarankan sebelum melanjutkan tutorial ini sebaiknya anda baca terlebih dahulu tutorial diatas. Jika sudah langusng saja kita mulai tutorialnya.

Langkah pertama yang kita lakukan adalah membuat proyek baru pada android studionya, pada tutorial ini saya membuat proyeknya tetap menggunakan java bukan kotlin ya.


Kemudian kalian tambahkan permission untuk akses lokasi GPS terlebih dahulu pada file AndroidManifest.xml dan mengetikkannya seperti berikut :


Kemudian langkah berikutnya dengan membuat file baru dengan nama Compass.java dan mengetikan seperti kode di bawah ini :

Kemudian langkah berikutnya lagi dengan membuat file baru dengan nama GPSTracker.java dan mengetikkannya seperti kode di bawah ini :


Kemudian siapkan asset untuk gambar kompas dan kiblatnya, kalian bisa membuat sendiri atau bisa menggunakan gambar-gambar yang sudah saya sediakan di google drive, bisa langusng kalian download dan langsung digunakan. Download Assets Arah Kiblat

Langkah selanjutnya adalah membuat tampilah untuk kompas dan arah kiblatnya lalu menambahkan kode activity_main.xml hingga menjadi seperti kode dibawah ini :


Kemudian balik lagi untuk ngoding bagian MainActivity.java nya, dengan mengetikkan kode seperti berikut :


Sekarang kita bisa coba dengan menjalankan project yang sudah kita buat dan koding untuk memastikan tidak ada error dan berjalan sesuai mestinya. Jika berhasil akan menjadi seperti gambar dibawah ini.



Sekian tutorial yang bisa saya berikan, semoga dapat dipahami untuk semua dan jika ada pertanyaan bisa ditanyakan di kolam komentar dibawah. Terima kasih

Proyek GudangKita Bagian 3 – Tutorial Figma Membuat UI/UX Halaman Login & Halaman Register

Proyek GudangKita Bagian 3 – Tutorial Figma Membuat UI/UX Halaman Login & Halaman Register

Proyek GudangKita Bagian 3 – Tutorial Figma Membuat UI/UX Halaman Login & Halaman Register

Ngulik Kode - Halo teman-teman balik lagi dengan Admin MuhFikriH, apa kabar ? Semoga kalian sehat selalu.


Dalam membangun sebuah Aplikasi, peran UI/UX sangat dibutuhkan. Bagaimana tidak, jika User Interface aplikasi yang kita buat tidak baik, maka User akan kurang tertarik untuk menggunakan Aplikasi kita. Begitu juga dengan User Experience, Aplikasi yang kita buat dengan UX yang buruk maka akan mempersulit User menggunakan aplikasi kita.


Maka dari itu kali ini Admin akan membuat tutorial menggunakan Figma untuk Design Mobile Application. Dalam tutorial pertama membuat design UI/UX kali ini, yang akan kita buat adalah Login Page dan Register Page Interface Mobile di Figma.


Figma sendiri adalah Web Based Application yang bisa digunakan di dalam situs nya figma.com tanpa harus mendownload aplikasi desktop nya. Tetapi jika kalian ingin mendowload nya, kalian bisa download disini https://www.figma.com/downloads/


Okay, setelah menyelesaikan proses download dan login di Figma, kalian bisa langsung membuat file baru yang berada di kanan atas, atau kalian bisa dengan mudah menggunakan shortcut Ctrl+N


A. Mengenal Tools di Figma

Nah sebelum kita memulai, kita akan melakukan pengenalan terlebih dahulu dengan tools yang ada di dalam figma yang perlu kalian ketahui. 


Nah, untuk memudahkan pengerjaan, kita bisa menggunakan shortcut seperti di bawah ini: 
     F - Untuk membuat frame
     T - Untuk Membuat text
     R - Untuk membuat persegi
     O - Untuk membuat lingkaran
     L - Untuk membuat garis

B. Membuat Login Page

Nah setelah itu kita akan membuat frame untuk halaman login terlebih dahulu. Ketik F, lalu sebelah kanan akan muncul design frame yang ingin kalian buat, karena kita ingin membuat tampilan di mobile, kalian pilih frame untuk phone. 

Admin akan memilih iPhone 8 Plus, tapi kalian bebas menentukan pilihan yang kalian suka. Jika sudah, akan muncul frame yang kalian pilih di canvas seperti berikut :


Lalu kalian bisa mengikuti Langkah-langkah selanjutnya dibawah ini, telah disajikan gambar properties/style untuk memudahkan kalian dalam mengikuti tutorial di bawah.


Style:

  • Text--font-poppins, weight-regular, size-18, color: #000
  • Rectangle--border radius-15, color:#ddd
  • Text--font-poppins, size-10, weight-light
  • Rectangle--border radius-15, color: #454545
  • Text--font-poppins, size-12, weight-light
  • Text--font-poppins, size-14, weight-light
  • Rectangle--border radius-3, color:#454545
  • Text--font-poppins, weight-regular, size-18, color: #fff
  • Ellipse --olor:#c4c4c4

Jika kalian liat, di bawah Prototype terdapat Icon Google dan Facebook. Nah kali ini kita akan mendownload plugin Brandfetch. Kalian klik menu lalu ke plugins, lallu klik browser plugins in community. 

Jika sudah, ketik "Brandfetch" lalu install.


Balik ke design kalian, lalu ketik Ctrl + /  kemudian ketik Brandfetch, kalian bisa mencari logo brand yang kalian inginkan. Sebagai contoh disini Admin menggunakan logo Faceboook. Jika sudah select pada bagian ellipse dan klik gambar yang ada di plugins.


Jika menjadi seperti gambar di bawah, tandanya kalian sudah berhasil. 


Lakukan juga ke ellipse lainnya, kalian boleh mengisinya dengan contoh brand Google. Seperti gambar di bawah ini. 


Lalu kita akan menambahkan icon show/hide di dalam rectangle password. Silahkan kalian download plugins icons8 icons di plugins community seperti sebelumnya. Jika sudah, klik ctrl + / dan cari plugins icons8 icons. Lalu ketikkan show hide seperti gambar berikut :



Kalian juga bisa mengubah warna di kanan atas plugin nya menjadi warna sesuai selera kalian. Jika sudah, klik dan arahkan ke dalam rectangle password seperti gambar. 


Okay memasuki langkah terakhir yaitu menambahkan vector. Sekarang kalian klik link ini https://undraw.co/search dan ketikkan “login” kalian boleh pilih  sesuka hati, lalu setelah itu kalian download. Kemuadian, kalian copy ke frame seperti ini :


Fyi, kalian bisa mengganti warna dari gambar yang udah kalian download tadi dengan cara klik dua kali lalu ubah warnanya. 

Nah untuk touching terakhirnya,  Admin merubah warna gambarnya menjadi lebih gelap dan menambah beberapa shape untuk meramaikan white space dan terakhir menambahan Text Register di ujung kanan atas seperti gambar berikut :


C. Membuat Register Page

Hal pertama yang harus kalian lakukan adalah duplicate hasil login page yang sudah jadi dengan shortcut Alt + Shift lalu geser ke tempat yang kalian inginkan, lalu ikuti seperti gambar dibawah ini :



  • Ganti text “ Register” menjadi “Login”
  • Download gambar berbeda dari sebelumnya di sini https://undraw.co/search Kalian bisa search dengan menggunakan keyword “Register” dan pilih sesuai selera kalian. Setelah itu copy seperti gambar diatas
  • Ganti text “Login” menjadi “Register”
  • Ganti text “Login” menjadi “Register”
  • Duplicate salah satu label text dan textfieldnya. Lalu ubah menjadi “Email”
  • Ubah text menjadi seperti diatas.
Nah desain halaman Login dan Halaman Register kita sudah selesai nih, gampang banget kan ?. Sekian dulu Tutorial Figma dari Admin, kita akan lanjut sama-sama mempelajari Figma untuk mendesain aplikasi kita pada artikel berikutnya. Jika ada pertanyaan silahkan tinggalkan pada kolom komentar, begitu juga dengan kritik dan saran. Maaf bila ada salah kata, dan terima kasih telah membaca tutorial ini. Semoga ilmu nya bermanfaat.