birdie

birdie

ฅ•ω•ฅ
登入次數：165 次
註冊於2023年01月05日
  發表了 18 篇貼文
  新增了 117 則留言
  貼文共 30,381 次瀏覽
全部留言
想請教一下前端新手工作內容

我去年轉職前端，第一個禮拜都沒在寫程式，也是先丟檔案讓你看，確實一開始會懷疑自己的能力，差不多試用期過後，才大略了解公司架構，因為很多功能是要實際做到才會了解，當時上班蠻迷茫的，每天上班挑戰不會的東西，感覺每天都是我的職涯危機(到現在也這麼覺得，哈哈)，不知不覺也快一年，回頭看以前遇到的問題跟我現在遇到的問題相比其實都不算什麼，現在遇到的問題才真的好難啊啊啊😂 就紀錄每天工作遇到的事情，一開始會混亂，東湊西湊最後會整理成自己的一套系統和經驗，知道自己哪裏不足，下班有空的時間研究練習，當時自己能力不足非常焦慮，但我就這樣走過來了…只能說學無止境～ 我入職一個月後帶我的前輩就離職了，你至少還有前輩可以問，真羨慕😂

非同步 JS 訓練一：第3課 ── 認識 async/await 語法

交作業 https://jsfiddle.net/birdie2019/ydzsu43c/24/

非同步 JS 訓練一：第2課 ── 認識 promise chain 鏈接

交作業 https://jsfiddle.net/birdie2019/p8uL3r1e/28/

非同步 JS 訓練一：第1課 ── 認識 callback hell

交作業 https://jsfiddle.net/birdie2019/6dm07yo8/20/

html/css 小分享：設定複選框和開關的樣式

這篇很受用，工作上確實遇到checkbox這類的問題！

上班族關懷串 Part. 3

近期…在水深火熱之中xD，前輩在我入職後分別離職，前端人力不足🤣，我自己很多東西不熟，吸收能力比較慢，還有因為是接案公司會有時間的壓力，只能加油了，每天都覺得時間不夠用😱

後端 JS 訓練一：第7課 ── 學習 node 匯入/匯出模組

