web analytics

Deploy Flutter ด้วย Codemagic

สวัสดีผู้อ่านครับ ก่อนหน้านี้ผมเขียนบล็อกเกี่ยวกับ App Center ที่เป็นเครื่องมือ CI/CD ของ mobile app จาก Microsoft บล็อกนี้อยากจะลองแชร์เกี่ยวกับเครื่องมืออีกตัว คือ Codemagic ที่เป็นบริการ CI/CD เหมือนกันและเป็นพันธมิตรกับ Flutter อีกด้วย จะเป็นอย่างไร ไปลองเล่นกันครับ

Codemagic คืออะไร

Codemagic เป็นเครื่องมือ DevOps ช่วย build และ test แอป พร้อมส่งแอปให้กับ Tester ในทันที หรือ publish ขึ้น App Store ได้เช่นกัน โดย Codemagic เป็นบริการ CI/CD รายแรกๆที่รองรับ Flutter หากใครติดตาม Flutter และได้ดูงาน Flutter Live 2018 จะเห็นว่า คุณ Triin Kask (CEO ของบริษัท) มานำเสนอการ build Flutter โดย Codemagic ด้วย ทำให้ผมรู้จัก Codemagic มาตั้งแต่ตอนนั้น

จะเห็นได้ว่า Codemagic เป็นคู่แข่งโดยตรงของ App Center ที่ผมเขียนบล็อกไปก่อนหน้านี้ แต่ทว่าจริงๆแล้ว Codemagic มีฟีเจอร์ที่เหนือกว่า App Center พอสมควร จะเป็นอย่างไร เรามาลองเล่น codemagic กัน

ตอนก่อนหน้านี้ เกี่ยวกับ Flutter x App Center ครับ

เริ่มต้น

ก่อนอื่น สมัครสมาชิกใช้งาน Codemagic ก่อนนะ
https://codemagic.io/

ในหน้าเว็บจะเห็นว่า จุดเด่นแรกของ Codemagic ที่ใน App Center ไม่มี คือการรองรับ Flutter โดยตรง ทำให้ Codemagic เหมาะมากๆกับ Flutter

หลังจาก Login ก็สร้าง App ใหม่ แล้ว Codemagic จะให้เรา Connect Repository ที่เราเก็บ source code ไว้ เช่น ของผมใช้ Gitlab

เลือก Repository ที่ต้องการและเลือก Project type เป็น Flutter

Build Config (Android)

ขั้นตอนต่อมาคือ เราต้องการ Config ต่างๆ ซึ่ง Codemagic ใช้งานง่ายมาก
โดยเริ่มต้นผมจะเลือก เฉพาะ Android ก่อน

ที่ Run build on เราจะสามารถเลือก VM สเปคที่ต้องการได้ ซึ่งหากใช้แบบฟรี ก็จะเลือกได้แค่ MacOS Standard
แต่ก็นับว่าเพียงพอแล้วล่ะ

จากนั้นที่ Android code signing ให้เช็คถูกที่ Eanble Android code signing แล้วกำหนด Keystore ของแอป

จากนั้นก็กดปุ่ม Start new build
Codemagic จะให้เลือก Branch ที่เราต้องการ แล้วกดปุ่ม Start new build อีกครั้ง

Distribution (Android)

หลังจากรอ build โปรเจค Flutter ของผม ใช้เวลา build ประมาณ 6 นาที (เฉพาะ Android)

ซึ่งจะมาพร้อมกับอีเมล สามารถกดดาวน์โหลด apk ติดตั้งได้เลย

Build Config (iOS)

มาทำ iOS กันต่อ โดยเพิ่ม iOS ใน Build for platforms

จากนั้นที่ Build ให้กำหนด Xcode version ที่ต้องการ และสามารถเลือก CocoaPods version ได้ด้วย

ขั้นตอนถัดไป คือกำหนด Code signing สามารถเลือกได้ว่าจะให้ Automatic หรือ Manual

