JSDC.tw
      • Sharing URL Link copied
      • /edit
      • View mode
        • Edit mode
        • View mode
        • Book mode
        • Slide mode
        Edit mode View mode Book mode Slide mode
      • Customize slides
      • Note Permission
      • Read
        • Owners
        • Signed-in users
        • Everyone
        Owners Signed-in users Everyone
      • Write
        • Owners
        • Signed-in users
        • Everyone
        Owners Signed-in users Everyone
      • Engagement control Commenting, Suggest edit, Emoji Reply
    • Invite by email
      Invitee

      This note has no invitees

    • Publish Note

      Share your work with the world Congratulations! 🎉 Your note is out in the world Publish Note

      Your note will be visible on your profile and discoverable by anyone.
      Your note is now live.
      This note is visible on your profile and discoverable online.
      Everyone on the web can find and read all notes of this public team.
      See published notes
      Unpublish note
      Please check the box to agree to the Community Guidelines.
      View profile
    • Commenting
      Permission
      Disabled Forbidden Owners Signed-in users Everyone
    • Enable
    • Permission
      • Forbidden
      • Owners
      • Signed-in users
      • Everyone
    • Suggest edit
      Permission
      Disabled Forbidden Owners Signed-in users Everyone
    • Enable
    • Permission
      • Forbidden
      • Owners
      • Signed-in users
    • Emoji Reply
    • Enable
    • Versions and GitHub Sync
    • Note settings
    • Note Insights New
    • Engagement control
    • Transfer ownership
    • Delete this note
    • Insert from template
    • Import from
      • Dropbox
      • Google Drive
      • Gist
      • Clipboard
    • Export to
      • Dropbox
      • Google Drive
      • Gist
    • Download
      • Markdown
      • HTML
      • Raw HTML
Menu Note settings Note Insights Versions and GitHub Sync Sharing URL Help
Menu
Options
Engagement control Transfer ownership Delete this note
Import from
Dropbox Google Drive Gist Clipboard
Export to
Dropbox Google Drive Gist
Download
Markdown HTML Raw HTML
Back
Sharing URL Link copied
/edit
View mode
  • Edit mode
  • View mode
  • Book mode
  • Slide mode
Edit mode View mode Book mode Slide mode
Customize slides
Note Permission
Read
Owners
  • Owners
  • Signed-in users
  • Everyone
Owners Signed-in users Everyone
Write
Owners
  • Owners
  • Signed-in users
  • Everyone
