Zero to Frontend Developer with Flutter + React



รายละเอียด


คอร์ส Zero to Frontend Developer with Flutter + React ถูกออกแบบมาเพื่อพาคุณเริ่มต้นจากศูนย์ไปสู่การเป็นนักพัฒนา Frontend ที่สามารถสร้างแอปได้จริงทั้งบน Mobile และ Web โดยใช้ Flutter และ React + TypeScript คุณจะได้เรียนตั้งแต่พื้นฐานการเขียนโปรแกรม การออกแบบ UI ไปจนถึงการจัดการ State และเชื่อมต่อ API เมื่อจบคอร์สคุณจะสามารถพัฒนาแอปได้ครบทั้งสองแพลตฟอร์ม พร้อมมีผลงานจริง เช่น E-commerce App และ Product Showcase Website สำหรับใช้ต่อยอดหรือสร้าง Portfolio ได้ทันที

> Outcome
- สร้าง Mobile App ด้วย Flutter ได้
- สร้าง Web App ด้วย React + TypeScript ได้
- เชื่อมต่อ API และจัดการข้อมูล JSON ได้
- เข้าใจ State Management ทั้ง Mobile และ Web
- มีผลงานโปรเจกต์ 2 ตัว (Mobile + Web)

> Structure
- Phase 1: Flutter (Week 1-8)
- Phase 2: React + TypeScript (Week 9-15)

*** Phase 1: Flutter (Mobile App) ***

Week 1: Introduction + Setup + Dart Basics
- Flutter คืออะไร และแนวคิด Cross-platform
- ติดตั้ง Flutter SDK และ Android Studio
- Dart Basics:
- Variables / Types / Functions
- Null Safety

Week 2: OOP + Collections
- class / constructor / inheritance / mixins
- List / Map / Set
- สร้าง Product Model

Week 3: Flutter UI Basics
- Widget Tree และ BuildContext
- Stateless vs Stateful Widget
- Text / Image / Icon / Container
- Button types ต่างๆ

Week 4: Forms + Layout
- TextField และ TextFormField
- Scaffold / AppBar / Drawer
- Snackbar / Dialog
- Row / Column / Padding / SizedBox

Week 5: Advanced Layout
- Expanded / Flexible
- Stack / Positioned
- ListView / GridView
- Card / ListTile / Divider
- Responsive ด้วย MediaQuery

Week 6: State Management
- setState
- Lifting State Up
- Provider:
- ChangeNotifier
- Consumer / context.watch / read

Week 7: Navigation + API
- Navigator (push / pop / replace)
- Named Routes
- HTTP GET / POST
- JSON:
- jsonDecode / fromJson / toJson
- FutureBuilder

Week 8: Storage + Theme + Mini Project
- SharedPreferences
- cached_network_image
- Pull-to-refresh
- ThemeData / Dark Mode

- Mini Project:
- E-commerce App
- Product List + Search
- Product Detail
- Cart + Favorites

*** Phase 2: React + TypeScript (Web App) ***

Week 9: TypeScript Fundamentals
- TypeScript คืออะไร
- Types:
- string / number / boolean
- interface vs type
- Union Types
- Functions with Types
- import / export

Week 10: React Basics
- React และ Virtual DOM
- สร้างโปรเจกต์ด้วย Vite
- JSX / TSX
- Function Component
- Props และ children

Week 11: State + Events
- useState
- Event Handling
- Controlled Components
- Conditional Rendering
- List rendering (.map)
- Tailwind CSS basics

Week 12: Layout + Components
- Flexbox / Grid
- Responsive Design
- Reusable Components
- Props Variants
- clsx / cn

Week 13: API + Routing
- useEffect
- fetch / async await
- Axios
- Loading / Error Handling
- React Router v6
- Dynamic Routes

Week 14: Forms + Architecture
- Controlled vs Uncontrolled Form
- Form Validation
- React Hook Form
- Project Structure
- Separation of Concerns

Week 15: Final Project
- Product Showcase Website
- Home Page
- Product List
- Product Detail
- Contact Form
- Responsive + Dark Mode

# Projects

Project 1: Mobile App
- E-commerce App
- Product Listing
- Cart System
- Favorites
- Dark Mode

Project 2: Web App
- Product Showcase Website
- Responsive UI
- API Integration
- Form + Validation

# Tools & Tech
- Flutter
- Dart
- React
- TypeScript
- Tailwind CSS
- HTTP / REST API
- Django/Flask (Back-end)

<<<วันเวลาเรียน>>>