ในตัวอย่างนี้ผมจะเลือก Manual เพราะผมมีทั้ง Provisioning Profile และ Certificate อยู่แล้ว
(Provisioning Profile สามารถดาวน์โหลดได้จากใน เมนู profiles ใน Apple Developer)

Connect App Store

หากขี้เกียจหาไฟล์ Provisioning Profile และ Certificate แนะนำให้ใช้แบบ Automaic ก็ได้
Codemagic จะเชื่อมต่อกับ App Store Connect แล้วดึง Provisioning Profile มาใส่ให้แบบอัตโนมัติ
โดยจำเป็นต้องไป connect App Store ก่อน ที่เมนู User Settings > Integrations

การเชื่อมต่อ App Store จะเชื่อมต่อโดยใช้ API key ประกอบด้วยข้อมูล 3 อย่าง คือ Issuer ID , Key ID , API key ซึ่งทั้ง 3 อย่างสามารถหาได้ใน App Store Connect อ่านได้ที่ doc ของ codemagic ได้เลย

Distribution (iOS)

จากนั้นกด Start new build ได้เลย แล้วก็รอ Codemagic ทำงานสักพัก จุดที่ผมชอบใน Codemagic อีกจุดคือ การแสดง log แบบแยกขั้นตอน ทำให้อ่านง่าย

โปรเจค Flutter เล็กๆ ทั้ง Android และ iOS ของผมใช้เวลา build เพียง 12 นาทีนิดๆเท่านั้น

แล้วก็จะได้รับอีเมลสำหรับดาวน์โหลดแอป ซึ่งจะรวม iOS / Android ให้เลยในอีเมลฉบับเดียว สะดวกดี
แถมไม่จำเป็นต้อง login Codemagic เพื่อดาวน์โหลดอีกด้วย

ผลลัพธ์

หลังจากลองใช้งาน Codemagic พบว่าตอบโจทย์ผมมากๆยิ่งกว่า App Center เสียอีก เพราะ Config ง่ายมาก ออกแบบสำหรับ Flutter โดยเฉพาะ และ Tester จะได้อีเมลสำหรับดาวน์โหลดแอปหลังจาก เรา push code ไปที่ Gitlab แบบอีเมลฉบับเดียวทั้ง iOS / Android อีกทั้ง Codemagic ยังใช้เวลา build สั้นกว่า App Center พอสมควรด้วย แล้วก็ที่ชอบอีกอย่างคือ Codemagic หน้า UI ต่างๆทำออกมาได้สวยดีทีเดียว

ค่าบริการ

บริการ Codemagic ฟรี แต่จำกัดเวลาในการ build 500 นาทีต่อเดือน และ 120 นาทีต่อ build
ซึ่งหากเราใช้ build Flutter โปรเจคเล็กๆ ก็จะได้ราวๆ 40 ครั้งต่อเดือน

หากเราต้องการใช้งานแบบไม่จำกัดเวลา เราจะต้องจ่าย $299 ต่อเดือน ประมาณเกือบๆ 10,000 บาท
หากใช้เกิน 500 นาที สามารถจ่ายแบบรายนาทีได้ เช่น VM macOS standard ราคา $0.038 / นาที

รายละเอียดค่าบริการ
https://codemagic.io/pricing/

จบแล้ว

บล็อกนี้มาแชร์เกี่ยวกับ Flutter ร่วมกับ Codemagic ครับ บล็อกถัดไป ผมอยากจะเขียนสรุป App Center vs Codemagic ครับ ลองเล่นแล้ว ตัวไหนมีจุดเด่นตรงไหน อันไหนคุ้มกว่ากัน คุ้มกว่าในเงื่อนไขไหนบ้าง ติดตามได้ในตอนถัดไปครับ

ขอบคุณที่ติดตามอ่านจนจบครับ (:
แล้วพบกันใหม่ในบล็อกถัดไปครับ