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

1 Like 1 留言 1991 瀏覽

鐵人賽 Modern Web DAY 17

實作經典 JavaScript 30 系列第 17 篇

技術 Day17: 為網站設計一個彩蛋

WES BOS系列影片Alex快速導讀系列影片今天的實例用到了cornify.js這個套件，功能類似打電動時要放大絕招前，一定要輸入一段指令串。例如:上上下下...

喬依司 ‧ 2020-09-25 ‧團隊自討苦吃三十天#像極了愛情

1 Like 0 留言 1847 瀏覽

鐵人賽 Modern Web DAY 7

實作經典 JavaScript 30 系列第 7 篇

技術 Day07: Flexbox + JavaScript 製作手風琴版面

WES BOS系列影片Alex快速導讀系列影片作者可能怕我們忘記flex怎麼用，在中間穿插了這個課程，練習JS之餘，也能夠再複習一下flexbox所以在一開...

喬依司 ‧ 2020-09-15 ‧團隊自討苦吃三十天#像極了愛情

0 Like 0 留言 1841 瀏覽

鐵人賽 Modern Web DAY 1

雖然你不是木村拓哉，但它也可以讓你變很行 - Gatsby.js 系列第 1 篇

技術 [Day 01] - 成為行男的第一步

為什麼要寫這系列的文章？稍有經驗的開發者，可能都對 SPA ( Single Page Application ) 不會太陌生，其原理都是藉由廣為人知的 J...

chasel1020 ‧ 2020-09-16

1 Like 0 留言 1827 瀏覽

技術 JavaScript　⑅ES6：展開運算子 & 其餘運算子

展開運算子及其餘運算子( 又稱其餘參數 )他們有共通特點，那就是「都跟陣列有關」　寫法就是 ...沒錯，就是「 ... 」（寫在文字編輯器中應該是會...

RIN ‧ 2020-11-16

0 Like 0 留言 1798 瀏覽

鐵人賽自我挑戰組 DAY 4

邁向 JavaScript 核心之路系列第 4 篇

技術 [Day 4] JavaScript 語法介紹－ function arguments

在開始介紹 Arguments 之前，想先跟各位介紹一級函式 ( First-class function )，而什麼是一級函式呢？一級函式是指你對其他型別，...

chasel1020 ‧ 2019-09-19

0 Like 0 留言 1798 瀏覽

鐵人賽自我挑戰組 DAY 10

「 Nice to meet you , JavaScript . 」- 學習日記系列第 10 篇

技術初探JavaScript - JS 比較運算子與邏輯運算子

<比較運算子> == 等於與 != 不等於 ==是用來比較是否相等，而一個等於=是用來賦予指定值，不是用來比較的。用於數字比較的範例：...

Linn ‧ 2020-09-10

0 Like 0 留言 1792 瀏覽

鐵人賽 Modern Web DAY 5

雖然你不是木村拓哉，但它也可以讓你變很行 - Gatsby.js 系列第 5 篇

技術 [Day 05] - 初探 Gatsby 之樣式調整大全

今天我們會在 React 方面多著墨，會講解如何在 React 專案中調整樣式，還有有哪些方式能去調整，同時也會講解如果在 Gatsby 專案中，該怎麼使用這些...

chasel1020 ‧ 2020-09-20

0 Like 0 留言 1786 瀏覽

鐵人賽自我挑戰組 DAY 19

邁向 JavaScript 核心之路系列第 19 篇

技術 [Day 19] JavaScript 物件繼承－繼承 ( Inherit )

簡介終於講完物件導向的章節了，今天我們就要來講講繼承 ( Inherit )，簡單來說從一個原始版本的 class 來衍生出更多特殊版本的 class，這就叫...

chasel1020 ‧ 2019-10-04

0 Like 0 留言 1758 瀏覽

鐵人賽 Modern Web DAY 2

分手前端菜雞之旅@非洲30天系列第 2 篇

技術分手JS-import時到底要不要加{}嘛-D02

JS 模塊化為什麼要有這一篇？ Import & Export 不是很簡單嘛？你為什麼要騙一篇？(後面這句話才真的在騙字數) 欸不是，我就不知道什麼時...

Global Rachel ‧ 2022-09-17 ‧團隊還不給我加薪

0 Like 0 留言 1752 瀏覽

鐵人賽 Modern Web DAY 7

雖然你不是木村拓哉，但它也可以讓你變很行 - Gatsby.js 系列第 7 篇

技術 [Day 07] - 初探 Gatsby 之創建第一個網站 ( 上 )

