ใช้คอมเก่ากับ Windows 7 ก็ติดตั้งโปรแกรมสร้างโมบายแอพได้

ทุกวันนี้การสร้างแอปมือถือดูเหมือนเป็นเรื่องของคอมพิวเตอร์รุ่นใหม่ ระบบปฏิบัติการรุ่นใหม่ และโปรแกรมรุ่นใหม่ทั้งหมด แต่ในความเป็นจริง หากเรามีคอมพิวเตอร์เก่าที่เป็น Windows 7 ก็ยังสามารถเรียนรู้และสร้างแอป Android ได้ เพียงแต่ต้องยอมรับข้อจำกัดของเครื่อง และที่สำคัญที่สุดคือ ต้องเลือกเวอร์ชันของเครื่องมือให้เข้ากัน

บทความนี้ไม่ได้ตั้งใจบอกว่า Windows 7 เป็นระบบที่เหมาะกับการพัฒนาแอปในปัจจุบัน ตรงกันข้าม Windows 7 เป็นระบบปฏิบัติการที่เก่ามากและไม่ได้รับการสนับสนุนจาก เครื่องมือรุ่นใหม่จำนวนมากแล้ว แต่บทความนี้ต้องการบันทึกว่า ถ้าเรามีคอมเก่าอยู่แล้ว เราไม่จำเป็นต้องยอมแพ้ต่อความฝันในการสร้างแอป เพราะยังมีวิธีเลือกชุดซอฟต์แวร์รุ่นเก่าที่ทำงานร่วมกันได้

1. ก่อนเริ่มสร้างแอป ต้องรู้อะไรบ้าง?

ความรู้ด้านภาษาโปรแกรม

หากตั้งใจใช้ Flutter สิ่งสำคัญที่สุดคือภาษา Dart ซึ่งเป็นภาษาที่ Flutter ใช้ในการเขียนโปรแกรม ไม่จำเป็นต้องเป็นผู้เชี่ยวชาญตั้งแต่วันแรก แต่ควรเข้าใจพื้นฐานต่อไปนี้

• ตัวแปรและชนิดข้อมูล
• การคำนวณและตัวดำเนินการ
• if / else
• for และ while
• ฟังก์ชัน
• List และ Map
• Class และ Object
• การรับเหตุการณ์จากผู้ใช้ เช่น การกดปุ่ม
• การทำงานแบบ asynchronous เช่น การเรียกข้อมูลจากอินเทอร์เน็ต

เมื่อเข้าใจพื้นฐานเหล่านี้แล้ว จึงค่อยเรียนรู้สิ่งที่เป็นเอกลักษณ์ของ Flutter เช่น Widget, State, Layout, Navigation และการเชื่อมต่อ API

ส่วนประกอบของฮาร์ดแวร์

โดยเฉพาะคอมพิวเตอร์ RAM น้อย การใช้โทรศัพท์จริงเป็นอุปกรณ์ทดสอบ จะช่วยลดภาระของเครื่องได้มาก เพราะ Android Emulator สามารถใช้ทรัพยากร CPU และ RAM จำนวนมาก

2. โปรแกรมทั้งหมดที่ต้องใช้ และแต่ละตัวทำหน้าที่อะไร?

โปรแกรมไหน "จำเป็น" และโปรแกรมไหนเป็นเพียง "เครื่องมือช่วย"?

สิ่งที่ควรทำความเข้าใจตั้งแต่ต้นคือ โปรแกรมทุกตัวที่ติดตั้งไว้ ไม่ได้มีความจำเป็นต่อการสร้างแอปในระดับเดียวกัน บางโปรแกรมเป็นส่วนประกอบของระบบ Android และ Flutter โดยตรง ในขณะที่บางโปรแกรมเป็นเพียงเครื่องมือที่ช่วยให้เราทำงานสะดวกขึ้น

ตัวอย่างที่เห็นได้ชัดคือ Android Studio กับ Visual Studio Code แม้ว่าทั้งสองโปรแกรมจะสามารถใช้เปิด และแก้ไขโค้ดได้ แต่บทบาทของทั้งสองโปรแกรมในชุดเครื่องมือนี้แตกต่างกัน

Android Studio เป็นชุดเครื่องมือสำหรับการพัฒนา Android โดยตรง นอกจากใช้เป็น IDE แล้ว ยังมี Android SDK Manager สำหรับติดตั้งและจัดการ Android SDK, SDK Platform, Build-Tools, Platform-Tools และส่วนประกอบอื่น ๆ ของ Android

ในการติดตั้ง Flutter บน Windows 7 ที่อธิบายในบทความนี้ Android Studio จึงมีบทบาทสำคัญในการเตรียมสภาพแวดล้อมของ Android แม้ว่าในภายหลังเราจะเลือกใช้ VS Code เป็นโปรแกรมหลักสำหรับเขียนโค้ดที่เร็วกว่าก็ตาม

ส่วน Visual Studio Code (VS Code) เป็นโปรแกรมแก้ไขโค้ด หรือ code editor ที่มีขนาดค่อนข้างเบา สามารถติดตั้งส่วนเสริม (extensions) สำหรับ Flutter และ Dart เพื่อช่วยเขียนโปรแกรมได้สะดวก

ดังนั้นในการใช้งานจริง เราสามารถมีทั้งสองโปรแกรมอยู่ในเครื่องเดียวกัน โดยให้แต่ละโปรแกรมทำหน้าที่ต่างกัน และไม่ต้องเปิดทั้งสองโปรแกรมพร้อมกันตลอดเวลา

Git — ไม่จำเป็นต่อการสร้างแอป แต่ควรมีสำหรับงานพัฒนาจริง

Git คือระบบ Version Control หรือระบบจัดการประวัติการเปลี่ยนแปลงของ source code หน้าที่ของมันคือช่วยให้เรารู้ว่าไฟล์ถูกแก้ไขอะไรไปบ้าง สามารถย้อนกลับไปดูเวอร์ชันก่อนหน้า และช่วยจัดการ source code เมื่อโปรเจกต์มีขนาดใหญ่ขึ้น

หากเรามี Flutter SDK, Android SDK และเครื่องมือที่เกี่ยวข้องพร้อมแล้ว เราสามารถสร้างและ build แอปได้โดยไม่ต้องมี Git

แต่เมื่อเราเริ่มทำโปรเจกต์จริง source code จะมีการแก้ไขอยู่ตลอดเวลา วันนี้เราอาจแก้โปรแกรมแล้วทำงานได้ดี แต่วันพรุ่งนี้อาจแก้บางอย่างแล้วเกิดปัญหา Git ช่วยให้เราบันทึกประวัติของการเปลี่ยนแปลงเหล่านั้น และสามารถย้อนกลับไปยังสถานะก่อนหน้าได้

Git ยังมีประโยชน์เมื่อต้องการเก็บ source code ไว้บนบริการต่าง ๆ เช่น GitHub หรือ GitLab หรือเมื่อต้องทำงานร่วมกับผู้อื่น

ทดสอบว่า Git ติดตั้งแล้วหรือไม่

หลังติดตั้ง Git for Windows สามารถตรวจสอบจาก Command Prompt ได้ด้วย:

git --version

หากติดตั้งเรียบร้อย จะเห็นหมายเลขเวอร์ชันของ Git ตัวอย่างเช่น:

git version 2.46.2.windows.1

สำหรับผู้ที่เพิ่งเริ่มเรียน Flutter อาจยังไม่ต้องเรียน Git อย่างละเอียด เพียงเข้าใจหน้าที่ของมันและติดตั้งไว้ก่อนก็ได้ เมื่อเริ่มทำโปรเจกต์จริงจึงค่อยเรียนรู้คำสั่ง Git เพิ่มทีละขั้น

3. ติดตั้ง Flutter SDK

ในการทดลองนี้เลือก Flutter 3.7.12 ซึ่งเป็นรุ่น Stable และเป็นรุ่นที่มีอยู่ใน Flutter SDK Archive โดยมาพร้อม Dart SDK 2.19.6

ดาวน์โหลดจาก Flutter SDK Archive .zip file แล้วแตกไฟล์ไว้ใน folder C:\src\ จะได้ C:\src\flutter

