區塊鏈大師之路- 第一章 區塊鏈技術實作

# 前言 站在巨人的肩膀上學習區塊鏈

想要學好區塊鏈，從基礎開始了解是非常重要的，掌握區塊鏈的架構和基礎技術，才能更好的理解區塊鏈的應用。這篇文章參考 區塊鏈生存指南 內的內容和程式碼，實作出一個簡易版的區塊鏈，並將區塊鏈的基礎技術做視覺化的呈現。

區塊鏈生存指南 1. 書籍連結 : https://www.books.com.tw/products/0010931871 2. github 程式碼 : https://github.com/lkm543/Blockchain_Survival_Guide

有了基礎的知識後，這篇文章會實作一個網頁版的區塊鏈技術展示，整體前端框架使用 React.js, CSS 則是使用 TailwindCSS 跟 DaisyUI, 書中的程式碼則是使用 Python 實作，這邊則是轉換成 Javascript 實作，透過轉換語言的實作。可以將書中的知識內化，同時經由視覺化的過程，可以更加熟悉區塊鏈，將實作的網站透過 github pages 釋出也會更有成就感。

網站實作連結: https://aquilass.github.io/block_chain/
網站 github: https://github.com/Aquilass/block_chain

# 前端網頁區塊鏈

區塊鏈的架構會分成三個部分，分別是區塊，區塊鏈，節點，這邊會分別介紹這三個部分的架構和實作。

主畫面

首先看到主畫面的部分，第一排是關於操作區塊鏈設定，包含建造創世區塊、創建用戶、關閉 log、驗證區塊完整性。

第二排是區塊鏈的視覺化，可以看到隨著你按在用戶底下的當個礦工挖呀挖，即可挖出一個新的區塊，並且將區塊加入區塊鏈中，底下內部 log 中則會有新增區塊鏈的資訊，包含區塊鏈的難度、區塊鏈的內容、區塊鏈的 hash 值，及用戶互相轉帳的 log。需要特別注意的是，區塊鏈上的交易內容，需要等待新的礦工挖出新的區塊，才會被加入區塊鏈中，這邊的交易內容是指用戶之間的轉帳。

在區塊鏈獲得 BTC 的方式僅有挖掘新的區塊或者接受他人的 BTC， BTC 的數量會顯示在用戶的名字旁邊，當你挖到新的區塊時，會獲得 100 個 BTC，當你接受他人的 BTC 時，則是會增加你的 BTC 數量。

最後是驗證區塊鏈完整性的按鈕，當按下之後會透過區塊鏈的 Hash 確定區塊鏈是否被竄改，如果區塊鏈被竄改，則會顯示區塊練被竄改，如果沒有被竄改，則會顯示區塊鏈完整。

最後再特別提一下，實際開發出的網站和 github pages ，感興趣的大大可以去玩玩看。

網站實作連結: https://aquilass.github.io/block_chain/
網站 github: https://github.com/Aquilass/block_chain