用React刻自己的投资Dashboard Day1 - 前言

tags: 2021铁人赛 React

系列文想法来源

因为笔者本身在金融业工作，日常生活中时常关注一些投资相关的数据，例如：总体经济数据、个股财务报告、加密货币价格...各种投资标的相关数据，平常都是透过网站或是软件来看数据，例如：Yahoo finance、钜亨网、CMoney、Bloomberg...等等，但有时候可能这些平台上面是没有我想要看的数据，就需要自己去Google看看有没有资料，有需要的话就要用Python将找到的资料做成图表，其实是一个蛮人工的过程。

刚好最近在学习使用React这个框架做网站，於是希望透过铁人赛这30天的过程，打造一个投资Dashboard，将平常会看的投资数据转化成图表，并呈现在网站上，同时也藉此机会熟悉React这个强大前端library。目标的话基本上希望完成从建构React专案开始，取得open source的资料，并使用javascript相关的图像library，最後则是建立资料的更新机制，就能让这个网站的资料保持在最新的状态。

30天文章内容

目前暂定会用到下列内容或是技术，待之後30天的过程可能会更新这个列表，所以在完赛後这个列表才会比较确定。

1. Day1 - 前言
2. Day2 - 投资Dashboard Wireframe
3. Day3 - React专案初始架构
4. Day4 - highcharts制作线图
5. Day5 - 多张图表渲染(Rendering lists)
6. Day6 - 建立图表区元件，串接API取得数据
7. Day7 - CORS与Proxy Server
8. Day8 - useState hook
9. Day9 - useEffect hook
10. Day10 - useCallback hook
11. Day11 - 分离UI元件与抓取数据元件
12. Day12 - 下拉式选单筛选功能
13. Day13 - 制作分页(Pagination)功能
14. Day14 - 解决重复发送API请求的问题
15. Day15 - 投资Dashboard 2.0版 Wireframe
16. Day16 - react-router-dom让SPA也有路由
17. Day17 - Dashboard 2.0版路由功能
18. Day18 - 选单列active style功能
19. Day19 - 2.0版首页内容设计
20. Day20 - 首页功能刻板
21. Day21 - 串接Finmind API
22. Day22 - 完成首页功能
23. Day23 - 台股技术面功能刻板
24. Day24 - 串接台股技术指标API
25. Day25 - 完成台股技术面功能
26. Day26 - 台股筹码面功能刻板
27. Day27 - 串接台股筹码指标API
28. Day28 - 完成台股筹码面功能
29. Day29 - 台股基本面功能刻板
30. Day30 - 网站功能未完待续