Sign in Subscribe

Create a Cosmos SDK Front End App Running on Your Local Host

Cosmos Guru

Cosmos Guru

— 1 min read
Create a Cosmos SDK Front End App Running on Your Local Host

In this tutorial, we will scaffold a front-end application using Ignite CLI.

Requirements:

  • Ignite CLI version 0.26.1
  • Golang
  • NPM

Remove Old Installation of Ignite

If you already have Ignite installed and the beta blockchain from the other tutorials, you can remove it with this command:

sudo rm -r $(which ignite)

Next, remove the beta blockchain as we are using a different version of Ignite for this exercise.

sudo rm -r beta
sudo rm -r .beta
sudo rm -r $(which betad)

Install Ignite Version 0.26.1

Install the specified version of Ignite:

curl https://get.ignite.com/cli@v0.26.1 | bash

Move the Ignite Binary

Move the Ignite binary to your system path:

sudo mv ignite /usr/local/bin

Scaffold the Beta Blockchain

Now, scaffold the beta blockchain:

ignite scaffold chain beta

cd beta

Scaffold Vue & Generate Composables

Next, scaffold the Vue front-end and generate the necessary composables:

ignite scaffold vue

ignite generate composables --clear-cache

Select yes if prompted.

Launch Your Chain

Launch your blockchain:

ignite chain serve

Launch the Front End

Open a new terminal window and run the following commands to set up and launch the front-end application:

cd beta

cd vue

sudo npm install 

sudo npx update-browserslist-db@latest

sudo npm audit fix --force

sudo npm run dev

If everything is done correctly, you should see the application running on your local host. Open the provided link in your browser.

Note: If you enter the mnemonic provided for Alice or Bob, you should see their account balance.

Read more