Coding Hero
React / GraphQL / Node.js
React Style 各種CSS使用方式 Part2 - import style file
HI, I’m Steven 這系列主要想整理一下 自己在開始開發 React 專案之後幾個常用來撰寫 styling 方式 主要會分為幾個系列 Part1 - inline style Part2 - import style file Part3 - style…
React hooks 進階 - custom hooks
使用了 hooks 之後，我就再也回不去了… 本篇要介紹的是如何使用 custom hooks 做狀態的封裝與 code reuse，並與 Redux 做比較。 在正文開始前，先說個小故事。還記得一年多前，React 16.8.0-alpha 剛問世，公司第一個採用 React…
React Style 各種CSS使用方式 Part1 - inline style
HI, I’m Steven 這系列主要想整理一下 自己在開始開發 React 專案之後幾個常用來撰寫 styling 方式 主要會分為幾個系列 Part1 - inline style Part2 - import style file Part3 - style…
Node.Js 使用 Redis 優化效能
最近在開發上，需要處理大量前端 request，也算是第一次要設計 to client 的專案，查詢資料庫可能會變得更加頻繁。 這時！腦海中浮現快取，cache，當我首次寫 Node.js…
Node.js Apollo Server 介紹 (1)
使用 Apollo Server 快速為你建造 Node.js GraphQL API。 前言 想當初在專案中，取資料用的不是純 Rest API，Server 總是吐一堆我可能不需要用的資料，想一次在 request…
ES6 Optional Chaining 實戰
本篇要介紹的是如何在現行使用 babel 轉譯 ES6 語法的專案中使用 TC39 的提案 feature - optional chaining。 What is optional chaining? Optional chaining 是一個來自 TC3…
React hooks 簡介
本篇要介紹的是 React 最常見的三個 hooks 的基本使用方法。 在正文開始前，先介紹一個 VSCode 套件 - ES7 React/Redux/GraphQL/React-Native snippets，這個套件內含很多寫 React 常會使用到的 code…
在React專案裡加入Apollo Client
本篇要介紹的是 GraphQL Apollo Client 的基本安裝。 What is GraphQL？ GraphQL 是一個開源的 API 數據查詢和操作語言及實現為了實現上述操作的相應運行環境。2012 年，GraphQL 由 Facebook 內部開發，201…
Class component vs function component
本篇介紹的是 React 的新 feature - hooks 與先前舊版本 class component 的差別。 React 在 16.8.6 之後，加入了新的 feature - hooks，對於開發方式產生了不小的變化，因為在 16.8.…