Owners Signed-in users Everyone
Engagement control Commenting, Suggest edit, Emoji Reply
  • Invite by email
    Invitee

    This note has no invitees

  • Publish Note

    Share your work with the world Congratulations! 🎉 Your note is out in the world Publish Note

    Your note will be visible on your profile and discoverable by anyone.
    Your note is now live.
    This note is visible on your profile and discoverable online.
    Everyone on the web can find and read all notes of this public team.
    See published notes
    Unpublish note
    Please check the box to agree to the Community Guidelines.
    View profile
    Engagement control
    Commenting
    Permission
    Disabled Forbidden Owners Signed-in users Everyone
    Enable
    Permission
    • Forbidden
    • Owners
    • Signed-in users
    • Everyone
    Suggest edit
    Permission
    Disabled Forbidden Owners Signed-in users Everyone
    Enable
    Permission
    • Forbidden
    • Owners
    • Signed-in users
    Emoji Reply
    Enable
    Import from Dropbox Google Drive Gist Clipboard
       Owned this note    Owned this note      
    Published Linked with GitHub
    • Any changes
      Be notified of any changes
    • Mention me
      Be notified of mention me
    • Unsubscribe
    --- tags: jsdc2021 --- # #Session 3 前端工程師也能搞得懂的區塊鏈 {%hackmd 2YoCBdBPTjmHXDr9lEpWuQ %} > 從這開始 > 可以直接打字做共筆囉 :point_down: 演講連結:https://vimeo.com/641650302 Lucien Lee ![](https://i.imgur.com/x1Hl0cx.png) ![](https://i.imgur.com/exZfPEC.png) # Agenda 1. 什麼是區塊鏈 2. 可做什麼 3. 在 JS 上的使用 # What is Blockchain a semantic overloaded word ![](https://i.imgur.com/ssYtirC.jpg) - 辨別不同的帳本 - 多本或一本帳本? - 帳本公開? - 誰可以驗證? ![](https://i.imgur.com/GNer6jK.png) ![](https://i.imgur.com/nJSnqjv.png) ## Ledger ### Unforgeable(不可偽造性) - Use Asynmetic Key,只有本人可修改 ![](https://i.imgur.com/PZetssy.png) ### Immutable(固定不可變) ![](https://i.imgur.com/dsiVFzK.png) Block 用 Hash fingerprint 串接,fingerprint 含前一個 Block 的資訊 [**講者範例網站**](https://andersbrownworth.com/blockchain/block) Block id + Nonce + Data + Prev = Hash - 挖礦就是將 Chain 上的 Hash 不斷重算的過程 - 可以從Hash的變化看出 ## Decentralized(去中心化) ![](https://i.imgur.com/xnmY3fZ.png) ### Example of ETH ![](https://i.imgur.com/lHkW78X.png) ![](https://i.imgur.com/PrFFgsm.png) ![](https://i.imgur.com/CdH7GcF.png) # Smart Contract ![](https://i.imgur.com/fbS8vuT.png) - Code is Rule - Verifiable Behavior - Resistance to Cencorship ![](https://i.imgur.com/vKP6642.jpg) Like Serverless -> Function as Service ![](https://i.imgur.com/1FUbdBH.png) 寫好你要做的事即可 ![](https://i.imgur.com/J6NHTlS.png) 根據用量計費 ![](https://i.imgur.com/9nohI5f.png) 區塊鏈根據交易的動作收錢 ![](https://i.imgur.com/RT7ALLf.png) - Dapps - RPC 溝通 ![](https://i.imgur.com/OAUC8F8.png) # How Does JavaScript ![](https://i.imgur.com/aVi0vOo.png) ![](https://i.imgur.com/9nEsGro.png) ![](https://i.imgur.com/9eoNjZy.jpg) 包裝介面,讓使用者方便使用 ## Script / Arbitrage 寫 Script # What's good scenario of blockchain ![](https://i.imgur.com/D0JpK1j.png) ![](https://i.imgur.com/3OxpKup.png) # Test ![](https://i.imgur.com/kcjpAmS.jpg) ![](https://i.imgur.com/9HPuEov.png) ![](https://i.imgur.com/w9oadaF.jpg) ![](https://i.imgur.com/A3gkeYz.jpg) test: 即時字幕: 不分區第二快來說這個話是什麼產生的熱愛的第四個東西丟記得到自己的一個這個東西我說我每一個都會環環相扣上一個草一個裡面的資料的部分所以只要你面只要一遍那個會連鎖反應變比如說我現在的4塊我想要改我應該是改了以後這個這邊的話也變了所以後面的時候也會受影響都變得不一樣才會去會被改過因為我剛剛講說去快點要去買你自己但感過以後他前面就不是領了他就算這個便當時多少去抽到的部分他抽到了以後呢就變了就算這邊 保濕後面的區塊都是小哪吒交易重算這個mining挖礦的過程就差速器具材料對的還是透過這種方法我就可以很快找到哪一塊去會被人家串改那個就是不可靠的是有問題的那個簡化 去了解去相信只要了解更多我們這種欲達成區塊鏈網路最後的特性去中心化的部分呢去中心化不是這麼簡單說我把一群電腦連在一起放在網路上就搞定了他其實裡面還是很多技術考量的因說這些電腦以在網路上要付什麼要互相找到鼻子怎麼樣去互相溝通去傳輸資料這邊就用到以前ptt傳需要的技術很知名的演算法用卡必那麼這樣的網路的演算法方便他們找到彼此只要怎麼去同步資料另外一個問題是這個姊姊姊沒有限可能惡意的想要散播一些壞人資料去工 網路的狀況會調整難度男都會做到同一個電腦王昱潔墊很難連續劇初會很難去操控網路就可以達到這個網路的公正性然後不會被二一公斤這邊我們帶他了解一下以太坊上交易他到底是什麼樣發生的喔那你比我大哥版本為例來講這個東西那首先得如果他想要叫他回去他的錢包有存到是要地方去處理他交易的一些詳細資料要傳給誰啊要轉多少啊在裡面然後呢用他希望去做的簽章法簽完妝的這個交易呢也散播到附近的乙太坊幾點上那附近景點收到禮後呢還是先檢查他的餘額夠不夠啊夠的話才繼續把這個交易的資料仙台到一個Q裡面有時候一個體差破裡面還沒打這個破綻存在那邊那這個過程中的幾點的會不斷收新的這些教也會廣播交易出去當鋪借幾點去知道這個叫也存在啊在這過程中他就選你現在給小費最多的交易然後計算他裡面的值的變化然後準備把這些交易打包在一起產生新的BLOCK就像我一樣交易動到那個給他部分然後你去猜數字不出頭出那個那是合法的一個結果抽到以後呢他就會把那個交易跌打包進去然後打*完他就說我這邊有一個打包好了一個新的那個附近網路接收納附近網路了他會去SIM這個新的BLOCK然後還要改動的一些狀態啊他這個資料已經超過離開了那這樣就可以產生一個因為我公證行的一種資料庫的一個結果剛剛講的部分啊我現在來講什麼COUNTRY部分數計算的部分啊我們現在呢除了再去外面上可以存資料以外什麼可以像是跑些小拳石小程式在上面好我的程式碼的好處是什麼呢是我在上面跑程式不是公開他非檢驗的上面跑東西呢不會被人家任意竄改預算的結果同時呢他也是不會被人家長在外面說你不能用每一個人都公開有權利也被使用於是他是抗生茶地獄傳統世界的工程師來說我覺得最接近的架構就是SERVER架構了那是什麼呢應用最早最早古老年要其他真的機器然後你要裝OS然後然後把裡面狀態的環境都不好然後再把你開發的丟進去然後跑起來然後會有怕死不分的他可以讓以後可能是虛擬環境知道把你寫好的一個ACTION丟進去就好了這地方更誇張一點都不用做你不用管這些你都不用管那個網路傳輸連接的過程你知道我管你的BB霜犬長什麼樣就好你不楚的是一塊塊地方權而不是一個完整完整個然後呢再呼叫時候呢直接去吃一個那個方式讓他從一個虛擬的環境發覺起來然後的計算所以已讀都歷史為例我可以看到月底都歷史呢他會把裡面的每一個幫選都變成一個ROUTE DE CAMPAGNE那我可以針對不同意後要去呼叫一個方選就好了廁所的時候不是會去拿那其他就只是一個方選取去讀取這個資料就好了我不需要把整個方選它SEVEN'S CODE寫起來我要寫這個藥局可以寄不出去啊然後在運行的時候呢我這個特別的地方在於它計價單願像以前是我叫多少的PM起來比較多少起來還記得是我是看我算了多久我算了多少的錢還計價的所以以上以前的過濾網他可能是一個 每一個計算他就一定要花多少錢沒有V KOOL每個STORAGE FEE個變數存下去你到底要花多少的DEX使用者在運行區塊鏈程式碼所需要付的錢區塊鏈的應用可能跟其他傳統應用感覺不一樣的方式他像是CC小段小段片段程式碼都公開在一個公開網路上大可以去呼叫石虎叫過程中需要付錢的省是要為自己的運算就付費的而不是開發者來付費退一步來說到底的區塊鏈應用的架構桿一樣子呢那我們就來談談的APP STORE APP從使用者的角度來說他要使用區塊鏈的計算應用感覺是什麼樣子他會先 那用裡面的沒有三街跟他在本地的月錢包存有事要的錢包去溝通法要做交易送進乾泡麵作簽章以後他再把這個千萬的名流道具還願的節點上內溝通的方法呢跟區塊鏈共同方法能不是他所熟悉的RAV4和送的溝通方法而是透過一個rtc的溝通方法來取代言溝通說我要執行什麼合約的什麼方選了什麼是rbc呢rpc remote Code縮寫是在古早年代面為台積電腦想要去操控筆電腦請他呼叫請他當地的一個程式運行的方法那就通過這個啊bccode一種傳輸格式跟他說請你幫我找你身上的某個程式起來在區塊鏈的也是用還沒說概念喔那實際操作方法是這樣子我想要呼叫地方宣name and operator把它用下參加密然後呢我娶他前面跳出來的吧為結果丟進到rpc呼叫的一個朋友裡面所以沒有那個是大概這樣子就說我要跟哪一個合約溝通然後呢飛彈面的前面就會先把這個方選的下巴馬丟進去之後呢再丟他這個方選的啊他不是跟在後面那就把這樣這個這一生的格式http post地方法院的RPG Games跟他說這一個這邊有個交易想要做這樣子的一個方軒叩拜託你幫我處理那如果你收到以後他就跑進剛剛提查過之前剛剛講的那個打包執行流程那後面來講講 這樣也可信的運算是很有價值很重要的相信最近大陸頻道遊戲廠商報率可能是不誠實裝備的掉寶率是不誠實這樣故事物你在於跑在雖然後面程式使用者是沒辦法驗證他裡面好東西是什麼的他裡面有沒有作弊打都不知道這樣是遊戲廠商 這樣也可信的運算是很有價值很重要的相信最近大陸頻道遊戲廠商報率可能是不誠實裝備的掉寶率是不誠實這樣故事物你在於跑在雖然後面程式使用者是沒辦法驗證他裡面好東西是什麼的他裡面有沒有作弊打都不知道這樣是遊戲廠商外面說他有很高的他實際也得掉寶機率降低擬試驗證區塊鏈是你是天然就可以變正式公開的所以像這樣的可信的運算在這樣的金融資產屬性的東西啊特別背中藥 區塊鏈所帶來價值之後跟他討論一下教程工程師在區塊鏈免辦什麼樣重要的角色喔其實啊在區塊鏈面前端工程師是各種重要角色尤其是我在做自己生出來是區塊鏈應用的時候就要提供很多讓使用者可以去操作區塊鏈因為去看那個非常複雜的東西你需要一個介面具包裝讓手指可以藉幾塊鏈上的操作而且更重要的事情是區塊鏈上的應用因為我們剛講的家是比較貴所以我們不會把很複雜運算就在區塊鏈上所以我可以說區塊鏈應用的杯子是這樣來為的是什麼就很多不適合新聞是說驗算幫助使用者體驗更好的邏輯都放到前端上所以前到底要寫相端的多的先應用 後端的負擔降低有些像是一首無非是說如果前後段都這一直晃不可以共用部分扣嗎那現在也有一些東西在想說我如果前後端都有趣共用信箱驗算的扣可不可以透過一些選擇Razer去產生類似扣能有些工具廠拍倉住你把區塊鏈上應用的那些API的結構轉換成一個太平便你選檔可以在前端值影棚 有人可以直接從這個手機的給予是什麼產生變成史作者與區塊鏈上寫應用的介紹吧大象塞進冰箱裡面用很簡報的方法在令人很狹小的一個空間裡面所以前端交部則把一些複雜東西搬出來開始做起來所以前在最裡面非常非常的重要同時呢我可以用這一隻耳朵跟區塊鏈溝通的腳本身是套裂腳本那這個在區塊鏈面是個極大的一個需求我們相信很多奇怪的工程師呢都不是一台就學什麼contract而是從這些跟戀上溝通的機會來開始 gogoro討論一個問題我就是區塊鏈到底要哪一座什麼是區塊鏈大直覺得ok放一些不可竄改的履歷啊什麼但我們現在討論功練舞面到底什麼情境社區塊鏈的思考的脈絡意這樣子的因為區塊鏈他為了天生要吃的驗證者就幫忙打包資料的節點它天然就含有錢的系統 特別是做資產相關的應用是為什麼去中心化基隆總數位資產在區塊鏈上特別版容的原因好那最後的演講不到這邊感謝大大參與有興趣聯絡我可以叫我臉書那我們現在有在招募訊工程師可以在搜尋para找到你的職缺謝謝各位

    Import from clipboard

    Paste your markdown or webpage here...

    Advanced permission required

    Your current role can only read. Ask the system administrator to acquire write and comment permission.

    This team is disabled

    Sorry, this team is disabled. You can't edit this note.

    This note is locked

    Sorry, only owner can edit this note.

    Reach the limit

    Sorry, you've reached the max length this note can be.
    Please reduce the content or divide it to more notes, thank you!

    Import from Gist

    Import from Snippet

    or

    Export to Snippet

    Are you sure?

    Do you really want to delete this note?
    All users will lose their connection.

    Create a note from template

    Create a note from template

    Oops...
    This template has been removed or transferred.
    Upgrade
    All
    • All
    • Team
    No template.

    Create a template

    Upgrade

    Delete template

    Do you really want to delete this template?
    Turn this template into a regular note and keep its content, versions, and comments.

    This page need refresh

    You have an incompatible client version.
    Refresh to update.
    New version available!
    See releases notes here
    Refresh to enjoy new features.
    Your user state has changed.
    Refresh to load new user state.

    Sign in

    Forgot password

    or

    By clicking below, you agree to our terms of service.

    Sign in via Facebook Sign in via Twitter Sign in via GitHub Sign in via Dropbox Sign in with Wallet
    Wallet ( )
    Connect another wallet

    New to HackMD? Sign up

    Help

    • English
    • 中文
    • Français
    • Deutsch
    • 日本語
    • Español
    • Català
    • Ελληνικά
    • Português
    • italiano
    • Türkçe
    • Русский
    • Nederlands
    • hrvatski jezik
    • język polski
    • Українська
    • हिन्दी
    • svenska
    • Esperanto
    • dansk

    Documents

    Help & Tutorial

    How to use Book mode

    Slide Example

    API Docs

    Edit in VSCode

    Install browser extension

    Contacts

    Feedback

    Discord

    Send us email

    Resources

    Releases

    Pricing

    Blog

    Policy

    Terms

    Privacy

    Cheatsheet

    Syntax Example Reference
    # Header Header 基本排版
    - Unordered List
    • Unordered List
    1. Ordered List
    1. Ordered List
    - [ ] Todo List
    • Todo List
    > Blockquote
    Blockquote
    **Bold font** Bold font
    *Italics font* Italics font
    ~~Strikethrough~~ Strikethrough
    19^th^ 19th
    H~2~O H2O
    ++Inserted text++ Inserted text
    ==Marked text== Marked text
    [link text](https:// "title") Link
    ![image alt](https:// "title") Image
    `Code` Code 在筆記中貼入程式碼
    ```javascript
    var i = 0;
    ```
    var i = 0;
    :smile: :smile: Emoji list
    {%youtube youtube_id %} Externals
    $L^aT_eX$ LaTeX
    :::info
    This is a alert area.
    :::

    This is a alert area.

    Versions and GitHub Sync
    Get Full History Access

    • Edit version name
    • Delete

    revision author avatar     named on  

    More Less

    Note content is identical to the latest version.
    Compare
      Choose a version
      No search result
      Version not found
    Sign in to link this note to GitHub
    Learn more
    This note is not linked with GitHub
     

    Feedback

    Submission failed, please try again

    Thanks for your support.

    On a scale of 0-10, how likely is it that you would recommend HackMD to your friends, family or business associates?

    Please give us some advice and help us improve HackMD.

     

    Thanks for your feedback

    Remove version name

    Do you want to remove this version name and description?

    Transfer ownership

    Transfer to
      Warning: is a public team. If you transfer note to this team, everyone on the web can find and read this note.

        Link with GitHub

        Please authorize HackMD on GitHub
        • Please sign in to GitHub and install the HackMD app on your GitHub repo.
        • HackMD links with GitHub through a GitHub App. You can choose which repo to install our App.
        Learn more  Sign in to GitHub

        Push the note to GitHub Push to GitHub Pull a file from GitHub

          Authorize again
         

        Choose which file to push to

        Select repo
        Refresh Authorize more repos
        Select branch
        Select file
        Select branch
        Choose version(s) to push
        • Save a new version and push
        • Choose from existing versions
        Include title and tags
        Available push count

        Pull from GitHub

         
        File from GitHub
        File from HackMD

        GitHub Link Settings

        File linked

        Linked by
        File path
        Last synced branch
        Available push count

        Danger Zone

        Unlink
        You will no longer receive notification when GitHub file changes after unlink.

        Syncing

        Push failed

        Push successfully