เห็นมีการพูดถึงเยอะกับ Flutter
เป็น open source platform สำหรับการพัฒนา mobile app
แบบ cross platform ทั้ง Android และ iOS ด้วยภาษา Dart
แน่นอนว่าส้รางโดยทีมของ Google นั่นเอง

เมื่อไปอ่านเอกสารก็พบการขายของนิดหน่อยคือ

  •  Look and Feel ของ app จะเหมือนกับ native เลย
  • ประสิทธิภาพแจ่มมาก
  • ได้รับแรงบันดาลใจมาจาก Reactive framework
  • Debug ได้รวดเร็วมาก ด้วย hot reload นั่นคือ แก้ code ไปดูผลการทำงานไป
  • สามารถเข้าถึง feature ต่าง ๆ ของแต่ละ platform ได้ เช่น battery และ GPS แต่ต้องเขียน code เฉพาะไป
  • ที่ชอบคือ Flutter testing support ซึ่งใช้ทั้ง unit + mocking framework และ device testing ผ่าน Flutter Driver รวมทั้ง Widget testing ซึ่งทุกอย่างในหน้าจอจะเป็น widget ทั้งหมด ทำให้เราสามารถทดสอบ widget แต่ละตัวได้เลย น่าสนใจจริง ๆ

จริงหรือไม่ มาลองกันดีกว่า

ปล.
Flutter ยังอยู่ในสถานะ beta นะ ดังนั้นอาจจะมีการเปลี่ยนแปลงครั้งใหญ่ได้
จะใช้ Flutter ก็ต้องศึกษาใหม่ รวมทั้งภาษา Dart ด้วย
ความสามารถของภาษา Dart ยังไม่เท่าเทียวกับ Swift หรือ Kotlin นะ แต่ Dart 2 ก็ดีขึ้น
สำหรับชาว Android นั้นสนับสนุน Android 4.1 ขึ้นไปนะ (Jelly Bean)
สำหรับชาว iOS ก็ iOS 8 ขึ้นไป
และไม่สนับสนุน device 32 bit ด้วยนะ

ขั้นตอนที่ 1 เริ่มต้นด้วยการติดตั้ง

สามารถติดตั้งได้ทั้ง Windows, MacOS และ Linux เลือกได้เลยจาก Get Started :: Install
ผมติดตั้งบน MacOS นะ
ต้องทำการ download Flutter SDK มีขนาด 621 MB
ในตอนที่ติดตั้งเป็น version 0.5.1 beta
จากนั้นทำการ extract และกำหนดในตัวแปร $PATH
จะสามารถ run คำสั่ง Flutter ได้ใน command line ดังนี้

$flutter

จะบอกว่าสิ่งที่เราติดตั้งนั้นมัน out of date
ดังนั้นทำการ update ซะ

$flutter upgrade

จากนั้นจะทำการ upgrade และตรวจสอบให้ว่า
ต้องทำการติดตั้งอะไรบ้าง ซึ่งตรงนี้ง่ายดี
ทำให้เรารู้ว่าต้องทำอะไรบ้าง
สามารถพิมพ์คำสั่งเองได้ด้วย (ให้หมอตรวจดูให้)

$flutter doctor -v

จะทำการตรวจสอบสิ่งต่าง ๆ ดังนี้ให้

  • Flutter SDK และผองเพื่อน เช่นภาษา Dart
  • Android Toolchain ทั้ง Android SDK และ JDK
  • iOS Toolchain ทั้ง Xcode, iOS-deploy และ Cocoapods
  • Android Studio IDE ติดตั้งพวก plugin ให้ครบ
  • IntelliJ IDEA ติดตั้งพวก plugin ให้ครบ
  • VS Code ติดตั้งพวก plugin ให้ครบ
  • การเชื่อมต่อกับ device หรือพวก Emulator

ปล.
สำหรับใครที่ติดตั้ง JDK หลาย version แนะนำให้กำหนด JAVA_HOME ให้เป็น JDK 1.8 ไปเลย
เอาแค่ Flutter, Android และ iOS Toolchain และ Device/Emulator/Simulator ให้ผ่าน ก็เพียงพอต่อการเริ่มต้นแล้ว

ผลการติดตั้งต้องเป็นประมาณนี้นะ

เพียงขั้นตอนแรกก็จัดว่าลำบากน่าดู !!

Issues ต่าง ๆ ของการติดตั้ง Flutter ก็เพียบนะ !!

เมื่อทุกอย่างพร้อม ก็เริ่มพัฒนา app กันเลย

$flutter create hello
$cd hello
$flutter run

ผลที่ได้คือ การสร้างและ run app บน device/simulator/emulator
น่าจะพอไปวัดไปวาได้ สำหรับการเริ่มต้นกับ flutter
แถมมีความสามารถให้ใช้งานเพียบ เช่น

  • ทั้งการ capture หน้าจอด้วยการกดปุ่ม s
  • ทั้งการดูลำดับชั้นของ element ในหน้าจอด้วยการกดปุ่ม i

แสดงการทำงานดังนี้

สำหรับคนเริ่มต้น เหนื่อยแน่นอน !!
แต่ Keep claim and coding/learning

ไว้มาพัฒนา app ด้วย Flutter กันต่อไปใน part 2

Tags: