Advanced React Native CLI
หลักสูตร Advanced React Native CLI เป็นการอบรมต่อยอดสาย React Native CLI แบบไม่ใช้ Expo ทั้งเขียน Turbo Native Module และ Fabric Component ปรับประสิทธิภาพ ทำ Push Notification และ Deep Linking จนถึงส่งแอปขึ้น Store ด้วย fastlane เหมาะกับนักพัฒนา React Native ที่ทำแอปได้แล้วและทีมที่ทำงานกับโค้ดเนทีฟ
- ระยะเวลา18 ชั่วโมง · 3 วัน
- รูปแบบออนไซต์ / ออนไลน์สด
- รอบถัดไปเปิดตามคำขอ
- ใบรับรองมี Certificate
ภาพรวมหลักสูตร
แอป React Native ที่ใช้งานจริงในองค์กรมักต้องทำมากกว่าหน้าจอและการเรียก API เช่น เรียกความสามารถของเครื่องที่ยังไม่มีไลบรารีรองรับ ห่อ View เนทีฟเดิมของทีม Android และ iOS มาใช้ในแอป แก้ปัญหาแอปช้าหรือเปิดนาน ทำงานได้แม้ไม่มีอินเทอร์เน็ต รับ Push Notification เปิดแอปจากลิงก์ และออกเวอร์ชันใหม่ขึ้น Store อย่างสม่ำเสมอโดยไม่ต้อง Build ด้วยมือ งานเหล่านี้ต้องเข้าใจทั้งฝั่ง JavaScript และโปรเจกต์ Android กับ iOS ที่อยู่เบื้องหลัง
หลักสูตรนี้เป็นฉบับปรับปรุงใหม่ที่ต่อยอดสาย React Native CLI แบบไม่ใช้ Expo บน React Native 0.87 ซึ่งทำงานบน New Architecture เท่านั้น พาผู้เรียนเขียน Turbo Native Module และ Fabric Native Component ผ่าน Codegen วัดและปรับประสิทธิภาพด้วย Hermes V1 และเครื่องมือ Profiler ทำข้อมูลแบบ Offline-first ทำ Push Notification ผ่าน Firebase Cloud Messaging และ Deep Linking เขียนชุดทดสอบ แล้วสร้าง Signed Release และ Pipeline ส่งแอปขึ้น Google Play และ App Store ด้วย Gradle, Xcode และ fastlane (อบรม 3 วัน วันละ 6 ชั่วโมง รวม 18 ชั่วโมง ระดับ Advanced)
สิ่งที่คุณจะได้รับ
- อธิบาย New Architecture ได้แก่ JSI, Turbo Native Modules, Fabric และ Codegen และอัปเกรดโปรเจกต์ได้
- เขียน Turbo Native Module และ Fabric Native Component ด้วย Kotlin และ Objective-C++ หรือ Swift ได้
- วัดและปรับประสิทธิภาพแอปด้วย React Native DevTools, Android Studio Profiler และ Instruments ได้
- ทำแอปแบบ Offline-first, Push Notification และ Deep Linking บนโปรเจกต์ React Native CLI ได้
- เขียน Unit Test และ E2E Test และตั้งค่า Build Variant แยกตาม Environment ได้
- สร้าง Signed Release และ Pipeline ส่งแอปขึ้น Google Play และ App Store ด้วย fastlane ได้
หลักสูตรนี้เหมาะสำหรับ
- นักพัฒนา React Native ที่สร้างแอปด้วย React Native CLI ได้แล้วและต้องการทำแอประดับ Production
- ทีมที่ต้องเชื่อมแอป React Native กับโค้ด Kotlin หรือ Swift ที่มีอยู่เดิม
- นักพัฒนา Android หรือ iOS ที่ทำงานร่วมกับทีม React Native
- ทีมที่ต้องการระบบ Build และส่งแอปขึ้น Store แบบอัตโนมัติ
พื้นฐานของผู้เข้าอบรม
- สร้างแอปด้วย React Native CLI ได้ ทั้ง Navigation, State และการเรียก API
- เขียน TypeScript ได้คล่อง
- เคยเปิดโปรเจกต์ใน Android Studio หรือ Xcode และอ่านโค้ด Kotlin หรือ Swift เบื้องต้นได้
- ใช้ Git และ Command Line ได้
หัวข้อการฝึกอบรม
รายละเอียดหลักสูตร
หลักสูตรนี้เป็นฉบับปรับปรุงใหม่ปี 2026 ของหลักสูตร Advanced React Native โดยวางเป็นหลักสูตรขั้นสูงของสาย React Native CLI ที่ต่อจาก Basic React Native for React Developers ต่างจากหลักสูตร Advanced React Native with Expo ที่ใช้ Expo, EAS และ Expo Modules API หลักสูตรนี้ไม่ใช้ Expo แต่ทำงานกับโปรเจกต์ Android และ iOS โดยตรง เขียน Turbo Native Module และ Fabric
Native Component เอง และ Build ด้วย Gradle, Xcode และ fastlane เนื้อหาอัปเดตเป็น React Native 0.87 อบรม 3 วัน วันละ 6 ชั่วโมง รวม 18 ชั่วโมง (09:00-16:00 น.) รูปแบบบรรยายสลับ Lab ระดับ Advanced วันแรกเป็น New Architecture และโค้ดเนทีฟ วันที่สองเป็น Performance ข้อมูลออฟไลน์ Push Notification และ Deep Linking วันที่สามเป็น Testing, Signed Release และ CI ด้วย fastlane
Day 1 New Architecture และโค้ดเนทีฟ
Section 1: Lab: New Architecture เชิงลึกและการอัปเกรดโปรเจกต์
- JSI, Turbo Native Modules, Fabric และ Codegen ทำงานร่วมกันอย่างไร
- ตั้งแต่ 0.82 ทำงานบน New Architecture เท่านั้น และผลต่อไลบรารีเดิม
- Strict TypeScript API ของ 0.87 และการเลิกใช้ Deep Import
- อัปเกรดเวอร์ชันด้วย React Native Upgrade Helper อย่างเป็นขั้นตอน
- Lab: อัปเกรดโปรเจกต์ตัวอย่างและแก้ไลบรารีที่ไม่รองรับ
Section 2: Lab: Turbo Native Module ตัวแรก
- เขียน Spec ใน TypeScript ด้วยชื่อขึ้นต้น Native และ TurboModuleRegistry
- ตั้งค่า codegenConfig ใน package.json และรัน Codegen
- Android: เขียนคลาส Kotlin ที่สืบทอด Spec ที่ Codegen สร้างให้
- iOS: เขียนด้วย Objective-C++ และลงทะเบียนผ่าน modulesProvider
- Lab: โมดูลอ่านข้อมูลอุปกรณ์และพื้นที่เก็บข้อมูลของเครื่อง
Section 3: Lab: Native Module ขั้นสูง
- Promise, Callback และการส่ง Error จากโค้ดเนทีฟ
- ส่ง Event จากเนทีฟกลับมา JavaScript
- งานหนักบน Background Thread โดยไม่บล็อก UI
- ภาพรวม Turbo Module แบบ C++ ที่ใช้โค้ดเดียวกันทั้งสองแพลตฟอร์ม
- Lab: โมดูลติดตามสถานะแบตเตอรี่ที่ส่ง Event แบบเรียลไทม์
Section 4: Lab: Fabric Native Component
- Spec ด้วย codegenNativeComponent และไฟล์ชื่อลงท้าย NativeComponent
- Android: SimpleViewManager และ Interface ที่ Codegen สร้างให้
- iOS: RCTViewComponentView และการอัปเดต Props
- ส่ง Event จาก View เนทีฟกลับมา JavaScript
- Lab: ห่อ View เนทีฟที่ทีมมีอยู่มาใช้ใน React Native
Section 5: Lab: แพ็กโมดูลเนทีฟเป็นไลบรารี
- สร้างโครงไลบรารีด้วย create-react-native-library
- Autolinking และการใช้ไลบรารีภายในองค์กรผ่าน Private Registry
- ภาพรวม Swift Package Manager ที่ยังอยู่ในขั้นทดลอง
- Lab: ย้ายโมดูลจาก Lab ก่อนหน้าเป็นไลบรารีและติดตั้งในแอปใหม่
Day 2 Performance, ข้อมูล และการแจ้งเตือน
Section 6: Lab: วัดและปรับประสิทธิภาพ
- Hermes V1 และ Bytecode ใน Release Build
- Performance และ Network Panel ใน React Native DevTools
- Android Studio Profiler, Xcode Instruments และ Perfetto
- ลดเวลาเปิดแอป ปรับ FlatList และลดการ Render ซ้ำ
- Lab: หาและแก้จุดที่ทำให้หน้ารายการสินค้ากระตุก
Section 7: Lab: ข้อมูลในเครื่องแบบ Offline-first
- เลือกที่เก็บข้อมูล: MMKV สำหรับค่าตั้งค่า และ SQLite ด้วย op-sqlite สำหรับข้อมูลจำนวนมาก
- ตรวจสถานะเครือข่ายด้วย NetInfo และคิวรายการที่รอส่ง
- ซิงก์ข้อมูลเมื่อกลับมาออนไลน์และจัดการข้อมูลชนกัน
- เก็บ Token อย่างปลอดภัยด้วย Keychain และ Keystore
- Lab: แอปจดคำสั่งซื้อที่ทำงานได้ตอนออฟไลน์
Section 8: Lab: Push Notification ผ่าน FCM และ APNs
- ตั้งค่า Firebase และ APNs Key สำหรับ iOS
- ขอสิทธิ์ด้วย react-native-permissions และ POST_NOTIFICATIONS บน Android 13 ขึ้นไป
- รับ Token และจัดการข้อความตอนเปิดแอปและเบื้องหลังด้วย React Native Firebase
- ทดสอบบนมือถือจริงเพราะ iOS Simulator ไม่รับ Push จริง
- Lab: แจ้งเตือนเมื่อสถานะคำสั่งซื้อเปลี่ยน
Section 9: Lab: Local Notification ด้วย Native Module
- Android: Notification Channel และ NotificationManager
- iOS: UNUserNotificationCenter และการตั้งเวลาแจ้งเตือน
- ห่อทั้งสองแพลตฟอร์มเป็น Turbo Native Module เดียว
- Lab: แจ้งเตือนนัดหมายที่ตั้งเวลาไว้ในเครื่อง
Section 10: Lab: Deep Linking, Universal Links และ App Links
- Custom URL Scheme กับลิงก์ https ที่เปิดแอปได้
- Android App Links: Intent Filter และไฟล์ assetlinks.json
- iOS Universal Links: Associated Domains และ RCTLinkingManager
- ตั้งค่า Linking ของ React Navigation 7 และเปิดหน้าจากการแจ้งเตือน
- Lab: ลิงก์ในอีเมลที่เปิดหน้ารายละเอียดคำสั่งซื้อในแอป
Day 3 Testing, Release และ CI
Section 11: Lab: Unit Test และ E2E Test
- Jest กับ @react-native/jest-preset และ React Native Testing Library
- Mock Native Module ที่เขียนเองในการทดสอบ
- E2E Test ด้วย Detox บน Emulator และ Simulator
- Lab: ชุดทดสอบขั้นตอนสั่งซื้อทั้ง Unit และ E2E
Section 12: Lab: Build Variant และ Environment
- Android productFlavors และ iOS Scheme กับ Build Configuration
- แยก Application ID ชื่อแอป และไอคอนของ Dev, Staging และ Production
- ส่งค่า Environment เข้าแอปโดยไม่ฝังความลับใน Bundle
- versionCode, versionName และ Build Number
- Lab: ติดตั้งแอป Staging และ Production คู่กันบนเครื่องเดียว
Section 13: Lab: Signed Release สำหรับ Google Play และ App Store
- Upload Key ด้วย keytool และ signingConfigs ใน Gradle
- สร้าง AAB และใช้ Play App Signing กับ Internal Testing
- iOS: Release Scheme, Archive และ Distribute App ไปยัง App Store Connect
- ทดสอบผ่าน TestFlight และเตรียมข้อมูลหน้า Store
- Lab: Build รุ่น Release และส่งขึ้นช่องทางทดสอบ
Section 14: Lab: CI, fastlane และ Crash Monitoring
- fastlane lane สำหรับ Android ด้วย gradle และ upload_to_play_store
- fastlane lane สำหรับ iOS ด้วย match, build_app และ upload_to_testflight
- รัน Pipeline บน GitHub Actions พร้อมเก็บความลับอย่างปลอดภัย
- ติดตาม Crash ด้วย Sentry และอัปโหลด Source Map ของ Hermes
- Lab: Pipeline ที่ทดสอบ Build และส่งแอปขึ้นช่องทางทดสอบอัตโนมัติ
Section 15: Workshop: แอปพร้อมขึ้น Store
- รวม Native Module, ข้อมูลออฟไลน์, Push และ Deep Link ในแอปเดียว
- วัดประสิทธิภาพและแก้ปัญหาที่พบบนมือถือจริง
- รันชุดทดสอบและ Pipeline จนได้ Build สำหรับทดสอบ
- นำเสนอผลงาน รีวิวโค้ด และวางแผนออกเวอร์ชันต่อไป
รอบอบรมและรูปแบบการอบรม
สำหรับบุคคล — รอบอบรมทั่วไป
ขณะนี้ยังไม่มีรอบอบรมเปิดรับสมัคร ลงชื่อจองไว้ได้เลย ทีมงานจะติดต่อกลับเป็นกลุ่มแรกเมื่อเปิดรอบถัดไป หรือสอบถามทางไลน์ หรือโทร 02-570-8449 หรือ 088-807-9770
สำหรับองค์กร — In-house / Private Training
- ปรับเนื้อหาให้ตรงกับเครื่องมือและงานจริงของทีม
- เลือกวันเอง อบรมที่บริษัทหรือออนไลน์สด
- ออกใบเสนอราคาในนามนิติบุคคลให้ฝ่ายจัดซื้อ
วิทยากรผู้สอน
คำถามที่พบบ่อย
หลักสูตรนี้ต่างจาก Advanced React Native with Expo อย่างไร
Advanced React Native with Expo ใช้ Expo, Expo Router, EAS Build และ EAS Update ซึ่งช่วยจัดการฝั่งเนทีฟให้ ส่วนหลักสูตรนี้เป็นสาย React Native CLI ที่ไม่ใช้ Expo ต่อจากหลักสูตร Basic React Native for React Developers ผู้เรียนทำงานกับโปรเจกต์ Android และ iOS โดยตรง เขียน Turbo Native Module และ Fabric Native Component ด้วย Kotlin และ Objective-C++ เอง ตั้งค่า Push Notification และ Deep Linking ในโปรเจกต์เนทีฟ และ Build กับส่งแอปขึ้น Store ด้วย Gradle, Xcode และ fastlane เหมาะกับทีมที่มีโค้ดเนทีฟเดิมหรือต้องควบคุมขั้นตอน Build เอง
Turbo Native Module คืออะไร และต่างจาก Native Module แบบเดิมอย่างไร
Turbo Native Module คือวิธีเขียนโค้ดเนทีฟให้ JavaScript เรียกใช้ใน New Architecture โดยเริ่มจากเขียน Spec เป็น TypeScript แล้วให้ Codegen สร้างโค้ดเชื่อมต่อแบบมีชนิดข้อมูลให้ทั้ง Android และ iOS จากนั้นจึงเขียนส่วนที่ทำงานจริงด้วย Kotlin และ Objective-C++ การเรียกผ่าน JSI ทำได้โดยตรงโดยไม่ต้องส่งข้อมูลผ่าน Bridge แบบเดิม และโหลดโมดูลเมื่อต้องใช้ ตั้งแต่ React Native 0.82 แอปทำงานบน New Architecture เท่านั้น โมดูลใหม่จึงควรเขียนแบบนี้
ทำ Push Notification ในแอป React Native CLI ต้องเตรียมอะไรบ้าง
ต้องมีโปรเจกต์ Firebase สำหรับ Firebase Cloud Messaging และ APNs Key จากบัญชี Apple Developer สำหรับ iOS ติดตั้ง React Native Firebase ในโปรเจกต์ ขอสิทธิ์แจ้งเตือนจากผู้ใช้ ซึ่งบน Android 13 ขึ้นไปต้องขอสิทธิ์ POST_NOTIFICATIONS เอง แล้วรับ Token ส่งไปเก็บที่เซิร์ฟเวอร์ และเขียนตัวจัดการข้อความทั้งตอนเปิดแอปและตอนทำงานเบื้องหลัง ควรทดสอบบนมือถือจริงเพราะ iOS Simulator ไม่รับ Push จริง
หลักสูตร Advanced React Native CLI เหมาะกับใคร ต้องมีพื้นฐานอะไรมาก่อน
เหมาะกับนักพัฒนา React Native ที่สร้างแอปด้วย React Native CLI ได้แล้ว ทีมที่ต้องเชื่อมแอปกับโค้ด Kotlin หรือ Swift เดิม และนักพัฒนา Android หรือ iOS ที่ทำงานร่วมกับทีม React Native ควรทำ Navigation, State และเรียก API ได้ เขียน TypeScript ได้คล่อง เคยเปิดโปรเจกต์ใน Android Studio หรือ Xcode และใช้ Git ได้ ถ้ายังไม่เคยใช้ React Native CLI แนะนำหลักสูตร Basic React Native for React Developers ก่อน
เรียนจบหลักสูตร Advanced React Native CLI แล้วทำอะไรได้บ้าง
เขียน Turbo Native Module และ Fabric Native Component แล้วแพ็กเป็นไลบรารี วัดและปรับประสิทธิภาพแอปด้วยเครื่องมือ Profiler ทำแอปแบบ Offline-first รับ Push Notification ผ่าน FCM และ APNs ทำ Local Notification และ Deep Linking เขียน Unit Test และ E2E Test ตั้งค่า Build Variant สร้าง Signed Release และ Pipeline ส่งแอปขึ้น Google Play และ App Store ด้วย fastlane ได้ ผู้ผ่านการอบรมได้รับใบประกาศนียบัตร (Certificate of Completion) ที่มีเลขที่ของตัวเองและตรวจสอบออนไลน์ได้
จัดอบรมหลักสูตร Advanced React Native CLI ให้ทีมในองค์กรได้ไหม
ได้ หลักสูตรนี้จัดเป็นการอบรมแบบ In-house ให้ทีมในองค์กรได้ และปรับตัวอย่างให้ตรงกับงานของทีม เช่น ฝึกเขียน Native Module จากโค้ดเนทีฟที่ทีมมีอยู่ หรือวาง Pipeline ให้ตรงกับขั้นตอนการออกเวอร์ชันของแอปที่ทีมดูแล ขอใบเสนอราคาได้จากหน้านี้ หรือติดต่อทาง LINE @itgenius โทร 02-570-8449