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

1 Like 0 留言 1496 瀏覽

鐵人賽 Modern Web DAY 26

被 React react 的後端工程師系列第 26 篇

技術 [DAY26] 今天天氣怎樣？等等我打一下 API 再跟你說

我想說的是API 串接範例練習，就是這麼簡單上一篇中安裝了 axios 於是我們就準備好了工具接下來要做練習，試試看實際執行的結果我們先直接在 Mass...

Nanami Lemon ‧ 2019-10-10

1 Like 0 留言 1040 瀏覽

鐵人賽 Modern Web DAY 25

被 React react 的後端工程師系列第 25 篇

技術 [DAY25] 打來打去之 API 又要挨打之套件安裝方法之 npm 安裝方法學問多

我想說的是在 React 裡面操作 ajax 可以使用 Axios 來達成使用 --save 安裝，會將指定套件加入依賴列表，未來可快速建立相同開發環境標...

Nanami Lemon ‧ 2019-10-09

1 Like 0 留言 887 瀏覽

鐵人賽 Modern Web DAY 24

被 React react 的後端工程師系列第 24 篇

技術 [DAY24] 活用生命週期的奧秘之提升效能

我想說的是使用 shouldComponentUpdate() 來優化組件效能前幾天中我們已經對 React 生命週期有了基本的認識那跟提高組件的性能又有...

Nanami Lemon ‧ 2019-10-08

1 Like 1 留言 841 瀏覽

鐵人賽 Modern Web DAY 23

被 React react 的後端工程師系列第 23 篇

技術 [DAY23] 生命週期 2 生命如此變化無常之然後呢之然後他就死掉了

我想說的是當組件被更新以及刪除的時候 react 的程式流程錯誤處理當一個組件在 render 的過程、生命週期或在某個子組件的 constructor...

Nanami Lemon ‧ 2019-10-07

1 Like 0 留言 922 瀏覽

鐵人賽 Modern Web DAY 22

被 React react 的後端工程師系列第 22 篇

技術 [DAY22] 生命週期 1 生命之初生命起源生命之水

我想說的是組件在 render 的一開始稱作 Mounting 看到標題有編號就代表，這些東西會講個幾篇具體幾篇我也不確定，兩篇或三篇吧在先前的範例中，我...

Nanami Lemon ‧ 2019-10-06

1 Like 0 留言 945 瀏覽

鐵人賽 Modern Web DAY 21

被 React react 的後端工程師系列第 21 篇

技術 [DAY21] 禁斷關係之 ref 之非必要不用之遇到難關的時候你可以再想想

我想說的是ref 一時爽，維護火葬場setState 有 callBack 函數有些時候會希望對 DOM 上面的值做操作，或是直接取得某個 input 欄...

Nanami Lemon ‧ 2019-10-05

1 Like 0 留言 753 瀏覽

鐵人賽 Modern Web DAY 20

被 React react 的後端工程師系列第 20 篇

技術 [DAY20] 過來讓我看看之 PropTypes 驗證元件屬性之這是我們之間的秘密

在組件間傳值的時候，當組件間關係越來越複雜時傳入參數值的正確性就變得很重要了，如果這個環節出錯一般稱為業務邏輯錯誤，這代表你程式寫的語法是對的但是錯的是你的業務...

Nanami Lemon ‧ 2019-10-04

1 Like 0 留言 1049 瀏覽

鐵人賽 Modern Web DAY 19

被 React react 的後端工程師系列第 19 篇

技術 [DAY19] 單向資料流之鮭魚逆流而上被石頭敲到不就＿頭好痛

我想說的是React 的寫法是 Functional Programming單向資料流，只能單向資料流 React 使用的是單向資料流也就是說資料只有一個...

Nanami Lemon ‧ 2019-10-03

1 Like 0 留言 1410 瀏覽

鐵人賽 Modern Web DAY 18

被 React react 的後端工程師系列第 18 篇

技術 [DAY18] Developer tools 與 Snippets 之老師我也想當金手指之 debug guy

我想說的是一些實用工具可以幫助開發上更加快速，能少打字就少打字，把力氣省起來Simple React Snippets 是一套 VSCode 上針對 reac...

Nanami Lemon ‧ 2019-10-02

0 Like 0 留言 771 瀏覽

鐵人賽 Modern Web DAY 17

被 React react 的後端工程師系列第 17 篇

技術 [DAY17] 組件傳值之我想搞點事

我想說的是React有明確規定，子組件時不能操作父組件裡的資料，所以需要調用父組件的方法，來修改父組件的內容有了 JSX 撰寫起來容易多了上一篇中我們成功...

Nanami Lemon ‧ 2019-10-01

