Angular 開發實戰:從零開始
4.7 (352 ratings)
Course Ratings are calculated from individual students’ ratings and a variety of other signals, like age of rating and reliability, to ensure that they reflect course quality fairly and accurately.
897 students enrolled

Angular 開發實戰:從零開始

掌握 Angular 開發框架的重要知識與觀念
Bestseller
4.7 (352 ratings)
Course Ratings are calculated from individual students’ ratings and a variety of other signals, like age of rating and reliability, to ensure that they reflect course quality fairly and accurately.
897 students enrolled
Created by Will 保哥
Last updated 5/2018
Traditional Chinese
Traditional Chinese
Price: $139.99
30-Day Money-Back Guarantee
This course includes
  • 5.5 hours on-demand video
  • 1 article
  • 1 downloadable resource
  • 1 Practice Test
  • Full lifetime access
  • Access on mobile and TV
  • Assignments
  • Certificate of Completion
Training 5 or more people?

Get your team access to 4,000+ top Udemy courses anytime, anywhere.

Try Udemy for Business
What you'll learn
  • 了解 Angular 開發框架與其優勢
  • 學會有效率的利用 Angular 開發前端應用
  • 掌握開發 Angular 的重要觀念與開發技巧
Course content
Expand all 55 lectures 05:37:48
+ 課程簡介
1 lecture 00:25
本課程範例原始碼
00:25
+ 簡介 Angular 開發框架
4 lectures 20:16
關於 AngularJS 與 Angular 開發框架
04:27
了解 Angular 的優點與主要特色
05:47
認識 Angular 開發語言:TypeScript
06:17
理解 Angular 應用程式與元件
03:45
隨堂測驗
3 questions
+ 了解 Angular 基本架構與啟動流程
6 lectures 43:16
認識 Angular 應用程式啟動流程
12:26
使用 Angular CLI 快速建立元件與範本
09:08
將靜態檔案加入 Angular CLI 建立的專案
04:53
將網頁 HTML 加入到 Angular 應用程式
05:54
升級 Angular 應用程式到新版的方法
06:15
+ 掌握 Angular 範本語法與資料繫結
22 lectures 01:57:48
學習資料繫結方法:內嵌繫結 (Interpolation)
03:52
學習資料繫結方法:屬性繫結 (Property Binding)
08:33
學習資料繫結方法:事件繫結 (Event Binding)
04:57
學習資料繫結方法:事件繫結 - 使用 $event 參數
04:41
學習資料繫結方法:事件繫結 - 使用具有型別的 $event 參數
03:24
請利用 Angular 資料繫結方法 (內嵌繫結、屬性繫結、事件繫結) 完成任務。請各位學員盡量「親手實作」這份作業,不要直接看解答說明,這樣才能有效幫助你加強學習效果。
嘗試運用 Angular 資料繫結方法
2 questions
學習資料繫結方法:雙向繫結 (Two-way Binding)
11:50
認識範本參考變數 (Template reference variables)
07:26
學習 Angular 元件型指令 (Component Directives)
10:19
學習 Angular 屬性型指令 (Attribute Directives) - NgStyle
08:02
學習 Angular 屬性型指令 (Attribute Directives) - NgClass
03:02
學習 Angular 結構型指令 (Structural Directives) - NgIf
04:24
學習 Angular 結構型指令 (Structural Directives) - NgSwitch
03:49
學習 Angular 結構型指令 (Structural Directives) - NgFor
11:59
學習 Angular 使用 Pipes 管線元件 - uppercase 與 lowercase
02:35
學習 Angular 使用 Pipes 管線元件 - number
05:36
學習 Angular 使用 Pipes 管線元件 - currency
03:52
學習 Angular 使用 Pipes 管線元件 - percent
01:21
學習 Angular 使用 Pipes 管線元件 - date
03:26
學習 Angular 使用 Pipes 管線元件 - json
01:30
學習 Angular 使用 Pipes 管線元件 - slice
03:34
在範本中使用安全導覽運算子 (safe navigation operator)
06:45
如何避免在範本中出現 TypeScript 型別錯誤
02:51
+ 認識 Angular 元件架構與模組
11 lectures 01:17:51
簡介 Angular 元件架構
03:19
建立 Angular 功能模組
04:25
將現有 Angular 元件加入功能模組
08:11
定義 Angular 元件的輸入介面 - @Input()
04:54
介紹 ngOnInit 與 ngOnDestroy 生命週期 Hook
06:20
定義 Angular 元件的輸出介面 - @Output()
13:18
解釋單向資料流與實作不可變的物件
04:21
實作單向資料流與實作不可變的物件 - 1
07:11
實作單向資料流與實作不可變的物件 - 2
11:32
介紹 ngOnChanges 生命週期 Hook
06:46
講解 ngOnChanges 生命週期 Hook 的實務運用
07:34
+ 認識 Angular 服務元件、相依注入與 HttpClient
6 lectures 34:18
建立 Angular 服務元件與實作相依注入
07:17
透過服務元件重構現有元件的程式碼
08:23
了解 @Injectable() 裝飾器與注入 HttpClient 服務元件
03:56
學習 HttpClient 基本使用方法 - get()
03:40
重構 DataService 服務元件 - 回傳 Observable 物件
08:17
使用 async 管道元件訂閱 Observable 物件
02:45
Requirements
  • 了解基礎 HTML / CSS / JavaScript 語法
  • 具有基礎的程式設計概念 (寫過任何一種程式語言即可)
Description

Angular 框架經過數年的發展,框架本身已經相當成熟,不但進入門檻越來越低,在執行速度、開發效率、學習曲線方面,也都得到了一個相當不錯的平衡點。我們都知道,網頁前端技術日新月異,但就我長期觀察下來,近兩年來 Angular 框架發展已經相當穩定,官方團隊也不斷精進整個開發生態,無論是在開發工具的支援,或是透過 Angular CLI 加速大型專案管理,都已經有相當程度的效益。現在,就是投入 Angular 學習的最佳時機!

本課程歷經數月的精心策劃、製作、剪輯,並特別強調新手入門 Angular 開發框架所需注意的各項細節,課程中穿插著理論與實務,幫助學員更快的理解 Angular 正確的開發觀念,也透過影片中的實際操作,教導學員一些實用的開發技巧。只要你認真學習,並動手實作,相信可以大幅提升 Angular 應用程式的開發效率,縮短自己嘗試錯誤的時間,提高學習效率。

Who this course is for:
  • Web 開發人員
  • 網頁前端工程師
  • 網頁設計師