DevCoach 174: Flutter | Bentangkan Sayap Kreativitasmu dengan Flutter Desktop

Transcript

2. Bentangkan Sayap Kreativitasmu dengan Flutter Desktop Achmad Ilham Imanuddin Curriculum Developer Multi-platform Flutter
3. Pokok Pembahasan • Histori tentang Flutter Desktop • Menguak Misteri Flutter Windows, macOS, dan Linux • Eksplorasi Flutter Desktop Multi-platform Flutter
4. Flashback
5. Mobile App Web App Desktop App https://flutter.dev/multi-platform Flutter
8. Mengapa kita butuh Desktop App? • Dapat diakses secara offline. • Dapat menyimpan data secara lokal. • Performa lebih baik.
9. Aplikasi Desktop Populer
10. Konfigurasi Flutter Desktop
11. Konfigurasi Windows
12. Konfigurasi Windows
13. Konfigurasi Windows • Download dan install Flutter SDK • Tambahkan direktori Flutter ke PATH • Instal Android Studio • Instal Visual Studio dan aktifkan “Desktop development with C++”
14. Konfigurasi Windows • Download dan install Flutter SDK • Tambahkan direktori Flutter ke PATH • Instal Android Studio • Instal Visual Studio dan aktifkan “Desktop development with C++” • Buat aplikasi Windows $ flutter create example_counter_app $ flutter run -d windows
15. Konfigurasi Windows Ada 2 sub direktori dalam folder windows. • flutter: generated files • runner: platform specific code
16. Konfigurasi macOS
17. Konfigurasi macOS
18. Konfigurasi macOS • Download dan unzip Flutter SDK • Ekstrak dan tambahkan ke PATH • Instal Xcode dan Cocoapods • Buat aplikasi macOS $ flutter create example_counter_app $ flutter run -d macOS
19. Konfigurasi macOS Ada 5 sub direktori dalam folder macos. • Flutter: generated files dan git-ignored files • Runner: platform specific code • Runner.xcodeproj: source code • Runner.xcworkspace: dependencies between projects • RunnerTests: test code
20. Konfigurasi Linux
21. Konfigurasi Linux
22. Konfigurasi Linux • Download dan install Flutter SDK • Tambahkan direktori Flutter ke PATH • Instal android-studio IDE • Buat aplikasi Linux $ flutter create example_counter_app $ flutter run -d linux
23. Konfigurasi Linux Ada 1 sub direktori dalam folder linux. • flutter: generated files
24. Konfigurasi Flutter • Jalankan perintah flutter doctor. • Jika Flutter SDK terinstal, pastikan setiap item yang berkaitan dengan aplikasi desktop tidak mengalami error.
25. Quiz #1 DevCoach 174
26. Quiz #1 DevCoach 174 Aplikasi apa yang wajib diinstal selain Flutter SDK dan Android Studio pada perangkat Windows? Beri alasannya mengapa perlu adanya aplikasi tersebut.
27. Package / Library
28. Default Theme Windows OS macOS Linux OS
29. Theme based on Platform Windows OS macOS Linux OS
30. Fluent Design Microsoft memperkenalkan Fluent Design, sebuah design system, yang dirancang sebagai pedoman dalam membuat aplikasi bergaya Windows. Fluent Design ini menyediakan komponen-komponen untuk menyusun antarmuka pengguna.
31. Cupertino Design Secara default, Flutter menyediakan dua desain sistem yang dapat digunakan pada aplikasi, yakni Material dan Cupertino. Material diperuntukkan bagi Anda yang ingin membuat aplikasi layaknya Android, sedangkan Cupertino menyediakan tema layaknya perangkat iOS.
32. Yaru Theme Nama tema pada perangkat Linux adalah Yaru. Tema ini diperkenalkan oleh suatu komunitas dan dapat digunakan pada Ubuntu 18.04 sebagai ekstensi. Di versi berikutnya, Yaru menjadi default tema di mana Anda tidak perlu melakukan instalasi lagi.
33. Theme based on Platform Windows OS macOS Linux OS fluent_ui macos_ui yaru
34. Window Effect flutter_acrylic
35. Window Size Mengatur minimal Size(500,400) Tanpa mengatur minimal Size
36. Window Size window_manager
37. Quiz #2 DevCoach 174
38. Quiz #2 DevCoach 174 Salah satu package yang dapat digunakan ketika ingin menerapkan tema layaknya aplikasi macOS? Beri alasannya juga!
39. App Deployment
40. App Deployment Platform Store Windows OS Microsoft App Store macOS App Store Linux OS Snap Store
41. • Run a Flutter build command $ flutter build windows • Get the .exe file and distribute it to anywhere • Or, use msix package to create a certificate and publish it to Microsoft Windows App Store. Distribution: Windows
42. Distribution: macOS • Run a Flutter build command $ flutter build macos • Register the app on App Store Connect • Create an application record • Code signing and configure the app distribution information • Create a build archive with Xcode
43. Distribution: Linux • Install snapcraft • Run a Flutter build command $ flutter build linux • Publish the app via snapcraft command
44. Quiz #3 DevCoach 174
45. Quiz #3 DevCoach 174 Apa nama store yang dapat kita gunakan untuk mempublikasikan aplikasi Linux?
46. ~ Letʼs code ~
47. Thank You Data Science
48. Feedback! dicoding.id/devcoachfeedback