Sesi 1: Say Hello Android - Tools, First App Launch & Git on GitHub

Gambaran Umum Sesi 1

Selamat datang di pertemuan perdana GDGoC Study Jam: Mobile Development bersama Google Developer Groups On Campus Universitas Widyatama.

Di sesi pertama ini, fokus kita terbagi menjadi dua capaian besar:

Belajar Setup Project & Git dari Nol: Memahami ekosistem Android, membuat proyek Compose perdana via wizard Android Studio, menjalankannya langsung ke smartphone fisik (Hello Android!), dan mempraktikkan alur Git murni (git init hingga git push).
Inisialisasi Template LuminaWalls: Menyiapkan starter pack proyek utama, memasang dependensi Splash API, dan memastikan laptop siap tempur untuk masuk ke Sesi 2.

1. What is Mobile Development?

More Than Just Phones

Pengembangan aplikasi mobile (mobile development) saat ini tidak lagi terbatas hanya pada layar smartphone. Ekosistemnya mencakup tablet, perangkat lipat (foldables), jam tangan pintar (Wear OS), televisi pintar (Android TV), hingga sistem hiburan mobil (Android Auto).

Deep Hardware Access

Keunggulan utama aplikasi mobile native dibandingkan aplikasi web terletak pada kemampuannya mengakses dan berinteraksi secara mendalam dengan komponen perangkat keras (hardware) perangkat:

Sensor biometrik (pemindai sidik jari & pengenalan wajah)
Kamera tingkat rendah dengan kontrol manual eksposur dan lensa
GPS dan giroskop presisi tinggi
Komunikasi nirkabel lokal (Bluetooth Low Energy, NFC, Wi-Fi Direct)

Web Development vs Mobile Development

Aspek	Web Development	Mobile Development (Android Native)
Tech Stack	Berjalan di browser menggunakan HTML, CSS, JavaScript / TypeScript	Menggunakan bahasa resmi Kotlin dengan toolkit Jetpack Compose
Model Eksekusi	Dijalankan oleh mesin peramban (interpreted inside browser engine)	Dikompilasi khusus menjadi instruksi biner mesin untuk arsitektur chipset tertentu (ARM64)
Akses Hardware	Terbatas oleh sandbox keamanan browser (Web APIs)	Integrasi penuh dan mendalam ke seluruh sensor dan periferal hardware secara native
Pengalaman Pengguna	Bergantung pada koneksi internet dan performa browser	Dirancang responsif, animasi mulus 120 FPS, dan mendukung kemampuan offline-first

2. The Evolution of Android UI

Pengembangan antarmuka pengguna di Android telah mengalami transformasi besar sejak awal kemunculannya:

2008 ---------------- 2014 ---------------- 2017 ---------------- 2021 ------------ Now
Java & Eclipse        Android Studio        Kotlin Official       Modern Standard
XML Layouts           Material Design 1     Compose Preview       100% Compose
(Manual XML)          (Android 5.0)         (Google I/O)          Material 3

The Classic Android Era (2008–2013): Era awal antarmuka Android saat sistem masih mencari identitas visualnya, menggunakan layout XML manual dan bahasa Java pada IDE Eclipse.
Modern Material Design (2014–2020): Diperkenalkannya Material Design pada Android 5.0 Lollipop bersama IDE resmi Android Studio berbasis IntelliJ, membawa konsistensi visual kertas digital (digital paper).
Jetpack Compose & Material 3 (2021–Sekarang): Standar resmi Google untuk membangun antarmuka deklaratif tanpa berkas XML. Seluruh UI ditulis langsung menggunakan fungsi Kotlin beranotasi @Composable.

Meet Material 3 Expressive

Material 3 Expressive adalah evolusi sistem desain Google yang mengedepankan pendekatan User Experience (UX) secara mendalam:

Dirancang untuk membangun ikatan emosional dan memberikan responsivitas visual alami bagi pengguna di setiap ketukan layar.
Built as a UI Library: Material Expressive bukan framework baru yang menggantikan Jetpack Compose, melainkan sebuah sistem desain resmi dari Google yang dibungkus menjadi Official UI Library bawaan agar proses perakitan antarmuka menjadi lebih terstandarisasi dan cepat.

3. Tooling and Environment

Rekomendasi Spesifikasi Perangkat

Processor: Minimal Intel Core i3 generasi ke-7, AMD Ryzen generasi ke-3 yang setara, atau disarankan menggunakan Mac dengan Apple Silicon M-Series.
RAM: Minimal 8 GB, dengan rekomendasi 16 GB untuk kenyamanan multitasking.
Penyimpanan: Menggunakan SSD dengan sisa ruang penyimpanan minimal 25 GB (direkomendasikan sisa ruang 50 GB).