今天我們將融會貫通，利用前兩章所學，建立一個擁有三個頁面的簡易網站，並導入一個外掛作為這樣網站的基礎樣式，話不多說，就讓我們開始吧！建立環境並導入外掛根據...

chasel1020 ‧ 2020-09-22

0 Like 0 留言 1715 瀏覽

鐵人賽自我挑戰組 DAY 26

邁向 JavaScript 核心之路系列第 26 篇

技術 [Day 26] JavaScript 設計模式－代理模式、中介者模式、觀察者模式

代理模式 (Proxy) 代理模式的意義是用一個物件做為另一個物件的介面，主要的目的是為了保護物件的存取，避免不正確的操作行為。 var car =...

chasel1020 ‧ 2019-10-11

0 Like 0 留言 1701 瀏覽

鐵人賽 Modern Web DAY 23

雖然你不是木村拓哉，但它也可以讓你變很行 - Gatsby.js 系列第 23 篇

技術 [Day 23] - Gatsby Image

不知道有沒有細心的讀者發現，我們在做部落格或一些簡單的入門專案時，都沒有圖片的存在？人都是視覺的動物，對於一個熱門的部落格來說，怎麼可以缺少了圖片呢？今天我們...

chasel1020 ‧ 2020-10-08

1 Like 0 留言 1692 瀏覽

鐵人賽自我挑戰組 DAY 2

Head First！從頭開始學JS 《深入淺出 JavaScript 程式設計》讀書筆記系列第 2 篇

技術 Day02. 沒圖沒真相，看圖學JavaScript才是王道

廢文的quota已經用完，但我還沒有打算開始進入JavaScript的正題XD先來介紹一下我使用的教材好了。我選擇的是歐萊禮的《深入淺出 JavaScript...

appletabby ‧ 2019-09-17

0 Like 0 留言 1681 瀏覽

鐵人賽自我挑戰組 DAY 21

邁向 JavaScript 核心之路系列第 21 篇

技術 [Day 21] JavaScript 物件繼承－傳遞參數到父層類別

傳遞參數到父層類別大給後，對於昨天的文章提到的繼承原型方法，不知道大家是否理解了呢？今天我們要針對那個方法再做一些延伸與調整，我們利用 call 的方式並沒...

chasel1020 ‧ 2019-10-06

2 Like 0 留言 1661 瀏覽

鐵人賽 Modern Web DAY 12

實作經典 JavaScript 30 系列第 12 篇

技術 Day12: 在Canvas畫布上，用滑鼠畫畫(二)

