iT邦幫忙

鐵人檔案

2021 iThome 鐵人賽
回列表
Modern Web

用React刻自己的投資Dashboard 系列

對於投資很狂熱的夥伴們,每天穿梭在股海之中,是不是為了得到最新消息,看了非常多的網站呢?本系列文章希望能夠藉由React架構,串接各種投資數據API,將散亂的投資資訊整理到一個網頁內,並藉由繪圖套件的輔助,將死板板的表格資料,做成一張又一張容易閱讀及分析的圖表,並且為每一張圖表加上使用說明書,不管是自己使用或是給別人看都非常方便,看到這邊是不是非常心動呢?開始吧,挑戰刻出屬於自己的投資Dashboard!

鐵人鍊成 | 共 30 篇文章 | 30 人訂閱 訂閱系列文 RSS系列文
DAY 21

用React刻自己的投資Dashboard Day21 - 介紹Finmind API

tags: 2021鐵人賽 React 接下來幾篇都會串接Finmind這個開源API,本篇就先來理解一下Finmind有哪些資料可以使用。看了一下官方網站的資...

2021-10-06 ‧ 由 Sean Liu 分享
DAY 22

用React刻自己的投資Dashboard Day22 - API與前端資料需求比對

tags: 2021鐵人賽 React 一般來說在開發階段,前端與後端會討論資料需求,讓API產出的內容能夠滿足前端畫面的需求,不過這次因為是串接外部的API,...

2021-10-07 ‧ 由 Sean Liu 分享
DAY 23

用React刻自己的投資Dashboard Day23 - 非同步呼叫API,完成首頁資料串接

tags: 2021鐵人賽 React 上一篇確認過API內容之後,剩下的部份就是串接API,並將資料呈現在畫面上了,雖然描述起來是短短兩句,不過還是寫了好多的...

2021-10-08 ‧ 由 Sean Liu 分享
DAY 24

用React刻自己的投資Dashboard Day24 - styled components

tags: 2021鐵人賽 React 因為下一篇要讓導覽列在手機版網頁呈現漢堡選單的樣式,在參考其他工程師寫的網頁的時候,發現有一位是用styled-comp...

2021-10-09 ‧ 由 Sean Liu 分享
DAY 25

用React刻自己的投資Dashboard Day25 - 製作漢堡選單

tags: 2021鐵人賽 React 安裝styled-components套件 在專案資料夾內一行安裝就完成了。 npm install --save st...

2021-10-10 ‧ 由 Sean Liu 分享
DAY 26

用React刻自己的投資Dashboard Day26 - 台股技術面功能規劃

這篇終於要來開始做台股技術面的功能了,對於善於技術分析的投資人來說,看K線是非常基本的事情,因為從技術分析的角度來看,K線可以分析出很多其他面向看不到的學問喔~...

2021-10-11 ‧ 由 Sean Liu 分享
DAY 27

用React刻自己的投資Dashboard Day27 - 台股技術面刻板

tags: 2021鐵人賽 React 一般來說刻板前應該會需要畫個wireframe會比較清楚一些,不過時間有限,就在紙上畫一畫就先開始寫code吧,先達成功...

2021-10-12 ‧ 由 Sean Liu 分享
DAY 28

用React刻自己的投資Dashboard Day28 - 串接台股技術面API

tags: 2021鐵人賽 React 上一篇刻好版型後,這篇就可以來串接API拉,目標當然就是讓使用者輸入股票代號後,能夠跑出最新收盤價格、漲跌幅度、漲跌幅度...

2021-10-13 ‧ 由 Sean Liu 分享
DAY 29

用React刻自己的投資Dashboard Day29 - 替股票加上名稱

tags: 2021鐵人賽 React 上一篇提到台股技術面的最新收盤資訊只有股票代號,似乎少了名稱,本篇就來把它補上吧。 資料來源 Finmind API裡面...

2021-10-14 ‧ 由 Sean Liu 分享
DAY 30

用React刻自己的投資Dashboard Day30 - 股票代號輸入防呆機制

tags: 2021鐵人賽 React 股票代號輸入錯誤當機問題 Day28的文章有提到,當使用者想要輸入股票代號看K線圖時,如果輸入的股票代號是錯誤的,也就是...

2021-10-15 ‧ 由 Sean Liu 分享