Launch a wensite on Sui Network with Walrus 👨‍💻 douglas.life

9 days ago

Launching a Website on Sui Using Walrus

This guide provides step-by-step instructions to deploy a static website on the Sui blockchain using the Walrus decentralized storage system. It assumes you have a pre-built website (e.g., in a build or dist directory) and are familiar with basic command-line operations.

Prerequisites

Before starting, ensure you have the following:

Pre-built Website: A directory containing your static website files (e.g., index.html, CSS, JS). This could be the output from a web framework like React, Vue, or plain HTML.
Rust Installed: The site-builder tool requires Rust. Install it by following the instructions at https://www.rust-lang.org/tools/install.
Sui CLI Installed: The Sui command-line interface is needed for interacting with the Sui blockchain. Follow the official Sui installation guide at https://docs.sui.io/guides/developer/getting-started/sui-install.
Walrus CLI Installed: Install the Walrus CLI, which includes the site-builder tool, by following the setup instructions at https://docs.walrus.site/walrus/intro.html#installing-the-walrus-cli. Alternatively, download the pre-built site-builder binary for your operating system from https://github.com/MystenLabs/walrus/releases.
Sui Wallet with Testnet SUI: Set up a Sui wallet (e.g., Sui Wallet browser extension) and fund it with Testnet SUI tokens:
- Download Sui Wallet: https://chrome.google.com/webstore/detail/sui-wallet/opcgpfmipidbgpenhmajoajpbobppdil
- Request Testnet SUI from the faucet: https://faucet.testnet.sui.io/
- Switch your wallet to Sui Testnet.
Walrus Testnet WAL Tokens: Obtain Testnet WAL tokens for storage payments from the Walrus faucet: https://faucet.testnet.walrus.site/.

Step-by-Step Instructions

Step 1: Prepare Your Website Directory

Ensure your website files are in a single directory (e.g., ./my-site). The directory must include an index.html file as the entry point. If it doesn’t, you can use the --list-directory flag during publishing to generate a file browser.

Verify your directory structure. For example:

my-site/
├── index.html
├── css/
│   └── styles.css
├── js/
│   └── app.js
└── assets/
    └── image.png

Step 2: Configure the Walrus Site-Builder

The site-builder tool uses a configuration file (sites-config.yaml) to manage settings. If this file doesn’t exist in your project directory, the tool will use default settings, but you can create one for advanced customization.

Optional: Create a Configuration File
- Create a sites-config.yaml file in your project directory.
- Example configuration:
```
title: "My Walrus Site"
description: "A decentralized website on Sui"
```
- For advanced settings (e.g., custom headers, routing), refer to the official documentation: https://docs.walrus.site/walrus-sites/advanced.html.

Step 3: Publish Your Walrus Site

Use the site-builder tool to publish your website to Walrus, which stores the files as blobs and creates a Sui object for metadata and ownership.

Run the Publish Command
- Navigate to your project directory:
```
cd my-site
```
- Execute the publish command, specifying the directory and storage duration (in epochs, where 1 epoch ≈ 2 days on Walrus Testnet):
```
site-builder publish --epochs 100 ./my-site
```
  - --epochs 100: Sets the site to remain active for approximately 200 days (100 epochs × 2 days). The maximum is 183 epochs (~1 year).
  - Replace ./my-site with the path to your website directory.
  - If your directory lacks an index.html, add the --list-directory flag:
```
site-builder publish --epochs 100 --list-directory ./my-site
```
Output
- The command generates a Walrus blob for each file and a Sui object ID for the site (e.g., 0x407a3081...).
- Note the Sui object ID from the output, as it’s required for updates or SuiNS integration.
- You can view the site on Sui Explorer: https://suiscan.xyz/testnet by searching for the object ID.

Step 4: Access Your Walrus Site

Walrus Sites are accessed via portals, which retrieve files from Walrus and metadata from Sui. You can use a public portal or host your own.

Using a Public Portal
- Access your site via a portal like https://walrus.site.
- The URL will be in the format: https://<object-id>.walrus.site, where <object-id> is the Base36-encoded Sui object ID (e.g., https://2hzpawjycxuiuh36047yocxapc69g8ercrypa7ccsk8ek4iqu6.walrus.site).
- To convert the Sui object ID to Base36, refer to the Walrus documentation or use a Base36 converter tool.
Optional: Host Your Own Portal
- Clone the Walrus Sites repository: https://github.com/MystenLabs/walrus-sites.
- Follow the instructions to set up a local portal: https://docs.walrus.site/walrus-sites/portal.html.
- Run the portal locally to serve your site at http://localhost:3000.

Step 5: Optional: Assign a SuiNS Domain

For a human-readable URL, integrate your site with SuiNS (Sui Name Service).

