1. DFINITY
  2. Hardware and Development
  3. Developers

Developers

How do I build a dapp locally using dfx? ("Hello World")

Here, we’ll show you how to build an app locally, as well as set you up to collect free cycles in a new cycles wallet. 

 

The "Hello World" dapp consists of backend code written in Motoko, a programming language specifically designed for interacting with the IC, and a simple webpack-based frontend.

 

This tutorial requires Linux, macOS 12.* Monterey or later, or Windows with a Windows Subsystem for Linux (WSL) installation. Also, Node.js is necessary for rendering the frontend assets and so is necessary to complete this tutorial. However Node.js is usually not needed for canister development in general.

 

A dfx project is a set of artifacts, including source code and configuration files, that can be compiled to a canister. By running:

dfx new hello_world

 

dfx creates a new project directory called hello_world. The terminal output should look similar to this:dfx_developer_identity_1.png
dfx_developer_identity_2.png

The helloWorld project directory includes the artifacts required for a "hello world" canister and a new hello Git repository. Your directory should look like this:

dfx_developer_identity_3.png

 

The helloWorld project is composed of two canisters:

 

hello_world_backend canister, which contains the template backend logic

hello_world_frontend canister, which contains the dapp assets (images, html files, etc)

It is good practice to check if your connection to the IC is stable by verifying the current status of the Internet Computer blockchain and your ability to connect to it. You can check this by typing:

dfx ping ic

 

If successful you will see an output resembling the following:

$ {

  "ic_api_version": "0.18.0"  "impl_hash": "d639545e0f38e075ad240fd4ec45d4eeeb11e1f67a52cdd449cd664d825e7fec"  "impl_version": "8dc1a28b4fb9605558c03121811c9af9701a6142"  "replica_health_status": "healthy"  "root_key": [48, 129, 130, 48, 29, 6, 13, 43, 6, 1, 4, 1, 130, 220, 124, 5, 3, 1, 2, 1, 6, 12, 43, 6, 1, 4, 1, 130, 220, 124, 5, 3, 2, 1, 3, 97, 0, 129, 76, 14, 110, 199, 31, 171, 88, 59, 8, 189, 129, 55, 60, 37, 92, 60, 55, 27, 46, 132, 134, 60, 152, 164, 241, 224, 139, 116, 35, 93, 20, 251, 93, 156, 12, 213, 70, 217, 104, 95, 145, 58, 12, 11, 44, 197, 52, 21, 131, 191, 75, 67, 146, 228, 103, 219, 150, 214, 91, 155, 180, 203, 113, 113, 18, 248, 71, 46, 13, 90, 77, 20, 80, 95, 253, 116, 132, 176, 18, 145, 9, 28, 95, 135, 185, 136, 131, 70, 63, 152, 9, 26, 11, 170, 174]

}

Updated