Category: Angular

1. Signals, effect, linkedSignal, toSignal เป็นมีสถานะเป็น stable แล้ว! 2. Zoneless mode เข้าสู่สถานะ developer preview (ไม่ต้องใช้ zone.js อีกต่อไป) 3. แนะนำใช้ control flow แบบใหม่ @if, @for, @switch แทน *ngIf, *ngFor, *ngSwitch แบบเดิมเพราะจะเอาออกแล้วใน v22 ครับ คำสั่งในการอัปเกรดอัตโนมัติ ng generate @angular/core:control-flow 4. รองรับ hot module replacement (HMR) ใน templates โดย เปิดใช้งานแบบ default 5. เพิ่ม type…

ถือเป็นการอัปเดตใหญ่ของ framework ตัวนี้เลยครับ โดยเฉพาะเรื่องของประสิทธิภาพ และเครื่องมือต่างๆ มาดูกันว่ามีอะไรใหม่บ้าง .1. มาพร้อมกับ Ivy compiler และ Ivy runtime ตัวใหม่และกำหนดเป็น default มาให้เลย แน่นอนทำให้ app ของเรา build ได้เร็วขึ้น มีขนาดเล็กลง และรันได้เร็วขึ้นกว่าเดิม (สำหรับ app เล็กๆ ขนาดลดลงราว 30% ส่วน app ขนาดใหญ่ ขนาดลดลงราว 25-40% เลยทีเดียว) .2. สำหรับคนที่เขียน unit tests ด้วย TestBed ในเวอร์ชันนี้ปรับปรุงการเขียน test ให้เร็วขึ้นกว่าเดิมราว 40% โดยที่ TestBed จะไม่ recomplie components ใหม่ทั้งหมดเหมือนเวอร์ชันเดิมครับ…

1. ใช้ TypeScript เวอร์ชัน 3.4 ล่าสุด . 2. เปลี่ยนวิธีเขียน lazy-loading แบบใหม่ (Routing) เพื่อรองรับการใช้งาน Ivy จะแก้โค้ดเองก็ได้ครับ แต่แนะนำให้ใช้คำสั่งอัปเดตจะดีกว่า (ดูข้อ 10) เพราะว่าตัว Angular CLI จะอัปเดตโค้ดส่วนนี้ให้อัตโนมัติเลย เดิม { path: ‘admin’, loadChildren: ‘./admin/admin.module#AdminModule’ } แบบใหม่ แก้เป็น { path, ‘admin , loadChildren: () => import(‘./admin/admin.module’).then(m => m.AdminModule) } . 3. Angular CLI 8 เปลี่ยนมาใช้ dart-sass แทน…

Angular 6 ตัวจริงออกมาให้ใช้ และอัปเดตกันแล้วครับ! รวมถึงเครื่องมือต่างๆด้วย ในเวอร์ชันนี้จะเป็น Long Term Support (LTS) ให้ใช้กันได้ยาวๆ มาดูกันว่ามีอะไรน่าสนใจบ้าง… . 1. เราสามารถสร้าง Custom elements ด้วย Angular Elements ได้ ดูรายละเอียดเพิ่มที่นี่ => http://bit.ly/2HPsn2M . 2. Ivy Renderer เป็น view renderer ตัวใหม่ ทำให้โปรเจคที่ build มีขนาดเล็กลง และแน่นอนทำให้เร็วมากขึ้น (ตอนนี้ ivy กำลังพัฒนาอยู่ น่าจะตัวจริงมาให้ใช้เร็วๆนี้ แต่ถ้าใครอยากลองทดสอบดูก่อน ก็สามารถเปิดใช้งาน ivy ได้นะครับ) . 3. เราสามารถสร้าง UI components ของเราเองได้โดยใช้ Component…

Angular CLI เป็นเครื่องมือแบบ command line interface ช่วยให้เราเขียน Angular ได้ง่าย และยังช่วยจัดโครงสร้างและโค้ดให้ถูกต้องตามหลักของ Best Practices อีกด้วย ถ้าใครจะเริ่มเขียน Angular ก็แนะนำให้ใช้ และศึกษาได้เลยครับ 🙂 . 1. ติดตั้ง Angular CLI (แบบ global) ด้วยคำสั่ง npm install -g @angular/cli . 2. ดู help ทั้งหมดของ Angular CLI ด้วยคำสั่ง ng help . 3. ดูเวอร์ชัน Angular CLI ด้วยคำสั่ง ng -v . 4….