Integrated Development Environment (IDE)

IDE adalah perangkat lunak terintegrasi untuk menulis kode, melakukan pengujian (testing), dan mengelola versi kode.

Untuk pengembangan Android modern, kita menggunakan Android Studio sebagai IDE resmi dari Google yang menyediakan:

Dukungan penuh untuk Kotlin dan Jetpack Compose beserta fitur Live Preview
Peralatan analisis bawaan (Logcat, Debugger, Memory & CPU Profiler)
Integrasi sistem build otomatis menggunakan Gradle
Fitur Device Mirroring untuk menampilkan layar smartphone fisik langsung di dalam editor

4. Belajar Setup Project dari Nol di Android Studio

Tahap ini bertujuan melatih kamu memahami alur pembuatan proyek Android Studio dari nol:

Langkah Pembuatan Proyek Baru

Buka aplikasi Android Studio.
Pada layar utama, klik tombol New Project.
Pada panel kategori template sebelah kiri, pilih Phone and Tablet, lalu pilih template Empty Activity (pastikan yang berlogo Jetpack Compose).
Isi formulir konfigurasi proyek:
- Name: HelloAndroid
- Package name: com.gdgoc.helloandroid
- Save location: Pilih folder direktori koding di laptopmu
- Minimum SDK: API 24 ("Nougat"; Android 7.0)
- Build configuration language: Kotlin DSL (build.gradle.kts) [Recommended]
Klik Finish. Tunggu proses Gradle mengunduh dan menyinkronkan komponen awal.

Mengenal Struktur Berkas Proyek Android

HelloAndroid/
├── app/
│   ├── build.gradle.kts            <- Konfigurasi SDK modul & dependensi library
│   └── src/main/
│       ├── AndroidManifest.xml     <- KTP aplikasi: izin hardware, deklarasi Activity, & metadata
│       ├── java/com/gdgoc/helloandroid/
│       │   ├── MainActivity.kt     <- Titik masuk utama (entrypoint) eksekusi Compose
│       │   └── ui/theme/           <- Color.kt, Theme.kt, Type.kt (Desain tema Material)
│       └── res/                    <- Asset non-kode: gambar (drawable), icon (mipmap), strings.xml
├── gradle/
│   └── libs.versions.toml          <- Version Catalog (inventaris dependensi terpusat)
└── build.gradle.kts                <- Konfigurasi plugin global tingkat proyek

Kenapa masih ada file .xml? Di Android modern, kita tidak lagi menggunakan XML untuk membuat desain tata letak tampilan (sudah 100% digantikan Jetpack Compose). Berkas XML seperti AndroidManifest.xml dan res/values/strings.xml tetap digunakan khusus untuk identitas sistem, izin perangkat, dan teks aplikasi.

5. Bye Emulator! Menjalankan Aplikasi ke HP Fisik

Menggunakan smartphone fisik langsung jauh lebih hemat RAM dan bebas dari lag dibandingkan emulator virtual.

Mengaktifkan USB Debugging di HP Fisik

Buka menu Settings (Pengaturan) di smartphone Android kamu.
Masuk ke About Phone (Tentang Ponsel).
Cari baris Build Number (Nomor Bentukan) atau Versi OS (MIUI / HyperOS / One UI / ColorOS).
Ketuk baris tersebut sebanyak 7 kali berturut-turut hingga muncul notifikasi “You are now a developer!”.
Kembali ke menu utama Settings, buka menu Developer Options (Opsi Pengembang).
Aktifkan toggle USB Debugging.
Hubungkan smartphone ke laptop menggunakan kabel data.
Pada dialog pop-up di layar HP (Allow USB debugging?), centang Always allow from this computer, lalu tekan OK / Allow.

Menjalankan Aplikasi (Hello Android!)

Buka tab Running Devices di Android Studio untuk melihat layar HP tertampil langsung via Device Mirroring.
Di toolbar atas editor, pastikan nama smartphone fisikmu sudah terpilih.
Klik tombol hijau Run ‘app’ (atau tekan Shift + F10).
Tunggu proses kompilasi berjalan hingga aplikasi terbuka di layar HP dan menampilkan teks “Hello Android!”.

6. Belajar Git dari Nol: Init, Commit & Push ke GitHub

Sekarang kita latih alur version control menggunakan proyek HelloAndroid yang baru saja kamu buat.

Konfigurasi Identitas Git Terminal