เรียนออนไลน์ผ่านไลฟ์ในกลุ่มเฟสบุ๊ค ทุกวันอาทิตย์บ่าย ยาว 15 สัปดาห์ เริ่มคลาสแรกวันอาทิตย์ที่ 17 พฤษภาคม 2569 และ เวลา 13.00-16.00 น. (ดูย้อนหลังได้เลยหลังจบไลฟ์)

<<<ค่าลงทะเบียนปกติ 3,960 บาท ลดให้พิเศษ! early bird 50% >>>

สำหรับ 50 คนแรกที่เห็นข้อความนี้เท่านั้น จ่ายเพียง 990 บาทเท่านั้น!
กดสมัครทางนี้ได้เลยจ้าาา
-----วิธีสมัคร------
1-กรอกข้อมูลตามแบบฟอร์มนี้ https://www.uncle-engineer.com/course/front-end-flutter-react > 2- โอนชำระผ่านบัญชีด้านล่างแล้วแนบสลิปสมัครแล้วกดส่ง > 3-รอรับอีเมลภายใน 24 ชั่วโมง
-----------------
ชำระค่าใช้จ่ายผ่าน…
บัญชี ออมทรัพย์ ธนาคารกรุงเทพ สาขา สยามพารากอน
ชื่อบัญชี: บริษัท คอนส์ โรโบติกส์ จำกัด
เลขบัญชี: <<<< 855-0-65158-5 >>>>
หรือ พร้อมเพย์ 0105561008411
ชื่อบัญชี: บริษัท คอนส์ โรโบติกส์ จำกัด

สอบถามข้อมูลเพิ่มเติมทางเพจ "ลุงวิศวกร สอนคำนวณ" https://www.facebook.com/UncleEngineer/ หรือไลน์แอด @uncleengineer

-------------------

ราคาปกติ:

3,960 บาท

ส่วนลดบุคคลทั่วไป ลด 75% เหลือ:

990 บาท



สมัครเรียนกรอกแบบฟอร์มทางนี้

กรอกข้อมูลแล้ว
จำเป็นต้องกรอก
กรอกข้อมูลแล้ว
จำเป็นต้องกรอก
กรอกข้อมูลแล้ว
จำเป็นต้องกรอก
กรอกข้อมูลแล้ว
จำเป็นต้องกรอก
กรอกรหัสส่วนลดแล้วกดตรวจสอบเพื่อดูราคาใหม่


วิธีการชำระเงิน
สรุปยอดที่ต้องโอน
ราคาตั้งต้น - บาท
ส่วนลด () - 0 บาท
ภาษีมูลค่าเพิ่ม 7% 0 บาท

ราคาสุทธิ - บาท
กรุณาโอนให้ตรงยอดนี้ทุกสตางค์ ระบบจะตรวจสลิปกับธนาคารอัตโนมัติ หากยอดไม่ตรงจะต้องรอแอดมินตรวจสอบด้วยตนเอง
โอนผ่านธนาคาร
บัญชี ออมทรัพย์ ธนาคารกรุงเทพ สาขา สยามพารากอน
ชื่อบัญชี: บริษัท คอนส์ โรโบติกส์ จำกัด
เลขบัญชี: 8550651585
กรณีสมัครหรือโอนชำระแล้ว​ ทางเพจไม่มีนโยบาย​คืนเงินให้แก่ผู้สมัคร​ เนื่องจากก่อนสมัครผู้สมัครได้ทำการตัดสินใจเป็นที่เรียบร้อยและเสร็จสิ้นแล้ว​ แต่ผู้สมัครสามารถเปลี่ยนไปเป็นคอร์ส​อื่นได้ที่ราคาเหมือนกันเท่านั้น
โอนผ่าน Promptpay
0-1055-61008-41-1 ชื่อบัญชี: บริษัท คอนส์ โรโบติกส์ จำกัด
Scan QR Code ผ่าน app ธนาคาร
อัพโหลดแล้ว
จำเป็นต้องอัพโหลด
สลิปต้องมี QR Code ระบบตรวจสอบกับธนาคารผ่าน QR Code บนสลิป
กรุณากดปุ่ม "แชร์สลิป" หรือ "บันทึกสลิป" ในแอปธนาคาร แล้วอัปโหลดไฟล์นั้น อย่าใช้วิธีแคปหน้าจอ เพราะมักได้ภาพที่ไม่ติด QR Code
หากสลิปของท่านไม่มี QR Code กรุณาทักเพจ ลุงวิศวกร สอนคำนวณ เพื่อให้แอดมินตรวจสอบให้