มีอะไรใหม่ใน Angular 11 และอะไรกำลังจะมา (What’s new, What’s next in Angular 11)
Original Link: https://perjerz.netlify.com/post/th-what-new-in-angular-11 (soon)
ในบทความนี้จะบอกคุณเกี่ยวกับ
- การออก Version ใหม่ใน Angular
- ของใหม่ใน Angular 11 (New) ที่น่าสนใจ
- ของที่กำลังจะมา (Coming soon) ที่น่าสนใจ
มาเริ่มกันเลย
การออก Version ใหม่ใน Angular
ขณะนี้เป็นเวลา 4 ปีแล้วครับที่ Angular อยู่กับเรามาและในวันที่ 14 กันยายนเป็นวันคล้ายเกิดของ Angular
แฮปปี้เบิร์ดเดย์ย้อนหลังนะแองกูล่า 🅰️🎂🎉🥳
Angular 2.0 ถูก Release ในวันที่ 14 กันยายน 2014 โดยการ Release ถูกแบ่งเป็น 3 ส่วนคือ major.minor.patch
เช่น เวอร์ชั่น 7.2.11 หมายถึง
- Major Version 7 — หมายถึงการเปลี่ยน Version ที่มีฟีเจอร์ใหม่ โดยที่พวกเราต้องรัน Script บางอย่าง, แก้ Code, ทดสอบ(Test) และเรียนรู้ API ใหม่
- Minor Major 2 — หมายถึงการเปลี่ยน Version ที่มีฟีเจอร์ใหม่ขนาดเล็กถูกพัฒนาเพิ่มเข้าไปมี Backward Compatable แก้ Code เล็กน้อยเพื่อใช้ API ใหม่
- Patch level 11 — หมายถึงการเปลี่ยน Version ที่แค่แก้บัค ไม่ต้องแก้ไข Code
Preview releases
Angular จะปล่อย Preview อะไรที่กำลังจะมาโดยแบ่งเป็น 2 ประเภทคือ Next และ Release Candidates (rc
) สำหรับ Major และ Minor Release โดย
- Next — อยู่ระหว่างการพัฒนาและทดสอบโดย tag ต่อท้ายด้วย
-next
เช่น8.1.0-next.0
- Release candidate — Feature สมบูรณ์อยู่ในช่วงทดสอบสุดท้ายโดย tag ต่อท้ายด้วย
-rc
เช่น8.1.0-rc.0
Document ล่าสุดของ Versionnext
หรือrc
อยู่ที่ next.angular.io.
Release Cycle
- ทุก 6 เดือน Major Version จะถูกอัพเดท
- มี 1–3 Minor Version สำหรับ Major Release
- Patch release และ pre-release (
next
orrc
) ถูกปล่อยเกือบทุกสัปดาห์
Support policy and schedule
มาพูดถึงการ Support แก้บัคต่างๆกันบ้าง
ทุก Major release ถูกดูแลเป็นเวลา 18 เดือน
- 6 เดือนแรก จะเป็น active support จะเป็นการออก updates and patches ปกติ
- 12 เดือนต่อมาจะเป็น long-term support (LTS) โดยแก้บัคเฉพาะช่องโหว่ความปลอดภัยหรือ Regression ที่เกิดจาก 3rd Party เช่น Browser ออก Version ใหม่
Angular versions ^4.0.0, ^5.0.0, ^6.0.0 and ^7.0.0 ไม่ได้ถูก Support แล้ว
จากตารางจะเห็นได้ว่า Version 8 จะหมด LTS ในวันที่ 28 พฤศจิกายนี้ต้องรีบอัพกันแล้วนะครับ ไม่ต้องพูดถึง 4,5,6,7 หมด LTS ไปนานแล้ว
ในขณะที่ทุกท่านกำลังเขียนโค๊ดกันอยู่ Hacker ก็ทำงานอยู่เหมือกันครับ คือหาช่องโหว่ ซึ่ง Hacker อาจเจอช่องโหว่ใน Dependency เก่าๆที่ Angular ใช้แล้วโจมตีทำให้ Web Application หรือธุรกิจท่านเสียหายได้
อ่านข้อมูลเพิ่มเติมได้ที่ Angular — Angular versioning and releases
ของใหม่ใน Angular 11 (New)
TypeScript
TypeScript 4.0 เวอร์ชั่นเกือบล่าสุดมาแล้ว Version 4.0 นี้มีฟีเจอร์ที่น่าสนใจเช่น
- Variadic Tuple Types (Variadic แปลได้ประมาณว่ารับได้หลายตัวๆ)
Variadic — Wikipedia กล่าวคือตอนนี้ ใช้ Spread (…) กับ Generic ได้
ที่เมื่อก่อนต้องเขียน Overload กันเหนื่อย - Labeled Tuple Elements ตั้งชื่อใน Tuple ได้
- unknown on catch Clause Bindings
ทำให้ e ใน catch เป็น unknown แทน any เพื่อสร้างความเข้มงวดโดยให้เราไป type narrowing ใน runtime
- Short-Circuiting Assignment Operators
&&=
,||=
, and??=
เหมือน += -=
- /** @deprecated */ Support
support/** @deprecated *
JSDoc comment แล้วขีดฆ่าให้ด้วย
- Convert to Optional Chaining
และฟีเจอร์อื่นๆ
อ่านต่อได้ที่ TypeScript: Documentation — TypeScript 4.0 (typescriptlang.org)
ส่วน TypeScript 4.1 เพิ่ง merge ไปสดๆร้อนๆ รอออ Release Version ต่อไป
Angular CLI
- Angular Team เคลมว่า build ngcc ทุกครั้งที่เรา npm install (แปลง Code Libray ViewEngine เป็น Ivy Compatable) ได้เร็วขึ้น 2–4x faster และ Compile เร็วขึ้นด้วยความสามารถของ TypeScript 4.0
- ตอน ng serve port ถูกใช้แล้วหรอ? ปัญหานี้จะหมดไปเพราะ Angular CLI จะถามว่าใช้ port อื่นแทนไหม
- หลัง ng build เสร็จรายงานผลลัพธ์ของ Chunks ไฟล์แบ่งประเภท จัดตารางให้อ่านง่ายขึ้น
Lint
- Lint, Linter — static code analysis tool used to flag programming errors, bugs, stylistic errors, and suspicious constructs — Wikipedia ง่ายคือเป็นเครื่องมือไว้หา error ใน code เพราะมนุษย์ทำงานผิดพลาดได้
ใช้คอมพิวเตอร์หรือโปรแกมหาความผิดพลาดให้เราดีกว่าซึ่ง Angular Team กำลังจะเลิกใช้ TSLint
ซึ่ง TSLint จะ deprecated แบบสุดแล้วธันวาคมนี้
- ในอนาคตดูเหมือนว่า Angular Team จะไม่ Default ลง Linter มาให้โดยให้ User ไปเลือกลง Lint ใช้เอง แต่ตอนนี้แนะนำให้ไปใช้ @angular/eslint
angular-eslint/angular-eslint: Monorepo for all the tooling related to using ESLint with Angular (github.com)
Hot Module Replacement(HMR)
แก้โค๊ดเท่าไหน Build ใหม่แค่ Component นั้นๆ ใน Development หลายคนน่าจะเบื่อเวลาเราแก้ Code แล้วต้องรอให้ CLI Build Project ขึ้นมาแล้วหน้าจอก็จะ Refresh (Live Reload) จะเห็นภาพชัดมากๆในโปรเจคขนาดใหญ่ที่ Build นานมาก (ทำ Lazy Load ช่วยได้เช่นกัน) แต่ด้วยเทคโนโลยี Hot Module Replacement จะช่วยให้คุณไม่ต้องเสียเวลารอ Refresh ทั้งหน้า โดยที่ตรงที่คุณแก้จะถูกแก้ไขแค่ส่วนนั้น
ดูตัวอย่างได้ที่ Using HMR in Angular 11 — YouTube
โดยที่สมัยก่อนถ้าหากคุณจะใช้ HMR รูปภาพด้านบนคือ Code ที่คุณต้องเพิ่มและแก้ลงไปเพื่อใช้งาน HMR ซึ่งก็ทำให้หลายๆคนขี้เกียจ Setup (หนึ่งในนั้นคือผม)
ด้วยพลังแห่ง Angular CLI 11 เพียงใช้คำสั่งด้านบนปสามารถใช้ HMR ได้เลย
Trusted Type
Trusted Type คือเครื่องมือที่จะมาช่วยป้องกันดักจับ DOM XSS (DOM Cross-site scripting) ซึ่ง DOM XSS คือช่องโหว่ความปลอดภัยติด OWASP 10 ที่เกิดขึ้นจากการที่ User ที่ใช้ Browser ส่งค่าอะไรบางอย่าง (ข้อความ input, URL จาก fragment #) เข้ามาที่ Browser เพื่อ Parse (เช่นeval()
function เค้าถึงไม่แนะนำให้ใช้กัน, set .innerHTML
)แล้ว Browser มันไปรัน JavaScript ที่ไม่พึงประสงค์ได้
ยกตัวอย่างเช่น เราสร้าง What You See Is What You Get (WYSIWYG)
แล้วมี Hacker ส่งข้อความมาให้เรา บอกให้เราไปสร้างบทความนี้ให้หน่อย ซึ่งส่วนใหญ่ข้อความจะเป็น HTML เพราะใส่สีจัดตัวหนาได้ ข้อความนั้นยาวมาก เราไม่ได้ดูละเอียด โดยที่เค้าแอบฝัง Script บางอย่างลงไป <script>send me your all local storages</script>
ซึ่งเราก็กดปุ่มสร้างบทความ ซึ่งระบบนั้นอาจจะมีการ Preview ข้อความนั้นขึ้นมาโดยการ Parse HTML นั้นด้วยคำสั่ง .innerHTML = ข้อความมะกี๊ที่มี script แฝง
โดยปราศจากการ Sanitization นำ script พวกนั้นออกก่อน
LocalStorage ของเราก็จะถูกส่งมาให้ Hacker นั้นทันที หรือถ้าแย่กว่านั้นระบบนี้เก็บข้อความนี้ไว้ใน Database โดยที่ไม่ได้ Sanitize แล้วมี User คนอื่นเข้ามาดูบทความนี้โดยที่หน้าแสดงบทความก็ยังคงต้องใช้ innerHTML = ข้อความนั้น
ก็โดนขโมย LocalStorage เหมือนกัน
แล้ว Trusted Type เข้ามาช่วยยังไง กล่าวคือเมื่อ Browser เปิดฟีเจอร์นี้ Developer จะไม่สามารถanElement.innerHTML = 'ข้อความนั้นแล';
ได้ตรงๆอีก Browser จะฟ้อง Error
สิ่งที่ต้องทำก็คือไปครอบข้อความนั้นผ่าน Trusted Type ก่อนถึงจะสามารถใช้ข้อความนั้นได้ พูดง่ายคือใช้ Type System ป้องกัน XSS เข้าไป
if (window.trustedTypes && trustedTypes.createPolicy) { // Feature testing
const escapeHTMLPolicy = trustedTypes.createPolicy('myEscapePolicy', {
createHTML: string => string.replace(/\</g, '<')
});
}const trustedHTML = escapeHTMLPolicy.createHTML('ข้อความที่มี Script');
console.log(escaped instanceof TrustedHTML); // true
el.innerHTML = trustedHTML; // '<img src=x onerror=alert(1)>' // ผ่าน
โดยที่ Trusted Type นั้น Support Chrome 83+ Version เก่ากว่านั้นต้องใช้ polyfills
สามารถติดตามสถานะได้ภาพด้านล่าง
ปกติเวลาเรา binding เช่น [href], [innerHTML]=
, interpolation {{}}
Angular จะ escape หรือ sanitize ให้อยู่แล้ว แต่มี
กรณีที่เราบอกเฮ้นาย Angular ไว้ใจค่าที่เราส่งไปได้ไม่ต้อง Sanitize นะ
abstract class DomSanitizer implements Sanitizer {
abstract bypassSecurityTrustHtml(value: string): SafeHtml
abstract bypassSecurityTrustStyle(value: string): SafeStyle abstract bypassSecurityTrustScript(value: string): SafeScript abstract bypassSecurityTrustUrl(value: string): SafeUrl
abstract bypassSecurityTrustResourceUrl(value: string): SafeResourceUrl
}
เช่นกรณีก่อน upload รูป เราต้องการ Preview รูปนั้นก่อนซึ่งต้อง this.previewImage = URL.createObjectURL(event.target.files[0]);
แล้วเราจะได้ blob:http//somewhere.com/abcdefg
ที่ต้องไป binding กับ <img src=previewImage />
ซึ่งถ้าเราไม่ bypassSecurityTrustResourceUrl
Angular จะงงมันคืออะไรไอไม่เข้าใจต้องเป็น SafeResourceURL (extends จาก SafeValue) ใน console log มันจะแจ้ง
WARNING: sanitizing unsafe URL value blob:https://angular-blob-to-safe-url.stackblitz.io/a3b12df3-a1fe-4672-9f35-b3a857589dcc (see http://g.co/ng/security#xss)
แล้วถ้าไปดู image src จะพบว่ายังเป็น unsafe:blob:https://angular-blob-to-safe-url.stackblitz.io/a3b12df3-a1fe-4672-9f35-b3a857589dcc (see http://g.co/ng/security#xss)
ทำให้รูปไม่ขึ้น
สรุปแล้ว Angular ไปเกี่ยวไงกับ Trusted Type ผมเข้าไปอ่าน Source code แล้วพบว่าหลังจาก Sanitize เสร็จแล้วจะทำการ wrap Trusted Type ซึ่งถ้าวันนึง Browser เปิด Trusted Type default เราก็ไม่แทบต้องทำอะไร ใช้งานได้ปกติ
อ่านรายละเอียดเพิ่มเติมได้ที่ Angular — Security
ของที่กำลังจะมา (Coming Soon)
Angular DevTools
Chrome Extension ใน Chrome Dev Tools พัฒนาโดยทีม Rangle กับ Angular Team โดย Minko Gechev (Software Engineer at Google) ออกมา Sneak Peek ให้ดูในงาน NG Rome ซึงรายละเอียดที่เปิดเผยออกมาคือมันถูกพัฒนาต่อยอดมาจาก Angular Augury (rangle.io) ที่เอาไว้ debug Angular ซึ่งอัพเดทล่าสุดเมื่อธันวาคม 2019 ผมเคยใช้แล้วรู้สึกเฉยๆ ดูในโค๊ดเอาเองดีกว่า แต่คิดว่าก็เหมาะไว้ดูภาพรวม Project ได้ ซึ่งตัว Angular DevTools ที่ออกใหม่นี้ความเจ๋งที่เพิ่มเข้าไปคือสามารถ Profiling ดู Change Detection Cycle ได้เหมาะกับ App ที่ต้องการ Optimize Performance
ตอนนี้อยู่ใน Stage Prototype ยังไม่ได้กำหนดวันปล่อยของ รอต่อไป
Experimental Webpack 5 Support
เปิดให้ลองใช้ Webpack 5 ได้เป็นแบบ Opt-in วิธีการคือใส่คำสั่งนี้ลงใน package.json
"resolutions": {
"webpack": "5.4.0"
}
ถ้าใช้ yarn ก็ใส่คำสั่ง yarn
แล้ว ng build --prod
ได้เลย
ถ้าใช้ npm ต้องลง npm-force-resolutions
เพื่อล็อค Version Transitive Dependency (Dependency ของ Dependency) ที่เราระบุใน Resolutions
npm install -D npm-force-resolutions
แล้วใส่คำสั่งข้างล่างลงใน package.json แล้ว npm i
จะใช้ได้
...
"preinstall": "npx npm-force-resolutions",
...
Webpack 5 เคลมตัวเองว่าดีขึ้นยังไงบ้าง
- Build เร็วขึ้นด้วย persistent caching
- ปรับปรุง long term caching ด้วย algorithms/defaults ที่ดีขึ้น
- ปรับปรุง tree shaking/better code generation ให้ดีขึ้น
- ปรับปรุงให้เข้ากันได้ดีกับ Web platform
แต่ก็มีประเด็นอยู่
สมัยก่อน Webpack สามารถรัน Node.js Module ใน Browser ได้ด้วยพลังแห่ง polyfills แต่เพราะ Ecosystem พัฒนาไป หลาย Module ถูกเขียนเพื่อสำหรับ Web แล้ว (ESM) Webpack 5 เลย poloyfills เพื่อลด bundle size ซึ่งทำให้บาง Module ที่อาจใช้ Node.js Module อยู่ใน Web หรือ Angular ใช้งานไม่ได้ นั้นจงเป็นเหตุผลที่ทีม Angular เปิด Webpack 5 เป็น Opt-in และ Angular Team ไม่แนะนำให้รัน Webpack 5 ใน Production
และนี่ก็คือสิ่งที่เกิดขึ้นตอน Build Angular Project แบบเปล่าไม่ได้ลงอะไรเพิ่ม (ng new) ด้วย
Webpack 5 ใน Windows 10
Webpack 4.44.2ใน OSX
Webpack 5.4.0 ใน OSX
ใหญ่ขึ้น 23.65 kB ซะงั้น ?
รอไปก่อนครับ
Module Federation
เป็นอานิสงค์จาก Webpack 5 ที่สามารถให้เราใช้ฟีเจอร์นี้ได้ คำถามแล้วมันคืออะไรหละ
Module Federation คือการบอกว่าบางจุดใน Application เรานั้นยังมีจุดที่ยังไม่รู้ ณ เวลา Compile Time แต่เราจะโหลดอีก Module (เป็นอีกแอพย่อยหนึ่ง อาจจะมองว่า คล้ายๆแปะ iframe เข้ามา หรือหน้าแยกก็ได้) เข้ามา โดยที่ตอนโหลด Module เข้ามานั้น เราจะใช้ Dependency หรือ Library ร่วมกันที่มีอยู่แล้วใน Application หลักซึ่งทำให้ไม่ต้องโหลด Dependency ซ้ำซ้อน
ยกตัวอย่างเช่นจากรูปด้านบนเรามี Application run อยู่ที่ port 5000 แล้วในนั้นหน้าเรามี Application ย่อยที่อีกทีมพัฒนา port 3000(ทำ Microfrontend [แยกกันทำโดยอิสระจากกัน แต่ตอนรวมอาจจะมี Script บางอย่างเล็กน้อยเพื่อรวมกันได้])แล้วต้องการจะเอามาใส่ ซึ่งปกติใช้ iframe เราจะโหลด Bundle ซ้ำสองรอบทั้งของ Application หลักและ Application ย่อย แต่ Module Federation จะบอกให้เราระบุว่ามี Depedency ไหนบ้างที่ใช้ร่วมกันจะได้ไม่โหลดซ้ำซ้อน
อ่านรายละเอียดเพิ่มเติมได้ที่ The Microfrontend Revolution: Module Federation in Webpack 5 — ANGULARarchitects
Strictly Typed Reactive Forms
สิ่งนี้เป็นสิ่งที่ผมรอมานานแล้วกล่าวคือใช้ Type System มาลดความผิดพลาดในการสร้าง FormGroup, FormControl ได้เพราะตอนนี้เวลาเราจะเรียกใช้ FormControl จาก FormGroup เราใช้คำสั่ง form.get('key')
ซึ่งมีโอกาสบ่อยมากที่เราพิมพ์ผิดใน key หรือ ตอนใช้ form.controls.key
ใน template แล้ว Angular Language Service ยังไม่สามารถทำงานดักจับการพิมพ์ผิดของเราได้
ใน Angular Ecosystem พอจะมี Library ที่คนทำไว้อยู่บ้างแล้วเช่น
- ngneat/reactive-forms: (Angular Reactive) Forms with Benefits 😉 (github.com)
- dirkluijk/ngx-typesafe-forms: Because FormControl<T> is more awesome than FormControl! (github.com)
แต่ความรู้สึกผมคือสิ่งนี้มันควรจะทำมาจาก Reactive Form เองไม่ต้องมีใครมาครอบมัน ผมเลยไม่ได้ใช้ Library ข้างนอก รอวันที่ Angular Team support และวันนั้นใกล้มาถึงแล้ว
ติดตามสถานะได้จากลิงค์ด้านบน
Optional NgModules
NgModule เป็น Concept หนึ่งใน Angular ที่มือใหม่งงที่สุด ผมเคยงงมาก่อนเหมือนกัน มีหลายคนใน Ecosystem มีความเห็นว่าถกเถียงกันให้ NgModule ออกไป
ปัญหาของ NgModule คือทำหลายอย่างมากเกินไปกล่าวคือ
- บอก Compilation Scope ให้ Angular Compiler ซึ่งจำเป็นทั้งตอน Development และตอนเขียน Unit Testing เพื่อที่จะลอง Environment ทั้งหมดใน Component ว่าต้องการ Depedency อะไรบ้าง ต้อง Mock อะไรบ้าง (ซึ่งก็มีแนวคิดเอา Dependency ไปแปะใน Metadata ของ Component ชื่อว่า deps อ่านต่อได้ที่ feat(core): introduce local scope & make NgModules optional in ivy by mgechev · Pull Request #27481 · angular/angular (github.com) ซึ่งสำหรับผมว่าแยก Depedency ออกมาอีกไฟล์ที่นามสกุล .module.ts ดีกว่าไปรวมทุกอย่างใน .component.ts)
- ใช้ในการ Code-Splitting หรือ Lazy Load Feature (แก้ด้วย component level code-splitting แทนได้อยู่ใน Roadmap)
- Configure Dependency Injection (คิดว่า Angular Team ควรจัดการตรงนี้)
- จัดกลุ่มของฟีเจอร์ (แก้ด้วยแนวคิด Workspace แทน แยก Apps, Library ออกจากกัน แทนได้)
ส่วนตัวผมชอบแนวคิด NgModule ตัว NgModule เพิ่ม Declarative, Readability ในการบอกว่าใน Component นี้มี ใช้อะไรบ้างและให้ Component อื่นใช้อะไรบ้าง แต่แนวคิดนี้ต้องใช้ความขยันเล็กน้อยในการแยก 1 Component — 1 Module
ซึ่ง Angular Team บอกว่าในอนาคตคงมีทางออกทั้งสองฝั่งสำหรับคนที่ใช้ และไม่ใช้ NgModule
Zone.js opt-out
Zone.js คือสุดยอดความสะดวกสบายที่ทำให้ Angular Developer ไม่ต้องเขียนโค๊ดเพิ่มในการ Sync Angular & DOM State เข้าด้วยกันผ่านการไปเรียก ChangeDetection (tick) อีกที
Zone.js ไป Monkey Patching async method เช่น setTimeout/Promise/EventTarget/EventTask(change, input, blur, …)…
อ่านรายละเอียดเพิ่มเติมได้ที่
angular/STANDARD-APIS.md at master · angular/angular (github.com)
ถ้าไม่มี Zone.js เราต้องคอย manual Sync Angular & DOM (detectChange, tick) เอง โค๊ดเราจะเต็มไปด้วย detectChange, tick
ซึ่งการมี Zone.js ก็แลกมาด้วยกับ Bundle Size ของ Polyfills ที่ใหญ่ขึ้นเล็กน้อยและ Debug ยากขึ้นเพราะ Stack Trace มี Zone เข้ามาเกี่ยวข้อง
ซึ่งใน use case ทั่วไป ข้อมูลบนหน้าจอไม่เยอะมาก ไม่ซับซ้อน Zone.js ทำงานตามปกติ Sync state ให้เรา ผู้ใช้ไม่รู้สึกกระตุก แต่ใน use case ที่หน้าซับซ้อนเราก็อยากจะจัดการเองไม่อยากให้ Zone.js ซึ่งคือ JavaScript รันเพราะมัน Block UI
ทีม Angular ได้บอกวิธีปิด Zone.js ไว้แล้วแต่ความลำบากคือเราต้องจัดการ Change Detection ซึ่งทีม Angular กำลังออกแบบและเตรียมแผนให้กับคนที่จะออกจาก Zone.js ด้วยวิธีไม่ลำบากมาก ผมตั้งสมมุติฐานว่าใช้แนวคิด Reactive Push-base Architecture (RxJS, rx-state) แทนซึ่งก็ต้องไปเข้าใจ Reactive อยู่ดี
Zone.js ใน Angular มีปัญหาหนึ่งก็คือไม่สามารถขยับไป tsconfig build target ไป ES2017 ได้ (เพื่อใช้ความสามารถโดย Native Syntax ของ Browser) เพราะ native async/await ไม่สามารถถูก monkey patch ได้อย่างถูกต้อง เลยไปทำให้ RxJS ที่มีแผนจะขยับ target ไป ES2018 เพื่อลด Bundle Size และ Support AsyncIterable ไม่ได้ไปด้วย (ถ้า Angular จะใช้ RxJS version ใหม่) ตอนนี้ก็ได้แต่รอ
อ่านรายละเอียดเพิ่มเติมได้ที่ Angular Roadmap
ประวัติของผู้เขียน
Siwat Kaolueng เป็นที่ปรึกษาเรื่อง Web และ Angular ให้กับองค์กรขนาดใหญ่ไม่ว่าจะเป็นบริษัทรับทำการตลาดและบริษัทพลังงานชื่อดัง
โดยความตั้งใจคือส่งมอบวิธีการ แนวคิด เครื่องมือ สถาปัตยกรรม และลงมือปฏิบัติร่วมกับทีมพัฒนา เพื่อให้ Web Application สร้างได้เร็ว ดูแลต่อง่าย และใช้งานได้อย่างมีประสิทธิภาพ
สนใจให้ผมไปช่วยออกแบบสถาปัตยกรรม (Architecture) วิเคราะห์ แก้ปัญหา ทำ Web Application ที่ใช้ได้นานๆ หรือพัฒนา Skill คนในทีมติดต่อได้ที่ siwat.kaolueng@gmail.com หรือ Facebook JaMe Siwat Kaolueng