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

0 Like 0 留言 4479 瀏覽

鐵人賽 Modern Web DAY 12

React + D3 的正確姿勢系列第 12 篇

技術 Day12-D3基本介紹(作用、svg)

前言從今天開始到結束的文章沒意外都會講 D3.js 了，前端能做資料視覺化的套件非常多，只是筆者覺得在用其他比較方便的套件之前應該要先了解整個圖表繪製過程，而...

陳奕帆 Andy Chen ‧ 2019-09-28

0 Like 0 留言 4477 瀏覽

鐵人賽 Modern Web DAY 24

React + D3 的正確姿勢系列第 24 篇

技術 Day24-line chart(using D3.js)

前言在講完長條圖之後接下來要介紹的是折線圖，折線圖也是視覺化中非常重要且基礎的一種圖表，廢話不多說馬上開始今天的文章吧！折線圖折線圖是用直線段將各數據點連...

陳奕帆 Andy Chen ‧ 2019-10-10

2 Like 0 留言 4476 瀏覽

鐵人賽 Modern Web DAY 2

那些年，我們一起錯過的Javascript 系列第 2 篇

技術 Day02_JS的二三事

Javascript Introduction 身為一個前端工程師，對前端三本柱子大家一定不陌生，HTML、CSS、Javascript，在一個Page裡面，J...

Ben the dust ‧ 2017-12-21 ‧團隊30天熱度

0 Like 0 留言 4435 瀏覽

鐵人賽 Modern Web DAY 24

一步步帶你了解 AWS & LINE API 並使用 Serverless 介接的各種應用系列第 24 篇

技術 Day 24 - 簡單使用 LINE LIFF API

前言以下就為大家帶來簡單的實作以及如何去使用它。實作在views/下新增一個liff_test.html並加入以下內容 <html> &l...

NiJia ‧ 2019-10-09 ‧團隊HSCA x CHATBOT x SERVERLESS

2 Like 0 留言 4429 瀏覽

鐵人賽 Modern Web DAY 13

React + D3 的正確姿勢系列第 13 篇

技術 Day13-D3基本介紹(scale、range)

前言今天要來介紹 D3.js 中第一個重要觀念： scale 以及 range ，在 D3.js 中的每個圖表都必須要設定 scale 以及 range ，今...

陳奕帆 Andy Chen ‧ 2019-09-29

0 Like 0 留言 4395 瀏覽

鐵人賽 Modern Web DAY 14

React + D3 的正確姿勢系列第 14 篇

技術 Day14-D3基本介紹(domain、endpoint)

前言昨天講了跟輸出區域有關的 scale 以及 range ，今天要來談一下輸入區域的 domain 了，這裡筆者會多提一個 endpoint ，其實這個 e...

陳奕帆 Andy Chen ‧ 2019-09-30

1 Like 0 留言 4319 瀏覽

鐵人賽 Modern Web DAY 15

React + D3 的正確姿勢系列第 15 篇

技術 Day15-D3基本介紹(time format)

前言今天要來介紹一個蠻重要的技巧，一般來說 JS 用來處理時間的套件相信大家首選都是 Moment.js ，當然筆者也是一樣，不過今天筆者並沒有要介紹 Mom...

陳奕帆 Andy Chen ‧ 2019-10-01

1 Like 0 留言 4305 瀏覽

鐵人賽 Modern Web DAY 17

React + D3 的正確姿勢系列第 17 篇

技術 Day17-D3基本介紹(select、append、attr)

前言從今天開始的文章就正式進入 D3 的圖表繪製設定了，光最基本的輸入輸出區域就花了不少篇幅說明 (其實是為了拖台錢讓鐵人賽更容易完賽XD) ，總之接下來的文...

陳奕帆 Andy Chen ‧ 2019-10-03

3 Like 0 留言 4213 瀏覽

鐵人賽 Modern Web DAY 8

今晚，我想來點 Web 前端效能優化大補帖！系列第 8 篇

技術 Day08 X 瀏覽器架構演進史 & 渲染機制

「在未來，瀏覽器會變得越來越強，以後我們可以在瀏覽器做越來越多事。」身為常與瀏覽器共舞的 Web 工程師，尤其是 Frontend Engineer，如...

莫力全 Kyle Mo ‧ 2021-09-23 ‧團隊StarBugs 星巴哥技術週刊

4 Like 0 留言 4166 瀏覽

鐵人賽 Modern Web DAY 4

