iT 邦幫忙::一起幫忙解決難題，拯救 IT 人的一天

0 Like 0 留言 908 瀏覽

技術自己的輪子自己造－－前端中的常見方法實作

最近開始重新閱讀JS的文章跟教學影片(網路上大推的Javascript: Understanding the weird parts)，原因是想要把荒廢的JS...

bywater529 ‧ 2022-11-13

0 Like 0 留言 671 瀏覽

鐵人賽自我挑戰組 DAY 30

手刻武器庫，30 天前端學習心得系列第 30 篇

技術 Day 30：完賽心得（2022 自我挑戰）

一、前言終於完成鐵人賽啦！可怕的不是每天的截稿期限，而是要在同一天寫兩篇「完賽心得」，而且內容還不能一樣，雖然我是有點想直接複製貼上，不過這樣子好像有點說不...

東尼先生 ‧ 2022-10-14

0 Like 0 留言 619 瀏覽

鐵人賽 Modern Web DAY 30

從零開始手刻網站，30 天打造我的前端武器庫系列第 30 篇

技術 Day 30 : 完賽心得（2022 主題競賽）

一、前言終於寫到第 30 天啦～真是可喜可賀（超感動的）！沒想到在比賽的這一個月裡，時間居然可以過的這麼快，每當寫完文章後，不知不覺間天也跟著黑了，更沒想到...

東尼先生 ‧ 2022-10-14

0 Like 0 留言 3441 瀏覽

鐵人賽自我挑戰組 DAY 29

手刻武器庫，30 天前端學習心得系列第 29 篇

技術 Day 29：前端面試題目整理

一、前言本篇要來整理常見的面試題目，整理的目的只是為了日後方便閱讀，文章內的資訊都是從網路上收集而來，若是有侵權情況，煩請告知謝謝！二、非關技術問題 2...

東尼先生 ‧ 2022-10-13

0 Like 0 留言 688 瀏覽

鐵人賽 Modern Web DAY 29

從零開始手刻網站，30 天打造我的前端武器庫系列第 29 篇

技術 Day 29：組件集大成

功能實作 : Demo 一、前言今天的目標是將現有的組件組成一個 SPA 網頁，最終目標是先把網頁寫出來，至於優化和除錯的部分，就要等整個功能都實作出來...

東尼先生 ‧ 2022-10-13

0 Like 0 留言 1210 瀏覽

鐵人賽 Modern Web DAY 29

擊敗前端面試大作戰！系列第 29 篇

技術 [擊敗前端面試大作戰] 把你的履歷分區塊 — — 前端工程師怎麼寫出滿分前端履歷

「一份好的履歷，距離拿下理想工作就成功了一半」這是過去一個老師跟我說過的一句話，而我在每一次找工作的經歷中不斷驗證出這句話的重要性。在求職過程中，面試官想要在...

bywater529 ‧ 2022-10-13

0 Like 0 留言 1542 瀏覽

鐵人賽自我挑戰組 DAY 28

手刻武器庫，30 天前端學習心得系列第 28 篇

技術 Day 28：前端測試入門

一、前言測試是前端裡面的一個重要單元，雖然說很重要，但是在一般的練習專案中，不會特別的去撰寫測試單元，自然就不會去研究相關的資料。趁這次鐵人賽的機會，來好好...

東尼先生 ‧ 2022-10-12

0 Like 0 留言 591 瀏覽

鐵人賽 Modern Web DAY 28

從零開始手刻網站，30 天打造我的前端武器庫系列第 28 篇

技術 Day 28：置中功能實作

功能實作 : Demo 一、前言本篇主要在探討「各種 CSS 置中排版的技巧」，這些技巧主要是參考 Amos 大的「CSS垂直置中技巧，我只會23個，你...

東尼先生 ‧ 2022-10-12

0 Like 0 留言 610 瀏覽

鐵人賽自我挑戰組 DAY 27

手刻武器庫，30 天前端學習心得系列第 27 篇

技術 Day 27：React 的 Hook - 概觀

一、前言 Hook 的東西不太可能用幾篇就可以全部介紹完畢，所以在這邊先列出一些使用 Hook 時可能要注意的地方，再慢慢將這些知識點給補上。在第二章節介紹...

東尼先生 ‧ 2022-10-11

0 Like 0 留言 786 瀏覽

鐵人賽 Modern Web DAY 27

從零開始手刻網站，30 天打造我的前端武器庫系列第 27 篇

