Figma+Arweave，4步驟輕鬆打造專屬數位空間
作者：橙子大元帥
審閱：Kyle
來源：內容公會- 新聞
想擁有專屬的網頁/ dApp，卻每次因為不會寫程式碼而卻步？其實0 程式碼去完成建構一個永久網頁已經不再是程式設計師的專利。即使完全沒有技術背景，你也可以透過本文的方法建立屬於自己靜態頁面並永久部署在區塊鏈上，並且可以透過網路存取。來吧，10 分鐘後你將有一個專屬的網頁！
我們先來看看部署一個頁面的流程：
- 設計你的頁面
- 將設計轉換為HTML 程式碼
- 將程式碼上傳至Arweave
- 設定ArNS 透過網域名稱存取頁面
完成最後一步，即可透過Arweave 的任意網關存取網頁，本流程中即使沒有任何程式設計經驗也可以輕鬆完成～
一、設計你的頁面
首選拖曳圖片設計的網站來設計頁面，UI 設計產業也常常選擇用Figma 或Canva 來設計，就像設計PPT 一樣就可以把自己想展示的內容輕鬆設計成頁面。打開瀏覽器即可在線上設計，基本半天就可以上手。
本文就選取設計業界最常用的Figma 來進行設計頁面，具體操作教學：
- 建立檔案：點選「+ New File」建立一個新檔案。
- 新增頁面：在左側的「Pages」欄可以管理頁面，預設是一個頁面，可以根據需要新增多個頁面。
- 開始設計：用工具列的矩形、文字方塊等元素建立頁面佈局，或直接從社群範本中獲取靈感。
- 管理元件：把常用元素（例如按鈕或導覽列）儲存為元件，方便重複使用。
更多教學可參考（相關連結）
也可以使用Wix、Webflow 等無程式碼網頁設計工具，上手也同樣非常簡單，而且製作出來的頁面效果會更佳，此類工具可以直接透過修改預設的模版後直接產生程式碼（可能需要付費功能） 。
二、將設計轉換為HTML 程式碼
Figma 頁面設計完成後，可在Figma社群搜尋「Figma to HTML」外掛程式即可將設計的頁面轉換成靜態網頁程式碼，外掛程式會自動讀取設計中的元素，並產生對應的HTML 和CSS 程式碼。
如果有一些程式碼基礎，也可以選擇手動匯出相關資源並進行產生HTML 程式碼，在Figma 中右鍵點擊設計元件，選擇“Inspect”，然後可以查看每個元件的CSS 屬性，根據這些屬性手動編寫HTML 和CSS ，然後將圖片資源和程式碼結合，建立完整的HTML 頁面。
三、將程式碼上傳至Arweave
匯出網頁程式碼後，首先可以透過直接開啟HTML 檔案或使用Live Server 先進行本機測試，顯示正常無誤後將上傳程式碼至Arweave，Arweave 針對網頁檔案提供了前端託管，所以將網頁檔案上傳後即可存取。這裡直接推薦使用PermaDAO 社群貢獻者FarMer 製作的一鍵將網頁上傳至Arweave 的工具： SiteUploaderOnArweave。
將檔案整個目錄上傳至網站，確保將首頁勾選“Set as index”，然後點擊“Upload Files and Generate Manifest”即可上傳至Arweave（錢包需要預留一些$AR 作為檔案上傳費用，檔案不大的情況下0.01 AR 足矣）
上傳之後會顯示網頁的交易哈希，以及上傳後的目標網頁，點擊最下方的SiteURL 即可訪問網頁，於是，你的永久網頁就製作好啦！
四、設定ArNS 透過網域名稱存取頁面
不知大家可否注意到網址的格式為“arweave.net/{hash}”，例如我這裡上傳之後的網頁。
這樣的網址可讀性非常差，那麼是否可以將此雜湊改為好記、易用的網域呢？當然可以，使用ArNS 為Arweave 區塊鏈上的任何雜湊、地址與永久網站提供友善的網域名稱。
首先需要到ArNS註冊一個你想要的域名，需要在Permaswap 買入一些$tARIO 來選擇域名期限“一年期限”或者“永久”，根據域名的長度以及域名期限決定花費$tARIO 的數量。
註冊好網域後，將網域名稱與交易雜湊綁定，即可使用ArNS 存取網頁，例如筆者的ArNS 為marshalorange，綁定後即可存取網頁，另外可透過AR.IO的任意網關存取。
透過以上簡單的四個步驟，即使沒有程式設計經驗，也可以輕鬆建立永久網頁，並將其部署到Arweave 區塊鏈上。從頁面設計到程式碼上傳，再到綁定友善的域名，你的網頁將成為一份專屬於你的永久數位空間。
那現在就開始動手吧！創造你的第一個永久網頁，踏出通往Web3 的第一步～
免責聲明：文章中的所有內容僅代表作者的觀點，與本平台無關。用戶不應以本文作為投資決策的參考。
您也可能喜歡
融資：為何像 BERA 這樣的「風投幣」面臨反彈
這是《The Funding》第21期的摘錄，於2月9日發送給我們的訂閱者。《The Funding》是由The Block資深編輯成員Yogita Khatri撰寫的雙週通訊。要訂閱免費通訊，請點擊此處。
隨著特朗普宣布對鋼鐵和鋁徵收25%新關稅，加密貨幣價格下滑
快速摘要 各種加密貨幣的價格在特朗普總統告訴記者他計劃下週對鋼鐵和鋁實施新的25%關稅後下跌。比特幣的價格在週五短暫突破10萬美元後，已滑落至約9萬5千美元，以太坊在過去24小時內下跌了3.5%。這一價格變動發生在預計將成為今年最受關注的電視轉播的超級碗LIX之前。
Kraken上架Barstool的Dave Portnoy採用的「JAILSTOOL」迷因幣，推動2億美元代幣
快速摘要 加密貨幣交易所Kraken已經上架了一種由Barstool創始人Dave Portnoy採用並推廣的迷因幣。該代幣的市值一度達到超過2.5億美元，似乎讓最初對迷因幣持懷疑態度的Portnoy改變了看法。Portnoy表示：「這太愚蠢了，可能是萬無一失的。」
Coinbase和Gemini的首席執行官歡呼消費者金融保護局局長削弱該機構權力
據報導，代理CFPB局長Russ Vought已告知該機構的員工「停止所有監督和檢查活動」，並停止了一個關鍵的未來資金來源，試圖削弱該局的監管努力。Coinbase首席執行官Brian Armstrong和Gemini首席執行官Tyler Winklevoss，以及Elon Musk，都對此發展表示歡迎。在CFPB的投訴中，Coinbase被提及的比例高於其他為美國公民服務的競爭對手加密貨幣交易所。
加密貨幣價格
更多
