ทุกวันนี้มีเทคโนโลยีการทำเว็บไซต์ออกมาใหม่มากมายครับ โดยเฉพาะอย่างยิ่งเทคโนโลยีที่เกี่ยวข้องกับ Javascript ไม่ว่าจะเป็นพวก Node JS, AngularJS (ที่พอรวมกับ Mongo DB แล้วกลายร่างเป็น MEAN Stack ได้อีก)
เทคโนโลยีใหม่ ๆ เหล่านี้ไม่ได้ใช้วิธีคิดเหมือนกับการเขียนเว็บด้วย PHP & MySQL ที่เราถนัดกันด้วย แต่ละเทคโนโลยีก็มีแนวคิดใหม่ ๆ เป็นของตัวเอง (เช่น jQuery จะวาง DOM ก่อน แต่ Angular JS จะวางข้อมูลก่อน) ทำให้ต้องใช้เวลาเรียนรู้เยอะกว่าการเปลี่ยนภาษาโปรแกรมมิ่งทั่วไปครับ
Angular JS คืออะไร
AngularJS เป็น Javascript Framework สำหรับทำเว็บแอพครับ ซึ่งพัฒนาขึ้นมาโดยพนักงาน Google และได้รับการสนับสนุน (หรือโฆษณา) โดย Google อย่างเป็นทางการ
ถ้าใครคิดไม่ออกว่า AngularJS มันมีไว้ทำอะไร ให้คิดถึง jQuery ครับ มันเอาไว้ทำหน้าเว็บที่มี Interactive ได้นั่นแหละ แต่อย่างที่บอกข้างต้นว่าแนวคิด 2 ตัวนี้ต่างกัน คือ AngularJS จะเน้นที่ข้อมูลก่อนแล้วค่อยมา DOM ส่วน jQuery จะเน้นที่ DOM ก่อนแล้วค่อยใส่ข้อมูล (DOM คือ แท็ก HTML ที่เราเขียนนั่นเอง)
ความสามารถ (Feature) หลักของ AngularJS
- 2 Ways Data Binding – Data Binding คือการผูกค่าของตัวแปร Javascript ไว้กับแท็ก HTML ในหน้าเว็บไซต์ เช่น เรากำหนด x = 4 ใน Javascript แล้วให้แสดงค่าของ x ออกมาที่แท็ก <input> บนหน้าเว็บไซต์ ถ้าในอนาคตเรามีการเปลี่ยนแปลงค่า x ด้วย Javascript ก็จะทำให้ตัวเลขในแท็ก <input> เปลี่ยนไปทันที
- ซึ่งพอเรียกว่า 2 Ways คือ เราเปลี่ยนค่า x ใน Javascript ค่าในแท็ก <input> ก็เปลี่ยน หรือถ้าเราพิมพ์เปลี่ยนตัวเลขในแท็ก <input> ค่าของ x ใน Javascript ก็เปลี่ยนไปด้วย โดยไม่ต้องเขียนโค้ดอะไรเพิ่มเลย (ถ้าเป็น jQuery เขียนกันหัวแตก)
- Directive – เราสามารถสร้างแท็กหรือ Attribute ใน HTML ใช้เองได้ เช่น <designil-admin-is-handsome>True</designil-admin-is-handsome> อะไรแบบนี้ครับ
- โดย AngularJS ก็ให้ Directive เป็น Attribute ที่ใช้บ่อย ๆ มาจำนวนหนึ่ง เช่น ng-app, ng-bind, ng-repeat etc. สำหรับวิธีใช้งานพวกนี้เดี๋ยวดูในคอร์สวีดิโอได้เลย
- Embeddable – AngularJS แบ่งการทำงานเป็น App ชัดเจน แต่ละ App จะไม่ตีกัน ทำให้ในหนึ่งหน้าสามารถมีหลาย App ทำงานพร้อมกันได้
- Vanilla Javascript – ตัว AngularJS เป็น Javascript Framework ไม่ใช่ jQuery Plugin เพราะฉะนั้นไม่ต้องใช้ jQuery ร่วมด้วยก็ได้ แต่ถ้าจะใช้ก็ได้เช่นกัน มันไม่ตีกันครับ อย่างไรก็ตาม เค้าแนะนำให้ใช้ตัวใดตัวหนึ่งเท่านั้น
แจกคอร์สวีดิโอสอน AngularJS ฟรีจาก Google
CodeSchool เป็นเว็บไซต์ที่ทำคอร์สวีดิโอสอนทำเว็บไซต์ / ทำแอพออกมามากมาย (แต่ผู้ใช้ต้องเสียเงินรายเดือน) ซึ่งนอกจากจะทำวีดิโอออกมาดี ฟังง่ายแล้ว ยังมีให้ลองเขียนโค้ดบนหน้าเว็บไซต์ตามโจทย์ แล้วตรวจนับคะแนนกันตรงนั้นเลย
ทาง Google ก็ใจดี จ่ายเงินให้ CodeSchool ทำคอร์สสอน Angular JS ออกมาให้เราเรียนกันฟรี ๆ ครับ สามารถสมัครสมาชิกเว็บไซต์ (ฟรี) เพื่อเก็บ Progress การเรียนได้ด้วย
คลิกที่นี่เพื่อเรียน Angular JS กับ CodeSchool ฟรี
ที่เอามาแนะนำนี่ก็เพราะแอดมินกำลังเรียนอยู่เหมือนกันครับ และจากที่เคยเรียนมาหลาย ๆ คอร์ส (ฟรี) กับ CodeSchool ได้ความรู้เยอะมาก
หรือใครอยากเรียนคอร์ส jQuery ก็มี คอร์สวีดิโอสอน jQuery ฟรีของ CodeSchool เช่นกันครับ ปัจจุบันจะเป็นบทความเท่านั้นแล้วนะครับ ไม่มีวิดีโอให้เราเรียนแล้วครับ
สำหรับคอร์สอัปเดตล่าสุด สามารถติดตามได้ผ่านทาง Coursera เลยนะครับ สอนวิธีเรียนออนไลน์ฟรี Coursera เรียนได้เรื่อยๆไม่เสียเงิน
ตัวอย่างคอร์ส AngularJS ฟรี จาก Coursera
- Single Page Web Applications with AngularJS
- Build Website with HTML, JavaScript, AngularJS, and React
Coursera เว็บไซต์รวมคอร์สสอนออนไลน์เนื้อหาระดับโลก เรียนแบบเริ่มต้นฟรี
สายชอบเรียนเก็บ Certificate ห้ามพลาด เรียนฟรีแบบเริ่มต้น เสียเงินหากต้องการใบประกาศณียบัตร
คอร์สเรียนมากกว่า 3000+ วิชา จากผู้สอนระดับโลก
ใครเรียนแล้วเป็นอย่างไร ติดตรงไหน มาพูดคุยกันใน เพจ Designil บน Facebook ได้เลยนะครับ
สามารถติดตามบทความแนวการศีกษาของเราได้ด้านล่างนี้เลยครับ
- รวม 10 เว็บไซต์เรียนเขียนเว็บฟรี หลักสูตร Web development
- 10 สุดยอดคอร์สเรียนออนไลน์เพื่ออาชีพในอนาคต
- 3 คอร์สออนไลน์เรียนฟรีจาก Google
บทความด้าน Coding อื่น ๆ
- Svelte คืออะไร? มาทำความรู้จัก Framework ตัวนี้กันเถอะ
- รวมเทคโนโลยีทำเว็บไซต์ ที่คนทำเว็บต้องรู้!
- React คืออะไร? ไขข้อสงสัยสำหรับมือใหม่ + แนวทางการหัด React ตั้งแต่เริ่มต้น
Designil ทำงานกันอย่างเต็มที่เพื่อสร้างคอนเทนต์ดีๆ มีสาระประโยชน์ให้กับผู้อ่าน สิ่งที่ทีมงานแนะนำทั้งหมดมาจากการค้นคว้าและทดลองใช้งานจริงหลายสัปดาห์ หากคุณชอบเนื้อหาแบบนี้และอยากสนับสนุนให้ทีมงานให้มีแรงสร้างคอนเทนต์ดีๆ ในอนาคต สามารถซื้อสินค้าหรือบริการผ่านลิงก์บนบทความของเราได้นะครับ บางลิงก์ทางทีมงานจะได้รับส่วนแบ่งเล็กน้อยโดยจะไม่เป็นการเพิ่มภาระค่าใช้จ่ายให้กับทางผู้อ่าน ขอบคุณสำหรับการติดตามครับ การทำงานของเรา
