iT邦幫忙

modern web相關文章
共有 399 則文章
0 Like 1 留言 2537 瀏覽
鐵人賽 Modern Web DAY 10
用React刻自己的投資Dashboard 系列 第 10 篇

技術 用React刻自己的投資Dashboard Day10 - 用useCallback hook幫你記住函式

tags: 2021鐵人賽 React 在Day9說明了useEffect的用法，不過其實當Card.js渲染時，會發現console有錯誤訊息如下： src...

Sean Liu ‧ 2021-09-25
0 Like 0 留言 1001 瀏覽
鐵人賽 Modern Web DAY 10
來自 GAS 的香氣～跟鳳黃酥一起享受 Google Apps Script 的午茶時光 系列 第 10 篇

技術 Day 10- 物品借用紀錄系統 (2) 設定 Calendar

昨天我們完成了基礎建設，但是有個地方忘記講到，我現在趕快補充一下！ 我們昨天設定歸還日期時，一定有人會問： 這樣他如果在當天的 23:59 分歸還不就也可以嗎...

鳳黃酥 ‧ 2021-09-25
0 Like 0 留言 2819 瀏覽
鐵人賽 Modern Web DAY 9
來自 GAS 的香氣～跟鳳黃酥一起享受 Google Apps Script 的午茶時光 系列 第 9 篇

技術 Day 9— 物品借用紀錄系統 (1) 基礎建構

今天我們要來製作新的專題：物品借用紀錄微服務！ 在學校，尤其是行政處室，最常出現的狀況應該就是「借物」這件事情。 不過我想應該各種單位應該都是啦～畢竟資源有限嘛...

鳳黃酥 ‧ 2021-09-24
0 Like 0 留言 3341 瀏覽
鐵人賽 Modern Web DAY 11
Follow me! 來一場前端技能樹之旅 系列 第 11 篇

技術 [Day 11 - JS] 互動吧網頁 — Javascipt的DOM 操作 / 事件

在前一篇，我們介紹完 Javascript 的語法和基本功能，包括宣告變數、條件陳述式、函式、物件陣列 ... 等等，接下來就來了解如何透過 Javascipt...

May ‧ 2021-09-24
0 Like 0 留言 1027 瀏覽
鐵人賽 Modern Web DAY 9
用React刻自己的投資Dashboard 系列 第 9 篇

技術 用React刻自己的投資Dashboard Day9 - useEffect hook

tags: 2021鐵人賽 React 既上一篇介紹完useState hook後，本篇就來介紹Day6也有用到的useEffect hook，在React官網...

Sean Liu ‧ 2021-09-24
0 Like 0 留言 1191 瀏覽
鐵人賽 Modern Web DAY 8
來自 GAS 的香氣～跟鳳黃酥一起享受 Google Apps Script 的午茶時光 系列 第 8 篇

技術 Day 8 — 自動化回信機(5) 優化回信機

咦？我們都寫完了，為什麼還不進入下一個專題呢？ 嘖嘖，這你就不懂了！身為一個工程師，能動，只是交件標準。但是你後續如果還要維護，那麼你寫的這份爛 code 會在...

鳳黃酥 ‧ 2021-09-23
0 Like 0 留言 2074 瀏覽
鐵人賽 Modern Web DAY 10
Follow me! 來一場前端技能樹之旅 系列 第 10 篇

技術 [Day 10 - JS] 初探 Javascript 基本功能 — 函式、迴圈 / 陣列、物件

在前一篇，我們提到了一些 Javascript 的語法和基本功能，包括宣告變數、資料型別、條件陳述式，接下來就繼續來了解迴圈、函式、物件、陣列的觀念和用法。 流...

May ‧ 2021-09-23
0 Like 0 留言 1192 瀏覽
鐵人賽 Modern Web DAY 8
用React刻自己的投資Dashboard 系列 第 8 篇

技術 用React刻自己的投資Dashboard Day8 - useState hook

