iT邦幫忙

frontend相關文章
共有 226 則文章
鐵人賽 Modern Web DAY 7

技術 07. [JS] 瀏覽器 DOM 元素的事件代理是指什麼?

本系列來到了 JavaScript 相關的主題,預計會在這逐步前進好一陣子,讓我們從較簡單的主題開始吧;今天就先來聊聊瀏覽器中的事件代理是怎麼一回事。 本系...

鐵人賽 Modern Web DAY 12
React + D3 的正確姿勢 系列 第 12

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

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

鐵人賽 Modern Web DAY 9

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

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

鐵人賽 Modern Web DAY 1

技術 Day01_還是要廢話一下吧

前言 想分享這個主題其實是有點心虛的,畢竟自己對Javascript也是一知半解,怎麼還敢分享出來誤人子弟,但我認為,錯誤中才能改正,能用自己的話語表達才是真正...

鐵人賽 Modern Web DAY 30

技術 JS 原力覺醒 Day30 - 我是怎麼活過這三十天的?

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

鐵人賽 Modern Web DAY 2
React + D3 的正確姿勢 系列 第 2

技術 Day02-React.js基本介紹(JSX)

什麼是 React.js 在開始正式進入今天文章的教學內容之前,先帶大家簡單了解一下什麼是 React.js 。 一進到 React.js 的官網便可以看到這段...

鐵人賽 Modern Web DAY 26
React + D3 的正確姿勢 系列 第 26

技術 Day26-donut chart(using D3.js)

前言 昨天的文章介紹了圓餅圖,今天要來介紹圓餅圖的變形版:環圈圖,其實筆者自己比較少用圓餅圖,只要是這種要計算數據比例的統計圖現在都改用環圈圖了,至於為什麼會有...

鐵人賽 Modern Web DAY 20
Zero to hero with React.js 系列 第 20

技術 【Day20 React】Redux 入門

後面這二十天,將專攻 Redux,一樣也是透過做中學的方式來理解 Redux。 首先,官方文件是必備材料: Redux 官方中文文件 另外,這一篇 Code C...

鐵人賽 Modern Web DAY 6

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

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

鐵人賽 Modern Web DAY 26

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

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

鐵人賽 Modern Web DAY 11

技術 JS 原力覺醒 Day11 - Falsy / Truthy

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

鐵人賽 Modern Web DAY 17
React + D3 的正確姿勢 系列 第 17

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

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

鐵人賽 Modern Web DAY 28

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

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

鐵人賽 Modern Web

技術 Day 43. 通用武裝・泛型註記 X 推論未來 - TypeScript Generic Declaration & Annotation

閱讀本篇文章前,仔細想想看 泛用型別的意義是什麼? 泛用型別大致上有哪些種類或形式? 如果還不清楚可以看一下前一篇文章喔~ 以下就直接正文開始~ 泛用...

鐵人賽 Modern Web DAY 1

技術 Angular 深入淺出三十天:表單與測試 Day01 - 前言

何謂表單? 維基百科是這樣說的: 表單是一種帶有空格可用於書寫以及能選擇和勾選相似內容的文件。 表單可用於填寫聲明、請求、命令、支票、稅單。 網頁...

鐵人賽 Modern Web DAY 14
React + D3 的正確姿勢 系列 第 14

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

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

鐵人賽 Modern Web DAY 24

技術 [Day 24] 初探 Deno — 與 Node.js 的淺比較

為什麼要寫這個主題呢?原因是我想如果前端開發者要接觸後端領域,「通常」會選擇 Node.js ,畢竟不用學另外的語言,npm 開發生態系也是相通的,不過最近出了...

鐵人賽 Modern Web DAY 5

技術 JS 原力覺醒 Day05 - Scope Chain

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

鐵人賽 Modern Web DAY 25
Zero to hero with React.js 系列 第 25

技術 【Day 25 React】Redux 做遊戲角色陣容應用程式——趴ㄈ ㄞˋ

mapping dispatch to props import { bindActionCreators } from 'redux'; import {...

鐵人賽 Modern Web DAY 20
React + D3 的正確姿勢 系列 第 20

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

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

鐵人賽 Modern Web DAY 10

技術 JS 原力覺醒 Day010 - 自動轉型 (Coercion)

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

鐵人賽 Modern Web DAY 10
React + D3 的正確姿勢 系列 第 10

技術 Day10-React環境架設(create-react-app)

前言 在之前的文章都是講如何透過線上編輯器來進行 React.js 的撰寫,在今明兩天的文章會教大家如何在本地端也能撰寫 React.js ,俗話說的好:萬事起...

鐵人賽 Modern Web DAY 13
Zero to hero with React.js 系列 第 13

技術 【Day 13 React】React + Webpack ——搜尋功能 #Part2

取得 input 的值 昨天做到 input event 的綁定,不過尚未取得 input 的值,在 handleQuery 裡,我們可以用 event.tar...

鐵人賽 Modern Web DAY 18

技術 JS 原力覺醒 Day18 - Functional Programming

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

鐵人賽 Modern Web DAY 8

技術 JS 原力覺醒 Day08 - Closures

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

鐵人賽 Modern Web DAY 3
React + D3 的正確姿勢 系列 第 3

技術 Day03-virtual DOM

前言 今天要來介紹一項非常重要的觀念,只要講到 React.js 就一定會提到 virtual DOM 這個東西,究竟為什麼需要 virtual DOM 呢?今...

鐵人賽 Modern Web DAY 29

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

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

鐵人賽 Modern Web DAY 16

技術 JS 原力覺醒 Day16 - Async / Await:Promise 語法糖

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

鐵人賽 Modern Web DAY 16
Zero to hero with React.js 系列 第 16

技術 【Day 16 React】React Flux 架構—— Store Event

上一篇文章介紹了 Flux 的基礎,今天就讓我們用 To-do app 來更深入了解 Flux 架構的運作原理吧~~~~~~ Store Change 每一次的...

鐵人賽 Modern Web DAY 22
React + D3 的正確姿勢 系列 第 22

技術 Day22-bar chart(using D3.js)

前言 從今天開始的文章就正式進入實作的過程啦~ 這次的系列文預計會帶給大家 5 種不一樣的圖表,視覺化是個非常深奧的世界,筆者我也只會一點皮毛而已XD 所以這次...