前言

一個月前,我開始了一份前端工程師的工讀,那時候的我做過幾個專案,但沒使用過 Anuglar 2,而公司規定前端以 Angular 2 開發,於是我便開始探索,適逢 IT 邦幫忙鐵人的活動,想說有個逼自己學習的活動參加也蠻好的,就開始了我痛苦的一個月。這一個月每天都花好幾個小時查資料打文章,鐵人賽還經過期末考,期末考那陣子我都是先打完文章有剩下時間才去念一點書,我想既然都有決心要參加鐵人賽,那不管如何都要做到底。

這幾三十篇的文章是我以初學者的角度,將網路上各種資源重新以自己方式翻譯和詮釋,甚至好幾篇的範例完全是我自己寫的,不敢說有多好,因為打文章的目的是讓自己吸收,而不是完全以教學的目的而寫,因此很多內容並不是很漂亮,但是仍對其他人有參考價值。三十天的文章也不是照順序讀最好,因為我在寫的時候並沒有一套完整的架構,而是一個單元一個單元的介紹。

一個月過去了,即使我沒有一個可以照順序學習的步驟,東湊西湊也拚出幾乎完整的 Angular 2 地圖,大部分的文獻內容都讀過了。網路上有關 Angular 2 的技術文章其實也沒有很多,即使英文也一樣,所謂不多是指多樣性,介紹基礎的內容文章非常多,但都在講同一件事,我希望看到的是多元內容,但其實能講的也就那些。Angular 2 說穿了只是一個強大的框架,最重要的不是把操作它的技術學的多厲害,而是懂得使用他,然後創造屬於自己的價值。

學習順序

我當初入門時,網路上很多基礎教學,但看完仍是一知半解,也很多細項的技術文,甚至看官方文件,看那些就像拼拼圖,當你全部拼完之後,就是完全了解 Angular 2 在幹嘛的時候,只是這樣學習有點像在走迷宮,我還是覺得能照一個順序學習,會比較有效率。

以下照順序,是我認為學好 Angular 2 的最佳方式,有標示「Day XX」的就是本系列 Angular 2 之 30 天邁向神乎其技之路 的文章。

在開始之前

  • 基礎知識
    基本的網頁知識和操作先有一定水準,也就是 html, js, css 熟悉之後再接觸框架。
  • 物件導向
    網頁程式本身就是一個非常物件導向的操作,對於物件導向有多一點了解在來使用 Angular 2 或 React 這類以組件為概念的框架會很有幫助,且能漂亮使用物件導向對於程式開發本來就有很大幫助。

開始接觸

進階學習
[Day 29] Angular 2 @Directive
[Day 10] Angular 2 動畫 (ANIMATIONS)
[Day 17] Angular 2 替 Component 加上 CSS 的所有招數
[Day 18] Angular 2 組件繼承 ( Component Inheritance )
[Day 20] Angular 2 組件相關的路徑
[Day 25] Angular 2 事先編譯 Ahead-of-Time (AoT)

實際應用
如何在 Angular 4 中加入 jQuery
[Day 06] Angular 2 表單
[Day 12] Angular 2 多語言 ( 1 )
[Day 13] Angular 2 多語言 ( 2 )
[Day 11] Angular 2 HTTP 方法--讓我 Call API
[Day 08] Angular 2 Lazy Loading 別讓載入速度拖垮你!
[Day 30] Angular 2 單元測試 Unit Test

製作 APP
[Day 21] Angular 2 + Ionic = Mobile App ( 1 ) 介紹
[Day 22] Angular 2 + Ionic = Mobile App ( 2 ) 建構
[Day 23] Angular 2 + Ionic = Mobile App ( 3 ) 實作 Todo List
[Day 24] Angular 2 + Ionic = Mobile App ( 4 ) 發布 App


本系列也告一段落,不能說完美,但至少也滿完整,希望對所有像我一樣初學 Angular 2 的工程師有所幫助,有任何問題也歡迎來信,我們未來再見!