tags: 2021鐵人賽 React 在Card元件中有使用到useState，是React中一個蠻重要的hook，是一個非常強大的功能，看起來跟用起來都非常...

Sean Liu ‧ 2021-09-23
0 Like 0 留言 3035 瀏覽
鐵人賽 Modern Web DAY 9
Follow me! 來一場前端技能樹之旅 系列 第 9 篇

技術 [Day 09 - JS] 網頁第三大核心技術 — Javascript

What is Javascript？JavaScript （簡稱 JS）是一種 直譯式(Interpreter) 程式語言，程式碼會由上到下立即執行，它與HT...

May ‧ 2021-09-22
0 Like 0 留言 3274 瀏覽
鐵人賽 Modern Web DAY 7
用React刻自己的投資Dashboard 系列 第 7 篇

技術 用React刻自己的投資Dashboard Day7 - CORS與Proxy Server

tags: 2021鐵人賽 React 上一篇在串接API的時候有遇到一個前端蠻常見的問題，跨來源資源共用(CORS)被阻擋，錯誤代碼如下： 打開瀏覽器的con...

Sean Liu ‧ 2021-09-22
0 Like 0 留言 1505 瀏覽
鐵人賽 Modern Web DAY 7
來自 GAS 的香氣～跟鳳黃酥一起享受 Google Apps Script 的午茶時光 系列 第 7 篇

技術 Day 7— 自動化回信機(4) 勾選後寄出通知信

我們已經順利的將 onEdit(e) 以及 MailApp.sendMail(message) 學完了，那麼下一步當然就是把它結合起來囉！ 結合的概念非常簡單，...

鳳黃酥 ‧ 2021-09-22
0 Like 0 留言 1336 瀏覽
鐵人賽 Modern Web DAY 8
Follow me! 來一場前端技能樹之旅 系列 第 8 篇

技術 [Day 08 - CSS Architecture] CSS設計模式，擺脫義大利麵代碼

當別人說你的程式是義大利麵代碼 (Spaghetti code)，聽起來很好吃，應該是稱讚的意思吧！千萬不要誤會，那是在說你的程式碼雜亂無章、難以理解。 在前面...

May ‧ 2021-09-21
0 Like 0 留言 1288 瀏覽
鐵人賽 Modern Web DAY 6
用React刻自己的投資Dashboard 系列 第 6 篇

技術 用React刻自己的投資Dashboard Day6 - 建立圖表區元件，串接API取得數據

tags: 2021鐵人賽 React 上一篇使用靜態的資料，將多張數據資料表畫成線圖呈現在網頁上，因為這個資料來源是JSON檔，所以是相對難更新的，因此本篇要...

Sean Liu ‧ 2021-09-21
0 Like 0 留言 1849 瀏覽
鐵人賽 Modern Web DAY 6
來自 GAS 的香氣～跟鳳黃酥一起享受 Google Apps Script 的午茶時光 系列 第 6 篇

技術 Day 6— 自動化回信機(3) 寄出信件功能

昨天我們終於把取得試算表內資訊的任務搞定了！接下來就是打勾之後，我們把信件寄出這個任務了！ 首先，按照慣例我們來看一下 Docs 的部分，了解一下怎麼把信寄出：...

鳳黃酥 ‧ 2021-09-21
0 Like 1 留言 3688 瀏覽
鐵人賽 Modern Web DAY 5
來自 GAS 的香氣～跟鳳黃酥一起享受 Google Apps Script 的午茶時光 系列 第 5 篇

技術 Day 5— 自動化回信機(2) 讀取試算表內容

昨天我們把試算表的前置作業完成，今天我們來看看將別人填表單後送到試算表中的內容怎麼被讀取。 首先先來看看昨天的問題： onEdit() 能在 Google 表單...

鳳黃酥 ‧ 2021-09-20
0 Like 0 留言 1825 瀏覽
鐵人賽 Modern Web DAY 7
Follow me! 來一場前端技能樹之旅 系列 第 7 篇

