Advanced Angular ขั้นสูง

Advanced Angular ขั้นสูง

หลักสูตรขั้นสูงใน Angular นี้ออกแบบมาสำหรับผู้ที่ต้องการพัฒนา Application ด้วย Angular อย่างเชี่ยวชาญ โดยเนื้อหาครอบคลุมด้านการวางโครงสร้างทางอุตสาหกรรมซอฟแวร์ สามารถดึงเอาข้อดีและประโยชน์จากเฟรมเวิร์คได้อย่างเต็มที่ มีประสิทธิภาพ เนื้อหาครอบคลุมตั้งแต่เรื่อง Component , Dependency Injection , Service & Factory การทำงานกับ 3rd party frameworks ไปจนถึงการเชื่อมต่อไปยังส่วน Backend ด้วย Http Client Service ขั้นสูง การใช้งาน Angular Material การทำเว็บหลายภาษาด้วย i18n ตลอดจนการ Deploy Angular ขึ้นสู่ Production จริงอันจะนำไปประยุกต์ร่วมกับการทำงานในโปรเจ็กต์ของผู้อบรมในอนาคตต่อไป

เนื้อหาครอบคลุมตั้งแต่ Angular 5 ถึงเวอร์ชั่นปัจจุบัน (V.8) และมีการอัพเดทเนื้อหาอย่างต่อเนื่องสม่ำเสมอทุกรอบการอบรม ดังนั้นผู้เรียนมั่นใจได้ว่าจะได้เรียนรู้เทคโนโลยีและความสามารถล่าสุดของ framework ตัวนี้อย่างครบถ้วนสมบูรณ์

สาขากรุงเทพฯ (ลาดพร้าว)
  • ยังไม่มีรอบเปิดอบรม (ลงชื่อจองไว้ได้)
  • เข้าใจการทำงานกับ Angular Component ขั้นสูง
  • เรียนรู้การใช้งาน Dependency Injection ใน Angular
  • เข้าใจการใช้งาน Services และ Factory ใน Angular
  • การทำงานร่วมกับ 3rd Party 
  • เรียนรู้เทคนิคการเขียนเว็บรองรับหลายภาษา
  • การปรับแต่ง Template และใช้งาน Angular Material
  • เข้าใจการเชื่อมต่อไปยัง backend ผ่าน Http Client Service
  • ฝึกทำ Workshop CRUD ร่วมกับ NodeJS
  • เรียนรู้การ Deploy Angular project ขึ้นสู่ Production
  • ผู้ที่ต้องการพัฒนา Web Application ด้วยภาษา Angular ขั้นสูง
  • IT Managers
  • Developers
  • กลุ่มผู้สนใจทั่วไป
  • มีพื้นฐานการเขียนเว็บไซต์ html & css มาบ้าง
  • เข้าใจพื้นฐานภาษา Javascript บ้าง
  • มีพื้นฐานการเขียน Angular มาบ้าง
  • เข้าใจหลักการทำงานเบื้องต้นของ Web Service
  • เข้าใจการทำงานกับฐานข้อมูลเบื้องต้น
  • 18 ชั่วโมง
  • ราคาปกติ 5,900 บาท / คน
  • โปรโมชั่นลด 10% เหลือ 5,310 บาท / คน
  • ราคาเหมาจ่าย (ผู้อบรมตั้งแต่ 10 คน) ตามแต่ตกลงกัน
  • ขอใบเสนอราคา

Day 1:

Module 1: Project Setup

  • เริ่มติดตั้งโปรเจ็กต์แรกกับ Angular 8
  • การตั้งค่าโปรเจ็กต์ที่สร้างขึ้นมา
  • เรียนรู้โครงสร้างโปรเจ็กต์ Angular 8 เจาะลึก
  • ทดสอบ Run และปรับแต่งโปรเจ็กต์ที่สร้างขึ้นมา

Module 2:  Advanced Components

  • Lifecycle Hooks
  • ViewChild
  • ViewChildren
  • Content Projection
  • ContentChild
  • ContentChildren