今晚，我想來點 Web 前端效能優化大補帖！系列第 4 篇

技術 Day04 X Core Web Vital & RAIL Model

在昨天介紹網頁檢測工具時，我們看到它提供了一些看起來十分專業的 Metrics，不過光看文字還真的猜不出它們代表的是什麼意思 ? 今天第一個段落會介紹三個評...

莫力全 Kyle Mo ‧ 2021-09-19 ‧團隊StarBugs 星巴哥技術週刊

1 Like 0 留言 4047 瀏覽

鐵人賽 Modern Web

讓 TypeScript 成為你全端開發的 ACE！系列第 47 篇

技術 Day 47. 通用武裝・泛型應用 X 結合 ES2015+ - TypeScript Generics with ES2015+ Features

閱讀本篇文章前，仔細想想看迭代器（Iterator）與聚合物（Collection）的差別在哪？迭代器模式要如何實踐？實踐的目的為何？什麼是多型巡訪...

Maxwell Alexius ‧ 2020-01-09

1 Like 0 留言 4041 瀏覽

鐵人賽 Modern Web DAY 10

JavaScript 原力覺醒 - 成為絕地武士之路系列第 10 篇

技術 JS 原力覺醒 Day010 - 自動轉型（Coercion）

一路上感謝各位讀者們的支持和回饋。本 30 天系列文目前已經將篇幅重新整理、編纂成冊。《JavaScript 概念三明治》在天瓏書局上架囉！喜歡這個系列，想閱...

Spark ‧ 2019-09-25 ‧團隊G8 Hash - c98b82371573afc08575815d90f5eac4

1 Like 1 留言 4027 瀏覽

鐵人賽 Modern Web DAY 25

JavaScript 原力覺醒 - 成為絕地武士之路系列第 25 篇

技術 JS 原力覺醒 Day25 - CRP : 關鍵渲染路徑

一路上感謝各位讀者們的支持和回饋。本 30 天系列文目前已經將篇幅重新整理、編纂成冊。《JavaScript 概念三明治》在天瓏書局上架囉！喜歡這個系列，想閱...

Spark ‧ 2019-10-10 ‧團隊G8 Hash - c98b82371573afc08575815d90f5eac4

1 Like 1 留言 3982 瀏覽

鐵人賽 Modern Web DAY 9

JavaScript 原力覺醒 - 成為絕地武士之路系列第 9 篇

技術 JS 原力覺醒 Day9 - 原始型別與物件型別

一路上感謝各位讀者們的支持和回饋。本 30 天系列文目前已經將篇幅重新整理、編纂成冊。《JavaScript 概念三明治》在天瓏書局上架囉！喜歡這個系列，想閱...

Spark ‧ 2019-09-24 ‧團隊G8 Hash - c98b82371573afc08575815d90f5eac4

2 Like 3 留言 3953 瀏覽

鐵人賽 Modern Web DAY 7

今晚，我想來點 Web 前端效能優化大補帖！系列第 7 篇

技術 Day07 X Image Sprites

經過昨天的一番折騰，我想讀者們都對基本的圖片優化稍有概念了，今天要介紹的優化技巧其實嚴格來說也算是圖片的優化範疇，但是跟優化圖片本身的大小無關，因此我選擇獨立...

莫力全 Kyle Mo ‧ 2021-09-22 ‧團隊StarBugs 星巴哥技術週刊

1 Like 0 留言 3949 瀏覽

鐵人賽 Modern Web DAY 9

Zero to hero with React.js 系列第 9 篇

技術【Day9 React】從拆解電子名片學習 React Props #Part3

皮卡丘就這麼跑進我的文章裡。。。目前我的專案長這樣~ 我一樣用電子名片這個專案來學習 React props 的運作原理，今天也會將我預先儲存在 json 裡...

TSAI ‧ 2017-12-15

1 Like 0 留言 3908 瀏覽

鐵人賽 Modern Web DAY 26

JavaScript 原力覺醒 - 成為絕地武士之路系列第 26 篇

技術 JS 原力覺醒 Day26 - 常用 API： setTimeout / setTimeInterval

一路上感謝各位讀者們的支持和回饋。本 30 天系列文目前已經將篇幅重新整理、編纂成冊。《JavaScript 概念三明治》在天瓏書局上架囉！喜歡這個系列，想閱...

Spark ‧ 2019-10-11 ‧團隊G8 Hash - c98b82371573afc08575815d90f5eac4

