---
# System prepended metadata

title: Jom Belajar Flutter!

---

# Jom Belajar Flutter!

Flutter ialah rangka kerja UI mudah alih percuma dan sumber terbuka yang dicipta oleh Google.

Anda boleh menggunakan satu bahasa pengaturcaraan dan satu pangkalan kod untuk mencipta dua applikasi berbeza (untuk iOS dan Android) dengan **Flutter!**

**Flutter** membolehkan anda membuat aplikasi mudah alih asli dengan hanya satu pangkalan kod! 

## 5 Sebab kenapa perlu belajar Flutter

1. Bina *Apps* dengan pantas

Kod flutter dikompilasi kepada kod mesin ARM atau Intel serta JavaScript, untuk prestasi pantas pada mana-mana peranti.
Kod flutter dikompilasi kepada kod mesin ARM atau Intel serta JavaScript, untuk prestasi pantas pada mana-mana peranti.

2. Mudah Untuk Dipelajari

**Flutter** menggunakan *Dart* sebagai bahasa pengaturcaraannya, yang mudah untuk dipelajari.

3. *Trend* Terkini

Repositori **Flutter** di *Github* mempunyai lebih 110,000 permulaan dan merupakan salah satu komuniti sumber terbuka yang paling pesat berkembang di *Github*.

4. Peningkatan Permintaan Pembangun **Flutter**

Banyak pembangun dan syarikat bergerak ke arah **Flutter**. Disebabkan peralihan ini, akan terdapat peningkatan dalam pekerjaan Flutter kerana majikan perlu mengupah pembangun **Flutter** yang berpengalaman.

5. Komuniti Yang Besar 

**Flutter** mempunyai komuniti yang besar dan mampu membantu anda antara satu sama lain! Komuniti pembangun **Flutter** telah melihat pertumbuhan eksponen dalam beberapa tahun kebelakangan ini pada forum QA yang berbeza seperti *Stack Overflow*, dsb.

## 5 Syarikat Terkenal yang menggunakan **Flutter**

<img src="https://i.imgur.com/0xVCoBX.png)" alt= "drawing3" width="300"/>

*Sumber: wikimedia commons*

1. G Pay
Dengan **Flutter**, *Google Pay* 3.0 akan dapat membuat skala dengan cepat dan cekap merentas iOS dan Android.

<img src="https://i.imgur.com/wzvHdto.png" alt="drawing2" width="300"/>

*Sumber: wikipedia*

2. e-Bay
*e-Bay* mendapat pengalaman pembangunan lebih menyeronokkan dan lebih pantas dibina dengan **Flutter**.

<img src="https://i.imgur.com/CnHDs0y.png"
alt="drawing" width="350"/>

*Sumber: logo.wine*

3. Alibaba Group
*Alibaba* mengukur pasaran terpakai terbesar di China dengan **Flutter**.

<img src="https://i.imgur.com/ZYgyBDS.png"
alt="drawing5" width="350"/>

*Sumber: freepnglogos*

4. Toyota
Prinsip sumber terbuka **Flutter** dan komuniti pembangun yang banyak penting buat kejayaan *Toyota*.

<img src="https://i.imgur.com/O9fmhyn.png" alt="drawing4" width="350"/>

*Sumber: 1000 logos*

5. Tencent
*Tencent* mengambil pertaruhan strategik yang besar pada **Flutter**.

## Kelebihan Pembelajaran Berasaskan Projek

Bina projek sendiri dan anda akan... 

1. Dapat tingkatkan kemahiran menyelesaikan masalah
2. Bina portfolio untuk masa depan
3. Berfikiran kritis
4. Belajar menguruskan masa

## Belajar Dart Programming

<img src="https://i.imgur.com/JeLirgu.png" alt="drawing6" width="350"/>

*Dart, bahasa pengaturcaraan terbaik untuk pemula. Sumber: dart.dev*

### Apa Itu Dart?

**Dart** ialah bahasa pengaturcaraan yang bertujuan umum  dan sumber terbuka. Ia pada asalnya dibangunkan oleh *Google*. **Dart** ialah bahasa berorientasikan objek dengan gaya sintaks C.

### Contoh ringkas kod Dart

<img src="insert pic" alt="drawing7" width="350"/>

### Pembolehubah dan Jenis Data

**Dart** menggunakan kata kunci var untuk mengisytiharkan pembolehubah. Sintaks var ditakrifkan seperti berikut:

`var name = 'Dart';`

Bahasa **Dart** menyokong jenis data berikut :

Nombor − Ia digunakan untuk mewakili literal angka – Integer dan Ganda.

Strings− Ia mewakili urutan aksara. Nilai *string*  dinyatakan dalam petikan tunggal atau berganda.

Booleans − **Dart** menggunakan kata kunci *bool* untuk mewakili nilai *Boolean* – benar dan salah.

