Flutter เบื้องต้น (Beginner)

Flutter เบื้องต้น (Beginner) — 20 บท

1. ✨ แนะนำ Flutter และ Dart

Flutter คืออะไร?

Flutter คือ Framework จาก Google สำหรับการพัฒนาแอปพลิเคชันแบบ Cross-platform หมายถึงเขียนโค้ดครั้งเดียว แล้วสามารถใช้งานได้ทั้งบนระบบปฏิบัติการ Android, iOS, Web และ Desktop โดยใช้ภาษาเดียวกัน (Dart)

Flutter ใช้ Widget-based structure ที่สามารถจัดการทุกองค์ประกอบของ UI ได้อย่างยืดหยุ่น เหมาะสำหรับนักพัฒนาที่ต้องการ UI ที่สวยงาม รวดเร็ว และปรับแต่งได้เอง

Dart คืออะไร?

Dart คือภาษาโปรแกรมที่ Google พัฒนาขึ้นมาเพื่อใช้กับ Flutter โดยเฉพาะ ซึ่งมีลักษณะคล้ายภาษา JavaScript, Java, และ C# ทำให้เรียนรู้ได้ไม่ยาก

คุณสมบัติเด่นของ Dart:

ทำงานแบบ compiled (เร็ว)
รองรับ OOP (Object-oriented programming)
มี async/await สำหรับเขียน asynchronous code ได้สะดวก

ข้อดีของ Flutter

⚡ Performance ใกล้เคียง Native app
🌟 UI สวย ปรับแต่งได้ละเอียด
🔄 Hot Reload ช่วยให้เห็นการเปลี่ยนแปลงแบบ real-time
🌎 พัฒนาได้หลายแพลตฟอร์มจากโค้ดชุดเดียว

ตัวอย่างโค้ดแรกใน Flutter

import 'package:flutter/material.dart';

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

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(title: Text("แอป Flutter แรก")),
        body: Center(
          child: Text(
            "สวัสดี Flutter!",
            style: TextStyle(fontSize: 24, color: Colors.blue),
          ),
        ),
      ),
    );
  }
}

คำอธิบายโค้ด:

main() เป็นฟังก์ชันหลักที่เริ่มทำงาน
runApp() คือการเรียกใช้งาน widget หลักของแอป
MaterialApp คือ widget ที่ห่อทั้งแอป ใช้มาตรฐานการออกแบบของ Google
Scaffold เป็นโครงสร้างพื้นฐานที่มี AppBar, Body ฯลฯ
Text ใช้แสดงข้อความ

สรุป

Flutter และ Dart คือคู่หูที่ใช้พัฒนาแอปที่มีคุณภาพสูง ด้วยโค้ดชุดเดียว คุณสามารถเริ่มสร้างแอปของคุณเองได้ในไม่กี่นาที และมีเครื่องมือครบครันพร้อมพัฒนาในระยะยาว