讓我總結說明一下，老方法、新方法的關鍵思維差異： - 在老方法中，工程師眼中主要關心 html，開發過程會一直去思考 html 結構，因為「應用程式的狀態（資料）」就存在 html 之中，html 同時是狀態、也是 UI - 在新方法中，工程師眼中主要關心 data model，通常就是...
## 課程目標 繼續熟悉 data model 的觀念 ## 課程內容 有了 data model 與 render function 之後，還有一個很大的好處 就是當應用程式的狀態，作為資料，需要跟外部溝通時，也很好用 直接把 data model 轉換為字串，傳出去...
## 課程目標 繼續熟悉 data model 的觀念 ## 課程內容 有了 data model 與 render function 之後 除了在更新資料時，腦中一律只要想著 data model 就好 就連在撈資料時，也一樣只要思考 data model 就好，非常...
## 課程目標 能夠在陣列更新元素 繼續熟悉 anonymous function 的觀念 ## 課程內容 這課先介紹一種資料型態：布林（boolean） 這種資料型態，幾乎所有程式語言都有，是一種寫程式必備的基本資料型態 ``` var x = true; ...
## 課程目標 繼續熟悉 render function 的觀念 ## 課程內容 render function 雖然只是將 data model 轉換成 UI 呈現在 root 裡面 但是根據資料內容的不同，render function 當然也可以有各種條件判斷、巢狀結構...
## 課程目標 能夠從陣列刪除元素 認識 for in 迴圈寫法 認識匿名函式（anonymous function） ## 課程內容 在 JavaScript 中，刪除陣列元素的方法，有超多種 這邊介紹一種根據索引刪除的方法 ``` var fruits...
## 課程目標 能夠新增元素到陣列 ## 課程內容 因為我們不再使用「在各處胡亂更新各處 DOM」的寫法 現在要認真開始學習，如何在 JavaScript 中，用各種變數、資料型別，建立出 data model 這一課來學學新增元素到陣列的方法 ``` <but...
## 課程目標 認識 data model 的觀念 認識 render function 的觀念 ## 課程內容 如果電商網站上有這樣的內容 ``` <div> 商品名稱：<span id="name">冬季外套</span> 價格：<span id="p...
第1課 ── 學會 Cookie 相關功能 https://replit.com/@birdiewu/DarkvioletClutteredDigits?v=1 第2課 ── 學會 Local Storage 相關功能 https://jsfiddle.net/birdie2019/wkq...
https://jsfiddle.net/birdie2019/5sfhbq8v/15/ 作業如上，雖然完成此課作業的功能但有個問題 JS程式碼的部分，作業網址第30行和第36行部分 為什麼改成event.target就無法運作了？如圖下圖 ![](https://i.i...
## 課程目標 學會結合 AJAX 與 data attribute 來製作應用程式 ## 課程內容 打造應用程式的時候，有些資料不會直接顯示在畫面上，但之後的其他動作會用到 這時可以把資料存在 data attribute 裡面 ``` <div data-emai...
## 課程目標 認識 AJAX 與不同的 HTTP 請求方法 ## 課程內容 HTTP 協定中，HTTP Request 有多種不同的方法 前面幾課的寫法，都是 HTTP GET 類型，這一課來接著談談更多不同的請求方法 繼續使用模擬電商網站的範例 API ###...
## 課程目標 認識 AJAX 錯誤處理 ## 課程內容 在前一課，我們說過以下的話 > 有些任務現在還不會立刻執行，但我先把要執行的任務交待清楚，時間點到的時候，就執行 > 以 UI 動作來說，時間點就是 `onclick` 之時、`onchange` 之時 >...
## 課程目標 認識基本的 AJAX 原理 ## 課程內容 這一課來認識大名鼎鼎的 AJAX 觀念 AJAX 全名 Asynchronous JavaScript and XML 簡單來說，就是「非同步從主機取得資料來更新網頁內容」的技術 舊式的網頁，都是瀏覽器向...
## 課程目標 認識變數作用域 認識函式的不同寫法與特性 ## 課程內容 來認識一些程式語言觀念與名詞 ``` <button onclick="action1()"> global scope </button> <button onclick="acti...
## 課程目標 認識並且能使用 Local Storage 相關功能 ## 課程內容 Local Storage 提供了前端開發者簡易的儲存功能，能夠把資料儲存在瀏覽器上 跟 cookie 不同的是，local storage 的資料不會挾帶在 http request 中發...
## 課程目標 認識並且能使用 Cookie 相關功能 ## 課程內容 大名鼎鼎的 cookie，很多人在科技新聞上都聽過 某某公司利用網頁 cookie 追蹤個資、某某公司偷偷用 cookie 分享個資 這類新聞提到的 cookie，就是本課在說的 cookie ...
第1課 ── autosize 套件 https://jsfiddle.net/birdie2019/j69s8vdc/38/ 第2課 ── vanilla-lazyload 套件 https://jsfiddle.net/birdie2019/401xa29h/104/ 第3課 ─...
練習1 ── alert 示警元件 https://jsfiddle.net/birdie2019/4ur1c7xf/34/ 練習2 ── toast 吐司元件 https://jsfiddle.net/birdie2019/fmc6b8ht/49/ 研究了一下setTimeout()用...
軟體工程師寫部落格，對於職業生涯很有幫助，有很多好處。這篇文章的作者簡單分享心得。 原文出處：https://dev.to/nasirovelchin/every-software-developer-should-write-a-blog-4622 --- 作為一名軟體工程師，我...
精選技術文章、免費程式設計資源、以及業界重要新聞！
