Overview

Fahram Mobile App adalah aplikasi mobile berbasis Flutter yang mengintegrasikan dua platform web utama:

Portal Fahram – portal publik berisi artikel, galeri, dokumen, dan katalog kursus.
Fahram LMS – sistem pembelajaran online untuk kursus, modul pembelajaran, dan ujian.

Aplikasi ini dirancang sebagai all-in-one mobile platform sehingga pengguna dapat mengakses konten publik tanpa login serta mengikuti kursus dan ujian setelah melakukan autentikasi.

Aplikasi ini mengadopsi arsitektur modern Flutter dengan pendekatan Clean Architecture, Riverpod State Management, dan Modular Feature Structure sehingga scalable dan maintainable untuk jangka panjang.

Tujuan Pengembangan

Tujuan utama aplikasi ini adalah:

Menggabungkan portal konten dan platform pembelajaran dalam satu aplikasi mobile.
Menyediakan pengalaman belajar yang lebih nyaman melalui perangkat mobile.
Mendukung akses cepat terhadap artikel, kursus, modul pembelajaran, dan ujian.
Meningkatkan engagement pengguna melalui fitur mobile seperti notifikasi, offline caching, dan deep linking.

Teknologi yang Digunakan

Mobile Framework

Flutter 3.29+
Dart 3.7+

State Management

Riverpod
Riverpod Generator
Freezed

Networking

Dio HTTP Client
Retrofit API Generator
Flutter Secure Storage

UI & Design

Flutter Material 3
Google Fonts
Cached Network Image
Flutter HTML Renderer
Carousel Slider
Shimmer Loading
Photo View

Navigation

GoRouter (Declarative Routing)

Storage & Cache

Hive Local Database
Shared Preferences
Secure Token Storage

Authentication

Email & Password Login
Google Sign In
Apple Sign In
OAuth Login

Arsitektur Aplikasi

Aplikasi menggunakan pendekatan Clean Architecture dengan struktur feature-first.

Struktur ini memisahkan setiap fitur menjadi tiga layer utama:

Data Layer
Berisi API service, data source, dan model.
Domain Layer
Berisi entity dan repository interface.
Presentation Layer
Berisi UI, state management, dan widgets.

Contoh struktur project:

lib/
 ├── core
 │   ├── config
 │   ├── network
 │   ├── router
 │   ├── theme
 │   └── widgets
 │
 ├── features
 │   ├── auth
 │   ├── portal
 │   │   ├── home
 │   │   ├── articles
 │   │   ├── gallery
 │   │   ├── documents
 │   │   └── courses_catalog
 │   │
 │   ├── lms
 │   │   ├── dashboard
 │   │   ├── courses
 │   │   ├── modules
 │   │   ├── exams
 │   │   └── profile
 │   │
 │   └── settings

Pendekatan ini membuat aplikasi lebih mudah dikembangkan oleh tim dan mempermudah maintenance.

Fitur Utama Aplikasi

1. Portal Publik

Pengguna dapat mengakses konten tanpa login.

Fitur yang tersedia:

Artikel dan berita
Galeri foto
Dokumen publik
Katalog kursus
Halaman kontak
Informasi perusahaan

Fitur Artikel

Infinite scrolling
Kategori dan tag
HTML rendering
Syntax highlighting
Share ke media sosial
Related articles

Galeri

Album foto
Fullscreen viewer
Swipe navigation
Zoom image

Katalog Kursus

Pencarian kursus
Filter level
Preview modul
Informasi mentor
CTA untuk mengikuti kursus

2. Authentication System

Aplikasi menyediakan sistem autentikasi lengkap.

Fitur login:

Email dan password
Google Sign In
Apple Sign In
OAuth login

Fitur akun:

Registrasi
Verifikasi email
Reset password
Logout

Token autentikasi disimpan secara aman menggunakan Flutter Secure Storage.

3. Learning Management System (LMS)

Setelah login, pengguna dapat mengakses fitur LMS.

Dashboard

Menampilkan ringkasan aktivitas pengguna:

Kursus yang diikuti
Modul yang telah diselesaikan
Statistik ujian
Kursus terbaru

My Courses

Menampilkan semua kursus yang diikuti oleh pengguna.

Status kursus:

Active
Pending
Completed
Rejected

Setiap kursus memiliki progress indicator untuk memantau perkembangan belajar.

4. Modul Pembelajaran

Modul pembelajaran dapat diakses langsung dari aplikasi.

Fitur modul:

HTML content rendering
Navigation antar modul
Progress tracking
Sidebar modul
Auto tracking progress ke server

5. Sistem Ujian

Aplikasi menyediakan sistem ujian online.

Fitur ujian:

Timer countdown
Question navigator
Multiple choice questions
Auto-save jawaban
Local backup jawaban
Prevent back navigation

Saat ujian berlangsung, layar akan tetap aktif menggunakan WakeLock.

6. Hasil Ujian

Setelah ujian selesai, pengguna dapat melihat hasilnya.

Informasi yang ditampilkan:

Skor akhir
Jumlah jawaban benar dan salah
Review jawaban
Highlight jawaban benar dan salah

7. Profile Management

Pengguna dapat mengelola akun mereka melalui halaman profil.

Fitur profil:

Edit data profil
Update password
Statistik belajar
Logout

8. Settings

Pengaturan aplikasi meliputi:

Dark mode
Notifikasi
Bahasa
Cache management
Informasi aplikasi

Desain UI & Tema

Aplikasi menggunakan Material 3 Design System dengan warna utama biru.

Fitur desain:

Light & Dark Mode
Responsive layout
Smooth animations
Shimmer loading states

Typography menggunakan Google Sans untuk tampilan modern dan konsisten.

Optimasi Performa

Untuk memastikan performa optimal di perangkat mobile, beberapa teknik yang digunakan:

Image caching
Lazy loading pagination
Offline caching dengan Hive
Riverpod autoDispose
Debounce search

Keamanan Aplikasi

Keamanan menjadi fokus utama dalam pengembangan aplikasi.

Beberapa mekanisme yang diterapkan:

Secure token storage
HTTPS API communication
Laravel Sanctum authentication
Obfuscated release build
Sensitive data protection

Tag: Flutter