Skip to content

Commit e68a22e

Browse files
authored
fix: Don't link localhost (#81)
* fix: Don't link localhost * revert * fix: Trying again
1 parent 5930dcb commit e68a22e

File tree

5 files changed

+13
-9
lines changed

5 files changed

+13
-9
lines changed

fern/tutorials/creating-smart-contracts/hello-world-smart-contract/integrating-your-smart-contract-with-the-frontend.mdx

Lines changed: 4 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -5,6 +5,7 @@ url: "https://docs.alchemy.com/docs/integrating-your-smart-contract-with-the-fro
55
slug: "docs/integrating-your-smart-contract-with-the-frontend"
66
---
77

8+
89
You'll need to have finished part 1: [creating and deploying a smart contract](https://docs.alchemy.com/alchemy/tutorials/hello-world-smart-contract), part 2: [interacting with your smart contract](https://docs.alchemy.com/alchemy/tutorials/hello-world-smart-contract/interacting-with-a-smart-contract), and part 3: [submitting your smart contract to Etherscan](https://docs.alchemy.com/alchemy/tutorials/hello-world-smart-contract/submitting-your-smart-contract-to-etherscan) before starting part 4 below.
910

1011
## Part 4: Marrying Web2 & Web3: connecting your smart contract to a frontend project
@@ -143,7 +144,7 @@ Once the modules have finished installing and you've updated the `webpack.config
143144
```
144145
</CodeGroup>
145146

146-
Doing so should open [http://localhost:3000/](http://localhost:3000/) in your browser, where you'll see the frontend for our project. It should consist of one field (a place to update the message stored in your smart contract), a "Connect Wallet" button, and an "Update" button.
147+
Doing so should open `http://localhost:3000/` in your browser, where you'll see the frontend for our project. It should consist of one field (a place to update the message stored in your smart contract), a "Connect Wallet" button, and an "Update" button.
147148

148149
![2864](e03bff0-Frontend.png "Frontend.png")
149150

@@ -469,7 +470,7 @@ Since we want to display this smart contract in our UI, let's update the *useEff
469470

470471
Note that we only want our *loadCurrentMessage* to be called once during the component's first render. We'll soon implement `addSmartContractListener` to automatically update the UI after the message in the smart contract changes.
471472

472-
Before we dive into our listeners, let's check out what we have so far! Save your **HelloWorld.js** and **interact.js** files, and then go to [http://localhost:3000/](http://localhost:3000/)
473+
Before we dive into our listeners, let's check out what we have so far! Save your **HelloWorld.js** and **interact.js** files, and then go to `http://localhost:3000/`
473474

474475
You'll notice that the current message no longer says "No connection to the network." Instead, it reflects the message stored in the smart contract. Sick!
475476

@@ -695,7 +696,7 @@ In *connectWalletPressed*, we make an await call to our imported *connectWallet*
695696

696697
Now, let's save both files (**HelloWorld.js** and **interact.js**) and test our UI.
697698