技術 Day 27：CSS 選擇器功能實作

組件實作 : Demo 一、前言今天要來實作CSS Selectors（選擇器），選擇器的最主要用途，就是讓 CSS 可以更精準的選取到想要的元素，如果...

東尼先生 ‧ 2022-10-11

0 Like 0 留言 539 瀏覽

鐵人賽自我挑戰組 DAY 26

手刻武器庫，30 天前端學習心得系列第 26 篇

技術 Day 26：最有生產力的一年，價值，就從認識自己開始

一、前言今天來談談一些比較輕鬆的話題，由於國慶日放假陪伴家人，我就沒有去研究 React 的相關用法。雖然這篇不是純技術的文章，但是應該會是一個很好的經驗談...

東尼先生 ‧ 2022-10-10

0 Like 0 留言 410 瀏覽

鐵人賽 Modern Web DAY 26

從零開始手刻網站，30 天打造我的前端武器庫系列第 26 篇

技術 Day 26：Flexbox 功能實作

組件實作 : Demo 一、前言今天要來研究一下 Flexbox 的寫法，它是一個用來排版的神器，可以很有效的處理元素水平與垂直置中對齊，本篇主要是參考...

東尼先生 ‧ 2022-10-10

0 Like 0 留言 567 瀏覽

鐵人賽自我挑戰組 DAY 25

手刻武器庫，30 天前端學習心得系列第 25 篇

技術 Day 25：React 的 Hook - useState 與 useEffect

一、前言昨日誠摯的建議（洗腦）各位學習 React 的 Class 寫法之前，可以先學習強大的 Hook，或許是一種不錯的入門方式。今天要持續的來探討 Ho...

東尼先生 ‧ 2022-10-09

0 Like 0 留言 477 瀏覽

鐵人賽 Modern Web DAY 25

從零開始手刻網站，30 天打造我的前端武器庫系列第 25 篇

技術 DAY 25：前端小功能實作-不分類

一、前言這篇收集了一些常見的組件，每個功能的程式碼並不多，於是決定將這些程式碼集中寫在一起啦～希望這些組件可以被重複利用，並且發揮一定的作用。那麼，現在就來...

東尼先生 ‧ 2022-10-09

0 Like 0 留言 1521 瀏覽

鐵人賽 Modern Web DAY 24

從零開始手刻網站，30 天打造我的前端武器庫系列第 24 篇

技術 Day 24：Scroll 組件實作

組件實作 : Demo、Demo2 一、前言 Scroll 的意思為滾動，它常見的應用，比如在頁面捲動時所產生的效果，這個效果被稱作為「視差滾動」 Par...

東尼先生 ‧ 2022-10-08

0 Like 0 留言 812 瀏覽

鐵人賽自我挑戰組 DAY 24

手刻武器庫，30 天前端學習心得系列第 24 篇

技術 Day 24：React 的 Hook 初探

一、前言昨天我們把 React 的環境架起來，並且執行「Hello World」程式。今天要來學習一下 Hook 的寫法，至於 Hook 是什麼？以及要如何...

東尼先生 ‧ 2022-10-08

0 Like 0 留言 924 瀏覽

鐵人賽 Modern Web DAY 23

從零開始手刻網站，30 天打造我的前端武器庫系列第 23 篇

技術 Day 23：Image Overlay 組件實作

組件實作：Demo 一、前言 Image Overlay 指的是圖片上的覆蓋效果，我們要做的是：「使用滑鼠移動到圖片上，頁面會從四個方向來滑入頁面，像是從...

東尼先生 ‧ 2022-10-07

0 Like 0 留言 876 瀏覽

鐵人賽自我挑戰組 DAY 23

手刻武器庫，30 天前端學習心得系列第 23 篇

技術 Day 23：React 環境建置 - Hello World

一、前言從今天起連續 5 天，我們會專注在前端框架 React 的學習上。學習框架原因不單只是因為專案需求，更多的原因是學框架對于求職來說，已經變成一種標準...

東尼先生 ‧ 2022-10-07

0 Like 0 留言 940 瀏覽

鐵人賽自我挑戰組 DAY 22

手刻武器庫，30 天前端學習心得系列第 22 篇

技術 Day 22：SVG Path 急速入門

組件實作：Demo 一、前言今天要來介紹的東西是「與繪畫相關的東西 - CSS 和 SVG」，CSS 來製作圖形是一件很常見的事情，至於為什麼會特別的提...

東尼先生 ‧ 2022-10-06