** ไม่ควรแตกไว้ใน C:\Program Files\ เพราะ Windows อาจจำกัดการเขียนโค้ดเพิ่ม

และอย่าลืมเก็บ .zip file ไว้ backup ในที่ปลอดภัย เช่น

D:\Software Archive\Flutter\flutter_windows_3.7.12-stable.zip

จากนั้นเพิ่มโฟลเดอร์ต่อไปนี้เข้าใน Windows PATH โดย

1. Click Start
2. Right-click Computer
3. Click Properties
4. Click Advanced system settings
5. Click Environment Variables... (ปุ่มที่อยู่ด้านล่าง)

จะเห็น 2 sections คือ User variables กับ System variables เราจะดัดแปลงเฉพาะ User variables

คลิก PATH แล้ว คลิกปุ่ม Edit... จะมีหน้าจอ Edit User Variable โผล่ขึ้นมา

ที่ช่อง Variable value ให้เพิ่มข้อความข้างล่าง ลงไปท้ายสุดของช่อง เพื่อให้ Windows รู้ว่า Flutter อยู่ที่ไหน

;C:\src\flutter\bin

แล้ว Click OK

จากนั้นลองทดสอบด้วย Command Prompt: โดยไปที่ Start พิมพ์คำว่า cmd แล้ว Enter

ในช่อง command prompt ให้พิมพ์ข้อความข้างล่างนี้ แล้วกด Enter

flutter --version

ควรเห็น Flutter 3.7.12 และ Dart 2.19.6 เป็นคำตอบ (เครื่องเก่าจะช้า อาจต้องรอเกือบ 1 นาที)

4. ติดตั้ง Android Studio รุ่นที่เข้ากับเครื่องเก่า

ในการทดลองนี้ใช้ Android Studio Dolphin 2021.3.1 ซึ่งเป็น Android Studio รุ่นเก่าที่สามารถใช้ร่วมกับชุดเครื่องมือในบทความนี้ได้ และมาพร้อมกับ Android SDK ที่สำคัญควรดาวน์โหลดจาก official website ของ Google เท่านั้น

หากเครื่องคอมพิวเตอร์ RAM < 8 GB ให้ติดตั้งแบบ Custom คือเลือกติ๊กเฉพาะ Android SDK กับ Android SDK Platform พอติดตั้งทั้งหมดเสร็จ Click Finish

5. ติดตั้ง Android SDK Command-line Tools

Android Studio รุ่นเก่าบางรุ่นมาพร้อม Java Runtime ของตัวเอง แต่เครื่องมือบางตัวที่ Flutter เรียกใช้ อาจต้องการ Java รุ่นใหม่กว่า

ในการทดลองนี้ เมื่อเรียก flutter doctor --android-licenses ระบบแจ้งว่า Java version 17 or higher is required

ดังนั้นจึงต้องติดตั้ง JDK 17 และทำให้ Command Prompt สามารถเรียกคำสั่ง java ได้ หรือ Downgrade Android SDK Command-line Tools to a version compatible with Java 11.0.3

เราเลือกอย่างหลัง เพราะไม่อยากดาวน์โหลดอะไรเพิ่มอีก

วิธีการ: เปิด Android Studio → More Actions → SDK Manager → SDK Tools แล้วเปิดตัวเลือก Show Package Details

ในการทดลองนี้เลือก Android SDK Command-line Tools 8.0 คลิก Apply

ทดสอบด้วย:

"C:\Program Files\Android\Android Studio\jre\bin\java.exe" -version

จะได้ openjdk version "11.0.13"

หากใครเลือกที่จะดาวน์โหลด JDK 17 พอติดตั้งแล้วสามารถทดสอบด้วย:

java -version

หากคำสั่งนี้ทำงานได้ จึงค่อยดำเนินการยอมรับ Android SDK licenses

6. ยอมรับ Android SDK Licenses

เปิด Command Prompt แล้วใช้:

flutter doctor --android-licenses

ระบบจะแสดงข้อตกลงหลายรายการ ให้ตอบ y ตามขั้นตอนจนหมด

เมื่อติดตั้งถูกต้อง ควรจบลงโดยไม่มีปัญหาเรื่อง Android licenses

7. ติดตั้ง Android SDK Platform

