Cover image

Flutter EP.4 Project structure file flutter

31 May 2020

Share to:

สวัสดีครับ ใน EP.3 เราได้เรียนรู้ Widget ใน Flutter กันไปแล้ว สําหรับเนื้อหาต่อไปในบทความนี้จะเป็นเรื่องโครงสร้างไฟล์ใน Flutter ว่ามีอะไรบ้าง แต่ละไฟล์คืออะไร เราจะได้มาเรียนรู้กันครับ

เมื่อเราสร้าง Flutter Project ขึ้นมา ภายใน Project จะมี File และ Directory ที่ Flutter สร้างขึ้นมาให้เราตามรูปภาพดังนี้

Image

มาดูรายละเอียดของ File และ Directory กันครับ

android and ios

เป็น Directory ที่สําหรับเก็บไฟล์ที่เกี่ยวข้องทั้งหมดสําหรับ Android และ iOS โดยปกติเราจะไม่ค่อยเข้ามายุ่งในนี้เท่าไร แต่ในบางกรณีเราอาจจะต้องการเพิ่มเติมหรือแก้ไข Feature ในแต่ละ Platform ก็สามารถเข้ามาแก้ไขได้ในนี้

lib

เป็น Directory ที่สําหรับเก็บ Code ของ Application ของเราทั้งหมด ซึ่งเราสามารถสร้าง Directory ย่อยๆ เพื่อแบ่งเป็นส่วนได้ ตัวอย่างเช่น models, screens, services, utils, and widgets

pubspec.yaml

pubspec.yaml เป็น File พิเศษ มีไว้เก็บ Setting ของ Flutter ครับ ซึ่งภายในจะเก็บ app name, description, SDK version, dependencies ฯลฯ

test directory

เป็น Directory ใว้เก็บ Code สําหรับ Test Application เช่น Unit Test ต่างๆครับ

ไฟล์อื่นๆ (99.99% เราไม่จําเป็นต้องไปแก้ไขมัน)

  • .idea เป็น Directory สําหรับเก็บ File Setting ทั้งหมดของ Project ครับ

  • .gitignore เป็น File ignore ของ git ครับ

  • .metadata, .packages, pubspec.lock เป็น File ที่ถูกสร้างโดย Flutter และถูกใช้โดย Flutter

  • README.md เป็น Markdown file จะถูกใช้โดย git(Version control) เช่น git ส่วนใหญ่จะใช้เป็นการเขียนคําอธิบาย Repository ของ git ครับ

Directory ที่เราจะเข้าไปแก้ไขบ่อยๆก็คือ lib และ pubspec.yaml เนื่องจาก Code ทั้งหมดของ Application จะเก็บไว้ใน Directory lib ครับ

สําหรับเนื้อหาในบทความนี้ก็มีเพียงเท่านี้ครับ แล้วพบกันใหม่ EP หน้านะครับ ขอบคุณครับ

Suggestion blogs

การเขียน Regular expressions

Regular expressions คืออะไรRegular expressions คือรูปแบบของตัวอักษรที่ใช้คนหาข้อความใน string เช่น ถ้าต้องการหาข้อความที่เป็นตัวเลขติดกันสองตัวจาก string "test01 test1" ซึ่งเราจะสามารถค้นหาและดึงเอาข้อความที่เป็นตัวเลขติดกัน(01) ออกมาได้

Vue.js เริ่มต้น ตอน5 (ทําความรู้จักกับ Props)

หลังจากที่เราเรียนรู้ Component กันไปแล้ว ถ้ายังจํากันได้ภายใน Component มี Option ตัวนึงชื่อว่า Props ซึ่งมีหน้าที่ รับข้อมูลจากภายนอก Component เข้ามาใช้งานภายใน Component โดยจะรับข้อมูลผ่านทาง Attribute การใช้งาน Props สามารถใช้งานได้หลายรูปแบบ เราจะมาเรียนรู้ไปทีละแบบนะครับ

lsof ตรวจสอบการเปิดไฟล์ต่างๆ ใน linux

ถ้าต้องการดูว่า โปรแกรมที่เราสนใจ เปิดใช้งานไฟล์ไหนบ้าง หรือเปิด socket อะไรบ้าง สามารถดูได้ด้วยคําสั่งนี้


Copyright © 2019 - 2024 thiti.dev |  v1.41.0 |  Privacy policy | 

Build with ❤️ and Astro.

Github profile   Linkedin profile   Instagram   X profile   Youtube channel   Telegram   Email contact   วงแหวนเว็บ