技術 [Day 07 - RWD] 跨平台生存之道 — RWD響應式網頁設計

現在越來越多種類的裝置出現，包括電腦、平板、手機，我們會在不同大小的螢幕上瀏覽網頁，究竟網頁要如何在所有設備上，都能顯示適合該裝置的排版模式？在過去會根據裝置來...

May ‧ 2021-09-20
0 Like 0 留言 1690 瀏覽
鐵人賽 Modern Web DAY 5
用React刻自己的投資Dashboard 系列 第 5 篇

技術 用React刻自己的投資Dashboard Day5 - 多張圖表渲染(Rendering lists)

tags: 2021鐵人賽 React 上一篇只畫了一張圖表，投資怎麼可能只需要看一張圖呢？這邊就再加上兩張圖來看看吧! 更改資料放置位置 專案架構圖如下 這...

Sean Liu ‧ 2021-09-20
0 Like 0 留言 1977 瀏覽
鐵人賽 Modern Web DAY 6
Follow me! 來一場前端技能樹之旅 系列 第 6 篇

技術 [Day 06 - CSS] Flexbox帶你飛，實現多樣化的網頁佈局

為什麼要學 Flexbox ？還沒學習 Flexbox 的我們，想要讓文字段落並排顯示時，只能調整元素的寬度讓它為了適應大小自動換行，這樣實在太不方便了！為了能...

May ‧ 2021-09-19
0 Like 0 留言 2345 瀏覽
鐵人賽 Modern Web DAY 4
用React刻自己的投資Dashboard 系列 第 4 篇

技術 用React刻自己的投資Dashboard Day4 - highcharts製作線圖

tags: 2021鐵人賽 React Javascript繪圖套件 在搜尋chart library的時候，發現JS可以用的library很多，包含 D3.j...

Sean Liu ‧ 2021-09-19
0 Like 0 留言 1518 瀏覽
鐵人賽 Modern Web DAY 4
來自 GAS 的香氣～跟鳳黃酥一起享受 Google Apps Script 的午茶時光 系列 第 4 篇

技術 Day 4— 自動化回信機(1) 前置作業

今天開始就要來利用專題了解 GAS 的各項功能囉～ 說到要能優雅、或是狼狽的…總之要能夠享受下午茶，不管你的狀態為何，你都必須要有「時間」。 而系統自動化，也就...

鳳黃酥 ‧ 2021-09-19
0 Like 0 留言 2388 瀏覽
鐵人賽 Modern Web DAY 3
來自 GAS 的香氣～跟鳳黃酥一起享受 Google Apps Script 的午茶時光 系列 第 3 篇

技術 Day 3 — 拆解 GAS 的執行

昨天我們寫了第一個 GAS 程式： Hello World ，今天我們來拆解一下我們到底寫了什麼東西。 昨天我們直接開始寫程式，還沒有機會好好認識一下 GAS...

鳳黃酥 ‧ 2021-09-18
1 Like 0 留言 1769 瀏覽
鐵人賽 Modern Web DAY 3
用React刻自己的投資Dashboard 系列 第 3 篇

技術 用React刻自己的投資Dashboard Day3 - React專案初始架構

tags: 2021鐵人賽 React 使用 Creat react app 對於React的初學者來說，create react app是最好的朋友，可以快速...

Sean Liu ‧ 2021-09-18
0 Like 0 留言 1298 瀏覽
鐵人賽 Modern Web DAY 5
Follow me! 來一場前端技能樹之旅 系列 第 5 篇

技術 [Day 05 - CSS] 玩轉CSS樣式，進入網頁美麗新世界

在上一篇學到了 CSS 的基本語法、使用選擇器以及檔案的套用方法。接著就讓我們來學習如何運用樣式屬性！首先來簡單了解一下 CSS 是如何去進行網頁的排版和調整元...