Buka Terminal atau tab Terminal di Android Studio, lalu atur identitas global:

git config --global user.name "username-github-kamu"
git config --global user.email "email-github-kamu@example.com"

Verifikasi konfigurasi:

git config user.name
git config user.email

Inisialisasi Git Lokal

Pastikan kamu berada di dalam folder proyek HelloAndroid, lalu jalankan:

# 1. Jadikan folder proyek sebagai repositori Git
git init

# 2. Masukkan semua berkas ke staging area
git add .

# 3. Kunci riwayat checkpoint pertama
git commit -m "feat(setup): first hello android app launch"

Format Pesan Commit Standar (Conventional Commits)

Tipe	Kapan Dipakai	Contoh Penerapan
`feat`	Menambah fitur atau komponen baru	`feat(card): rakit wallpaper card pake stacking box`
`fix`	Memperbaiki bug atau glitch tampilan	`fix(splash): atasi icon splash kepotong di android 12`
`refactor`	Merapikan susunan kode tanpa mengubah fungsi	`refactor(nav): pisah floating navbar ke folder components`
`chore`	Urusan dependensi atau konfigurasi build	`chore(deps): pasang coil di libs.versions.toml`
`docs`	Menulis panduan atau dokumentasi	`docs(readme): tambahkan langkah aktifkan usb debugging`

Membuat Repository di GitHub & Push Perdana

Buka peramban, masuk ke akun GitHub, lalu klik New Repository.
Beri nama repositori: hello-android.
Biarkan opsi README dan .gitignore tidak dicentang (karena proyek lokal kita sudah memilikinya). Klik Create repository.
Salin URL repositori milikmu, lalu jalankan perintah berikut di Terminal laptopmu:

# Hubungkan repositori lokal ke GitHub
git remote add origin https://github.com/username-github-kamu/hello-android.git

# Pastikan branch utama bernama main
git branch -M main

# Unggah kode ke GitHub
git push -u origin main

Selamat! Kamu sudah menguasai alur setup project Android Studio dan alur Git dari nol.

7. Persiapan Template LuminaWalls untuk Sesi 2

Untuk proyek besar aplikasi wallpaper LuminaWalls yang akan kita kembangkan dari Sesi 2 sampai Sesi 5, panitia telah menyediakan starter pack berisi aset gambar, warna tema Material, dan string XML agar kita tidak perlu membuat semuanya dari nol.

Clone Template LuminaWalls

Buka terminal baru di folder kodinganmu, lalu clone repositori starter:

git clone https://github.com/gdgocwidyatama/MobileDev.git luminawalls
cd luminawalls

Buka folder luminawalls tersebut di Android Studio (File > Open…), lalu tunggu Gradle menyelesaikan sinkronisasi.

Memasang Dependensi Splash API Resmi Android

Di template LuminaWalls, pustaka androidx-core-splashscreen sudah terdaftar rapi di gradle/libs.versions.toml. Kamu cukup memanggilnya di modul aplikasi:

1. Pasang di `app/build.gradle.kts`

Buka berkas app/build.gradle.kts, tambahkan di dalam blok dependencies:

dependencies {
    // Pustaka Splash Screen resmi Android 12+
    implementation(libs.androidx.core.splashscreen)
}

Klik tombol Sync Now di sudut kanan atas editor.

2. Pasang di `MainActivity.kt`

Buka berkas app/src/main/kotlin/com/gdgoc/luminawalls/MainActivity.kt, lalu tambahkan installSplashScreen() sebelum super.onCreate():

package com.gdgoc.luminawalls

import android.os.Bundle
import androidx.activity.ComponentActivity
import androidx.activity.compose.setContent
import androidx.activity.enableEdgeToEdge
import androidx.core.splashscreen.SplashScreen.Companion.installSplashScreen
import com.gdgoc.luminawalls.ui.LuminaMainApp

class MainActivity : ComponentActivity() {
    override fun onCreate(savedInstanceState: Bundle?) {
        val splashScreen = installSplashScreen()
        super.onCreate(savedInstanceState)

        enableEdgeToEdge()

        setContent {
            LuminaMainApp()
        }
    }
}

Tekan Run (Shift + F10) untuk memastikan aplikasi LuminaWalls menyala di HP fisikmu.

Simpan Checkpoint Sesi 1 ke GitHub

git status
git add .
git commit -m "feat(sesi-1): setup project, run edge-to-edge, and install splash api"
git push origin main

Kini laptop dan perangkatmu sudah 100% siap untuk mulai merakit antarmuka LuminaWalls dari kanvas kosong di Sesi 2!