พัฒนาแอพด้วย Flutter สำหรับผู้เริ่มต้น 7 ชั่วโมงเต็ม [FULL COURSE]
ฝัง
- เผยแพร่เมื่อ 29 พ.ค. 2024
- 🤝 สนับสนุนช่องด้วยการสมัครสมาชิก (Membership):
/ @kongruksiamofficial
🎯 ข้อมูลพื้นฐาน
- ใช้ Flutter version 1.22.3
- ใช้ Android Studio version 4.1
➤ ดาวน์โหลด Flutter เวอร์ชั่น 1.22.3 ได้ที่ :
docs.flutter.dev/development/...
🎓 คอร์สเรียน Udemy :
github.com/kongruksiamza/udem...
🛒ซื้อของผ่าน Shopee :
shope.ee/3plB9kVnPd
➤ ดาวน์โหลด Flutter SDK :
flutter.dev/
➤ ดาวน์โหลด Android Studio :
developer.android.com/studio
➤ ดาวน์โหลด Visual Studio Code :
code.visualstudio.com/
📌 โค้ดประกอบการสอน :
github.com/kongruksiamza/Flut...
🗒 เอกสารประกอบการสอน :
github.com/kongruksiamza/prog...
🕵♂ ติดตั้ง Package :
pub.dev/
🕵♂ API ที่เกี่ยวข้อง :
exchangeratesapi.io/
📌 ประกอบด้วยเนื้อหา :
0:00 - ทำความรู้จักกับ Flutter & Dart
12:15 - Flutter SDK (Windows)
24:16 - แก้ปัญหา Unable to find git in your PATH
30:20 - Android Studio
44:25 - Set Path Android SDK (Windows)
49:37 - Android Emulator
56:18 - ดาวน์โหลด Visual Studio Code
01:01:05 - สร้างโปรเจค Flutter
01:08:51 - ทดสอบรันโปรเจค
01:12:11- โครงสร้างโปรเจค
01:16:44- การเปลี่ยนชื่อแอพ
01:21:15- การเปลี่ยนไอคอนแอพ
01:34:48- รู้จักกับ Widget
01:44:41- เริ่มต้นใช้งาน Widget
01:53:45- Scaffold
02:04:19- เปลี่ยนสีของแอพ
02:09:16- Stateless Widget
02:17:56- Center Widget
02:21:44- กำหนดขนาดและสีข้อความ
02:24:34- นำภาพเข้ามาทำงาน (External)
02:27:30 - Column Widget
02:37:21 - Stateful Widget
02:46:33 - ปุ่มและไอคอน
02:55:30 - Event และ SetState
03:02:50 - กำหนด Event แบบฟังก์ชั่น
03:10:44 - กำหนดกลุ่ม Widget ใน List
03:21:45 - ListView Widget
03:28:09 - กำหนดรายละเอียดด้วย ListTile
03:33:15 - ListView Builder
03:39:06 - แอพเมนูอาหาร
03:49:37 - นำภาพเข้ามาทำงาน (Internal)
03:57:40 - กำหนด Event การเลือกเมนู
03:59:51 - รู้จักกับ Container Widget
04:06:21 - ใช้งาน Container Widget
04:17:52 - กำหนดระยะห่างด้วย Padding
04:27:08 - กำหนด Text Style
04:33:22 - Expanded Widget
04:40:45 - SizedBox
04:49:53 - สร้าง Widget ต้นแบบ
05:06:39 - รูปแบบตัวเลขเป็นสกุลเงิน
05:14:11 - Widget Lifecycle
05:30:21 - Asynchronous & Future
05:56:30 - รู้จักกับ API
06:10:13 - Exchange Rate API
06:15:52 - ติดตั้ง HTTP Package
06:18:33 - การดึงข้อมูลจาก API
06:32:20 - แปลง JSON เป็น Dart
06:38:04 - จัดการค่า NULL
06:44:48 - ดึงข้อมูลและจัดการค่า NULL
06:50:02 - Linear ProgressIndicator
07:00:52 - Future Builder
07:09:57 - แสดงข้อมูลจาก Snapshot
07:14:33 - แสดงอัตราการแลกเปลี่ยน
07:22:07 - ระบุฐานสกุลเงินเริ่มต้น
⏲ อัพเดต!!!
กรณีที่ไม่สามารถเรียกใช้งาน get http ได้
โค้ดเดิม
var url = "api.exchangeratesapi.io/lates...";
var response=await http.get(url);
ให้เปลี่ยนเป็น
var url = Uri.parse('api.exchangeratesapi.io/lates...
var response=await http.get(url);
⏰⏰อัพเดต (11/08/2564) ⏰⏰
ปัจจุบันไม่สามารถใช้งาน API (NoSuchMethodError The method '[]' was called on null.)
❌ api.exchangeratesapi.io/lates...
ให้เปลี่ยนไปใช้
✅ api.exchangerate-api.com/v4/l...
หรือดูขั้นตอนการแก้ปัญหาได้ที่คลิปนี้
👉 • Flutter | การแก้ปัญหาด...
📢 ติดตามข่าวสารของเราได้ที่ :
➤ Facebook : / kongruksiamtutorial
➤ TikTok : / kongruksiamstudio
➤ Instagram : / kongruksiamstudio
➤ Medium : / kongruksiam
#Flutter #Dart #Android
![พัฒนาแอพพลิเคชั่นด้วย Flutter 3.x | สำหรับผู้เริ่มต้น [FULL COURSE]](http://i.ytimg.com/vi/HnFf_cmPa8w/mqdefault.jpg)
ตอนนี้ช่อง www.youtube.com/@KongRuksiamTutorial
อัปเดตเนื้อหาพัฒนา Mobile Application ด้วย Flutter 3 (เวอร์ชั่นล่าสุด)
เข้าเรียนได้ที่ :
th-cam.com/play/PLEE74DyIkwEnR3qX2kfL6exYPp_qmVXOG.html&si=rJO6TFmV36wm3HXa
สุดยอดความละเอียด แทบจะจับเมาส์สอนกันเลยทีเดียว สุดยอดช่องความรู้ภาษาไทยช่องนึงเลยครับ
**สำหรับคนที่หาFolder toolsไม่เจอ**
ให้ไปที่ Tools -> SDK manager -> SDK tools
เเล้วกดเอา Hide obsolete packages ออก อยู่ขวาล่างจอ
จากนั้นลงAndroid SDK Tools(obsolete)
โฟลเดอร์toolsจะขึ้นมาเเล้วคับ
ขอบคุณมากครับ
ไปที่tools นี่ไปที่ตัวโปรแกรมมันปะครับหรือที่อื่นเพราะหาในtools แล้วผมไม่เจอคำว่าsdk manager
@@lex1818 ใช่ครับที่ตัว android
thanks
ขอแก้ให้นะครับ ถ้าอยู่หน้า Welcome to Android Studio ให้ไปที่ More Actions เลือก SDK Manager จากนั้นเลือก SDK Tools ติ๊ก Hide obsolete packages ออก อยู่ขวาล่างจอ จากนั้นลง Android SDK Tools(obsolete)
โฟลเดอร์ tools จะขึ้นมาเเล้วครับ
ขอบคุณความรู้ที่มอบให้ครับ จะตั้งใจนำความรู้ที่ได้ไปพัฒนาและศึกษาต่อครับ🙏
เนื้อหาดีมากๆเลยค่ะ ประทับใจมากกกกกกกกกกก
เนื้อหาดีมากขอบคุณครับ
เป็นกำลังใจครับ ทำได้ดีมากๆ
ขอบคุณครับ เป็นความรู้ที่ทรงคุณค่ามากครับ ขอบคุณมากครับ
ขอบคุณมากกกกกกกเลยคะ ช่วยหนูเขียน project ได้เยอะเลย
สอนได้ละเอียดและเข้าใจง่ายมากครับ ขอบคุณครับ
ดีมากเลยตรับสอนแล้วนำไปใช้จริงได้
สอนดีมากเลยครับอาจารย์
ขอบคุณมากๆเลยค่ะ สำหรับความรู้และข้อมูลต่างๆ เรียนคอร์สนี้จบแล้ว ตอนนี้กำลังจะไปเริ่มศึกษาเรื่องปูพื้นฐานภาษา Dart ต่อ จะพยายามเรียน flutter ให้ครบทุกคอร์สนะคะ ขอบคุณมากค่ะ
ขอบคุณมากๆๆๆที่สุดครับอาจารย์
ขอบพระคุณมากครับอาจารย์ ตอนนี้ ผม ทำ ปุ่ม บวก ลบ และ รีเซต บนแอปนับเลขได้แล้วครับ และ ยังสู้ต่อไป ขอบคุณมากครับ🙏🙏🙏🙏
โอ้โห เรียบเรียงเนื้อหาแหละอธิบายได้ดีมากครับผม ยินดีที่ได้รู้จักครับ
พี่คือผู้ช่วยชีวิต พน.หนูมีสอบflutter มานั่งดูแล้วเข้าใจมากๆ ขอบคุณมากจริงๆ
ขอบคุณมากๆนะครับ สำหรับความรู้ ตอนนี้กำลังทำผลงานติดพอร์ตไว้สมัครงานอยู่ คลิปของพี่ช่วยชีวิตผมได้เยอะมากๆ ทำต่อไปนะครับ ขอบคุณมากจริงๆ
ขอบคุณครับ สอนละเอียดทุกคลิป ชอบมากๆครับ
เรียนครบ 7 ชั่วโมงแล้วครับ ให้ความรู้ได้มากเลยครับ ขอบคุณมากๆครับ ^^'
ขอบคุณคับ สอนดีมากคับ คือ สอนแบบ คนไม่รู้ จาก ศูนย์ จริงๆ ดีมากเลยคับ สอนแบบนี้หลายๆคลิปนะคับ ใช้เวลานานไม่เป็นไรคับ
ความรู้เต็มๆชอบมากครับ
กุมภา 2565
ดูจบแล้ว ขอบคุณอาจารย์ที่่ทำคลิปสอน ♥
ดูยาวๆ มีความเข้าใจในการพัฒนาโปรแกรมด้วย ฟัตเตอร์มากขึ้น
ขอบคุณครับ ได้ความรู้อันยอดเยี่ยมครับผม ไม่มีความรู้ flutter มาก่อนสามารถทำตามได้ ครับ อธิบายละเอียดดีครับ แต่ ท้ายๆ ไปเร็ว นิด และอธิบายสั้นไปนิดครับผม ตรงสกุลเงินบางส่วนครับ แต่ก็เข้าใจครับ ขอบคุณครับ
สอนดีมากๆ ติดเรื่องเดียวเลย ฟลัสเตอร์
ขอบคุณมากนะคะ 🙏🏻
สอนดีมากจริง ๆ ครับ ทำเรื่องยากให้เข้าใจได้ง่าย
ขอบคุณมากครับ อยากให้มี Xamarin อีกตัวครับหาเรียนอยากมากครับ
พระเจ้า นี่แหละที่หามานาน ขอบคุณที่ทำคลิปดีดีออกมานะคะ
ขอบคุณมากค่ะ ไม่มีกั๊กเลย เราไม่ได้เรียนจบสายนี้มาเลยแต่มีโปรเจคในหัว อยากมีแอพและแพลตฟอร์ม (แนวช่วยเหลือสังคมและคุณภาพชีวิต)ถ้าศึกษาด้านนี่ไปเรื่อๆจะพบว่า บางช่อง บางคอร์สเรียนกั๊กแยกเป็นส่วนๆ บ้างก็ทำTool สำเร็จรูป จะไปแก้ไขอะไรก็ไม่ได้ เราก็ไม่มีตังไปจ้าง Dev หรือโปรเเกรมเมอร์ที่ไหน ถ้าทำสำเร็จจะมารีวิวน่ะค่ะ (น่าจะนานเลย^^!) ขอบคุณพี่ๆทีมงานมากๆค่ะ
ดีมากๆๆๆๆๆๆเลยครับ💕💕💕💕
สุดยอดครับอาจารย์
พี่คะๆ อยากให้ทำคลิปสอนทำ flutter integration_test ของฝั่ง QA ด้วยค่ะ เปิดแค่สมาชิกก็เอาค่ะ ขอแบบ Advance เลยค่ะ
อาจารย์ครับ dart รองรับ การทำงานแบบ overload constructor มั้ยครับ
สวัสดีครับ
ขอบคุณมากๆครับสำหรับการสอนดีๆ
ตอนนี้ผมสามารถสร้างแอฟได้แล้วครับแต่ตอนนี้ผมติดปัญหาอยู่ 1 อย่างครับ
คือผมอยากจะ Export ไฟล์ AAB จาก VSCode ครับ
ช่วยทำคลิปสอนได้ไหมครับ
ขอบคุณครับ
เข้ามาเรียน ดีมาก
ดูยังไม่จบ แต่มือนี่ สั่น อยากทำตามเลยทีเดียวครับ ขอบคุณครับ
ขอบคุณมากๆครับ
คือผมเป็นครู ได้รับมอบหมายให้สอนม.ปลาย เขียนโมบายแอปร้านค้า อยากให้พี่ๆแนะนำครับ ว่าควรใช้ภาษาอะไร Framework api สอนแบบไหนที่ไม่ยากเกินไป
🥰🥰🥰🥰 ขอบคุณมากๆนะค่ะ
ยอดเยี่ยมเหลือที่จะกล่าว ทุ่นการอ่านตำราไปได้มหาศาล เริ่มต้นจากง่ายไปหายาก จากพื้นฐานไปสู่ความซับซ้อนได้อย่างเข้าใจทะลุปรุโปร่ง
สอนดีมาก ๆ ครับ
ขอบคุณมากครับ
ตอนนี้android studio flamingo แล้วคะ มันเลยงงๆ
ขอวิธี install flutter ในระบบ MacOs ด้วยครับ
Thanks 😊
ขอบคุณครับจาร
ขอบคุณครับ
อทิบายเกี่ยวกับ initState หน่อยครับ และวิธีการใช้
ขอบคุณที่ทำคลิปสอนออกมาเยอะแยะเลยนะคะ สอนฟรีแต่การพูดการสอนดีกว่าคอร์สที่เคยลงเรียนไปอีกค่ะ5555
สำหรับใครแก้ pub finished with exit code 255 ไม่ได้ให้ไปที่ basicflutter\android\local.properties ต่อท้ายด้วย flutter.minSdkVersion=30
อย่าลืมลง JDK ด้วยนะครับ
ขอบคุณครับ งมตั้งนาน 🙏
สอนดีมากค่ะกำลังเรียนได้ 1:30 แล้วค่ะ
เรียนจบเรียบร้อย :)
ขึ้นตอน Set paht ใน โฟลเดอผม ไม่มี tools และ bin .Local\Android\Sdk ครับ แต่ check fluter doctor แล้ว
[√] Flutter (Channel stable, 3.13.9, on Microsoft Windows [Version 10.0.19045.3570], locale th-TH)
[√] Windows Version (Installed version of Windows is version 10 or higher)
[√] Android toolchain - develop for Android devices (Android SDK version 34.0.0)
[√] Chrome - develop for the web
[√] Visual Studio - develop Windows apps (Visual Studio Community 2022 17.7.6)
[√] Android Studio (version 2022.3)
[√] Connected device (3 available)
[√] Network resources
• No issues found!
แบบนี้ OK ไหมครับ
สวัสดีครับมีเรื่องอยากสอบถาม คือโหลดc++ มาแล้วแต่doctorก็ยังเช็คว่ายังไม่ได้โหลดนี่เป็นปัญหาที่ตรงไหนหรอครับ
สอนเข้าใจกว่าอาจารย์อีก😂
สอนดีมากจริงๆ ค่ะ มีการเตรียมการสอน และอธิบายละเอียด ตรรกะแม่น ตรงประเด็น ทำให้เข้าใจง่ายสุดๆ
คนสอนใจดีแบบนี้พร้อมสนับสนุนเต็มที่เลยค่ะ
นั่งทำตาม อาจารย์ตั้งนานไม่สำเร็จทำสองรอบก็ไม่สำเร็จ สรุปทำใน VMWARE ไม่ได้นะครับ emulate ไม่ขึ้น vmware ไม่รองรับ hyper-v
ระบบแจ้ง ปัญหา เยอะมากครับ อาทิ the function 'runApp' isn't defined ..../classes can only extend other classes ..../ เป็นต้น ไม่ทราบว่า จะต้องแก้ยังงั้ยครับ..
เยี่ยมครับแต่อยากให้อาจารย์เน้นเรื่อง Code Conventions หน่อยครับผม :)
Fc ครับ
ขอบคุณน่ะค่ะอาจารย์กำลังศึกษาอย่างตั้งใจค่ะ
เนื้อหาเข้าใจง่ายมากเลยครับ แต่อยากให้สอน ดึงข้อมูล ip เครื่องของuser แล้วนำไปเก็บไว้ตัวแปร หน่อยได้ไหมครับ
ขอบคุณครับจาน
อยากให้สอนลง flutter เวอร์ชั่น mac os บ้างครับ
ขอปุ่มกดไลท์ล้านรอบครับ คุ้มค่ากับความรู้ที่เรียน
เรียนจบ ผมสามารถรับปริญญากับพี่ได้มั้ยครับ
ขอบคุณที่ทำคริปดีๆนะคับถ้าผมประสบผลสำเร็จในอานาคด จะไม่ลืมพี่เลีย
ดีครับพี่
อาจารย์พึงเข้ามาเรียน มุมขวาบนมีคำว่า demo เอาออกอย่างไร
pub finished with exit code 66
พลาดที่อะไรครับ
ผมอยากรู้เรื่องง่ายๆแค่ว่าจะเอาแอพที่เขียนลงโทรสัพยังไงทำไมไม่มีใครสอนเลยอะครับ
ผมใส่โค๊ตเปลี่ยนสีธีมแล้วมันไม่ยอมเปลี่ยนสีแก้ไขยังไงดีครับ
ท่านอาจาร
สุดยอดช่องด้านโปรแกรมมิ่ง เยอะและละเอียดมาก แต่ติดนิดนึง อ่านออกเสียงภาษาอังกฤษไม่ค่อยถูก บางคำเป็นคำหลัก ทำให้ฟังแล้วขัดๆครับ ถ้าปรับจุดนี้ได้ จะ perfect เลยครับ
เห็นด้วยครับ เข้าใจว่าอาจารย์อ่านภาษาอังกฤษเข้าใจ แต่ออกเสียงผิด อาจทำให้ไขว้เขวสำหรับคนที่ฟังภาษาอังกฤษออก ไม่ได้ตินะครับ ติงเฉยๆ
สุดยอดมากครับเรียนเข้าใจง่ายมากครับ
C:\Users\Home\AppData\Local\Android\Sdk ไม่มี Folder Tools ต้องทำยังไงคะ สร้างเองได้เลยมั้ยคะ
พอผมรันมันขึ้นแบบนี้ครับ Launching lib\main.dart on Android SDK built for x86 in debug mode ต้องทำไงดีครับ
Macbook M1 รัน emulator ไม่ได้ ต้องแก้ยังไงบ้างครับ
really like this video from laos
มือใหม่หัดทำแอปครับกดติตามแล้วนะครับ
ขออนุญาติสอบถามค่ะ พอดีติดตั้ง vs code แต่ไม่สามารถ install extension อะไรได้เลยค่ะ
ขึ้นว่า ''check the log" อะค่ะ พอทราบไหมคะว่าต้องเข้าไปแก้ตรงไหน
แก้ได้ยังครับ..บอกหน่อย😁
ที่ cmd ต้องการรัน android-licenses แต่ขึ้นอย่างงี้ ต้องทำงัยคะ???
C:\Users\PC>flutter doctor --android-licenses
Android sdkmanager not found. Update to the latest Android SDK and ensure that the cmdline-tools are installed to
resolve this.
หมายเหต : ไม่เข้าใจ ensure that the cmdline-tools are installed to
resolve this. ค่ะ ต้องจัดดารที่ไหนอย่างไร??? ขอบพระคุณล่วงหน้าค่ะ
เรียบร้อยแล้วค่ะ...ไปติดตั้ง cmdline-tools ที่ sdkmanager ของ Android Studio ค่ะ
ผมไม่สามารถใช้คำสั่ง flutter doctor --android-licenses ได้ครับขึ้น Invalid จะต้องทำยังไงครับ
ใช้ database อะไรครับ
ของผมไม่มี foolder tool ทำไงครับ
ถ้าไม่มีความรู้เลย ฝึก Flutter เลยได้ไหมครับ
อยากได้วิธี set เครื่อง mac คับ😭
หัวจะระเบิด
อยากโอนไปเงินไปส่นับสนุนช่อง ทำยังไงได้บ้างครับ
The emulator process for AVD Pixel_4_API_30 has terminated. ผมรัน ADV manager แล้วฟ้องแบบนี้ต้องแก้ไขยังไงครับ
รับทำ แอพพลิเคชั่นไหมครับ
ของผมขึ้น fatal not a git repository (or any of the parent directories) .git
ทำไมปี 2022 นี้เคื่องมืต่าง update เป้น version ใหม่หมดแล้ว ม้นไม่ตงกับ วีดีโอของพี่เลีย
ผมีคำถามเกี่ยวกับ syntex ครับ เคยเจอแต่ไม่รู้ว่ามีความหมายยังไง เช่น String? name, Int? number มันมีความหมายว่าอะไรครับ
th-cam.com/video/nQ8yODH3Zl8/w-d-xo.htmlsi=32tht5OOUYc-xIYT หัวข้อ Null Safety ครับผม
อยากให้ทำวิธีส่งแบบ POST ด้วยจังเลยครับ
ปรกติจะ เป็นแบบ RestFull
ตรงที่เอารูปเมนูอาหารเข้าไป มัน Error throw error ไปต่อไม่ถูกเลยครับ
ตอนลองรันครั้งแรกตามอาจารย์ ใน Emulator ของผม App Flutter มันไม่ขึ้นครับ
ตอน ใช้คำสั่ง flutter doctor --android-licenses มันขึ้นสีแดงว่า Android sdkmanager not found. Update to the latest Android SDK and ensure that the cmdline-tools are installed to
resolve this. ครับทำไง
หาวิธีแก้ด้วยครับเป็นเหมือนกัน
ใช้พื้นที่ ฮาร์ดิสไปเยอะ ต้องล้างเครื่องใหม่ windows ใหม่ พื้นที่ไม่พอ
สอบถามครับ พอดีผมติด error ตรงไฟล์ ExchangeRate อะครับ ที่บรรทัด
date: json["date"] == null ? null : DateTime.parse(json["date"]),
error แจ้งว่า The argument type 'DateTime?' can't be assigned to the parameter type 'DateTime'.
กับบรรทัด rates: json["rates"] == null ? null : Map.from(json["rates"]).map((k, v) => MapEntry(k, v.toDouble())),
error แจ้งว่า The argument type 'Map?' can't be assigned to the parameter type 'Map'.
มีวิธีแก้มั้ยครับ
ผมก็ติดครับ แก้ยังไงครับ