ตอนแรก Android SDK Manager ติดตั้ง Platform-Tools รุ่นใหม่ ซึ่งมี adb.exe รุ่น 37.x

เมื่อทดลองเรียก:

adb version

Windows 7 แสดงข้อความ:

นี่แสดงว่า adb.exe รุ่นนั้นเรียกใช้ API ที่ Windows 7 ไม่มี

วิธีแก้: ไปที่ Android Studio → SDK Manager → SDK Platforms

ในกรณีทดลองนี้ Platform-Tools 34.0.4 เป็นรุ่นที่ทดสอบแล้วว่าสามารถทำงานบน Windows 7 เครื่องนี้ได้

ก่อนเปลี่ยนไฟล์ ไม่ควรลบของเดิมทิ้ง ให้เปลี่ยนชื่อโฟลเดอร์เดิมเพื่อเก็บไว้เป็น backup เช่น

C:\Users\ชื่อคุณ\AppData\Local\Android\Sdk\platform-tools
→
C:\Users\ชื่อคุณ\AppData\Local\Android\Sdk\platform-tools-37.0.1

จากนั้นคลิก Platform-Tools 34.0.4 → Apply

หลังติดตั้งควรพบโฟลเดอร์

C:\Users\ชื่อคุณ\AppData\Local\Android\Sdk\platforms\android-34

จากนั้นไปที่

C:\Users\ชื่อคุณ\AppData\Local\Android\Sdk\platform-tools

adb.exe
fastboot.exe
AdbWinApi.dll
AdbWinUsbApi.dll

ทดสอบ adb.exe ก่อน โดยเปิด Command Prompt และเข้าไปยังโฟลเดอร์ Platform-Tools:

cd C:\Users\kom\AppData\Local\Android\Sdk\platform-tools

จากนั้น:

adb version

ผลที่ได้จากการทดลองคือ:

8. ทดสอบ ADB Server

ต่อไปทดสอบ:

adb start-server

จากนั้น:

adb devices

หากยังไม่ได้เสียบโทรศัพท์ Android ผลอาจเป็น:

List of devices attached

ไม่มีชื่ออุปกรณ์อยู่ด้านล่างก็ไม่ใช่ความผิดพลาด เพราะหมายถึงขณะนั้นยังไม่มี Android device เชื่อมต่ออยู่

9. ทดสอบทั้งหมดด้วย flutter doctor

เมื่อทุกอย่างติดตั้งแล้ว ให้ใช้:

flutter doctor

ในการทดลองนี้ Flutter ตรวจพบ:

• Flutter
• Android toolchain
• Chrome
• Android Studio
• Visual Studio Code
• Connected devices
• HTTP Host Availability

โดยมีคำเตือนเกี่ยวกับ Windows Version และ Visual Studio ซึ่งต้องแยกทำความเข้าใจ

10. ต้องติดตั้ง Visual Studio หรือไม่?

หากเป้าหมายคือการสร้าง Android application ไม่จำเป็นต้องติดตั้ง Visual Studio เพียงเพราะ flutter doctor แสดงเครื่องหมายกากบาท

Visual Studio มีความเกี่ยวข้องกับการพัฒนา Flutter สำหรับ Windows desktop ซึ่งเป็นคนละเป้าหมายกับการสร้าง Android app

11. ทำไมจึงไม่ควรเปิด Android Emulator บนคอมเก่า?

Android Emulator สะดวกมากสำหรับคอมพิวเตอร์ที่มีทรัพยากรเพียงพอ แต่สำหรับคอมพิวเตอร์เก่าที่มี RAM จำกัด การใช้โทรศัพท์ Android จริงอาจเหมาะกว่า

แนวคิดคือ:

1. เขียนโปรแกรมบนคอมพิวเตอร์
2. เสียบโทรศัพท์ Android ผ่าน USB
3. เปิด Developer Options
4. เปิด USB debugging
5. ให้ adb ตรวจพบโทรศัพท์
6. ให้ Flutter ติดตั้งและเปิดแอปบนโทรศัพท์

วิธีนี้ช่วยลดภาระของ CPU และ RAM ของคอมพิวเตอร์เก่าได้มาก