class="post-template-default single single-post postid-18953 single-format-standard unselectable group-blog">

MASUKKAN HPK DI SINI dan PISAHKAN DENGAN KOMA (hpk 1, hpk 2, hpk 3, dst)

Membuat Aplikasi Sederhana Dengan Flutter

Membuat Aplikasi Sederhana Dengan Flutter

Membuat Aplikasi Sederhana Dengan Flutter – Pada zaman sekarang perkembangan aplikasi sudah sangat berkembang, banyak sekali aplikasi yang dibuat untuk memudahkan kehidupan kita sehari – hari.

Maka dari itu banyak developer yang berlomba – lomba membuat berbagai macam aplikasi untuk mempermudah kehidupan orang – orang atau hanya sekedar sebagai media hiburan saja.

Mungkin beberapa di antara kalian penasaran dan ingin mencoba bagaimana cara membuat sebuah aplikasi, maka dari itu kami akan berikan ulasan tentang cara membuat aplikasi sederhana dengan Flutter.

Namun sebelum itu, kalian harus mengetahui terlebih dahulu apa itu Flutter dan bagaimana caranya membuat sebuah aplikasi sederhana. Jika kalian penasaran, kalian bisa membaca ulasan kami ini hingga akhir.

APA ITU FLUTTER

Flutter merupakan sebuah platfrom yang dipakai oleh para developer untuk membuat aplikasi multiplatfrom dengan menggunakan satu basis coding (codebase). Dimana aplikasi yang dihasilkan oleh Flutter dapat dipakai di berbagai platfrom baik desktop, web bahkan mobile seperti Android dan iOS.

Flutter adalah sebuah platfrom gratis dan open source. Jika kalian ingin menggunakan Flutter maka kalian harus mempelajari bahasa pemograman Dart. Berbeda dengan Framewrok Front-end pada umunya yang memakai bahasa pemograman JavaScript.

Flutter mempunyai dua kompenen yang sangat penting yaitu, Framework User Interface dan Software Development Kit (SDK).

  • Framework UI adalah komponen UI, seperti tombol navigasi, teks dan lain sebagainya, yang bisa kalian atur dan kustomiasasi sesuai dengan kebutuhan kalian.
  • Software Development Kit adalah kumpulan tools yang memliki fungsi untuk membuat aplikasi bisa dijalan di multiplatfrom.

CARA KERJA FLUTTER

Sebenarnya cara kerja dari Flutter bisa dikatakan cukup sederhana. Berikut ini cara kerja dari Flutter di platfrom Mobile (Android & iOS).

  1. Developer membuat dan mengembangkan aplikasi dengan bahasa Dart dan Widget yang disediakan di Framework Flutter.
  2. Pada platfrom Android, kode yang ditulis akan dikompilasi oleh mesin C++ menggunakan Android NDK (Native Development Kit). Sementara untuk iOS maka kode akan di kompilasi menggunakan LLVM (Low-Level Virtual Machine)
  3. Pada Android kode native dikompilasi kembali dengan menggunakan Dart Kompiler.
  4. Setelah kode disesuaikan dengan perangkat masing – masing, maka apliksai dapat dijalan.

LANGKAH – LANGKAH MEMBUAT APLIKASI SEDERHANA

Hal yang perlu disiapkan pertama kali adalah sebuah PC/Laptop dan juga aplikasi Android Studio untuk membuat sebuah aplikasi sederhana. Berikut langkah – langkahnya :

  1. Pertama, kalian buka aplikasi Android Studio di PC/Laptop kalian.
  2. Setelah itu kalian buat Proyek Flutter dengan cara klik File → New → New Flutter Project
Sumber : medikre.com

  • Sekanjutnya pilih Flutter Application kemudian klik Next.
Sumber : medikre.com

Kemudian konfigurasi aplikasi sama seperti yang di bawah ini lalu klik Next

Nama Proyek            : hello_app

Jalur SDK Flutter      : <path_to_Flutter_sdk>

Lokasi Proyek           : <path_to_project_folder>

Deskripsi                    : Aplikasi Hello World

  • Selanutnya konfigurasi proyek dan tetapkan domain perusahaan menjadi Flutterapp.medikre.com dan klik Selesai.
  • Kemudian masukan domain perushaan yang tadi telah di konfigurasi.
  • Sebelum lanjut ke langkah selanjutnya, kalian harus mengetahui struktur aplikasi Android Studio serta fungsi dan tujuannya apa. struktur aplikasi dan tujuannya adalah sebagai berikut :
Sumber : medikre.com

