Contents
在一個完整的全端環境中建立一個真實世界的應用程式,掌握 React 中最新和最棒的功能,
從這 4.5 小時的課程,你會學到
- 使用 React Hooks 和 GraphQL 建立實用、功能豐富的應用程式
- 使用 React Hooks 管理真實應用程式中的狀態
- 如何使用 React Hooks 和 GraphQL 建立全端的應用程式
- 使用 React Hooks 整合 GraphQL 客戶端 / 伺服器端程式庫
要求
- 對 React Hooks 的基本理解(例如,參加了我的 React Hooks 課程)
- 熟悉 GraphQL
課程說明
想要使用 React Hooks 建立一個真實世界的全端( full-stack )應用程式? 只要看看這門課就知道了。
### 我們要建造什麼 ? ###
一個即時、全端的 React 應用程式,後端是 GraphQL Server (Apollo Server 2) ,使用雲端 MongoDB 資料庫(Mongo Atlas) ,使用 React Hooks 來管理我們的狀態(替換 Redux!) ,使用社群認證(Google OAuth2) ,使用 GraphQL 訂閱即時資料,使用 Cloudinary 上傳影像等等。
我們的應用程式將是一個名為 GeoPins 的即時地理定位應用程式,使用者可以在地圖上標出不同的位置,並即時與其他使用者分享自己的內容—- 分享圖片、對位置和地點的評論、透過在圖釘上新增評論與其他使用者互動,以及管理他們在地圖上建立的圖釘。
### 課程包括哪些概念? ###
- 如何使用身份驗證建立一個強健的 GraphQL 伺服器(使用 Apollo Server 2)
- 如何深入使用兩個 GraphQL 客戶端程式庫 — Apollo Client 和 GraphQL Request
- 使用 useContext 和 useReducer Hooks 替換 Redux,用於全域性狀態管理
- GraphQL 中的所有主要概念: 查詢、變更、訂閱、 TypeDefs、解析器、輸入等
- 所有主要的 Hooks(useState、 useEffect、 useContext、 useReducer)
- 建立客制化的 Hooks 以”hook”到應用程式的其它功能
- 整合社群登入(Google OAuth)和 Apollo Server 2
- 使用 GraphQL 訂閱及時顯示應用程式的變更
- 使用 Cloudinary API 上傳動態影像
- 使用雲端的 MongoDB (MongoDB Atlas)
- 使用 Mongoose 建立模型、 CRUD 和搜尋操作以及分類
- 使用 Material UI 元件庫和 Material UI 圖示製作有吸引力的應用程式
- 使用 Material UI 和 “useMediaQuery” Hooks 做一個非常簡單的移動 / 響應設計
- 使用 Mapbox API 和 ReactMapGL 開發令人驚歎的地圖應用程式
- 使用瀏覽器地理定位 API 檢視使用者的當前位置
- 使用 React Router v4 建立路由保護 / 保護路由
- GraphQL / Apollo 中的基本身份驗證 / 授權概念
- 伺服器和 React 客戶機上的錯誤處理
- Async / await 函式以及大量的 ES6 / ES7概念
- 還有更多!
目標受眾
- 希望學習尖端開發工具和技術的React / JavaScript 開發人員
- 希望建立完整的真實世界 JavaScript 應用程式的開發人員
講師簡介
Reed Barger 全端 Web 開發人員 ( 更多講師主講課程介紹 )
我是一個充滿熱情的網頁開發者,熱衷於學習和教授我所知道的東西。 我相信通過實踐學習,這種哲學在我教授的每一門課程中都有體現。 我喜歡探索新的網路技術,我的課程專注於給你在今日快速發展的行業中擁有優勢。
英文字幕:有
- 想要了解如何將英文字幕自動翻譯成中文? 請參考這篇 How-To
報名參加課程| 更新 coupon code
也許你會有興趣
- 2019 完整的 React 開發者課程 (包含 Redux,Hooks,GraphQL)
- React 前端開發學習地圖
- ★英語學習地圖 – 練好英文是最大的學習槓桿
- 如何找工作學習地圖 – 找工作不要靠運氣!
✍ 搜尋結果太多?可參考 Soft & Share 搜尋引擎使用技巧