May ‧ 2021-09-18
0 Like 1 留言 3036 瀏覽
鐵人賽 Modern Web DAY 2
來自 GAS 的香氣～跟鳳黃酥一起享受 Google Apps Script 的午茶時光 系列 第 2 篇

技術 Day 2— 你的第一次聞GAS

今天來直接上手開始我們的 Google Apps Script 之旅啦！ 我們在使用 Google Apps Script 之前，一定要先了解一件事情： Goo...

鳳黃酥 ‧ 2021-09-17
0 Like 0 留言 1576 瀏覽
鐵人賽 Modern Web DAY 4
Follow me! 來一場前端技能樹之旅 系列 第 4 篇

技術 [Day 04 - CSS] 網頁長這樣能看嗎，CSS魔術Show

CSS (Cascading Style Sheets，階層樣式表)，用來描述 HTML 外觀的樣式表，含有各式各樣的樣式屬性，能夠讓你在元素上面套用樣式美化網...

May ‧ 2021-09-17
0 Like 0 留言 1778 瀏覽
鐵人賽 Modern Web DAY 2
用React刻自己的投資Dashboard 系列 第 2 篇

技術 用React刻自己的投資Dashboard Day2 - 網站Wireframe設計

tags: 2021鐵人賽 React 投資Dashboard內容設計 要實際動手製作wireframe之前，先來規劃一下圖表的內容有什麼，一般來說，投資相關的...

Sean Liu ‧ 2021-09-17
1 Like 1 留言 1764 瀏覽
鐵人賽 Modern Web DAY 1
來自 GAS 的香氣～跟鳳黃酥一起享受 Google Apps Script 的午茶時光 系列 第 1 篇

技術 Day 1 — GAS 能聞嗎？

引言 大家好，我是 CXPhoenix ，你可以叫我 Phoenix，或是鳳黃酥，平時都是在學校服務廣大莘(ㄧㄠ)莘(ㄇㄛˊ)學(ㄍㄨㄟˇ)子(ㄍㄨㄞˋ)了解資...

鳳黃酥 ‧ 2021-09-16
0 Like 0 留言 2631 瀏覽
鐵人賽 Modern Web DAY 3
Follow me! 來一場前端技能樹之旅 系列 第 3 篇

技術 [Day 03 - HTML] 想寫網頁，就從HTML開始

HTML (HyperText Markup Language，超文本標記語言)，是一種用來建立網站結構的語言，透過包含標籤 (Tag) 與內容 (Conten...

May ‧ 2021-09-16
1 Like 1 留言 2092 瀏覽
鐵人賽 Modern Web DAY 1
用React刻自己的投資Dashboard 系列 第 1 篇

技術 用React刻自己的投資Dashboard Day1 - 前言

tags: 2021鐵人賽 React 系列文想法來源 因為筆者本身在金融業工作，日常生活中時常關注一些投資相關的數據，例如：總體經濟數據、個股財務報告、加密貨...

Sean Liu ‧ 2021-09-16
0 Like 0 留言 2965 瀏覽
鐵人賽 Modern Web DAY 2
Follow me! 來一場前端技能樹之旅 系列 第 2 篇

技術 [Day 02] 建立開發環境，做好行前準備

老套說：「工欲善其事，必先利其器」— 要寫網頁，就不能沒有好用的開發環境。在開始認識各種前端技能之前，最重要的就是要先知道該在哪裡運行 Code ，就讓我們來看...

May ‧ 2021-09-15
iThome鐵人賽
參賽組數
1123 組
團體組數
52 組
累計文章數
23096 篇
完賽人數
656 人
iT+看影片追技術 看影片追技術 看更多
熱門tag 看更多
15th鐵人賽 13th鐵人賽 14th鐵人賽 12th鐵人賽 11th鐵人賽 鐵人賽 2019鐵人賽 2018鐵人賽 javascript 2017鐵人賽 python windows php c# windows server linux css 程式設計 react vue.js
熱門問題
熱門回答
熱門文章
IT邦幫忙