自從改用 React Hooks 搭配 Functional Component 之後,Class 的概念都快忘光光了呢~ (也有可能是根本沒懂過?) 決定 refresh 一下 Class 如何使用。 # 甚麼是 Class? class 是用來創造 Object 的。 想像成 clas...
簡單示範動畫效果:https://jsfiddle.net/birdie2019/bhdL4r7u/26/ 之前看國外網友的作品覺得作品裡的表單動畫好看,細讀了code,發現只需用HTML和CSS就能做到 主要用到: * [HTML <input> required 屬性](https...
恭喜你完成這份奇怪的 Vue 入門課程 如同我在這門課程中不斷強調的 任何的技術工具,其實都充滿了大量的過時觀念、多餘觀念、錯誤觀念 也就是很多小功能、小語法,要嘛是已經很少人在用了,要嘛是重複設計了,要嘛是根本設計失敗了。這些學了也用不到 偏偏你在補習班或者上網自學的時候,...
## 課程目標 - 認識 Template Refs ## 課程內容 來讀一下 Template Refs 的說明 - https://vuejs.org/guide/essentials/template-refs.html 簡單來說,在我們使用了任何前端框架之後,就...
## 課程目標 - 認識 Lifecycle Hooks 與 Watchers ## 課程內容 來認識一下 Lifecycle Hooks - https://vuejs.org/guide/essentials/lifecycle.html 簡單來說,在 vue 執行...
## 課程目標 - 學習事件處理的寫法 ## 課程內容 來學一下事件處理的寫法 - https://vuejs.org/guide/essentials/event-handling.html 眼花撩亂沒關係,我已經多次告訴過你應該用什麼心態去面對 不用把這些東西...
## 課程目標 - 學習迴圈的寫法 ## 課程內容 來學一下在 Vue 模板裡面,如何寫迴圈、顯示陣列內容 - https://vuejs.org/guide/essentials/list.html 老樣子,同一件任務,有很多種不同的寫法 隨便挑一個你覺得順眼的...
## 課程目標 - 學習條件判斷式的寫法 ## 課程內容 先來學一下管理 css class 與 style 的一些寫法 - https://vuejs.org/guide/essentials/class-and-style.html 老樣子,這些寫法比較進階,稍微有...
## 課程目標 - 體驗一下 Reactivity 的效果與便利 ## 課程內容 來學 Vue 之中 Reactivity 的基本觀念 - https://vuejs.org/guide/essentials/reactivity-fundamentals.html 老...
## 課程目標 - 能夠運行 Vue 基本環境 - 能夠 render state ## 課程內容 身為工程師,要習慣到處翻閱各種技術文件 這次的課程,我不會手把手帶領,細談所有觀念 我會一次提供一個官網連結。請你一邊閱讀,一邊把其中的範例貼到 jsfiddle 跑跑...
第2課 練習目標 學會用id(選擇器)、class(類選擇器)、元素名稱來指定特定元素 學會用CSS來替文字加上設計感,替文字變色、變大小、設計邊框、寬度、留白等等 練習過後才發現 美工真的是一門學問 等之後還有機會練習的時候 會回頭多測試一些語法 練習:https://jsf...
``` <fieldset> <legend>ID</legend> <input type="text" id="position" placeholder="Enter PositionID"> </fieldset> ```  你一定常常心想:這也太華麗了,畫面上 DOM 的變化很複雜、很頻繁,我好像寫不出來呀? 別擔心,這是因為你目...
>最近在忙著實作我的一些小項目,沒有上來發文,但還是一直學習JS, >累積滿多經驗,也累積不少疑問。 >之前站長阿川有跟我提到相關話題,也就是UJS,想說把它拿過來聊一聊。 >剛好最近弄的東西,跟這個也有一些關聯性。 ## html與JS的交互關係。 Inline JavaScri...
## 課程目標 認識 AJAX 與不同的 HTTP 請求方法 ## 課程內容 HTTP 協定中,HTTP Request 有多種不同的方法 前面幾課的寫法,都是 HTTP GET 類型,這一課來接著談談更多不同的請求方法 繼續使用模擬電商網站的範例 API ###...
## 課程目標 認識變數作用域 認識函式的不同寫法與特性 ## 課程內容 來認識一些程式語言觀念與名詞 ``` <button onclick="action1()"> global scope </button> <button onclick="acti...
## 課程目標 認識並且能使用 Cookie 相關功能 ## 課程內容 大名鼎鼎的 cookie,很多人在科技新聞上都聽過 某某公司利用網頁 cookie 追蹤個資、某某公司偷偷用 cookie 分享個資 這類新聞提到的 cookie,就是本課在說的 cookie ...
如果你是網頁設計師,或者開發的網站以公司介紹、形象網站為主 那麼目前為止的課程,已讓你具備相當的動態網頁開發能力 各種特效與視覺效果,你都做得出來 甚至更複雜的動態效果,直接上網找現成的套件,也都不是問題,你都能夠自行研究&導入了 不過,如果需要開發與伺服器互動的應用程式,例...
每週二晚上《CodeLove Talk》直播! 聊聊科技新聞,一起討論軟體開發相關的話題!