1 Like 0 留言 685 瀏覽

鐵人賽 Modern Web DAY 16

被 React react 的後端工程師系列第 16 篇

技術 [DAY16] 組件的傳值之爸爸給你的你才能要

我想說的是組件傳遞資料並不是只能傳遞數值，函式也可以傳遞子組件不能直接操作父組件的資料，要通過父組件傳來的函數去變更父組件的資料上一篇中我們把按摩服務列表...

Nanami Lemon ‧ 2019-09-30

2 Like 0 留言 2994 瀏覽

鐵人賽 Modern Web DAY 13

前端三十 - 成為更好的前端工程師系列第 13 篇

技術 13. [JS] 為什麼判斷相等時不能用雙等號？

相信大家在初學 JavaScript 時，一定有人跟你說過：「比較時記得要用三等號（===），不要用雙等號（==）」，但你知道為什麼嗎？稍微有經驗的人可能馬上...

Gary ‧ 2019-09-29 ‧團隊Wow Doge!

0 Like 0 留言 725 瀏覽

鐵人賽 Modern Web DAY 15

被 React react 的後端工程師系列第 15 篇

技術 [DAY15] 組件的拆分

我想說的是組件拆分的方法在前面幾篇中，其實已經寫好了一個基本的按摩服務列表但是從頭到尾只使用了一個組件在小型專案中也許可以這麼做，但隨著專案大小勢必會需要...

Nanami Lemon ‧ 2019-09-29

1 Like 0 留言 2530 瀏覽

鐵人賽 Modern Web DAY 25

React.js 從【0】到【1】推坑計畫系列第 25 篇

技術【Day 25】useCallback - 學會把函式記起來

不知不覺來到第 25 天了，本來預計是要用小專案作結的，沒想到意外的忙碌啊，所以剩下的幾天就決定介紹一些我原本也不熟悉或不常使用的特性，學習的同時也盡量內化並記...

莫力全 Kyle Mo ‧ 2019-09-29

1 Like 0 留言 5295 瀏覽

鐵人賽 Modern Web

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

技術 Day 32. 戰線擴張・專案輸出 X 輸出設定 - TypeScript Compiler Output Configurations

閱讀本篇文章前，仔細想想看為何有些 ES6 的 Feature 諸如 Promise、Object.assign 等東西無法直接在 TypeScript...

Maxwell Alexius ‧ 2019-10-12

1 Like 2 留言 2476 瀏覽

鐵人賽 Modern Web DAY 12

前端三十 - 成為更好的前端工程師系列第 12 篇

技術 12. [JS] 為什麼 typeof new Array() === 'object'？

JavaScript 由於弱型別的語言特性，對於剛開始學習的新手來說，型別就跟暗戀的對象一樣，總是讓人捉摸不透，即使你用了 typeof 運算子來問他，也會得...

Gary ‧ 2019-09-28 ‧團隊Wow Doge!

1 Like 0 留言 3897 瀏覽

鐵人賽 Modern Web

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

技術 Day 31. 戰線擴張・專案監控 X 編譯設定 - TypeScript Compiler Compile Configurations

恩... 照常 Day 31. 繼續。《戰線擴張》篇章概要本系列進入到第三部分：《戰線擴張》篇（The Front Line Expansion）筆者就...

Maxwell Alexius ‧ 2019-10-11

0 Like 0 留言 9483 瀏覽

鐵人賽 Modern Web DAY 24

React.js 從【0】到【1】推坑計畫系列第 24 篇

技術【Day 24】 useRef

useRef 是一個可以讓我們抓取到 DOM 節點的 hooks。實作上非常簡單，直接來看範例吧： import React, { useRef } from...

莫力全 Kyle Mo ‧ 2019-09-28

0 Like 0 留言 1082 瀏覽

鐵人賽 Modern Web DAY 14

被 React react 的後端工程師系列第 14 篇

技術 [DAY14] 一個蘿蔔一個坑之 JSX 幾個坑

我想說的是JSX 註解的寫法和一般的 HTML 不一樣寫程式不寫註解，就像是大腸麵線沒加香菜雖然能，但吃就是少一味；還有些人特別討厭加寫註解還是有些好處的...

Nanami Lemon ‧ 2019-09-28

2 Like 0 留言 3015 瀏覽

鐵人賽自我挑戰組 DAY 22

破釜沉舟的轉職路-37歲從0開始成為一個軟體工程師系列第 22 篇

技術 CSS 的預處理器 Sass

連續的從 HTML 到 CSS 然後到 RWD，現在我們要來到了 Sass了，Sass 是 CSS 的預處理器，顧名思義它的功能就是可以「預先處理」CSS，讓我...