Module 3: Dependency Injection

  • Creating a Service
  • Adding to Module Providers
  • Using the NamesService
  • Injecting Dependencies into Services

Module 4: 3rd party frameworks

  • Integrating a pure ES6 JavaScript Library (lodash)
  • Integrating JavaScript Widgets (plotly.js)
  • Integrating old jQuery Widgets (jquery-datetimepicker)
  • Integrating modern jQuery Widgets (Kendo UI for jQuery)
  • Improving performance (NgZone)

Day 2:

Module 5: Styling Angular Components 

  • Separating Structural Styles From Theme Styles
  • How To Create An Alternative Component Theme And Ship It With The Library
  • Creating an Alternative Component Theme
  • Angular Style Isolation - Emulated View Encapsulation
  • Learn 2 More Alternative Ways of Handling CSS in Angular Applications
  • Setting Up A Library Module, Confirming AOT is Supported
  • Angular Component Testing Overview
  • The Angular CLI Testing Infrastructure

Module 6: Authentication & Route Protection in Angular

  • How Authentication Works
  • Adding the Auth Page
  • Switching Between Auth Modes
  • Handling Form Input
  • Preparing the Backend
  • Preparing the Signup Request
  • Sending the Signup Request
  • Adding a Loading Spinner & Error Handling Logic
  • Improving Error Handling
  • Sending Login Requests
  • Login Error Handling
  • Creating & Storing the User Data
  • Reflecting the Auth State in the UI
  • Adding the Token to Outgoing Requests
  • Attaching the Token with an Interceptor
  • Adding Logout
  • Adding Auto-Login
  • Adding Auto-Logout
  • Adding an Auth Guard

Module 7: Working with NgRx

  • What is Application State?
  • What is NgRx?
  • Getting Started with Reducers
  • Adding Logic to the Reducer
  • Understanding & Adding Actions
  • Setting Up the NgRx Store
  • Selecting State
  • Dispatching Actions
  • Multiple Actions
  • Preparing Update & Delete Actions
  • Updating & Deleting Ingredients

Module 8: Angular Animations

  • Setting up the Starting Project 
  • Animations Triggers and State 
  • Switching between States 
  • Transitions 
  • Advanced Transitions 
  • Transition Phases 
  • The "void" State 
  • Using Keyframes for Animations 
  • Grouping Transitions 
  • Using Animation Callbacks 

Day 3: 

Module 9: Adding Offline Capabilities with Service Workers

  • Adding Service Workers
  • Caching Assets for Offline Use
  • Caching Dynamic Assets & URLs

Module 10: Angular Material

  • Environment Setup
  • Autocomplete
  • Bottom Sheet
  • Cards
  • Widgets
  • Layouts
  • Inputs
  • Icons
  • Grids
  • SideNav
  • Fab Speed Dial
  • Swipe
  • Switches
  • Themes
  • Toasts

Module 11: Angular Internationalization (i18n) ทำเว็บหลายภาษาด้วย Angular

  • Introduction to Angular Internationalization (i18n)
  • Understanding Angular i18n Unique Identifiers
  • Angular i18n Pluralization Support
  • Angular i18n Alternative Expressions Support
  • Running a Translated Angular Application using the Angular CLI

Module 12: Workshop Angular CRUD with NodeJS

  • Setup Node JS
  • Build a Node.JS Backend
  • Connect MongoDB Database with Angular 8 MEAN Stack App
  • Create Model with Mongoose JS
  • Create RESTful APIs using Express JS Routes
  • Set up Angular 8 MEAN Stack Project
  • Activate Routing Service in MEAN Stack Angular App
  • Create Angular 8 Service to Consume RESTful APIs
  • Register an Employee by Consuming RESTful API in Angualr 8 MEAN Stack App
  • Show Employees List and Delete Student Object using RESTful API in MEAN Stack App
  • Edit Employees Data in MEAN Stack Angualr 8 App
06/02/2020 18:07:37