今天可以再來玩一些Canvas的功能 1.更改畫筆的顏色，讓畫筆畫出彩虹的顏色這邊是使用HSL色彩概念，HSL即色相、飽和度、亮度(hue,Saturation...

喬依司 ‧ 2020-09-20 ‧團隊自討苦吃三十天#像極了愛情

0 Like 0 留言 1647 瀏覽

鐵人賽 Modern Web DAY 17

從ES到ESNext - 30天輕鬆掌握ECMAScript 系列第 17 篇

技術 ES2017(ES8) - async / await

本系列文章經過重新編排和擴充，已出書為ECMAScript關鍵30天。原始文章因當時準備時程緊迫，多少有些許錯誤。為了避免造成讀者的困擾，以及配合書籍的內容規...

Yuri Tsai ‧ 2020-10-02

1 Like 0 留言 1642 瀏覽

技術有關Chrome瀏覽器擴充功能，選定特別類型檔案封鎖上傳

我的manifest.json檔案： { "manifest_version": 3, "name": &quo...

pion2000new ‧ 2025-02-11

0 Like 0 留言 1634 瀏覽

鐵人賽 Modern Web DAY 26

雖然你不是木村拓哉，但它也可以讓你變很行 - Gatsby.js 系列第 26 篇

技術 [Day 26] - Gatsby feat. WordPress

今天我們要與鼎鼎大名的 WordPress 進行串接，將 WordPress 站內的資料藉由 GraphQL 來撈取，並在 Gatsby 專案中，將這些資料做一...

chasel1020 ‧ 2020-10-11

1 Like 0 留言 1625 瀏覽

鐵人賽 Modern Web DAY 29

實作經典 JavaScript 30 系列第 29 篇

技術 Day29: Event Capture, Propagation, Bubbling and Once

WES BOS系列影片Alex快速導讀系列影片今天比較偏觀念的講解主要是希望能較深入理解addEventListener()學習DOM的事件機制，包括事件捕獲...

喬依司 ‧ 2020-10-07 ‧團隊自討苦吃三十天#像極了愛情

1 Like 0 留言 1620 瀏覽

鐵人賽 Modern Web DAY 6

實作經典 JavaScript 30 系列第 6 篇

技術 Day06: 針對陣列的操作練習(二)

WES BOS系列影片Alex快速導讀系列影片做完基礎陣列練習後，來做些進階的練習進階練習目標 :6.Sort the inventors by years...

喬依司 ‧ 2020-09-14 ‧團隊自討苦吃三十天#像極了愛情

0 Like 0 留言 1613 瀏覽

鐵人賽 Modern Web DAY 24

雖然你不是木村拓哉，但它也可以讓你變很行 - Gatsby.js 系列第 24 篇

技術 [Day 24] - 動態導覽列 ( Dynamic Navigation )

身為一個專業的網站，怎麼可以讓使用者在我們的網站中迷路了呢？所以今天我們要來做導覽列 ( Nav Bar )，我們會用 Gatsby 中的資料來動態的產生，而資...

chasel1020 ‧ 2020-10-09

1 Like 0 留言 1612 瀏覽

鐵人賽 Modern Web DAY 27

實作經典 JavaScript 30 系列第 27 篇

技術 Day27:Speech Synthesis

WES BOS系列影片Alex快速導讀系列影片今天來認識 Web Speech API中的兩個功能一個是 SpeechSynthesisUtterance它包...

喬依司 ‧ 2020-10-05 ‧團隊自討苦吃三十天#像極了愛情

1 Like 0 留言 1605 瀏覽

技術 JS筆記-關掉alert的簡單小技巧

目錄 JS筆記-幫元素加上style的寫法 JS筆記-getPosition 讓你找到元素x,y位置 js筆記--寫腳本需要用到的waitForKeyEleme...

Oo_花之舞__oO ‧ 2023-01-01

1 Like 0 留言 1601 瀏覽

鐵人賽 Modern Web DAY 13

實作經典 JavaScript 30 系列第 13 篇

技術 Day13: 認識console

WES BOS系列影片Alex快速導讀系列影片今天比較輕鬆，作者帶我們深入了解console的一些使用方法，記錄下來，也許那天突然就會用到也不一定。作者有準...

喬依司 ‧ 2020-09-21 ‧團隊自討苦吃三十天#像極了愛情

0 Like 0 留言 1580 瀏覽

鐵人賽 Modern Web DAY 4

雖然你不是木村拓哉，但它也可以讓你變很行 - Gatsby.js 系列第 4 篇

技術 [Day 04] - 初探 Gatsby 之專案結構說明

今天我們要針對專案架構做一個基本的認識，而下篇會講一些 React 的基礎觀念，例如如何建立一個元件、如何在 React 專案裡添加樣式、如何由父元件傳值給子組...

chasel1020 ‧ 2020-09-19

0 Like 0 留言 1567 瀏覽

技術 2022新年挑戰 - 7 days for Javascript(Day 1 - Developer Set Up)

因為在工作上, 基本上碰不到Javascript, 感覺再不複習一下, 就要忘光光了 (汗)所以決定找個線上課程follow一下, 在這個新年假期, 也充實一下...

summer_teng ‧ 2022-01-30

2 Like 0 留言 1553 瀏覽

鐵人賽 Modern Web DAY 16

實作經典 JavaScript 30 系列第 16 篇

技術 Day16: 自製的影片撥放器(二)

今天首先要控制音量大小與調整播放速度 1.先設定會使用到的函式名稱 function handleRangeUpdate() { console.log(t...

喬依司 ‧ 2020-09-24 ‧團隊自討苦吃三十天#像極了愛情

0 Like 1 留言 1531 瀏覽

技術 #02學習筆記 JavaScript變數宣告

Javascript的宣告方式在很久很久以前... 其實也沒有多久啦。 ES6之前宣告的方法都是用var宣告，這也導致很多有趣的事情發生。所以在ES6之...

Eazy ‧ 2023-05-13

0 Like 0 留言 1528 瀏覽

鐵人賽 Modern Web DAY 18

雖然你不是木村拓哉，但它也可以讓你變很行 - Gatsby.js 系列第 18 篇

技術 [Day 18] - 建立屬於自己的主題 ( 一 )

在前一章節中，我們使用了官方提供的主題去快速建立了一個部落格，後續幾個章節中，我們要建立一個主題，並將它放到 NPM 上供人下載使用。設置工作區首先，我們要...

chasel1020 ‧ 2020-10-03

0 Like 0 留言 1524 瀏覽

技術 function :發生 JavaScript 嚴重錯誤\n\nSCRIPT1006: 必須要有 ')'

#取得Query String #取得URL的Query String https://127.0.0.1/test.aspx?version=1 在專案中新增...

圓頭人 ‧ 2022-01-17