Alec ‧ 2019-09-30

0 Like 0 留言 2401 瀏覽

鐵人賽 Modern Web DAY 23

React.js 從【0】到【1】推坑計畫系列第 23 篇

技術【Day 23】useMemo

昨天 React.memo 比較像是針對 component 做 memorization，今天要介紹的 useMemo 這個 hooks 則是可以對函式實作...

莫力全 Kyle Mo ‧ 2019-09-27

2 Like 1 留言 1381 瀏覽

鐵人賽自我挑戰組 DAY 21

破釜沉舟的轉職路-37歲從0開始成為一個軟體工程師系列第 21 篇

技術介紹了好多天的 RWD，今天來排一個完整一點的版型

我們花了好多天的時間來介紹 RWD 的設計概念，但是每一個概念都比較片斷與零散一點，今天我們來把所有的概念整合一下，變成一個完整的 RWD 網頁吧，來看一下我們...

Alec ‧ 2019-09-29

6 Like 1 留言 5231 瀏覽

鐵人賽 Modern Web DAY 30

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

技術 Day 30. 機動藍圖・流言終結者 X 重新認識物件的複合 - Favour Object Composition Over Class Inheritance

閱讀本篇文章前，仔細想想看已經熟悉類別的運作流程並懂得 OOP 的基礎概念。熟悉了策略模式（Strategy Pattern）嗎？如果還不清楚的話...

Maxwell Alexius ‧ 2019-10-10

0 Like 0 留言 3230 瀏覽

鐵人賽 Modern Web DAY 22

React.js 從【0】到【1】推坑計畫系列第 22 篇

技術【Day 22】React.memo

昨天講到了 class based component 可以透過 shouldComponentUpdate 比較前一次 props 與前一次 state 來...

莫力全 Kyle Mo ‧ 2019-09-26

1 Like 0 留言 5937 瀏覽

鐵人賽 Modern Web DAY 21

React.js 從【0】到【1】推坑計畫系列第 21 篇

技術【Day 21】React 渲染機制

我們都知道使用 React 讓我們的應用可以擁有非常好的效能，但背後裡 React 到底幫我們做了哪些努力呢？今天就來初探一下 React 的渲染機制！當我們...

莫力全 Kyle Mo ‧ 2019-09-25

2 Like 0 留言 1401 瀏覽

鐵人賽自我挑戰組 DAY 20

破釜沉舟的轉職路-37歲從0開始成為一個軟體工程師系列第 20 篇

技術在 media query 內使用 float:none 清除浮動效果

float的使用，我們常會用在 desktop 的排版上，不管是要將區塊並排顯示，或是要將選單橫列，常常都會使用到{float:left;}。今天我們要提到的是...

Alec ‧ 2019-09-28

1 Like 0 留言 2157 瀏覽

鐵人賽 Modern Web DAY 13

被 React react 的後端工程師系列第 13 篇

技術 [DAY13] Filter 標題的靈感之我真的一滴都不剩了之真想不出

我想說的是filter 會建立一個經過指定運算判斷後回傳為真的新陣列，就是這麼簡單關於 filter 在其他地方我好像已經遇到好幾遍，一直沒有有系統地把它...

Nanami Lemon ‧ 2019-09-27

1 Like 1 留言 4498 瀏覽

鐵人賽自我挑戰組 DAY 17

破釜沉舟的轉職路-37歲從0開始成為一個軟體工程師系列第 17 篇

技術改用百分比(%)為單位，讓你的 RWD 網頁縮放自如

過往我們不管是設width寬、height高時，或是在做margin或padding，比較習慣的單位都是用px，現在我們要改用%百分比，但在改用百分比前我們先...

Alec ‧ 2019-09-25

1 Like 0 留言 5229 瀏覽

鐵人賽 Modern Web DAY 20

React.js 從【0】到【1】推坑計畫系列第 20 篇

技術【Day 20】可能不需要redux (2) - contextAPI

昨天介紹了 useReducer 的用法，但是還缺少了 global state 的機制啊？怎麼會說可能可以不需要 redux 了？今天就來介紹 context...

莫力全 Kyle Mo ‧ 2019-09-24

3 Like 1 留言 2476 瀏覽

鐵人賽自我挑戰組 DAY 16

破釜沉舟的轉職路-37歲從0開始成為一個軟體工程師系列第 16 篇

技術 RWD 不可顯示 X 軸法則

使用行動設備上網時不管是手機或是平板，不同於使用電腦會有滑鼠，而是使用我們的手指滑動銀幕，以使用習慣來說，通常是以上下滑動的方式來進行內容瀏覽，而不像是使用電腦...

Alec ‧ 2019-09-24