Android – Kode sumber yang dibuat otomatis untuk membuat aplikasi android

Ios – Kode sumber yang dibuat otomatis untuk membuat aplikasi ios

Lib – Folder utama yang berisi kode Dart

Ib/main.dart – Titik masuk aplikasi Flutter

Test – Folder untuk menguji aplikasi Flutter

Test/widget_test.dart – Contoh kode

.gitignore – Kontrol versi Git

.metadata – Otomatis dibuat oleh alat Flutter

.packages – Otomatis dibuat untuk melacak paket Flutter

.iml – File proyek yang dipakai oleh Android Studio

Pubspec.yaml – Dipakai oleh Pub (pengelola paket Flutter)

Pubcspec.lock – Otomtasi dibuat oleh Pub

README.md – File berisi deskripsi proyek

  • Langkah selanjutnya kalian bisa merubah kode yang ada di file lib/main.dart dengan codingan dibawah ini :

import ‘package:Flutter/material.dart’;

void main() => runApp(MyApp());

class MyApp extends StatelessWidget {

   // This widget is the root of your application.

   @override

   Widget build(BuildContext context) {

      return MaterialApp(

         title: ‘Hello World Demo Application’,

         theme: ThemeData(

            primarySwatch: Colors.blue,

         ),

         home: MyHomePage(title: ‘Home page’),

      );

   }

}

class MyHomePage extends StatelessWidget {

   MyHomePage({Key key, this.title}) : super(key: key);

   final String title;

   @override

   Widget build(BuildContext context) {

      return Scaffold(

         appBar: AppBar(

            title: Text(this.title),

         ),

         body: Center(

            child:

            Text(

               ‘Hello World’,

            )

         ),

      );

   }

}

Sebelum dilanjutkan ada baiknya kalian pahami dulu codingan yang ada diatas

Baris 1 – Mengimpor/memasukan paket Flutter,material. Materi merupakan paket Flutter untuk membuat antarmuka atau tampilan pengguna sesuai dengan pedoman material yang telah ditentukan oleh Android.

Baris 3 – Titik masuk Flutter. Memangil fungsi runApp lalu meneruskanya ke objek kelas MyApp. runApp memliki tujuan untuk memasang widget yang diberikan ke layar.

Baris 5-17 – Widget dipakai untuk membuat User Interface dalam Framework Flutter. Stateless Widget merupakan widget yang tidak mempertahankan status widget. MyApp memperluas Stateless Widget serta mengganti metode pembuatannya. Metode build memiliki tujuan membuat bagian UI aplikasi, dimana metode build memakai MeterialApp, sebuah widget level root untuk membuat UI.

Baris 19-38 – MyHomePage mirip dengan MyApp akan tetapi MyHomePage mengembalikan Scaffold Widget. Scaffold merupakan widget level atas di sampsing MaterialApp yang digunakan untuk membuat desain material yang sama dengan UI.

  • Langkah terakhir kalian hanya tinggal menjalan aplikasi tersebut dengan klik Run → Run main.dart jika berhasil maka akan muncul tampilan yang seperti dibawah ini.
Sumber : medikre.com
Sumber : medikre.com

KESIMPULAN

Seperti itulah cara membuat aplikasi sederhana dengan Flutter, mungkin aplikasi ini hanya menampilan sebuah tesk “Hello World” namun begitu hal ini tentu tidak mudah seperti yang terlihat, butuh sebuah pengetahuan soal bahasa pemograman dart dan tentunya logika yang baik.

Jika diantara kalian yang ingin menjadi seorang developer aplikasi mobile atau ingin bekerja disebuah perushaan developer maka kalian perlu memiliki pengetahuan soal bahasa pemograman mobile. Kalian juga mungkin bisa menempuh pendidikan formal di Universitas Negeri maupun Swasta dan ambil jurusan Teknik Informatika / Informatika atau Sistem Informasi jika kalian bercita – cita menjadi seorang programmer.

Kami berikan beberpa tips untuk kalian yang ingin menjadi programmer, yaitu kalian harus selalu belajar dan selalu pratek apa yang telah kalian pelajari serta kalian harus menguasai setidaknya satu saja baha pemogramman yang ada dan yang terakhir kalian harus sering mengasah logika kalian. serta kalian juga bisa mengunjungi berbagai macam situs belajar coding yang ada di internet untuk mengasah kemampuan kalian.

Recommended For You

About the Author: Rahmat Saefullah

Tinggalkan Balasan

Alamat email Anda tidak akan dipublikasikan. Ruas yang wajib ditandai *

EnglishIndonesianJapaneseRussian
error: Content is protected !!