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

0 Like 0 留言 764 瀏覽

鐵人賽自我挑戰組 DAY 5

從freeCodeCamp進入前端宇宙系列第 5 篇

技術 CSS基礎介紹(3)

來輕鬆聊聊終於來到基礎CSS的最後一篇，這次要分享的是CSS的變量。想像一個情境，你正在負責一個網頁的視覺設計，而你需要在許多地方用上同樣的顏色(如:暗紅色D...

JackyHuang ‧ 2021-09-07

0 Like 0 留言 1746 瀏覽

鐵人賽自我挑戰組 DAY 4

從freeCodeCamp進入前端宇宙系列第 4 篇

技術 CSS基礎介紹(2)

來輕鬆聊聊今天的內容將著重在版面配置，利用這些屬性，可以讓一個網頁，從完全空白到能清楚的區分網頁中各種功能的區塊。背景背景設定如同border(邊框)...

JackyHuang ‧ 2021-09-06

0 Like 0 留言 1642 瀏覽

鐵人賽自我挑戰組 DAY 3

從freeCodeCamp進入前端宇宙系列第 3 篇

技術 CSS基礎介紹(1)

來輕鬆聊聊學會如何利用HTML編輯網頁架構後，再來要進入讓網頁美化的CSS了。還不知道什麼是HTML的人，沒關係，只要花兩天就可以學到基礎概念囉! 學HTML...

JackyHuang ‧ 2021-09-05

0 Like 0 留言 1706 瀏覽

鐵人賽自我挑戰組 DAY 2

從freeCodeCamp進入前端宇宙系列第 2 篇

技術 HTML基礎介紹(2)

來輕鬆聊聊學習完第一天的內容後，接著要進入到時常用到，而且重要的標籤了。藉由標籤可以做到表格、列表、表單等樣式，完整的HTML網頁架構又是如何呢?就讓我們一起...

JackyHuang ‧ 2021-09-04

0 Like 0 留言 9759 瀏覽

鐵人賽 Modern Web DAY 3

33歲轉職者的前端筆記系列第 3 篇

技術 33歲轉職者的前端筆記-DAY 3 什麼是 iframe 及使用心得

iframe 是寫網頁常見的語法之一在進公司前不知道有這語法但通常一個網頁內容左側或上方選單都是固定相同的內容，當時我還笨笨的每個分頁都複製貼上在改請...

a841722 ‧ 2021-09-03

0 Like 0 留言 1360 瀏覽

鐵人賽自我挑戰組 DAY 1

從freeCodeCamp進入前端宇宙系列第 1 篇

技術 HTML基礎介紹(1)

來輕鬆聊聊嗨我是Jacky，今天要來談談HTML。舉凡網頁開發、設計，不管聽過、看過甚至接觸過的朋友，可能知道藉由HTML與CSS這兩個程式語言，能夠組成我...

JackyHuang ‧ 2021-09-03

0 Like 0 留言 2310 瀏覽

技術面向前端的CDN解決方案! 全框架皆可使用

面向前端的CDN解決方案！前陣子想在Angular的專案下套用CDN機制過去我都是使用 webpack publicPath 來達成但使用Angular我不...

Ami ‧ 2021-07-28

0 Like 0 留言 13578 瀏覽

徵才均一【資深前端工程師】招募中！

均一平台教育基金會致力於使用科技，讓教育產生規模化的轉型。我們致力於弭平學習資源的落差、改變一體適用的工廠式教學風景，讓每一位孩子都能用自己的方式學習，成為終身...

junyiacademy_小均 ‧ 2021-06-12

3 Like 2 留言 9650 瀏覽

技術【網頁設計入門】如何使用 Bootstrap 與 Github Pages 製作個人網站 ?

簡單架設 x 不失質感目錄源起 : 開發者網站開發工具 : Adobe Brackets 基礎的 html 與 css 語法 Bootstrap 前...

Enoxs ‧ 2021-06-11

1 Like 0 留言 6784 瀏覽

技術【前端 HTML/JSX】在Input框內部加上Icon？除了使用Bootstrap、Semantic或Material-UI之外你還可以這麼做

相信像下列的輸入框需求，在前端開發的時候很容易遇到菜鳥前端的第一直覺大概就會想要這樣寫... 把icon的部分直接放在 <input>裡面 &lt...

一宵三筵 ‧ 2021-03-08

0 Like 0 留言 1765 瀏覽

技術 React源碼 commit階段詳解

點擊進入React源碼調試倉庫。當render階段完成後，意味著在內存中構建的workInProgress樹所有更新工作已經完成，這包括樹中fiber節點的更...

nero ‧ 2021-02-19

0 Like 0 留言 2323 瀏覽

技術梳理useEffect和useLayoutEffect的原理與區別

點擊進入React源碼調試倉庫。 React在構建用戶界面整體遵循函數式的編程理念，即固定的輸入有固定的輸出，尤其是在推出函數式組件之後，更加強化了組件純函數的...

nero ‧ 2021-02-16

0 Like 0 留言 2198 瀏覽

技術 React hooks 的基礎概念：hooks鏈表

當函數組件進入render階段時，會被renderWithHooks函數處理。函數組件作為壹個函數，它的渲染其實就是函數調用，而函數組件又會調用React提供的...

nero ‧ 2021-02-14

0 Like 0 留言 1546 瀏覽

技術 React和DOM的那些事-節點更新

點擊進入React源碼調試倉庫。 React的更新最終要落實到頁面上，所以本文主要講解DOM節點（HostComponent）和文本節點(HostText)的更...

nero ‧ 2021-02-13

0 Like 0 留言 1974 瀏覽

技術 React和DOM的那些事-節點新增算法

點擊進入React源碼調試倉庫。本篇是詳細解讀React DOM操作的第二篇文章，文章所講的內容發生在commit階段。插入DOM節點操作的是fiber節點...

nero ‧ 2021-02-11

0 Like 0 留言 1994 瀏覽

技術 React和DOM的那些事-節點刪除算法

點擊進入React源碼調試倉庫。本篇是詳細解讀React DOM操作的第壹篇文章，文章所講的內容發生在commit階段。 Fiber架構使得React需要維護...

nero ‧ 2021-02-12

0 Like 0 留言 1436 瀏覽

技術完全理解React的completeWork以及错误边界

點擊進入React源碼調試倉庫。概述每個fiber節點在更新時都會經歷兩個階段：beginWork和completeWork。在Diff之後（詳見深入理解R...

nero ‧ 2021-02-10

1 Like 1 留言 11976 瀏覽

技術 [經驗分享] 從開發轉QA工程師？為何想要轉職？開發與QA的差異？

大家好！本篇將會以我轉職的心路歷程作為主軸，我為什麼轉職成QA？當開發與當QA差很多嗎？當QA該注意些什麼？等等問題，我皆會以我個人經驗為主去探討，若有其他想法...

Gary ‧ 2021-02-07

0 Like 0 留言 2953 瀏覽

技術深入理解React Diff算法

點擊進入React源碼調試倉庫。上壹篇React狀態計算解密之後，我們來分析壹下Diff的過程。 fiber上的updateQueue經過React的壹番計...

nero ‧ 2021-02-09

0 Like 0 留言 1567 瀏覽

技術 ReactFiber節點的更新入口：beginWork

React的更新任務主要是調用壹個叫做workLoop的工作循環去構建workInProgress樹，構建過程分為兩個階段：向下遍歷和向上回溯，向下和向上的過程...

nero ‧ 2021-01-23

1 Like 0 留言 2001 瀏覽

技術 React的秘密-原理解析第壹篇：核心概念

作為壹個構建用戶界面的庫，React的核心始終圍繞著更新這壹個重要的目標，將更新和極致的用戶體驗結合起來是React團隊壹直在努力的事情。為什麽React可以將...

nero ‧ 2021-01-22

0 Like 0 留言 1181 瀏覽

技術前端工程學習日記第４天

#使用 margin（向外）、padding（向內）來推擠距離css:.box{border:10px solid #000;padding-left:30p...

九四帥 ‧ 2020-11-05

1 Like 0 留言 1336 瀏覽

鐵人賽影片教學 DAY 26

前端框架新選擇 - 30 天從 0 到 1 學 Svelte 系列第 26 篇

技術 Day26. 實作簡易 Svelte(1)：實作 HTML 解析器 | 30 天從 0 到 1 學 Svelte

影片內容昨天我們講解了 HTML 解析的原理，並探討了使用抽象語法樹的目的，有限狀態機等等，今天我們會透過昨天所學到的內容來實作一個 HTML 的解析器，...

愷開 ‧ 2020-10-05

1 Like 0 留言 1137 瀏覽

鐵人賽影片教學 DAY 25

前端框架新選擇 - 30 天從 0 到 1 學 Svelte 系列第 25 篇

技術 Day25. 如何解析 HTML 語法 | 30 天從 0 到 1 學 Svelte

影片內容講解解析 HTML 的過程以及有限狀態機。 Svelte 為了使用客製化的語法，所以在編譯時期會先解析一次 svelte 元件，其中 HTML 的...

愷開 ‧ 2020-10-04

1 Like 0 留言 1076 瀏覽

鐵人賽影片教學 DAY 24

前端框架新選擇 - 30 天從 0 到 1 學 Svelte 系列第 24 篇

技術 Day24. Svelte 如何編譯程式碼（2）| 30 天從 0 到 1 學 Svelte

影片內容昨天我們提到 Svelte 會先將程式轉換成抽象語法樹（AST），再開始做編譯，今天我們會來看看 Svelte 生成的程式碼是如何被執行的。 ◼︎...

愷開 ‧ 2020-10-03

1 Like 0 留言 1007 瀏覽

鐵人賽影片教學 DAY 23

前端框架新選擇 - 30 天從 0 到 1 學 Svelte 系列第 23 篇

技術 Day23. Svelte 如何編譯程式碼 | 30 天從 0 到 1 學 Svelte

影片內容介紹 Svelte 當中如何編譯程式碼（簡介）簡報連結：https://speakerdeck.com/kjj6198/svelte-ru-he...

愷開 ‧ 2020-10-02

1 Like 0 留言 1480 瀏覽

鐵人賽影片教學 DAY 21

前端框架新選擇 - 30 天從 0 到 1 學 Svelte 系列第 21 篇

技術 Day21. Svelte 搭配 d3 做資料視覺化：長條圖 | 30 天從 0 到 1 學 Svelte

影片內容透過 Svelte 搭配 d3.js 做資料視覺化很方便，可以很容易跟 DOM 節點互動之外，搭配 reactivity 的語法也很容易執行 d3...

愷開 ‧ 2020-09-30

2 Like 0 留言 2077 瀏覽

鐵人賽 Modern Web DAY 30

到底要怎麼開始開發網站? --- 從入門到使用Vue, Firebase製作老闆交代的網站系列第 30 篇

技術【D30 - 期待與各位再次見面】前端學到暈島隆重閉幕!

恭喜各位如果是從之前一步一步走來的人~ 那你已經擁有了基本的前端工程師必備技能!! 前言我們在從一開始的那個地圖來看起，驗收一下我們這一路走來到底走過哪裡...

ryanyen2 ‧ 2020-09-30

1 Like 0 留言 3888 瀏覽

鐵人賽自我挑戰組 DAY 22

不前不後，不上不下，一個曾經交大資工書卷的軟體工程師成長之路系列第 22 篇

技術美好的幻覺：Frontend 前端

先分享下 Frontend 的發音https://www.youtube.com/watch?v=ZdtpKFbhTtk 記得是 Frontend 不是 Fro...

Mike Fang ‧ 2020-09-30

1 Like 0 留言 1124 瀏覽

鐵人賽影片教學 DAY 20

前端框架新選擇 - 30 天從 0 到 1 學 Svelte 系列第 20 篇

技術 Day20. UI 實戰篇：Tooltip | 30 天從 0 到 1 學 Svelte

影片內容用 Svelte 實作 Tooltip UI 相關連結程式碼範例：https://svelte.dev/repl/58058516ea844c...

愷開 ‧ 2020-09-29