Basic React Native (สำหรับผู้เริ่มต้น)

ภาพรวมหัวข้อการอบรม

Module 1: การเตรียมเครื่องมือและความพร้อมทั้งบน Mac และ Windows
Module 2: ทบทวนพื้นฐานการเขียน React.JS
Module 3: เริ่มต้นสร้างและทดสอบ React Native App
Module 4: การสร้างและทำงานกับ UI Core Component
Module 5: การสร้าง Navigation ระหว่างหน้าจอ
Module 6: การเข้าถึง API ของระบบ
Module 7: การทำงานกับกล้องถ่ายภาพและสแกนโค้ด
Module 8: การพัฒนาแอพเชื่อมต่อกับ Rest API

รายละเอียดหลักสูตร

Module 1: การเตรียมเครื่องมือและความพร้อมทั้งบน Mac และ Windows

แนะนำสเปกและคุณสมบัติเครื่องที่จะติดตั้งเครื่องมือสำหรับ React.JS / React Native
ขั้นตอนการติดตั้ง Node.JS
ขั้นตอนการติดตั้ง Visual Studio Code (VS Code) และส่วนเสริม (Extension) ที่จำเป็นสำหรับ React
แนะนำขั้นตอนการติดตั้งฐานข้อมูล MongoDB สำหรับไว้ทดสอบเขียนเชื่อมต่อกับ Node.JS สร้าง Rest API
การติดตั้ง React-Native CLI

Module 2: ทบทวนพื้นฐานการเขียน React.JS

รู้จัก React.js
แนะนำ JSX
แนะนำ React Component
การทำงานกับ Props
State ใน React
การใช้งาน React Router

Module 3: เริ่มต้นสร้างและทดสอบ React Native App

ภาพรวมการพัฒนาแอพด้วย React Native
การสร้างขึ้นโปรเจ็กต์ React Native ด้วย React-Native CLI
แนะนำโครงสร้างโปรเจ็กต์ React Native
การทดสอบรันแอพบน Emulator (Android/iOS)
การรันแอพทดสอบบนเครื่องจริง (Android)
การกำหนด StyleSheet
แนวคิดเกี่ยวกับการออกแบบ Responsive UI
หลักการทำงานกับ CSS Flexbox ร่วมกับ React Native

Module 4: การสร้างและทำงานกับ UI Core Component

การใช้งาน Component Alert
การทำงานกับ Component Text, Nested Text, Props, Style
ใช้งาน Component Button
การใช้งาน Component TextInput รับข้อมูล
ใช้งาน Component Switch สำหรับตัวเลือกรายการ
แสดงรูปภาพด้วย Component Image
เรียนรู้และใช้งาน Component ในกลุ่ม touchable
การใช้งาน Component Modal แสดง Popup
ใช้งาน Component ScrollView, FlatList และ SectionList
แนะนำการใช้งาน Iconicons

Module 5: การสร้าง Navigation ระหว่างหน้าจอ

รู้จักและติดตั้ง Library สำหรับทำ Navigation
การเปลี่ยนหน้าจอด้วย Stack Navigator
การปรับแต่ง Header Title
การส่งข้อมูลระว่างหน้าจอ
กากรสร้างและใช้งาน Bottom Tab Navigation
Module 6: การเข้าถึง API ของระบบ

การตรวจสอบขนาดหน้าจอ
ทิศทางการหมุนหน้าจอ
ตรวจสอบสถานะการเชื่อมต่อ Internet
การ link ไปยังแอปอื่นๆ
พิกัดและตำแหน่ง และการทำงานกับแผนที่ Google Map
การจัดเก็บข้อมูลด้วย AsyncStorage

Module 7: การทำงานกับกล้องถ่ายภาพและสแกนโค้ด

แนะนำ Library สำหรับตรวจสอบ Permission
การเลือกกล้องหน้า หลัง และการใช้แฟลช
การถ่ายภาพ
การถ่ายวิดีโอ
การสแกน Barcode และ QR code
การใช้งาน Library Image Picker

Module 8: การพัฒนาแอพเชื่อมต่อกับ Rest API

การขึ้น Project Node.jS + Express สำหรับสร้าง Rest API
การรับส่งข้อมูลระหว่าง Mobile App และ Web API Server
การแสดง Loading... ระหว่างโหลดข้อมูลจาก API
การส่งข้อมูลขาก Component ไปยัง Server
การติดต่อกับฐานข้อมูลฝั่ง Server
การสร้างรายการของ FlatList ด้วยข้อมูลจาก Server