0 Like 0 留言 1198 瀏覽

鐵人賽 Modern Web DAY 22

從零開始手刻網站，30 天打造我的前端武器庫系列第 22 篇

技術 Day 22：鍵盤輸入事件實作

組件實作：Demo 一、前言鍵盤輸入監聽事件是一個很有用的功能，或許在瀏覽一般的網頁時，比較不常使用鍵盤控制。但如果是遊玩網頁遊戲，取得鍵盤的監聽就會變...

東尼先生 ‧ 2022-10-06

0 Like 0 留言 657 瀏覽

鐵人賽自我挑戰組 DAY 21

手刻武器庫，30 天前端學習心得系列第 21 篇

技術 Day 21：小作品展示

組件實作 : Demo、Demo2 一、前言昨天學習 Sass 的最主要目的，就是為了要看懂自己以前寫的東西，我把它統稱為小作品，當時的這些小作品我是照...

東尼先生 ‧ 2022-10-05

0 Like 0 留言 449 瀏覽

鐵人賽 Modern Web DAY 21

從零開始手刻網站，30 天打造我的前端武器庫系列第 21 篇

技術 Day 21：List 功能實作

組件實作 : Demo 一、前言 List 也是一種很常見的功能，其實 List 可以跟之前做的 Day 18：Collapsibles 組件實作搭配使...

東尼先生 ‧ 2022-10-05

0 Like 0 留言 1423 瀏覽

鐵人賽 Modern Web DAY 20

從零開始手刻網站，30 天打造我的前端武器庫系列第 20 篇

技術 Day 20：AJAX 功能實作

組件實作 : Demo 一、前言 AJAX（Asynchronous JavaScript and XML）中文翻作「非同步的 JavaScript 與...

東尼先生 ‧ 2022-10-04

0 Like 0 留言 595 瀏覽

鐵人賽自我挑戰組 DAY 20

手刻武器庫，30 天前端學習心得系列第 20 篇

技術 Day 20：Sass 學習筆記

一、前言之前在 Hahow 學習前端相關的課程，學了一點 Sass 的基本寫法，印象中大概學了 4 個月，後來使用純 CSS 作為開發環境，導致 Sass...

東尼先生 ‧ 2022-10-04

0 Like 0 留言 857 瀏覽

鐵人賽 Modern Web DAY 20

擊敗前端面試大作戰！系列第 20 篇

技術 [擊敗前端面試大作戰] 前端優化

今天是擊敗前端面試大作戰的第二十篇了！！！！我們前面討論了 HTML/CSS、Javascript、React 和 Typescript，基本上主要面試會考到...

bywater529 ‧ 2022-10-04

0 Like 0 留言 1540 瀏覽

鐵人賽 Modern Web DAY 19

從零開始手刻網站，30 天打造我的前端武器庫系列第 19 篇

技術 Day 19：滑動頁面組件實作

組件實作 : Demo 一、前言滑動頁面組件 Overlay 的用途是當作側邊選單，可以用在隱藏一部分的資訊，讓頁面看起來更乾淨，反過來說，Overla...

東尼先生 ‧ 2022-10-03

0 Like 0 留言 884 瀏覽

鐵人賽自我挑戰組 DAY 19

手刻武器庫，30 天前端學習心得系列第 19 篇

技術 Day 19：jQuery 學習筆記-下

組件實作 : Demo、Demo2 一、前言今天要來繼續研究 jQuery 的用法，經過我非常努力的看書後，發現勾不起我寫文章的動力，索性就直接在網路上...

東尼先生 ‧ 2022-10-03

0 Like 0 留言 975 瀏覽

鐵人賽 Modern Web DAY 18

從零開始手刻網站，30 天打造我的前端武器庫系列第 18 篇

技術 Day 18：Collapsibles 組件實作

組件實作 : Demo、Demo2 一、前言 Collapsibles 翻譯為折疊的意思，所以它可以像是下拉選單一樣，點擊按鈕後即可展開內容，其實這個組件的作...

東尼先生 ‧ 2022-10-02

0 Like 0 留言 1489 瀏覽

鐵人賽自我挑戰組 DAY 18

手刻武器庫，30 天前端學習心得系列第 18 篇

技術 Day 18：jQuery 學習筆記-上

一、前言伴隨著前端框架的不斷演進，jQuery 的使用慢慢地式微，甚至出現了棄用 jQuery 的建議【1】。雖然某些公司專案開上可能不再使用 jQuery...