Contents
學習如何使用 React HighCharts，風格化的元件和 CSS Grid建立漂亮快速的儀表板
從這 3.5 小時的課程，你會學到
- 快速 React 應用程式開發
- 風格化的元件和動態 CSS
- 用於繪製歷史數據圖表的 HighCharts
- 用於快速佈局的 CSS Grid
- 使用 CryptoCompare API 獲取實際定價資料
- 日期操做的時刻
- 用於函數程式設計(functional programming)的 Lodash
- Async / Await
- 建立一個完整的專案
- 使用 localStorage 儲存最喜歡的硬幣
要求
- 一臺可連線網際網路的電腦
課程說明
用這個專業的 React 課程建立一個完整的加密貨幣儀表板！
- 設定帶有介紹問候的頁面
- 在第一次訪問時問候使用者，要求他們選擇他們的最愛
- 提供預設的5個貨幣作為最愛 & 所有貨幣的完整列表
- 用模糊搜尋搜尋貨幣
- 懸停( Hovering )和選擇貨幣
- 在收藏夾中新增 / 刪除貨幣
- 取消所選的貨幣
- 確認喜歡的貨幣
- 為使用者記住這些設定
- 生成儀表盤價格和歷史資料
- 儀表板
- 資料從記住的收藏夾中初始化，或者轉發到設定頁面
- 顯示 5 個主要卡片為前 5 個最愛和簡潔的卡片為下五個
- 在當前最喜愛的符號上呈現10個歷史點的線形圖
- 選擇貨幣更改和重新獲取資料，記住當前最喜歡的貨幣
- 選擇呈現歷史點：使用日/週/月
- 在圖表旁邊顯示貨幣的名稱和影象
- 額外免費課程: 主題( Themes )
- 輕鬆地配置應用程式的主題是 dark 的或者是 light
React 不僅僅針對業界內的專家，事實上初學者應該從 React 開始，因為它確實是建構應用程式最簡單的方式。
create-react-app 專案是一個驚人的模板，可以快速建構應用程式。 你不再需要強調 Webpack，建構工具等等。 這些都是在你啟動專案唯一需要的:create-react-app。
每一行程式碼都會解釋，因為專案是從頭開始的，沒有跳過任何步驟或浪費了時間。
你將看到如何快速完成風格化元件，最新進展的 CSS-in-JS 範例。
使用 HighCharts，我們將向您展示如何執行HighCharts 與 React，並定製主題以適應我們的專案。
對我們最喜歡的資料進行複雜的修改需要對狀態流的嚴格瞭解，因此我們必須注意解釋如何維護我們的 React 狀態的每一個方面是重要的，並且只建立了整潔的變數。
與所有開發人員一樣，我們也會遇到錯誤，所以你將會看到這些錯誤是如何被修復的，以及將來如何避免。 我們不只是貼上程式碼，我們從頭開始重建，就像你一樣。
在所有的螢幕共享中都包含了 Webkit Inspector，所以你可以看到我們是如何除錯的，因為我們在編寫程式碼時應該經常進行除錯、日誌記錄和檢查。
如果你有任何問題，請伸出手來。 我們很樂意幫助你們回答與你們的課程學習有關的所有問題。
祝你在CryptoDash上有好運，我知道你會喜歡這個專案。
目標受眾
- 從 Web 開發的完全初學者到希望接案專家。
講師簡介
react.school _ 增強的 JavaScript 專案( 更多講師課程介紹 )
開始工作吧。 我們相信以專案為中心的 web 開發是為軟體開發職涯做準備的最好方式。 我們的課程給你一個 React 開發人員的日常職責的核心洞見。
React 就是未來。 在一項超過20000名開發人員參與的調查中，《 JavaScript 2018 現況》發現，65% 的開發人員”曾經使用過 React 並且願意再次使用它”，這一數字在2017年為58% 。
我們是首席軟體工程師，擁有幾十年在部署和維護 web 應用程式的經驗。 我們在專案中使用 React，提供高效能的資料視覺化應用程式，高階的單網頁應用程式，以及所有的使用者介面給客戶。
我們提供優質的軟體專案建立實際的職涯工作流程，具有專門的支援和完整的原始碼參考。
英文字幕：有
- 想要了解如何將英文字幕自動翻譯成中文? 請參考這篇 How-To
報名參加課程 ｜ 更新 coupon code
也許你會有興趣
- React 前端開發學習地圖
- ★英語學習地圖 – 練好英文是最大的學習槓桿
- 如何找工作學習地圖 – 找工作不要靠運氣！
發表迴響