Hosting Your Website on the Internet Computer in Minutes with Juno

Isaac Valadez
Code & State
Published in
5 min readJul 13, 2023

Deploying a static site fully on Web3 is possible thanks to the Internet Computer and made effortless with the help of Juno. You can think of Juno as an on-chain Firebase for building Web3 dapps. It’s just as easy as it is on the good old Web 2.0, but without the limitations of trust-based or centralized services.

In this article, we will guide you through the step-by-step process of deploying your website on a canister smart contract, ensuring that you have complete ownership and control over it.

Furthermore, we will explore how to establish your domain name, guaranteeing the preservation of your brand identity that your clients and users hold dear. By following our instructions, you can ensure a seamless transition to the Internet Computer while maintaining your online presence and brand recognition.

Code & State is proud to publish this guide in collaboration with David Dal Busco, the creator of Juno and a speaker at the recent ICP Community Conference.

Table of contents

To host your website on-chain, this tutorial will guide you through the following three steps:

  1. Creating the canister smart contract (no developer skills required)
  2. Deploying your website
  3. Setting up the custom domain

Step 1: Creating the canister smart contract

When deploying a smart contract using Juno, it automatically comes with a predefined set of features that are specifically designed to enhance your projects and streamline the development process. These features include commonly needed functionalities such as authentication, a simple database, file storage capabilities, and website hosting.

To begin, sign in to the Juno console.

We affectionately refer to these feature-rich smart contracts as “Satellites.” To create your website project, simply click “Launch a new satellite” and follow the guided wizard to set it up.

That wraps up the setup phase. Your canister now lives on the Internet Computer, solely owned by you and and you alone.

Step 2: Deploying your website

While deploying your dapp in a continuous deployment environment like GitHub Actions is certainly possible, for the sake of simplicity, we will assume that you prefer to perform your initial website deployment from your computer.

To accomplish this, ensure that Node.js is installed on your machine (if it isn’t already), and proceed to install the Juno command line interface. You can do this by executing the following command in your terminal:

npm i -g @junobuild/cli

Once the installation is complete, you can log in to your satellite from the terminal.

juno login

Running this command will open Juno’s console in your browser. You will be prompted to grant access to your satellite(s) and mission control (which is your own canister holding references to your satellites) for your machine.

With the ability to interact with your smart contract on the Internet Computer, you can now deploy your website project to its dedicated satellite by running the following command from your project’s root folder:

juno deploy

During the initial deployment, you will be prompted to select the target satellite. The process should proceed smoothly, and upon completion, your website will be hosted on-chain 🎉.

To access your deployed website, you can find its URL in Juno’s console under the “Hosting” tab or simply run the command line juno open.

Step 3: Setting up the custom domain

As if serving your dapps directly from the blockchain to browsers wasn’t amazing enough, preserving your unique brand image is also fully supported.

To configure your domain name, navigate to the hosting tab of Juno’s console. From there, initiate the setup process by clicking on “Add custom domain” and follow the guided wizard.

Once you have entered your desired domain name, Juno will provide you with the necessary records that need to be added to your DNS provider. These will ensure proper mapping of your domain to your deployed website on the Internet Computer.

Once you have configured the DNS records for your domain, click on “Ready” to confirm. At this point, Juno will take over and handle the rest of the process for you.

After completing the configuration, you will eventually see the status displayed as “Available.” This signifies that your website is now being served on the web with its unique name, but with the added benefit of being served directly from the blockchain!

Need Help or Have Questions?

Do you have any questions or have you encountered any issues while following this tutorial? Don’t worry! The Juno team is here to help.

If you need further clarification, assistance, or want to share your experience, feel free to reach out to Juno on Twitter or their vibrant community on Discord. You can also check out the Juno FAQ section on their website for additional information and answers to common queries.

👋

Thank you for reading! Stay connected with Juno by following them on Twitter to keep up with their latest updates.

⭐️⭐️⭐️ are also much appreciated: visit their GitHub repo and show your support!

I also like to thank David Dal Busco for providing all of the resources for this guide, be sure to check out our livestream with David and subscribe to the Code & State YouTube account to stay in the loop with other incredible ICP projects like Juno!

--

--

Code & State
Code & State

Published in Code & State

Follow Code & State for insights into how we’re making it easier for developers to build and earn on the Internet Computer. Developer Tooling, Blockchain, Web3 Education and more.

Isaac Valadez
Isaac Valadez

Written by Isaac Valadez

Isaac is an entrepreneur, blockchain dev, & mechanical engineer from Texas. He co-founded dSquad, organized Motoko Bootcamp, & has traded crypto since 2017.

Responses (2)