698-
Open your browser on the [http://localhost:3000/](http://localhost:3000/) page, and press the "Connect Wallet" button on the top right of the page.
699+
Open your browser on the `http://localhost:3000/` page, and press the "Connect Wallet" button on the top right of the page.
699700

700701
If you have Metamask installed, you should be prompted to connect your wallet to your dApp. Accept the invitation to connect.
701702

fern/tutorials/creating-smart-contracts/hello-world-solana-program/integrating-your-solana-program-with-a-web3-application.mdx

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -5,6 +5,7 @@ url: "https://docs.alchemy.com/docs/integrating-your-solana-program-with-a-web3-
55
slug: "docs/integrating-your-solana-program-with-a-web3-application"
66
---
77

8+
89
# 1. Introduction
910

1011
Congrats on making it this far! You’ve already deployed your Solana program, and now we’ll build a frontend application that will interact with the program to allow you write and update a message you’ll store on the Solana blockchain! By the end of this tutorial, you’ll know how to connect your web3 app to a user’s Phantom Wallet and use your previously deployed Solana program to store a message that anyone can change. And we’re going to get through it together!
@@ -192,7 +193,7 @@ All this is doing is rendering a giant title for your application! Next, look at
192193

193194
Don’t worry too much about CSS! All this is doing is making our application look pretty. We don’t need CSS to use our Solana program and create our web3 application. It just looks nicer 😅. If you’re still curious, you can learn more about it [here](https://www.w3schools.com/html/html_css.asp).
194195

195-
Awesome! We’re ready to look at our app! You can view your application on `[http://localhost:3000/](http://localhost:3000/)` by running the following from your `app` directory on your terminal:
196+
Awesome! We’re ready to look at our app! You can view your application on `http://localhost:3000/` by running the following from your `app` directory on your terminal:
196197

197198
<CodeGroup>
198199
```shell shell

fern/tutorials/creating-smart-contracts/nft-minter-tutorial-how-to-create-a-full-stack-dapp/nft-minter.mdx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -101,7 +101,7 @@ Once those have finished installing, run `npm start` in your terminal:
101101
```
102102
</CodeGroup>
103103

104-
Doing so should open [http://localhost:3000/](http://localhost:3000) in your browser, where you'll see the frontend for our project. It should consist of 3 fields: a place to input a link to your NFT's asset, enter the name of your NFT, and provide a description.
104+
Doing so should open `http://localhost:3000/` in your browser, where you'll see the frontend for our project. It should consist of 3 fields: a place to input a link to your NFT's asset, enter the name of your NFT, and provide a description.
105105

106106
![2876](32e01d7-PNrbdLnNM6OriGE32N25TGSl.png "PNrbdLnNM6OriGE32N25TGSl.png")
107107

@@ -378,7 +378,7 @@ In `connectWalletPressed`, we simply make an await call to our imported `connect
378378
379379
Now, let's save both files (`Minter.js` and `interact.js`) and test out our UI so far.
380380
381-
Open your browser on the [http://localhost:3000/](http://localhost:3000) page, and press the "Connect Wallet" button on the top right of the page.
381+
Open your browser on the `http://localhost:3000/` page, and press the "Connect Wallet" button on the top right of the page.
382382

383383
If you have Metamask installed, you should be prompted to connect your wallet to your dApp. Accept the invitation to connect.
384384

fern/tutorials/learning-solidity/how-to-verify-a-message-signature-on-ethereum/how-to-create-a-signature-generator-dapp.mdx

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -5,6 +5,7 @@ url: "https://docs.alchemy.com/docs/how-to-create-a-signature-generator-dapp"
55
slug: "docs/how-to-create-a-signature-generator-dapp"
66
---
77

8+
89
## Clone Starter Files
910

1011
1. First, clone the [signature-generator-app](https://github.com/Chris-Moller/signature-generator-app) repository to get your starter files on your local machine. This repository provides all of the necessary styling and UI. (If you need assistance cloning a repository, checkout [GitHub's documentation](https://docs.github.com/en/repositories/creating-and-managing-repositories/cloning-a-repository).)
@@ -18,7 +19,7 @@ In your terminal:
1819

1920
1. Navigate to your local repository with \`cd starter files.
2021
2. Run `npm install` to install your dependencies.
21-
3. Run `npm start` to deploy a local development server at [http://localhost:3000/](http://localhost:3000/).
22+
3. Run `npm start` to deploy a local development server at `http://localhost:3000/`.
2223

2324
At your local server, you should see the front end of our Signature Generator app. It should contain:
2425

fern/tutorials/nfts/how-to-create-an-nft-game/how-to-create-an-nft-game-frontend.mdx

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -5,6 +5,7 @@ url: "https://docs.alchemy.com/docs/how-to-create-an-nft-game-frontend"
55
slug: "docs/how-to-create-an-nft-game-frontend"
66
---
77

8+
89
In the last tutorial on [Part 1: How to Create an NFT Game Smart Contract](/docs/how-to-create-an-nft-game-smart-contract), we leveraged Hardhat, Solidity, and Alchemy to deploy an NFT game smart contract that allowed users to breed and collect creatures called Alchemon.
910

1011
![1920](c911224-cat-town.jpeg "cat-town.jpeg")
@@ -446,9 +447,9 @@ We are all set to go! Let's launch our app on localhost using the following comm
446447

447448
### Playing the game
448449

449-
* When you open [localhost:3000](https://localhost:3000), you will first be prompted to visit the [localhost:3000/connect]() page. Here, connect your MetaMask wallet to be redirected back to the main breeding page at [localhost:3000](https://localhost:3000).
450+
* When you open `localhost:3000`, you will first be prompted to visit the `localhost:3000/connect` page. Here, connect your MetaMask wallet to be redirected back to the main breeding page at `localhost:3000`.
450451

451-
* For breeding to work, you must choose two different Alchemons as parents. In case you don't have 2 Alchemons, you can simply mint Genesis NFTs by visiting [localhost:3000/mint-genesis](https://localhost:3000/mint-genesis). Make sure you've got enough Goerli ETH from the [Goerli Faucet](https://goerlifaucet.com/) before you mint.
452+
* For breeding to work, you must choose two different Alchemons as parents. In case you don't have 2 Alchemons, you can simply mint Genesis NFTs by visiting `localhost:3000/mint-genesis`. Make sure you've got enough Goerli ETH from the [Goerli Faucet](https://goerlifaucet.com/) before you mint.
452453

453454
* You will be redirected back on the main page. Select an Alchemon in both the first and the second dropdown, then click on breed. Metamask will prompt you to pay gas for the transaction.
454455

0 commit comments

Comments
 (0)