# 极简Solidity开发入门

By [Safu](https://paragraph.com/@yoomin) · 2022-05-30

---

本文目的很简单, 搭建一个基本的Solidity开发环境, 包含前后端, 实现基本的合约交互方便, 以学习Solidity. Let‘s go!

**第一步, 安装运行**[**Hardhat**](https://hardhat.org/)

> **这是什么?**
> 
> Hardhat是一个Solidity的集成开发环境, 包含运行在本地的Blockchain的EVM(类比于生产环境的EVM公链)、JSON-PRC服务用于和前端通信(类比于生产环境的Infura等节点同步服务提供商), 以及测试、部署等服务
> 
> [https://hardhat.org/](https://hardhat.org/)

提前建立好项目文件夹

    ❯ mkdir hardhat-intro
    
    ❯ cd hradhat-intro
    

在该文件夹下:

选择‘Create an advanced sample project that uses TypeScript’, 剩下的一路next/yes即可

**第二步, 运行本地节点&部署合约**

![初始目录结构](https://storage.googleapis.com/papyrus_images/e82d79f775805840968c38c34ac5ce2422602baa15d7a8b7d5980aa702a9dd43.png)

初始目录结构

这里, contracts包含需要部署的合约(注意, 这里合约和.sol文件可能并不是一一对应的关系); scripts包含hardhat部署合约时需要的文件; test则是测试相关文件.

接下来我们让hardhat跑起一个本地EVM区块链

or

    ❯ ./node_modules/.bin/hardhat node
    

> **做了什么?**
> 
> 这里hardhat在本地运行了一个EVM区块链(称为[hardhat network](https://hardhat.org/hardhat-network/#hardhat-network)), 并提供了与其通信的JSON-RPC服务
> 
> ’Started HTTP and WebSocket JSON-RPC server at [http://127.0.0.1:8545/](http://127.0.0.1:8545/)‘
> 
> **有什么不一样?**
> 
> hardhat network默认交互才产出区块, 也可以设置定时出块; 同时提供了错误栈的输出.

新开终端窗口, 我们把自带的`Greeter.sol`部署到这个本地区块链中:

    ❯ npx hardhat run --network localhost ./scripts/deploy.ts
    

可以看出hardhat完成了合约的编译(生成了artifact文件, 输出了合约地址);

    ❯ npx hardhat run --network localhost ./scripts/deploy.ts
    Downloading compiler 0.8.4
    Generating typings for: 2 artifacts in dir: typechain for target: ethers-v5
    Successfully generated 5 typings!
    Compiled 2 Solidity files successfully
    Greeter deployed to: 0x5FbDB2315678afecb367f032d93F642f64180aa3
    

同时运行node的终端窗口也输出了相关信息.

      Contract deployment: Greeter
      Contract address:    0x5fbdb2315678afecb367f032d93f642f64180aa3
      Transaction:         0x7269d154f4fe421d28cd94b0f36485036b4fd82a48d623148c2d61c1484e42b2
      From:                0xf39fd6e51aad88f6f4ce6ab8827279cfffb92266
      Value:               0 ETH
      Gas used:            497026 of 497026
      Block #1:            0x48de628ad9758862292b079c9e24c28d156922e8271e5fbd0f0c8470dc4bbfd3
    
      console.log:
        Deploying a Greeter with greeting: Hello, Hardhat!
    

到这里hardhat的部分就完成了, 我们进行前端的设置.

**第三步, metamask链接本地JSON-PRC网络**

打开metamask, 进入Settings → Networks, 添加如下网络(该网络已经内置, 所以只需要修改参数即可)

![](https://storage.googleapis.com/papyrus_images/bc27391fa8c3e93e457dd820c4c4a0bdba90e53968e635e95b75536411387ef8.png)

完成后就相当于连接到了hardhat网络

接下来导入账号, 使用运行`hardhat node`的窗口, 默认提供了20个测试账号, 我们选择第一个

> Account #0: 0xf39Fd6e51aad88F6F4ce6aB8827279cffFb92266 (10000 ETH) Private Key: 0xac0974bec39a17e36ba4a6b4d238ff944bacb478cbed5efcae784d7bf4f2ff80

选择右上角 → Import Account, 输入Private Key

![](https://storage.googleapis.com/papyrus_images/9c5e077ad9cffe9ad8240bd098ba8eaec84ad2b1c5019ca47f7d6264d06681fe.png)

账号就成功导入了

**第四步, 前端合约交互**

选择你喜欢的框架, 这里我们使用`create-react-app`

    ❯ npx create-react-app hardhat-playground-fe --template typescript
    

这里直接贴出`App.tsx`的代码:

[https://gist.github.com/KobiMaster/889e494811f127713351c0c6fbf8fb16](https://gist.github.com/KobiMaster/889e494811f127713351c0c6fbf8fb16)

注意合约初始化里的abi和合约地址, 这些都要去hardhat生成的文件和终端输出里拿到.

至此就全部完成了! Keep Build!

推荐阅读:

[https://solidity-by-example.org/hello-world](https://solidity-by-example.org/hello-world)

---

*Originally published on [Safu](https://paragraph.com/@yoomin/solidity)*