Lists dan Maps − Ia digunakan untuk mewakili koleksi objek.

### Kelebihan Dart

1. Dioptimumkan Untuk UI
Bahasa pengaturcaraan yang dioptimumkan untuk membina interface pengguna dengan ciri seperti keselamatan nol bunyi, operator spread untuk mengembangkan koleksi dan pengumpulan jika untuk menyesuaikan UI untuk setiap platform

Bahasa pengaturcaraan yang mudah dipelajari, dengan sintaks yang biasa

2. Pembangunan Yang Produktif
Buat perubahan pada kod sumber anda secara berulang, menggunakan **muat semula panas** untuk melihat kesan **serta-merta** dalam apl yang sedang berjalan.

Tulis kod menggunakan sistem jenis **fleksibel** dengan analisis statik yang kaya dan alatan yang **berkuasa** dan **boleh dikonfigurasikan**

Lakukan pemprofilan, pengelogan dan penyahpepijatan dengan **editor kod** pilihan anda.

3. Pantas Pada Semua Platform
**AOT-kompilkan** apl kepada kod mesin asli untuk permulaan segera

**Sasarkan** web dengan penyusun lengkap, matang, pantas untuk JavaScript

**Jalankan kod** "back-end" yang menyokong apl anda, ditulis menggunakan satu bahasa pengaturcaraan

## SDK Flutter (Kit Pembangunan Perisian)

Membolehkan pembangun membina aplikasi untuk mudah alih, web dan desktop menggunakan pangkalan kod tunggal.

### Ciri-ciri SDK Flutter

* SDK Dart

* Mengandungi enjin pemaparan, *widget*, API untuk ujian dan penyepaduan.
 
* Alat kompilasi untuk Kod Mesin Asli (kod untuk iOS dan Android).

* Rangka kerja moden gaya tindak balas
 
* Sediakan Interop dan API pemalam untuk berhubung dengan sistem dan SDK pihak ketiga.

* Pelari ujian tanpa kepala yang menjalankan ujian pada *Windows*, *Linux* dan *Mac*.

* Gunakan *Dart DevTools* untuk menguji debug dan memprofilkan apl 
 
* Menggunakan alat *command line* **Flutter** dan **Dart** untuk membangun, membina, menguji dan menyusun apl anda merentas platform.

## Seni Bina Flutter: BLoC

### Seni Bina Flutter

**Flutter** menyampaikan seni bina asas yang boleh anda gunakan pada aplikasi anda dan mengurus keadaannya dengan mudah. 

Antara seni bina yang digunakan dalam pembangunan aplikasi **Flutter** dipanggil Komponen Logik Perniagaan (BLoC).

### Apa Itu BLoC?

BLoC ialah pendekatan yang baik yang memisahkan logik perniagaan anda daripada antara muka pengguna dan menyelia perkara utama logik perniagaan dengan ujian. 

Idea teras yang digunakan untuk seni bina BLoC ialah kesederhanaan, skalabiliti dan kebolehujian, dan semua matlamat ini pasti dicapai dalam seni bina BLoC.

### 5 "Top Database" Untuk Aplikasi Flutter

<img src="https://i.imgur.com/DmlYxGn.png" alt="drawing8" width="250"/>

*Firestore. Sumber: Dana Hartweg*

1. Firestore

Firestore ialah database dokumen NoSQL yang dibina untuk penskalaan automatik, prestasi tinggi dan kemudahan pembangunan aplikasi. Walaupun UI Firestore mempunyai banyak ciri yang sama seperti database tradisional, sebagai database NoSQL ia berbeza daripada yang lain seperti dalam cara ia menerangkan hubungan antara objek data.

<img src="https://i.imgur.com/9W33ngy.png" alt="drawing9" width="250"/>

*SQLite. Sumber: wikipedia*

2. SQFlite

Sqflite ialah plug-in flutter SQLite yang terkenal. la adalah relational database dengan transaksi yang sangat baik dan sokongan kelompok.

<img src="https://i.imgur.com/2ILedUh.png" alt="drawing10" width="250"/>

*ObjectBox. Sumber: pub.dev*

3. ObjectBox

ObjectBox menyimpan objek secara langsung, bukannya menyimpan data dalam relational DB dan mengaksesnya melalui lapisan ORM. Ia mempunyai keserasian penuh ACID, menyediakan semantik transaksi dan menggunakan MVCC untuk kawalan serentak.

<img src="https://i.imgur.com/KPVgUUu.png" alt="drawing11" width="250"/>

*Hive. Sumber: wikimedia commons*

4. Hive

Hive ialah pangkalan data NoSQL yang sangat berkuasa dan menjanjikan. Ia serasi dengan semua platform, termasuk web.

<img src="insert pic" alt="drawing12" width="250"/>

*Moor. Sumber: ----*



