AngularJS part:4 สรุป

จากการใช้งานที่ผ่านมา ผมว่าปัญหาใหญ่ที่สุดคือ doucument ที่ครอบคลุมการทำงานทั้งหมด และตัวอย่างที่ชัดเจน แต่อาจจะเป็นเรื่องยาก เพราะแค่ data-ng-repeat ยังมีวิธีเขียนที่หลากหลายมาก (วิธีที่ผมเรื่องใช้ คืออันที่ผมเข้าใจได้ง่ายที่สุด ซึ่งผมค้นไม่เจอจาก document !!! omg!!!) และเงื่อนไขบางอย่างเช่น การเขียน if cause ใน directive {(cause)?true:false} ซึ่งต้องเขียนแบบไม่มี space เป็นต้น

ในการค้นข้อมูลจะเห็นว่า ทุกคนระบุว่า Angular ยาก learning curve ชัน ซึ่งผมกลับมองว่า ต้องโทษความไม่ชัดเจนของ document (อาการเดียวกับที่ผมเจอ document ของ microsoft)

AngularJS part:3 การใช้งานจริง

การพัฒนาโปรแกรมไม่ควรต้องเขียนงานซ้ำๆ แต่ควรเป็นการใช้ module หรือ function กลางที่สามารถนำกลับมาใช้ใหม่ได้ ฉะนั้น การแยกองค์ประกอบให้เป็นอิสระต่อกันจึงเป็นสิ่งที่สำคัญมาก
คราวนี้เรามาลองดูว่า AngularJS ทำแบบนั้นได้หรือไม่

Continue reading

AngularJS part:2 แนะนำโครงสร้าง

มองคร่าวๆ AngularJS จะประกอบไปด้วย app, controller, directive, service ซึ่งสามารถระบุขอบข่ายของมันได้ดังนี้

  1. app : คือ ตัวหลักที่จะประกอบด้วย controller, directive, service อีกที และรวมไปถึง component อื่นๆ เช่น dateTimePicker เป็นต้น
  2. controller : คือ ส่วนที่เก็บตัวแปรร่วม $scope รวมถึง function ต่างๆตาม event
  3. directive : คือ ส่วนแสดงผล (ซึ่งสามารถ มี controller ภายในนี้ได้ ซึ่งมีประโยชน์มากในกรณีต้องการแยก element เพื่อ re-usable)
  4. service : คือ ส่วนของ function (ส่วนนี้จะมีประโยชน์มากถ้าต้องใช้บ่อยๆในหลายๆ directive)
  5. component : อันนี้คล้ายๆ directive ( ตาม document ของ angular https://docs.angularjs.org/tutorial/step_03 )

คราวนี้มาลองเขียน code ง่ายๆเพื่อดูการใช้งานของมันดีกว่า testAngular.html

Continue reading

AngularJS part:1 installation

หลังจากได้ทดลอง React ก็พบว่า แนวคิดน่าสนใจมาก แต่ติดอยู่ที่ ต้องลงผ่าน NodeJS (npm) และต้อง compile ก่อนการใช้งาน ซึ่งผมรู้สึกว่า ยากต่อการ debug ก็เลยลองค้น JavaScript framework ในกลุ่มเดียวกันคือ AngularJS และ Vue ซึ่งทั้งสองอัน ไม่ต้อง compile ทั้งคู่ Vue ติดอยู่ที่ ไม่มี dateTimePicker ซึ่งต้องใช้มาก ผมเลยไปจบที่ AngularJS ซึ่งต้องยอมรับว่า ถอดใจไปหลายครั้ง เพราะรู้สึกว่า ทำหลายๆอย่างไม่ได้ … แต่สุดท้ายกลับพบว่า มันสามารถทำได้ ซึ่งต้องโทษ document ของ website หลัก ที่ไม่มี document ที่ครอบคลุมสิ่งเหล่านั้น

หลังจากบ่นไปเรื่อยเปื่อย ก็เข้าเรื่องกันเลยดีกว่า เริ่มต้นจากการ install เลยก็แล้วกัน

Continue reading