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

มาตราฐาน RSS 2.0

สวัสดีครับ สําหรับทความนี้จะเกี่ยวข้องกับ มาตรฐานของ RSS 2.0 ก่อนอื่นมาดูตัวอย่าง xml ของ RSS 2.0 กันก่อน

Vue.js เริ่มต้น ตอน10 (Vuex)

Vuex คืออะไรVuex เป็นตัวช่วยจัดการ Data flow โดยปกติเวลาเขียนเว็บจะต้องมีการใช้งาน State หรือ Data ที่เก็บข้อมูลใน Component อยู่แล้ว ซึ่ง Vuex จะมาช่วยจัดการอะไรพวกนี้  ทําให้ Code ของเราเป็นระบบ และ ข้อมูลทั้งหมดจะไหลไปในทิศทางเดียวกันทั้งระบบ ลดการเขียน Code ซํ้าซ้อน

ติดตั้ง Nginx เพื่อใช้งานร่วมกับ Apache2

ในปัจจุบันมี web server อยู่สองเจ้าที่ได้รับความนิยมคือ apache2 และ nginx สองเจ้านี้จะมีขอดีข้อเสียงต่างกัน nginx จะมีข้อดีคือ สามารถรองรับ user concurrent และ request static file ได้ดีกว่า apache2 ส่วน apache2 มีข้อดีคือ PHP ซึ่ง PHP ของ nginx นั้น จะทำงานผ่านโมดูล FastCGI อีกทีหนึ่ง  ซึ่งจะได้ Performance ที่ช้ากว่า mod_php ของ apache2 ที่ทำงานแบบ


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

Build with ❤️ and Astro.

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