[交作業](https://github.com/birdiewu/test-node)

後端 JS 訓練一：第6課 ── 替 CLI 應用程式加上顏色

[交作業](https://github.com/birdiewu/test-node)

後端 JS 訓練一：第5課 ── 繼續練習 node 輸入輸出、檔案處理

[交作業](https://github.com/birdiewu/test-node)

後端 JS 訓練一：第4課 ── 把 node 非同步設計改寫為同步設計

[交作業](https://github.com/birdiewu/test-node)

後端 JS 訓練一：第3課 ── 用 node 寫入檔案內容

[交作業](https://github.com/birdiewu/test-node)

後端 JS 訓練一：第2課 ── 用 node 讀取檔案內容

颱風天有空來寫作業 重新繳交一次XD [交作業](https://github.com/birdiewu/test-node)

回答網友提問：32歲非本科考慮轉職工程師，壓力很大，怎麼辦？

其實我也32 XD

上班族關懷串 Part. 2

近期學蠻多新知識，在看前人寫的程式碼，Promises和Async/Await，雖然自己還沒應用到，但爬文了還是似懂非懂，不知道站長有沒有其他方式能指引這部分，每天上班都在解決問題，一開始會覺得很難不會，好痛苦，但解決完問題回頭看好像又還好其實不難，經驗值＋1的感覺XD

紀錄入職第2週心得

有用內建的功能去搜尋，當因為是php 傳來的值，所以也很難找到😨

分享職場小菜雞所遇到的狀況

我最近也是利用下班或假日空檔學一下Tailwind，玩一玩試一試發現很好用，相見恨晚～XD

紀錄入職第一週心得

看來不只我有這種心情，果然轉職後才是挑戰的開始，哈哈 --- 第一份工作大家覺得最重要的是什麼呢？ 我覺得是累積經驗～碰到什麼學什麼都是寶貴的經驗

後端 JS 訓練一：第2課 ── 用 node 讀取檔案內容

[交作業](https://github.com/birdiewu/node-test)

後端 JS 訓練一：第1課 ── 安裝 node 環境

交作業 ![](https://i.imgur.com/YeNJbSr.png)

🎉🎉🎉 恭喜 birdie 順利轉職＆給新入行者的簡單建議 🎉🎉🎉

我面試也有遇到要會DW 也有遇到面試官不知道JQuery和JS之間的關係， 他把投影畫面切到JS(四)的作業四，一直關注在我不會JQuery，哈哈 結果他請公司的RD跟我聊，RD說會JS也可以，但主面試官不這麼認為，我就被刷掉了XD 所以還是要看公司，個人覺得這些公司比較偏傳統性質

🎉🎉🎉 恭喜 birdie 順利轉職＆給新入行者的簡單建議 🎉🎉🎉

面試面到懷疑人生，等待更是焦慮 薪資我都開月薪40K左右(供參考XD，畢竟我沒相關經驗) 最後手上offer也不知道該如何選擇 有軟體也有接案的甚至還有駐點的 最後選擇接案的公司，趕快先進入業界 下週就要去報到了～ 轉職後是另一種挑戰，哈哈 近期趕緊惡補複習一下之前所學(>"<) --- 覺得大家可以在論壇上勇於發問，就算覺得自己的問題不是問題 面試到後期，我臉皮越來越厚XD，都會問面試官其他問題，就算沒錄取我也沒關係，至少我從面試中了解知識或業界是如何使用的，依我面試經驗大部分面試官都樂於回答。 另外，就算面試官給答案也要自己去查證看看，只是他個人的見解，不一定就正確，就互相學習。

分享最近面試心得

感謝站長之前的鼓勵 更新一下狀態，目前找到工作了～～

Git 入門上手教材：第7課 ── 學會處理 git 衝突

交作業 https://github.com/birdiewu/myproject

Git 入門上手教材：第6課 ── 學會 git pull

交作業 https://github.com/birdiewu/myproject

Git 入門上手教材：第5課 ── 學會連線 github

交作業 https://github.com/birdiewu/my-project

Git 入門上手教材：第4課 ── 學會 git 重置指令

交作業 ![](https://i.imgur.com/W85IT7T.jpg)

Git 入門上手教材：第3課 ── 學會 git 版本切換

交作業 ![](https://i.imgur.com/N3w0qrX.jpg)

Git 入門上手教材：第2課 ── 學會 git 基本指令

交作業 ![](https://i.imgur.com/ih3fyYg.jpg) ‘新增檔案 -> 編寫草稿 -> 放進滿意區 -> 最後一口氣把滿意區的所有檔案提交出去‘ 覺得這段站長比喻的很好，很清楚明瞭

Git 入門上手教材：第1課 ── 學會 git 初始化

交作業 ![](https://i.imgur.com/09ElmdY.jpg)

我要繼續寫一些新教材囉！

期待！ 我目前自學完add commit push pull

分享最近面試心得

感謝站長建議！ 現階段就繼續學習，得失心不要太重，準備下一次的機會

04/28 本週閒聊串 😁😁😁

正想分享近期面試心得，站長就先PO文了，哈哈 由於我本身是美術科系畢業，之前也是做包裝和平面設計的工作，所以網頁設計和前端的職缺我都有投，目標是先讓自己進入業界環境。 剛開始蠻挫折的因為沒什麼前端junior職缺，且職缺要求五花八門技術又要有相關工作經驗或是相關科系，工作內容好像什麼都要會，也很多我看不懂的工具... 過一兩週後，開始有人找我，但大多都是網頁設計相關的工作，至於工作內容也很雜，且薪資也不在預期之中。 這幾天陸續面試，其實沒什麼自信且緊張，有些公司面試有筆試，拿到試題腦袋一片空白，平常用電腦打字，現在變成拿筆寫出code或回答問題，最後就把試題會的部分寫一寫，完全看不懂的就跳過，之後面試官來面試我，原本想說試題好多都不會，根本亂寫一通，可能會被洗臉，先做好心理準備XD 結果面試官一題一題有耐心的問我為什麼會這樣回答，不管我答對還是錯面試官都詳細的告訴我釐清觀念，其實考官有說題目都比較刁專有陷阱，因為知道我是初學者，所以也在他預料範圍內，很感謝他們耐心教導，對方也告訴我一些這方面的經驗或關鍵字，真感人！ 總之，近期的面試都吸取很多知識和建議，也被面試官提點我的JS部分要在深入學習扎實一點 --- 分享一下面試題目(我比較有印象的) ``` if ([]) { console.log('Y') } else { console.log('N') } //結果為如何 ``` ``` console.log( (0.1 + 0.2) === 0.3 ) //結果為如何 ``` ``` console.log( NaN === NaN ) //結果為如何 ``` ``` console.log(parseInt('123ABC')) //結果為如何 ``` ``` const a = '3' const b = 1 console.log (a+b) //結果為如何 ``` ``` console.log ([...'...'].length) //結果為如何 ``` 還有一系列的`typeof`型別比較問題，但我無法**直覺信心**的直接寫出答案 因為平常都是寫code時順便用`console.log`來確認型別，這部分要再重新複習😥 還有一些`class`和`this`的試題，我完全看不懂也不會😵 先分享這樣，希望近期能收到好結果～～

JavaScript 系列九：第7課 ── 學習開發狀態複雜的 vue 元件

[交作業](https://sfc.vuejs.org/#eNrVWG1v2zYQ/iuEE9T2Gst20qSDagddhiErsO5DCgwDogClJdpWIlECRTnJAv/3HV9FybIddxuwIoEsHnnP3XN3fNNL56c891Yl6fidSRGyOOeXAY3TPGMcfX7+OUsyhuYsS1HXG+q2GN4NKEIBJU9yYETmuEw4ehHSMANtSigvfCVABuhEtNbyGWGOe33TzwgvGTUthJbk6Q+c+Kh7NJ/j8WgkrYFqpf+Iebi0+FIeUPifDC0JaHCS5gnmBFoITdLnQSj5JPFiydFqkGYRSaZBR5kLOpeToRnT0Igwe9irMBlae+ARtAv+nCjbPxhPZ9nToIj/iunCh3cWETYA0QfVmWK2iKmPRrqd4yiSI5VA0ZOYnZOOytEgxbl3X2QU8idNBLqjCDpVeDqQMdEGzznPC384LOahSON94WVsMYQ3j5WUxynxSJEOZix7LAgD4KAjw60xhiBcgcuMUPCcsF2YjaEbuCZnQMWpq1oZbquwnGVg0LCTSYF0lMRHXziDgGmXZZp9dJVlCcFUC0Um6zJVUCSNRcHedsscapP4FWr3bm/FBpyRSFbs6fm5NoTQghFCpXR8MbbSGUBK4ciKVDndkAIYOkVv+wu8IjctBoT8utWI6LnaNBSWDPLBb66vwAxbzHoCTeiN+saaM8dSwpdZVAU6hJCxTzQveRUHhPgyLrxjEb5eS+xOgE63r6G1iXBJwofPdsxvhC740kAGPODxHPUkbAXkJXIUmqD31nbA99mW/W50pSfCBNDUP+0rispnT0TW4SocEyJ0OUUj9OYNko3JVGRFDhOY4m/DMJqKQLz9vUxnhClYj2eqXHvji74Hc/0Lx4z3Tk+6o27fjJRAppAOUNFVtlvD0NqfxPZAOrpViQJTKVERNMPWiCQFqSKp1dQgo1KBWLV65ZhA/Fd5cXx6Xay/g6yYBcIE2cRwT2bMMDc3BmpLdjS7/01yvmHu7B/5L2dHL9ImyjqEe3KjR7mp0ThbMlP5tS05Zn2dTp0FdnOa5pgV5BPlUud2fIfeymzent7BNmL56VQ6JVTXO7N679r0Knp1tXOrdtGmVm1uoPlV7G7HL4736xPdNG5Zgba37n9thk+fUcQ5ZM/ZMopXsD/iooDToTwPDkLMoqCDfCN90ccR+XOizyHiuYZzpLJXR1F01OlSAMmTnwDqznD4sGBZSSPV2/Wdnd2BGwJeG3SOKRGnV0O31gkV63RBZ4JnJLn89Zc/J0P16vTF4jTgqg6kRLi7EuUGwqr21JkPoY9yDHTtmDzHZAV0PJh4C8I9idUH1BQ/qUIF7ffQ/hgmcfggomXPJkIKGWVC2HbQcHk7AWpEAcqnJQponglcSMflzdZo8Odc8GaYLoAyiiOlUUHrjjSm0BopVvAGyyG8V5cMvYHWvKjHG5wcQGi2a4lV1SUJrVeTXEDX9UEkQeNgknY3OpBmQ++fEBVdVwcRBY2DiZqV/UCedbUmzerdvO24gypj9h4q7p4+onBTb942z3JzIc1KnsQU7lV2mFwNvWqFM3iPccTh9Hx6PrLKFu+0kpkbriPSt2CGo7iEu8a50wFX5SWOske4wsAf9KCji4sLxw91kTeU7KrooyNCXH/VuJYAWLOGsxovr/ttsGdnZx/k1wbxmQNiAKL5fN7UrBtqLNagYkhsguzxq7YnGANLojYWuDI24gyfFjjP0lq4o7iA8nj20TwhRnZfFnDnEh8yKAd42E3gSZjuxRA9OoihrsCfWs9OX2EzsDf0ujfj3d5ss1fBiofaaIwFoQ7AdfYJmQOXH60xTp74gMOELWDigx9lnhMW4sKtFJiD3+b1RgyLHIdkMCP8EVaqV1ED2z4sBZDeZZzYmdVww34K0s6Kh1g1GhPxXeWtpC0tN9JXC5Ol50KLta09xJufprSSWlnrzoxPm4XJTMlWRu2nrfXfQsWOkw==)

JavaScript 系列九：第6課 ── 學習用外部狀態管理 vue 元件

[交作業](https://sfc.vuejs.org/#eNrtls1uGzcQgF+F2BSwA2hXTt2gwFYRGqCHHppLD71ke6B2ZyXa/Cs5K0sN/O4Zcrk/kiUnDxBDEMjhzHB+qG/8JftobbHvICuzla+dsLiutFDWOGSfjn8ILs2Wtc4odlMsB0EwuKk0Y5WGQ1RtoOWdRPYlSGtD9ho0+rIXsNHVImyf43fDkd++HRQcYOf0sGPM78zTRwkOP5mGy5K1XHqIdsPpnyCluXD6HK+oNH1WyzEl2iAoKzkC7RhbbTpEo9nvtRT144cqO72QfWDoOqiydZStlr36ddMpmsk0yk5Mo7k65k1f132uTAPyxe1kG7VxjJm9QYEShmhOUiGXk1ptNFLl138ZB4oJ6zvFGiONY14g4wqQ2qM91BgKzngjrPCiFnrLQAos2N/gyMSBpeBBN52PhnsjO4vhhrTyDPagBbmj/jsz2G0k141AITyz4Fpw5ILWaJCrBQPOODKjNIn2IJnu1H8dVwwO4GpB7gU9G8V4hwumOdLdStBj5Iv+Eib5htIqXsu/L3aOcMC1eTzTXC3H2n+7HVNHr7cjdfhHO76nHbU0Hl7tyMkhbT0eqchBL/3kEh4sbxoqUcne2wN7d2cPv/XyunPeuJLCE1R2l6SKu63QuRPbHZaTes+HeEO2yHrk5Yrb4sEbTTiMd1XpwFfZyLIqI/yFfZXtEK0vl0vf1oGJD74wbrukVeE6jUJBAV7lG2eePDhyXGUJUtHHkoR7cHnoCrXGvebzTPWF3wF6lMqc0idYr6gNL2lN5XSGbmSfb+Lz/4dLovu/MVCyUCJg/PNNZwnYUF5QCbjvEJqpQLgPCuM+/G0BJ9j3fwn5uBO+mNxOGv2YSMAn8+j0zEc0/ikEeXshwgXrbWY+h2VcVDjcQT/EnWmmeUVvKbzW05C/dVmcQuNl6aphHF2fRcSVRuzpQu49sYdcBuQQjQKFesFQmx5E9LOZG9TcNeMJne3uxzXtvDRIv14FpBmhRaoUC0kni+XMZGWvWSeWXbK368jSuDmfjrGQs/go3bnXGSEueZ4Nz7ClvBM3+tV1YoQnRcM4tW/D68etM51u8jrgt2Ruu+G3dwuWPsWvbxMurCHCEvnovwpxgCZJ0diS3aVNQsmwldDOdhtDEatpT8ClAI/kTsIAqofOo2iPFEssaclq+h6BxaXY6lxQZvQgZyfxKRWh3dfTetO27ci9Q/4kGtwRJ+8mSO4ggfD9JBuB+vMk+664veU15BvAJwCdlII+Md3RUItlpMg6NRzSxCCA5Y4mXUfZ3U8wHlLb3S/Syg5pXsiih/pU5TGDXjDzN3qRQkM+ZD9LtKVkci/+J2C9++VlPKejp++NB9n2hckJyOchnE2l01DnY+f5Kw8f05k=)

JavaScript 系列九：第5課 ── 學習 Vue 的 slots 觀念

[交作業](https://sfc.vuejs.org/#eNrNVMFunDAQ/ZURPSSRAqRpc6F0pebe9hKpqsTFwMB6C7ZlD5tso/33DsaQ3e02uVZascz4zfMMfs/P0Rdjku2AURblrrLS0KpQBcneaEvwdXcvlEILjdU9XCTpnBhLLgoFUCh88tAaGzF0BM9jttJcr1CRy6YELFTXY7j3z1qQuLyaARZpsMpHU2LvkYXiX56+9KZywt50gpAjgLzfxeXUZNUJ5z4XUQjLNm6t2BWRxwH81AOsxRah0464RQZVJLUC0kBrBKkIrUJK4GEtHQhjgP9003RSYTJxLHvDO+GLAzfAw9j892/wQzYyYNPjRtOlUx+/2bzFuojA6kHVWP+PMxwtcuho1024JEwRjtaIupaqzeD2xjx9mnK9sK1UcamJdJ/B+5eVWjom3WXQdDjnNoMj2exinphYVhk4IyqMS6RHRBVAopOtiiU3xbKrGIY2rFS60zaDd03T+IyXVhIEMndZiupX6z83b+Px4+oxns/k33BenNEsWP8xoutoslLcC5NsnFZsNE9QhAVXRItHiohtNcZFtCYyLktT11Sj1zYu0bZN+S2xg2J7YoKuj0urHx27ccMs3lKBI+XkFi23y9qxaF/jPIH+xTu7kEc5dP/JhXHuFuCDt5p3nCP2+CTmDO617lCo0PN0Hbzh81puIZtd8rwwhZf9YvPcrHLXaUpXeWrmXDmwzGahF+QBoESPzDWZgOt5d06vJmuOYj+oylPe/1XNm3nMSdkZ3ATxNazZ2MnfyCr/GFTuBTXRz2XVYN2oIqO9iUPxYp0Dg5Ta8lFloPiKPUrFVtRy4A9+t2BPlX9Ot2SFYj+xAihg+Dgp9ulGW3bnYAzaSrh5u3MjcdVYIMePmbEXO7hJPrjTabO1ZrW94qG2FJe3d3fX8PJgnquZp6AknPjCcX70QxPu/wAmEkzo)

JavaScript 系列九：第4課 ── 學習 Vue 的 v-model 觀念

[交作業](https://sfc.vuejs.org/#eNqNVF1v0zAU/StWNtRNapJuowhMmYA3HnhC4oXw4CZO5+HYxna6dVX57Vx/pWk7TVvW1r72uT7n3Btvsy9KFeueZjhbmFozZW8rwToltUXfN9+E6i1qtezQpCjj3G2fVAKhStBHv7GhLem5RVsXrSWgBRXW4BBAKdHUzXb+uyGWXFymdU1tr0WaIWTpo8VI9Jz7zQDyyErA/6IcaMLE0k5xYinMEFp0m5x5xuu8kw3ln6rMpaoyxMnST1vGOW0gEAaINRD0mPyqym4XZUrx2oSyt5wJnzINx0mvj5MuyoFyNs2C0XlHVHFvpIAieA8A7RdMlQ0eVhnY7uZVdmetMrgsTVu7WtybQupVCaNC98KyjhbUdPlSywdDNSSusmijz1FCcE11rqloqKb6pZxHW0/yprKAlFFzHPRSBYadNglCSks4cF9z7+9PwnuK0Q+rmVhF0ih4fRINFcToq5ScEjHEUxlOVxjEDpKEXgSGHXPd+mvSK2hMivdcJr+jxJfarmFrP4Bh6BYcOsA1hd0ouu8aTf/2TEO3REbwh2tOjIEt2yQo/E5HQtJoFxxPyLVjCMg9XThitOGzZwMbzp3Ai2fUTdE5XcOrWliiVxSK56KX0LPBl4V3HuFW6qjnFm23oR5ot1uUfhRMKIMLo/72Thm74cEmWB9qLw2zTAoMhsBWtqYfw0IHNBiE5zP1iGY+6F/9YGtEP7DG3rk9byJKkaaBomJ07WBX8BUXWilsbtgTtNTVuxjd5wNZdW/Qv6BnGoNgAWtSMJ5opcIofzsfp3CfYMSJKLI0kvc2ifLoIAYgtIWrbcRxT/560AwYTURKB3g0K25MXKp7baSGMLRU2g3D3EOgUh1GNVHMgo6nQMHzLeKNF9kuSf1npWUvmryW3OU7ozQxXkoN7zvcwHCPH4TypbRWwgk3wBVEglP+WEXgikhsYrcewMd6jo8GcfMgbkwU30m4el6g27x3zykuVDXhDmk7iwPts9ls3tb1CD5c3wdQqNUeUzfueU6S33ssZHiBD6Wc5v0wc09CwlXjX5ps9x9b+YWD)

JavaScript 系列九：第3課 ── 學習 Vue 的 events 觀念

[交作業](https://sfc.vuejs.org/#eNqVVM1u00AQfpWVAZmqcRyoqKgJVSnXlksvkeoeHHuduLV3zXrdpkSRkDiAKiQOoKIKxI9A4gTiCILXSdSeeAVmd+1NXKcVRHGc/Xbm25nZb2Zo3EvT5n6ODcdoZz6LUr7qkihJKeNo83A955wSFDKaILNpl4BwMF2CkEvwQJoGOPTymKOhQH0K/gQTnjkKQJqqIZYj+Rt43Lu+UBowzHNGyhVCWfQIg/u22dkyG6Z4NuHZgKezYe5IAvEhDrqxXKxGktsl8G3bOhdYcJyksccxrBBqJ4dWV6UVe10c33WN0PNxl9I914DQY8oAurK0ctsLlgHheMDvl2gYhq6x2rY1h6Lssouos4e5x/AMMWUe6QmgwttqtQBSxv9Cv2+F0lFUCdFQVQsYHH0uAGIt3npZZ+5fGPjibDFUePVKIEZzEqA1LwgeAEgWwat+SJ3c+h/yJCJ5Jukt8KvTp5AlP4xFmsOQEr4FuTqIoEVkpgNzBC5KHme/3k1eHo2PPpyevJ88O578eAN//vx+fvb45PTTx8nx0/HX15O3Tyavfp5+Oxp//jL+/kLy2ykQtG0tIqNhqP6wEi9t7maUQO9I3brFBtyEFr5rQK+ItWv0OU8zx7az0BcNtJs1KevZ8K/JcsKjBDdxllhdRg8yzIDYNQphSw4bwH3MLIZJgBlml3GeM63xlo0Cqcy2dGUGuHAj9dZGKGUUTtTpcXmnDtriLCI93ZfydmuovuTajpK+g9YpjbGnxkQ5BmrGUhjnbdVQQSjBvE+DaYQQSxz5e9NJIwPpR1nzKk4ift0U4jUXNHl1U4nPXCh35YyZjprL5kyh+ak4za7n7/Vk8Jasj+moOjXKcun6gGqn8SDk+LGXZcCxPSwLpd6NshbyNWqIcu1Ufddk+uAr37obhkPVjWg0gikuZK57akbrMi2ZgHQrUioK2aUM5AWtBrP+TiEOKCbcFAzlVjooMD9nmUgupRHhmBWocraYF0Q5XNYtbZ54rBcRq0vhqASIajss6vX51ENeRVOVoxqZJm/NGKqhouxcfhAFvO+gpWm0fazoZ6A4ItgqccWFkJg01kEBrrRK+HxarWszZ3e2ygClt9K2rpSymWtSzXVzjsnNKsvGPJMqS2eejc5aaVtevDH6CxDDs7Q=)

JavaScript 系列九：第2課 ── 學習 Vue 的 props 觀念

[交作業](https://sfc.vuejs.org/#eNqNUk1v00AQ/Suj7SEgYjsUqMgSKlEQN05c97KJx66LvbuaXZeEKP+d8foDpxFVJcva+Xrz5s0cxRfn0scWhRQbv6PKhVtlqsZZCvDjcKfzEqEg28AizQa7S18oA6AM7mNijoVu6wDHzruzXG3QBC97B4xAy846xX+ug371eowThpbMaDFu9z/FbGX422QTNTYCNq7WAdkC2DSHZBtZ1nqL9Wclrt5/W998v1aCmdSW5p7bTTam/6d4XmZJmxLZEXAfvo5Yq9XqJUDr9frNDIswZ4tsa3LMz6s32TSQWIpe+qTRLn3w1vBaoipqCHglJlWV4EV0thL3ITgvs8wXu247Dz61VGb8Sqk1oWowRd8kW7K/PRIDKxG3MGBk7HxESgiZHSE9h/kk9QJ3XBqPMjuXs+tSrOfl2QA4stxwuoJeOwk/A1WmHPjCv2VcRKL0F95Bcwl31tao+YDmx/XcZXmnDchdrb3nDR4noOFx4oVKHw41dlFYbPXuVxljSWS+kP0Ey3GQiTk3FrEFwPEYWZ8iHybDLc9PIvKKXWJF5DTqpfOcJ5Vw7fZw4/afenejqaxMQlV5HyS8XU2BrSXeWUI6r1rW+d0UKKwJia/+oISPk3MgfVUURfREhukw+0jhCeSHsVmvbM86iNNflFl2Zg==)

JavaScript 系列九：第1課 ── 學習 Vue 元件基本觀念

[交作業](https://sfc.vuejs.org/#eNp9UstqwzAQ/BVVl7QQW/RqTKCX0h76B7qo9rq2iR5IcloI/veuHnaaNAkYs7OaWWlGOtIXY8rDBLSitWvsYPyOq0EabT15A9GCJZ3VkmxKlmAgb1bKhxjUSgjgfPlVa/9nQoKZQghX8BNpLXRi2ntyDN1Go1aB8q5KDZIPsk0g7JLLNC/Uc+y0wovHp0VlwU9WLShsF/5zpHOFX81Wxwg8SLMXHhARUmfvLKFoM9fZU0A1W0V0S5PnQgpTjk4rTDRuzfOC43Q1xClmEDCnvffGVYy5rgnBjK7U9othVdpJ+UFCCU4Wn1Z/O4xuxCnZfJzBsHkAW1hQeFzM4s7MC+q/uUswaOV01eFdnCfTP+/eiZCkj5yHmmHjMorlJdxWS2Rc154eyW11FznX9PMvtQ7wTA==)

使用 inline-block 版面配置

對，因為有空隙，所以會換行 我用參考連結的其中一個方法修改，如下 ``` nav { width: 25%; display: inline-block; vertical-align: top; } nav ul li { font-size: 16px; } .column { display: inline-block; vertical-align: top; width: 75%; } .column p { font-size: 16px; } .elem { position: relative; border: 2px solid; font-size: 0; } p { margin: 10px; } * { box-sizing: border-box; } ```

使用 inline-block 版面配置

``` inline-block ```會讓元素和元素之間有空隙 這篇參考一下 https://ithelp.ithome.com.tw/m/articles/10247993 也可以往這方面去搜尋

JavaScript 系列八：第7課 ── 國家資訊與地圖應用程式

交作業 https://replit.com/@birdiewu/Guo-Jia-Zi-Xun-Yu-Di-Tu-Ying-Yong-Cheng-Shi-world-map?v=1

JavaScript 系列八：第5課 ── 體重追蹤應用程式

交作業 https://replit.com/@birdiewu/Ti-Zhong-Zhui-Zong-Ying-Yong-Cheng-Shi-online-weight-tracker?v=1

JavaScript 系列八：第6課 ── 天氣查詢應用程式

交作業 https://replit.com/@birdiewu/Tian-Qi-Cha-Xun-Ying-Yong-Cheng-Shi-weather-in-taiwan?v=1

[作業問題] JavaScript系列八：第5課

感謝站長細心講解！！！ 又學到一課👍👍👍(筆記下來)

[作業問題] JavaScript系列八：第5課

太感謝了！ 我來研究一下

JavaScript 系列八：第4課 ── 行事曆應用程式

交作業 https://replit.com/@birdiewu/Xing-Shi-Li-Ying-Yong-Cheng-Shi-online-calendar?v=1

發問-自學課程標題命名問題

+1 我初期翻閱時容易混淆 後來站長有新增搜尋功能 搜尋關鍵字可快速找之前課程的資料複習 但對剛來的人來說確實閱讀上會有點困難

JavaScript 系列八：第3課 ── 分帳應用程式

交作業 https://replit.com/@birdiewu/Fen-Zhang-Ying-Yong-Cheng-Shi-online-split-bill?v=1

JavaScript 系列八：第2課 ── 筆記應用程式

交作業 https://replit.com/@birdiewu/Bi-Ji-Ying-Yong-Cheng-Shi-online-notepad?v=1

JavaScript 系列八：第1課 ── 碼表應用程式

交作業 https://replit.com/@birdiewu/Ma-Biao-Ying-Yong-Cheng-Shi-online-stopwatch?v=1

表單動畫特效

真的欸！沒想到這部分，感謝～

JavaScript 系列七：第7課 ── 認識 Template Refs

交作業 https://jsfiddle.net/birdie2019/54pzj7w2/432/

JavaScript 系列七：第6課 ── 認識 Lifecycle Hooks 與 Watchers

交作業 https://jsfiddle.net/birdie2019/54pzj7w2/415/

JavaScript 系列七：第5課 ── 學習 Vue 事件處理的寫法

交作業 https://jsfiddle.net/birdie2019/54pzj7w2/396/

JavaScript 系列七：第4課 ── 學習 Vue 迴圈的寫法

交作業 https://jsfiddle.net/birdie2019/54pzj7w2/94/

JavaScript 系列七：第3課 ── 學習 Vue 條件判斷式的寫法

交作業 https://jsfiddle.net/birdie2019/54pzj7w2/84/

JavaScript 系列七：第2課 ── 體驗一下 Reactivity 的效果與便利

交作業 https://jsfiddle.net/birdie2019/54pzj7w2/55/

神奇的聊天機器人

資訊落後ＸＤ

JavaScript 系列七：第1課 ── 認識 Vue 基本環境與 render state

交作業 https://jsfiddle.net/birdie2019/54pzj7w2/51/

JavaScript 系列三：練習4 ── 表單驗證

我是用HTML ```input```標籤的```required```屬性和 CSS ```:valid```和```:focus``` 選擇器做出動畫的 https://developer.mozilla.org/en-US/docs/Web/CSS/:valid 這部分是我看國外別人的作品學到的！

神奇的聊天機器人

因為太厲害了，我也跟機器人聊很久！ 身邊有人也用這招! 還說要利用他來寫論文，叫AI做報告XDDD

JavaScript 系列六：第7課 ── 資料序列化

交作業 https://jsfiddle.net/birdie2019/7haz6fLj/61/

JavaScript 系列六：第6課 ── 認識 data model 的優點

交作業 https://jsfiddle.net/birdie2019/7haz6fLj/39/

JavaScript 系列六：第1課 ── 認識 data model 與 render function

從這一課學到的 https://codelove.tw/@howtomakeaturn/post/Aq5Agq 我也覺得這方法很棒！

JavaScript 系列六：第5課 ── 熟悉匿名函式

交作業 https://jsfiddle.net/birdie2019/7haz6fLj/34/

[ 作業問題 ] JavaScript（六）第3課

謝謝：）

JavaScript 系列六：第4課 ── 熟悉 render function

交作業 https://jsfiddle.net/birdie2019/7haz6fLj/30/

JavaScript 系列六：第3課 ── 認識匿名函式

交作業 https://jsfiddle.net/birdie2019/7haz6fLj/24/

[ 作業問題 ] JavaScript（六）第3課

成功了！謝謝指點！ 之前JavaScript（五）第四課站長有提過，果然自己遇到了才感受的到這個問題！

[ 作業問題 ] JavaScript（六）第3課

重新做了一遍 https://jsfiddle.net/birdie2019/7haz6fLj/23/ 但第29行console.log(index) 結果都為2 還是刪除不到對映的todo，請問我是哪邊有做錯？

JavaScript 系列六：第2課 ── 認識陣列操作

請問是這樣嗎？ https://jsfiddle.net/birdie2019/7haz6fLj/15/

JavaScript 系列六：第2課 ── 認識陣列操作

我有點不清楚意思@@ 是指不在input裡設id或class，要想辦法取到input的值嗎？

JavaScript 系列六：第1課 ── 認識 data model 與 render function

交作業 https://jsfiddle.net/birdie2019/7haz6fLj/9/

[ 作業問題 ] - JavaScript 自學網頁の嬰兒教材：第6課

感謝解釋！

JavaScript 系列五：第7課 ── 學會 AJAX 與 data attribute 的結合

交作業 https://jsfiddle.net/birdie2019/5sfhbq8v/23/

JavaScript 系列五：第6課 ── 學會 AJAX 與各種 HTTP 請求方法

交作業 https://jsfiddle.net/birdie2019/5sfhbq8v/15/

JavaScript 系列五：第5課 ── 學會 AJAX 錯誤處理

交作業 https://jsfiddle.net/birdie2019/5sfhbq8v/12/

JavaScript 系列五：第4課 ── 學會 AJAX 基本原理

交作業 https://jsfiddle.net/birdie2019/5sfhbq8v/8/

JavaScript 系列五：第3課 ── 變數作用域、箭頭函式、ES6 語法

交作業 https://jsfiddle.net/birdie2019/0akLh4r8/7/

JavaScript 系列五：第2課 ── 學會 Local Storage 相關功能

交作業 https://jsfiddle.net/birdie2019/wkqbvhma/378/

自學網頁の嬰兒教材：JavaScript（四）作業分享

我只是菜鳥，還有很多要學，一起加油～～(ﾉ>ω<)ﾉ

JavaScript 系列五：第1課 ── 學會 Cookie 相關功能

交作業 https://replit.com/@birdiewu/DarkvioletClutteredDigits?v=1

JavaScript 系列四：第7課 ── TinyMCE 套件

交作業 https://jsfiddle.net/birdie2019/m8dforLn/23/

JavaScript 系列四：第6課 ── kenwheeler/slick 套件

交作業 https://jsfiddle.net/birdie2019/k6vgcod0/52/

JavaScript 系列四：第5課 ── xdan/datetimepicker 套件

交作業 https://jsfiddle.net/birdie2019/y7mzws6r/18/

JavaScript 系列四：第4課 ── jQuery 套件

交作業～ 原生JS: https://jsfiddle.net/birdie2019/ebax340f/2/ jQuery: https://jsfiddle.net/birdie2019/eabr2jh3/7/

JavaScript 系列四：第3課 ── Chart.js 套件

交作業 https://jsfiddle.net/birdie2019/upLn7j1b/6/

JavaScript 系列四：第2課 ── vanilla-lazyload 套件

交作業 https://jsfiddle.net/birdie2019/401xa29h/104/

JavaScript 系列四：第1課 ── autosize 套件

交作業 https://jsfiddle.net/birdie2019/j69s8vdc/38/

JavaScript 系列三：練習7 ── carousel 輪播元件

交作業 https://jsfiddle.net/birdie2019/t6uxb9df/30/

JavaScript 系列三：練習6 ── dropdown 下拉式選單

交作業 https://jsfiddle.net/birdie2019/xb0ka495/44/

JavaScript 系列三：練習5 ── collapse 折疊效果

交作業 https://jsfiddle.net/birdie2019/dkncrv03/43/

JavaScript 系列三：練習4 ── 表單驗證

交作業 https://jsfiddle.net/birdie2019/bdavsur4/91/

JavaScript 系列三：練習3 ── modal 互動視窗元件

交作業 https://jsfiddle.net/birdie2019/9p3zsthL/17/

JavaScript 系列三：練習2 ── toast 吐司元件

交作業～ https://jsfiddle.net/birdie2019/fmc6b8ht/49/

JavaScript 系列三：練習1 ── alert 示警元件

交作業 https://jsfiddle.net/birdie2019/4ur1c7xf/34/

JavaScript 系列二：第7課 ── 用 Selector API 選取元素

交作業 https://jsfiddle.net/birdie2019/wkqbvhma/358/

JavaScript 系列二：第6課 ── 讀取與修改 DOM 元素的 style

交作業 https://jsfiddle.net/birdie2019/wkqbvhma/350/

JavaScript 系列二：第5課 ── 認識 onchange 事件

交作業 https://jsfiddle.net/birdie2019/wkqbvhma/273/

JavaScript 系列二：第3課 ── 認識 for 迴圈

已修正～ https://jsfiddle.net/birdie2019/wkqbvhma/214/

JavaScript 系列二：第4課 ── 讀取與修改 DOM 元素的 class

交作業～ https://jsfiddle.net/birdie2019/wkqbvhma/223/

JavaScript 系列二：第3課 ── 認識 for 迴圈

交作業～ https://jsfiddle.net/birdie2019/wkqbvhma/46/

JavaScript 系列二：第2課 ── 從 DOM 樹移除元素、動態加上 onclick 事件

感謝提醒，已修正～ https://jsfiddle.net/birdie2019/L40td21h/139/

JavaScript 系列二：第1課 ── 認識 DOM 樹、新增元素

我原本想得太複雜了 從新修改後～ https://jsfiddle.net/birdie2019/L40td21h/102/

JavaScript 系列二：第2課 ── 從 DOM 樹移除元素、動態加上 onclick 事件

交作業～ https://jsfiddle.net/birdie2019/d914vs70/75/

JavaScript 系列二：第1課 ── 認識 DOM 樹、新增元素

交作業～ https://jsfiddle.net/birdie2019/m8doekjc/6/

JavaScript 系列一：第7課 ── 認識巢狀結構

看了你的作業，學到其他的技巧，感謝分享～

JavaScript 系列一：第7課 ── 認識巢狀結構

謝謝指點和示範！

JavaScript 系列一：第6課 ── 認識資料型態與轉換

了解，感謝回覆～

JavaScript 系列一：第7課 ── 認識巢狀結構

交作業～ https://jsfiddle.net/birdie2019/yx5frso2/89/

JavaScript 系列一：第6課 ── 認識資料型態與轉換

交作業～ https://jsfiddle.net/birdie2019/y86ez2o1/107/ 估價功能有出來，但不知道total這樣寫是不是重複宣告＠＠ JS的第16行和第22行 ![](https://i.imgur.com/B0cF9Cc.jpg)

JavaScript 系列一：第5課 ── 基本的 if/else 條件流程控制

交作業～ https://jsfiddle.net/birdie2019/9c2wo8vr/110/

JavaScript 系列一：第4課 ── 基本的陣列操作

交作業～ https://jsfiddle.net/birdie2019/9c2wo8vr/98/

JavaScript 系列一：第3課 ── 修改 html 的內容

交作業～ https://jsfiddle.net/birdie2019/xzckyvmp/57/

JavaScript 系列一：第2課 ── 基本的變數操作、從 html 取得內容

交作業～ https://jsfiddle.net/birdie2019/xc5z47Lu/97/

JavaScript 系列一：第1課 ── 基本的函數操作、onclick 事件

交作業~ https://jsfiddle.net/birdie2019/8he51za7/66/

熱門搜尋： 使用 開發 工作 專案 分享 ar 技術 網站 id 作為 for API github 作業 學習 第一 Ml js html javascript 測試 搜尋 AI java Javascript Git git JAVA HTML 前端 api app JavaScript %' ui javasc Java 語言 系列 開源 CD user COM 網頁 ul url 架構 結構 套件 jav ＣＳＳ 框架 Line 清單 ci GIT 編輯 後端 AWS 研究 py Node go css Github bi 主題 react 工程師 Ai 資料庫 伺服器 部署 REACT this Can console create aws json with 遊戲 CSS 部落格 查詢 Javas component JS Python class 新手 node 登入 分析 入門 練習 design 新創 vue 作品
🛡️ 隱私及網站安全：本站註冊過程「不須提供任何個資」，只要 E-Mail 與帳密即可註冊，請安心註冊！線上付款過程使用「綠界科技 ECPay 」第三方專業金流廠商，全程在「綠界科技 ECPay 」網站進行付款程序，本站「不會紀錄任何信用卡資訊」，請放心付款、解鎖課程！您隨時可以透過 FB 粉專或者 Email 聯絡站長，請求刪除網站上的個人資料。