2 Like 0 留言 3865 瀏覽

鐵人賽 Modern Web DAY 29

今晚，我想來點 Web 前端效能優化大補帖！系列第 29 篇

技術 Day29 X 面對高流量，前端可以做些什麼？

在現今的 Web 應用中，要建構一個穩定的大型系統，能夠處理 High Concurrency 的流量是一個不可或缺的條件，尤其是在服務的熱門時段，例如優惠活...

莫力全 Kyle Mo ‧ 2021-10-14 ‧團隊StarBugs 星巴哥技術週刊

2 Like 2 留言 3836 瀏覽

鐵人賽 Modern Web DAY 6

JavaScript 原力覺醒 - 成為絕地武士之路系列第 6 篇

技術 JS 原力覺醒 Day06 - 提升 Hoisting

一路上感謝各位讀者們的支持和回饋。本 30 天系列文目前已經將篇幅重新整理、編纂成冊。《JavaScript 概念三明治》在天瓏書局上架囉！喜歡這個系列，想閱...

Spark ‧ 2019-09-21 ‧團隊G8 Hash - c98b82371573afc08575815d90f5eac4

2 Like 0 留言 3739 瀏覽

鐵人賽 Modern Web DAY 7

Zero to hero with React.js 系列第 7 篇

技術【Day7 React】從拆解電子名片學習 React Components #Part1

把整張名片作為一個 component 每一個 component 外層都會用一個 class 包起來。extends 指的是 React.component...

TSAI ‧ 2017-12-13

1 Like 0 留言 3727 瀏覽

鐵人賽 Modern Web DAY 28

JavaScript 原力覺醒 - 成為絕地武士之路系列第 28 篇

技術 JS 原力覺醒 Day28 - JS 裡的資料結構

一路上感謝各位讀者們的支持和回饋。本 30 天系列文目前已經將篇幅重新整理、編纂成冊。《JavaScript 概念三明治》在天瓏書局上架囉！喜歡這個系列，想閱...

Spark ‧ 2019-10-13 ‧團隊G8 Hash - c98b82371573afc08575815d90f5eac4

1 Like 0 留言 3724 瀏覽

鐵人賽 Modern Web DAY 12

Zero to hero with React.js 系列第 12 篇

技術【Day 12 React】React + Webpack ——搜尋功能 #Part1

前面幾篇的做法，我都是直接引用 CDN 來操作。我們還有第二種方法可以 include React，就是透過第二篇介紹過的 Webpack，所以今天就來學學 W...

TSAI ‧ 2017-12-18

0 Like 0 留言 3655 瀏覽

鐵人賽 Modern Web DAY 20

React + D3 的正確姿勢系列第 20 篇

技術 Day20-D3基本介紹(chart event、tooltip)

前言在講完所有的圖表設定後，今天要來介紹如何讓我們設計好的圖表可以跟使用者進行互動，為了要讓圖表能進行互動我們就必須要將圖表設定一些 event ，這樣使用者...

陳奕帆 Andy Chen ‧ 2019-10-06

0 Like 0 留言 3646 瀏覽

徵才 [徵才]美商A10 Networks-FrontEnd Web Developer

【公司名稱】: 美商睿科網路科技有限公司【公司地址】: 台北南港軟體園區三期捷運南港展覽館站附近台北市南港區三重路66號6樓https://goo.gl/m...

stsai ‧ 2018-02-13

3 Like 0 留言 3644 瀏覽

鐵人賽 Modern Web DAY 15

今晚，我想來點 Web 前端效能優化大補帖！系列第 15 篇

技術 Day15 X Tree Shaking

在昨天我們學會了 code splitting 與 dynamic import 的技巧，讓程式在打包時可以形成好幾個 bundle chunks，並在真的需...

莫力全 Kyle Mo ‧ 2021-09-30 ‧團隊StarBugs 星巴哥技術週刊

1 Like 0 留言 3629 瀏覽

鐵人賽 Modern Web DAY 18

JavaScript 原力覺醒 - 成為絕地武士之路系列第 18 篇

技術 JS 原力覺醒 Day18 - Functional Programming

一路上感謝各位讀者們的支持和回饋。本 30 天系列文目前已經將篇幅重新整理、編纂成冊。《JavaScript 概念三明治》在天瓏書局上架囉！喜歡這個系列，想閱...

Spark ‧ 2019-10-03 ‧團隊G8 Hash - c98b82371573afc08575815d90f5eac4