Register a SuiNS Name
- Purchase a SuiNS name (e.g., my-site.sui) via the SuiNS interface: https://suins.io/.
- Use your Sui wallet to complete the transaction on Testnet.
Link the SuiNS Name to Your Site
- Update the site’s Sui object to point to your SuiNS name using the site-builder tool or Sui CLI.
- Example command:
```
site-builder update --sui-ns my-site.sui --object-id 0x407a3081...
```
  - Replace my-site.sui with your SuiNS name and 0x407a3081... with your site’s Sui object ID.
- Your site will now be accessible at https://my-site.walrus.site.
Verify on Sui Explorer
- Check the SuiNS mapping on https://suiscan.xyz/testnet to ensure the name resolves to your site’s object ID.

Step 6: Update Your Walrus Site (If Needed)

To update your site (e.g., modify index.html or add new files):

Edit Files
- Update the files in your website directory (e.g., ./my-site/index.html).
Run the Update Command
- Use the site-builder update command with the site’s Sui object ID:
```
site-builder update --epochs 100 ./my-site 0x407a3081...
```
  - Replace 0x407a3081... with your site’s object ID.
  - This updates only the modified files, preserving unchanged blobs.
Verify the Update
- Access the updated site via the same portal URL or SuiNS domain.
- Check the Sui Explorer to confirm the updated object metadata.

Step 7: Monitor and Maintain Your Site

Check Blob Storage: Use the Walrus Explorer to verify your blobs: https://explorer.walrus.site/.
Extend Storage Duration: If your site’s epoch duration is nearing expiration, extend it by executing a Sui transaction to add more epochs. Refer to https://docs.walrus.site/walrus/using.html#extending-blob-lifespan.
Integrate with Smart Contracts: For advanced use cases (e.g., linking your site to NFTs or dApps), use Sui’s Move language to interact with your site’s Sui object. See https://docs.walrus.site/walrus-sites/move.html.

Additional Notes

Cost Efficiency: Walrus uses the WAL token for storage payments, which is significantly cheaper than traditional Web2 storage or other blockchain solutions like Filecoin or Arweave.
Decentralization: Your site’s files are stored as blobs across Walrus’s decentralized nodes using the Red Stuff encoding algorithm, ensuring high availability and resilience.
Programmability: Walrus Sites are Sui objects, allowing integration with smart contracts for dynamic features like NFT-linked personalized sites.
Troubleshooting: If you encounter issues, check the Walrus documentation https://docs.walrus.site/ or join the Walrus Discord for community support: https://discord.com/invite/walrusprotocol.

Key Links

Walrus Documentation: https://docs.walrus.site/
Walrus Sites Guide: https://docs.walrus.site/walrus-sites/intro.html
Sui Documentation: https://docs.sui.io/
SuiNS: https://suins.io/
Walrus Explorer: https://explorer.walrus.site/
Sui Explorer: https://suiscan.xyz/testnet
Walrus CLI Releases: https://github.com/MystenLabs/walrus/releases
Walrus Sites Repository: https://github.com/MystenLabs/walrus-sites
Testnet Faucets:
- Sui: https://faucet.testnet.sui.io/
- WAL: https://faucet.testnet.walrus.site/
Walrus Discord: https://discord.com/invite/walrusprotocol

Hi there 👋 I'm Gudasol, Welcome to my Hive Blog

Gudasol-Type-Only[WhtOnBlk].png

🧙‍♂️ Mystic ~ 👨‍🏫 Teacher ~ 👨‍💻 Coder ~ 🎙 Rapper ~ 🎨 Designer

I built cXc.world 🗺

I teach a model of Universal Consciousness 🪐

I'm the rapper Gudasol 🜛 🌞

my php 🏡 douglas.life

🔭 I’m currently building: cXc.world, Aquarius.Academy and side project $GOLD + $SILVER
🌞 I’m looking to collaborate on: cXc.world Smart Contracts (EOSIO) and Web 4
✋ Grow with us, join cXc discord, Aquarius Academy discord, and Gudasol discord
💬 I love to talk about: Web 4, Geotemporal Systems, Biomimetic Economics, Fractal Information, Platonic Solids, Collective Participation Income (CPI), Time Tokens, Channeling, Flow State, Galactic Consciousness.

🌎 Fun fact: I have been a Digital Nomad for over 5 years!! Living mostly in Latin America. Currently in Medellin, CO.

Let's Connect

Instagram | Telegram | Twitter | Discord

Find My Latest on Linktree 🔗🌳

🗳 Freebies + Downloads on Gumroad ✅

photography hive art music gudasol ocd programming wax

0.000

1 comments

@hivebuzz 74

2 days ago

Congratulations @douglasjames! You have completed the following achievement on the Hive blockchain And have been rewarded with New badge(s)

	You distributed more than 25000 upvotes. Your next target is to reach 26000 upvotes.

_{You can view your badges on your board and compare yourself to others in the Ranking}
_{If you no longer want to receive notifications, reply to this comment with the word STOP}

0.000