Cookbook Community Meetup - 12pm ET / 5pm GMT every week on Wednesdays



Contributors: Luke Cassady-Dorion, PBillingsby, Panda, Patrick Skinner, Tom Wilson
Last Updated:

Hello World (Code)

This guide walks you through a quick way to get a static HTML, CSS and JavaScript webpage on to the permaweb using a few lines of code and a command-line interface (CLI).


  • NodeJSopen in new window LTS or greater
  • Basic knowledge of HTML, CSS and JavaScript
  • A text editor (VS Code, Sublime, or similar)


Using a terminal/console window create a new folder called hello-world.


cd hello-world
npm init -y
npm i -g @irys/sdk
mkdir src && cd src
touch index.js index.html style.css

Next open your text editor and import the hello-world directory.

Generate a wallet

node -e "require('arweave').init({}).wallets.generate().then(JSON.stringify).then(console.log.bind(console))" > wallet.json

The wallet.json file must be in the root of the hello-world folder and not inside of your src folder.

Create a webpage

This webpage is using basic HTML, CSS and JavaScript to create a styled button that when you click it the header text changes color. Once finished, we will be using Irys and our previously generated wallet to deploy a fully functioning, static and permanent webpage to Arweave.

Paste the code from the following code blocks into their files:


Click to view HTML
<!DOCTYPE html>
<html lang="en">
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <link rel="stylesheet" type="text/css" href="style.css" />
    <script src="index.js"></script>
    <title>Cookbook Hello World!</title>

    <button onclick="changeColor()" class="button">Click Me!</button>
    <h1 id="main">Hello World!</h1>


Click to view CSS
.button {
  padding: "10px";
  background-color: #4caf50;


Click to view JS
function changeColor() {
  const header = document.getElementById("main"); === ""
    ? ( = "red")
    : ( = "");

Now that there is a static site to deploy, it can be checked to ensure it all functions properly by typing open src/index.html in your console/terminal. If everything is working as expected it is time to deploy to Arweave!

Upload using Irys (Previously Bundlr)

The command below deploys the src directory whilst also indicating the index.html file as an index for the manifests (relative to the path provided to upload-dir flag).

irys upload-dir src -h --index-file index.html -t arweave -w ./wallet.json


You just published a static site on Arweave using a few commands and a few lines of code!