Leo 程式筆記

翻遍了各大國外網站，StakeOverFlow也每一篇仔細看過。

發現對於如何一步步將 Angular Universal完整部屬到IIS上的步驟，不是內容過時，就是步驟漏了不少。

因此撰寫一篇完整的將SSR專案部屬到IIS上的步驟。

相信我，這一篇絕對會是最完整的部屬流程文章，如果不是，倒想看看你的完整流程。

找了各式各樣的文章，一直沒有看到完整關於Angular Univeral的詳細步驟教學

而在設定時也會有一些小細節需要處理，因此本文將完整從 Client Side Render 如何成功導入 Server Side Render

讓 Google的爬蟲能夠搜尋的到使用 Angular開發的網站。

當我們在Angular中想要操作Template的DOM時，我們通常會在該DOM上加入範本參考變數(Template reference variables)

再經由ViewChild去取得，但並不是所有情況都可以取得到畫面上的DOM，因此本文主要介紹為什麼會遇到undefined問題

以及如何解決。

在前兩篇當中，我們已經將前置作業完成。

- 版型 Success

- 資料庫 Success

接下來，我們要開始撰寫Service 來讓我們可以將資料呈現在前端。

延續上一篇的描述中有提到，因為這是六角舉辦的活動，所以TodoApp 也是六角的第一週作品。

這次六角的活動舉辦的相當用心，每一週的作品都特地準備了設計稿讓我們進行切版。

最近因為參加六角學院的比賽，主題是將每一次的設計稿進行切版。

但是對於一個前端工程師來說，僅僅只練習切版肯定是不夠的。

因此，除了切版以外，若能加上資料庫來實作，感覺有趣不少。

而 Google的 FireBase，簡單易學好操作，在沒有那麼多時間開發的情況下，使用 FireBase是最好的選擇。

因此這系列的文章，會教大家如何利用 Angular與 FireBase做一個簡單 Todo App。

在開發Angular專案的時候，由於前端已經轉換為MVC的框架，因此每一個Component都是獨立的

也因如此，所以檔案數量不僅多也肥大。

筆者這陣子在開發一個ERP系統，目前專案就已經將近30M了(不包含WebApi)

也就是說，用戶在使用系統的時候，以不考慮連線問題、後端處理等等

單獨下載檔案就需要下載近30M。

因此對於用戶體驗來說非常不好。

雖然說我們可以透過LazyLoading來解決這個問題，但是不管怎麼樣，一開始肯定是要將部分專案下載下來

更別說如果都沒有切Module，那肯定是很可怕的

昨天晚上學弟告訴我：他發現 明明已經使用 angular-cli安裝Chart.js這個建構圖表的 Third-party 

但是卻仍然無法使用，會一直報錯：

Cannot find modu
le '../../../node_modules/chart.js'

起初一開始以為只是它單純安裝完後沒有給人家import而產生的錯誤，但後來我自己在看Code的時候發現其實裡頭大有學問。

因此發布上這篇讓其他有相同問題的人可以少採一點坑。

這一章節主要會帶各位介紹一些常用的CLI指令，來快速開發自己的網站

Angular js 2的系列文章終於開始了，平均大概3-5天會進行更新

主要帶想學Angular js2 的初學者們能夠快速踏入這個領域