Tutorial Belajar Flutter

Flutter adalah SDK aplikasi Mobile dari Google yang digunakan untuk membangun aplikasi native iOS, Android, Desktop (Windows, Linux, macOS), dan Web dari satu source code. Saat membangun aplikasi dengan Flutter, semuanya berkaitan dengan Widgets, yaitu sebuah blok yang digunakan untuk membangun aplikasi Flutter. Widget merupakan elemen struktural yang dilengkapi dengan banyak fungsi khusus untuk material design, dan widget baru dapat digunakan dengan cara menyusun widget yang sudah ada. Proses menggabungkan widget disebut komposisi. Antarmuka pengguna aplikasi terdiri dari banyak widget sederhana yang memiliki tugasnya masing-masing. Itulah sebabnya mengapa pengembang Flutter cenderung memandang aplikasi Flutter mereka sebagai pohon widget.

Flutter adalah framework  open source untuk membuat aplikasi mobile berkualitas tinggi dan performa tinggi pada sistem operasi mobile seperti Android dan iOS. Framework ini menyediakan SDK yang sederhana, efisien, dan mudah dipahami untuk membuat aplikasi mobile menggunakan bahasa pemrograman Dart milik Google. Tutorial ini membahas dasar-dasar framework Flutter, proses instalasi SDK Flutter, cara menyiapkan Android Studio untuk mengembangkan aplikasi berbasis Flutter, desain struktur Flutter, serta cara mengembangkan berbagai jenis aplikasi seluler menggunakan framework Flutter.

Audiens

Sasaran tutorial ini adalah para profesional yang ingin membangun karir di bidang mobile development. Tutorial ini bertujuan untuk membuat Anda nyaman memulai belajar dengan menggunakan framework Flutter dan dapat memahami berbagai fungsinya.

Prasyarat

Tutorial ini disusun dengan mengasumsikan bahwa pembaca sudah memahami Kerangka Kerja atau biasa disebut dengan Framework dan memiliki pengetahuan yang memadai tentang Pemrograman Berorientasi Objek, dasar-dasar struktur Android, dan pemrograman Dart. Jika Anda masih pemula dalam salah satu konsep ini, kami menyarankan Anda untuk mempelajari tutorial terkait terlebih dahulu sebelum memulai belajar Flutter.

Tipe-tipe Widgets

• Stateless Widgets
• Stateful Widgets

Flutter, Dart, dan teknologi yang setara

// Untuk mengimport paket-paket penting, dibutuhkan koneksi.
// Flutter dan Dart
import 'package:flutter/material.dart';

// Fungsi Main
void main() {
// Memberikan perintah kepada runApp() untuk menjalankan aplikasi.

/* Tujuan dari fungsi runApp() adalah untuk menampilkan widget
yang diberikan di layar. */
  runApp(const MyApp());
}

// Widget digunakan untuk membuat antarmuka pengguna (UI) pada kerangka kerja (framework) flutter.

/* StatelessWidget adalah sebuah widget yang tidak mempertahankan
keadaan (state) dari widget tersebut. */

/* "MyApp" adalah sebuah class yang diturunkan dari class "StatelessWidget"
dan mengubah isi dari metode "build" */
class MyApp extends StatelessWidget {
  const MyApp({Key? key}) : super(key: key);

// Widget ini merupakan akar dari aplikasi Anda..
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      // Judul dari aplikasi
      title: 'Hello World Demo Application',
      // Tema dari widget
      theme: ThemeData(
        primarySwatch: Colors.lightBlue,
      ),
      // UI dari aplikasi
      home: const MyHomePage(title: 'Home page'),
    );
  }
}

class MyHomePage extends StatelessWidget {
  const MyHomePage({Key? key, required this.title}) : super(key: key);
  final String title;

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text(title),
      ),
      // Untuk set aplikasi menjadi di tengah
      body: const Center(
          child: Text(
            'Welcome to Nextgen Tutorial!',
          )),
    );
  }
}

Output

Dan, hal yang menjadi poin penjualan terbesar dari Flutter adalah:

1. High-Performance App: Aplikasi yang dikembangkan menggunakan Flutter sangat ekspresif dan memiliki antarmuka pengguna yang fleksibel. Pengembangan yang cepat berkat fitur hot reloading membuat aplikasi menjadi hidup dan ekspresif dengan memberikan fitur-fitur yang diinginkan untuk end user experience yang mirip dengan aplikasi asli.
2. Expressive and Flexible UI: Flutter memungkinkan pengembang untuk membangun aplikasi yang indah dengan mudah menggunakan widget material pre-build. Meskipun banyak widget telah ada, tetapi Flutter memungkinkan penggunaan widget yang fleksibel.
3. Fast Development & Hot Reloading: Hot Reloading mengacu pada penyisipan versi baru dari file yang diedit saat runtime sambil menjalankan aplikasi.

Kelebihan dan Kekurangan dari Flutter

Kelebihan:

• Flutter menggunakan satu source code tunggal, yaitu Dart, untuk kedua platform, Android dan iOS, yang merupakan bahasa yang sederhana dan menjamin keamanan tipe data. 
• Baik bahasa Flutter maupun komunitasnya sedang berkembang dengan pesat dan merilis fitur, widget, serta add-on baru secara teratur.
• Flutter memiliki set widget-nya sendiri, daripada menggunakan widget yang disediakan oleh sistem operasi host. Hal ini berarti pengguna dapat memberikan model pengenalan gestur sendiri dan memiliki kontrol yang lebih besar atas rendering yang akurat atau penyesuaian widget.
• Hot-reloading menjadi game changer dalam produktivitas proses development. Ini memberikan efek yang hidup pada aplikasi yang sedang dikembangkan, sehingga membuat seluruh siklus pengembangan lebih menarik bagi pengembang UI / UX yang menggunakan Flutter.
• Flutter tidak terikat pada ROM sehubungan dengan sistem widget. Jadi, meningkatkan portabilitasnya pada berbagai versi Android dan dengan demikian, mengurangi ketergantungannya pada platform host.
• Dart dan Flutter menyatu secara erat untuk mengoptimalkan Virtual Machine (VM) dart untuk ponsel yang khusus dibutuhkan oleh Flutter.
• Flutter merupakan pemain terkemuka dalam bidang pengembangan aplikasi lintas platform dengan dukungan komunitas yang luar biasa.

Kekurangan:

• Sebenarnya, tidak ada kekurangan pada Flutter karena tidak ada kerangka kerja lain yang seefektif dan sekompleks Flutter. Meskipun jika harus mencantumkannya, akan berkaitan dengan bahasa pemrograman Dart karena ketika mengonversi dart ke JavaScript ada beberapa bug yang harus diperbaiki, dart tidak memiliki kerangka kerja untuk backend, dan sebagainya.

Tutorial setelahnya : Arsitektur Flutter
Semua Tutorial Flutter : Tutorial Flutter