2 Like 0 留言 3614 瀏覽

鐵人賽 Modern Web DAY 20

今晚，我想來點 Web 前端效能優化大補帖！系列第 20 篇

技術 Day20 X CDN

CDN 這個名詞在前面的篇章應該出現過蠻多次的，一直感到困惑的朋友們不用擔心，今天終於要來好好介紹它了！什麼是 CDN ? CDN 的全名為 Conten...

莫力全 Kyle Mo ‧ 2021-10-05 ‧團隊StarBugs 星巴哥技術週刊

1 Like 0 留言 3609 瀏覽

鐵人賽 Modern Web DAY 29

JavaScript 原力覺醒 - 成為絕地武士之路系列第 29 篇

技術 JS 原力覺醒 Day29 - Set / Map

一路上感謝各位讀者們的支持和回饋。本 30 天系列文目前已經將篇幅重新整理、編纂成冊。《JavaScript 概念三明治》在天瓏書局上架囉！喜歡這個系列，想閱...

Spark ‧ 2019-10-14 ‧團隊G8 Hash - c98b82371573afc08575815d90f5eac4

1 Like 0 留言 3582 瀏覽

鐵人賽 Modern Web DAY 21

今晚，我想來點 Web 前端效能優化大補帖！系列第 21 篇

技術 Day21 X Upgrade Your HTTP Connection

其實很多的效能優化技巧都擁有「用了不一定會讓效能變得比較快，就算有可能也是使用者難以感知的微幅進步，甚至如果使用不當會讓網頁效能變的更差」的特性。不過對於...

莫力全 Kyle Mo ‧ 2021-10-06 ‧團隊StarBugs 星巴哥技術週刊

3 Like 0 留言 3543 瀏覽

鐵人賽 Modern Web DAY 27

今晚，我想來點 Web 前端效能優化大補帖！系列第 27 篇

技術 Day27 X Stale While Revalidate Cache Policy

在 Day24 介紹 Web 前端渲染架構時，有提到 Stale While Revalidate 這個快取的應用策略，今天將更詳細介紹這個策略，並看看怎麼運...

莫力全 Kyle Mo ‧ 2021-10-12 ‧團隊StarBugs 星巴哥技術週刊

技術 Day12-D3基本介紹(作用、svg)

技術 Day24-line chart(using D3.js)

技術 Day02_JS的二三事

技術 Day 24 - 簡單使用 LINE LIFF API

技術 Day13-D3基本介紹(scale、range)

技術 Day14-D3基本介紹(domain、endpoint)

技術 Day15-D3基本介紹(time format)

技術 Day17-D3基本介紹(select、append、attr)

技術 Day08 X 瀏覽器架構演進史 & 渲染機制

技術 Day04 X Core Web Vital & RAIL Model

技術 Day 47. 通用武裝・泛型應用 X 結合 ES2015+ - TypeScript Generics with ES2015+ Features

技術 JS 原力覺醒 Day010 - 自動轉型 （Coercion）

技術 JS 原力覺醒 Day25 - CRP : 關鍵渲染路徑

技術 JS 原力覺醒 Day9 - 原始型別與物件型別

技術 Day07 X Image Sprites

技術 【Day9 React】從拆解電子名片學習 React Props #Part3

技術 JS 原力覺醒 Day26 - 常用 API： setTimeout / setTimeInterval

技術 Day29 X 面對高流量，前端可以做些什麼？

技術 JS 原力覺醒 Day06 - 提升 Hoisting

技術 【Day7 React】從拆解電子名片學習 React Components #Part1

技術 JS 原力覺醒 Day28 - JS 裡的資料結構

技術 【Day 12 React】React + Webpack ——搜尋功能 #Part1

技術 Day20-D3基本介紹(chart event、tooltip)

徵才 [徵才]美商A10 Networks-FrontEnd Web Developer

技術 Day15 X Tree Shaking

技術 JS 原力覺醒 Day18 - Functional Programming

技術 Day20 X CDN

技術 JS 原力覺醒 Day29 - Set / Map

技術 Day21 X Upgrade Your HTTP Connection

技術 Day27 X Stale While Revalidate Cache Policy

標記使用者

技術 JS 原力覺醒 Day010 - 自動轉型（Coercion）

技術【Day9 React】從拆解電子名片學習 React Props #Part3

技術【Day7 React】從拆解電子名片學習 React Components #Part1

技術【Day 12 React】React + Webpack ——搜尋功能 #Part1