区块链笔记:DAPP的运行结构,环境准备,模板文件的选用,演示项目示例的运行

本文主要是介绍区块链笔记:DAPP的运行结构,环境准备,模板文件的选用,演示项目示例的运行,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!

概述

只有智能合约不足以构成一个应用,还需要配合前端,后端才能成为应用本身

DAPP的运行结构

  • DAPP是一个分布式应用,以下是它的简要组成结构
    • 以太坊节点 + 智能合约 + 调用端 + 界面
    • 以太坊节点 + 智能合约 是p2p网络结构的,没有明确的固定的服务端
    • 调用端和界面也就是所谓的前端,通常采用web框架结构
  • 我们需要在这个基础之上的增设一个后端服务
  • 专门用来跟节点通信,以及汇总一些数据,和那些不适合放在合约中的一些业务逻辑
  • 也就是这么一个结构:以太坊节点(智能合约) ---> 后端服务 ---> 前端程序

环境准备

  • 1.我们需要一个节点,可以使用ganache模拟节点或部署一个以太坊私有链,正式部署需要连接到以太坊的主网的节点
  • 2.一般推荐 vscode 做代码编辑
  • 3.使用Truffle来下载应用模板和编译部署
    • 如果我们需要开发一个基于web前端的DAPP可以使用它来下载官网支持的应用模板
    • 官方有一个box页面,有各种类型工程的模板
    • 基于一套工程框架来进行开发,不用从零开始

模板文件的选用

  • 这里开发一个基于web前端的DAPP的例子
  • 既然可以使用工程模板来快速创建目录文件,我们先建一个自己的一个工作目录dapptest
  • 进入这个目录里面,我们就开始下载一个项目模板: $truffle unbox webpack
  • 这个项目模板的名字是webpack, 下面是基于web前端的dapp的工程目录
  • 这里app的目录其实就是nodejs工程的一个目录结构
    • node_modules是node的一些依赖库
    • src中的html是前端页面,js是业务逻辑(和以太坊以及前端页面交互)是Dapp的中间层也叫应用后端
  • 当然这里是使用nodejs来开发的目录,其他语言开发会有相对应文件
  • contracts是我们自己编写的合约
  • 其他文件是与Truffle相关的一些文件
  • 我们可以看到nodejs工程被集成到了truffle目录中去了

项目的运行

  • 我们下载的这个工程模板文件,其实已经内置的一些合约

  • 可以来直接运行这个例子来看一下: $ truffle develop

    • 这里只是想运行一下这个测试程序
    • 我们就不需要去专门启动节点了
    • 当然我们也可以启动一个以太的私有节点或者ganache模拟节点
    • 这里为了方便,通过这个命令启动了truffle内置的一个节点环境
    • 可以看到它同样的监听了本机的8545端口,然后默认了就创建了10个账户地址
  • 由于我们进入了truffle本身的环境,所以可以直接来做合约的编译和部署, 在console控制台输入一下命令:

    • $ compile
    • $ migrate
  • 编译,部署完毕之后,就可以进入到app这个目录里面,来启动我们的示例的合约程序

    • $ cd app
    • $ npm run dev
      > app@1.0.0 dev /Users/johnny/Code/github/block-chain/dapptest/app
      > webpack-dev-serverℹ 「wds」: Project is running at http://localhost:8080/
      ℹ 「wds」: webpack output is served from /
      ℹ 「wds」: Content not from webpack is served from /Users/johnny/Code/github/block-chain/dapptest/app/dist
      ℹ 「wdm」: Hash: 0e531130c456b36c9abe
      Version: webpack 4.42.0
      Time: 1306ms
      Built at: 2020-03-22 10:44:38Asset       Size  Chunks             Chunk Names
      index.html  879 bytes          [emitted]  index.js   2.42 MiB    main  [emitted]  main
      Entrypoint main = index.js
      [0] multi (webpack)-dev-server/client?http://localhost:8080 ./src/index.js 40 bytes {main} [built]
      [../build/contracts/MetaCoin.json] 101 KiB {main} [built]
      [./node_modules/ansi-html/index.js] 4.16 KiB {main} [built]
      [./node_modules/ansi-regex/index.js] 135 bytes {main} [built]
      [./node_modules/strip-ansi/index.js] 161 bytes {main} [built]
      [./node_modules/web3/src/index.js] 2.01 KiB {main} [built]
      [./node_modules/webpack-dev-server/client/index.js?http://localhost:8080] (webpack)-dev-server/client?http://localhost:8080 4.29 KiB {main} [built]
      [./node_modules/webpack-dev-server/client/overlay.js] (webpack)-dev-server/client/overlay.js 3.51 KiB {main} [built]
      [./node_modules/webpack-dev-server/client/socket.js] (webpack)-dev-server/client/socket.js 1.53 KiB {main} [built]
      [./node_modules/webpack-dev-server/client/utils/createSocketUrl.js] (webpack)-dev-server/client/utils/createSocketUrl.js 2.91 KiB {main} [built]
      [./node_modules/webpack-dev-server/client/utils/log.js] (webpack)-dev-server/client/utils/log.js 964 bytes {main} [built]
      [./node_modules/webpack-dev-server/client/utils/reloadApp.js] (webpack)-dev-server/client/utils/reloadApp.js 1.59 KiB {main} [built]
      [./node_modules/webpack-dev-server/client/utils/sendMessage.js] (webpack)-dev-server/client/utils/sendMessage.js 402 bytes {main} [built]
      [./node_modules/webpack/hot sync ^\.\/log$] (webpack)/hot sync nonrecursive ^\.\/log$ 170 bytes {main} [built]
      [./src/index.js] 2.08 KiB {main} [built]+ 349 hidden modules
      ℹ 「wdm」: Compiled successfully.
      
  • 可以看到启动以后,创建的一个服务端,8080端口,我们可以打开来看一下: http://localhost:8080/

  • 这个页面就是工程模板自带的一个示例程序

  • 可以看到,这个页面就相当于就是前端,nodejs就相当于服务后端,节点就相当于以太节点
  • 这个例子是演示发送代币的功能 MetaCoin, 给一个地址发送指定数量的代币

这篇关于区块链笔记:DAPP的运行结构,环境准备,模板文件的选用,演示项目示例的运行的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!



http://www.chinasem.cn/article/950962

相关文章

html5的响应式布局的方法示例详解

《html5的响应式布局的方法示例详解》:本文主要介绍了HTML5中使用媒体查询和Flexbox进行响应式布局的方法,简要介绍了CSSGrid布局的基础知识和如何实现自动换行的网格布局,详细内容请阅读本文,希望能对你有所帮助... 一 使用媒体查询响应式布局        使用的参数@media这是常用的

Java使用SLF4J记录不同级别日志的示例详解

《Java使用SLF4J记录不同级别日志的示例详解》SLF4J是一个简单的日志门面,它允许在运行时选择不同的日志实现,这篇文章主要为大家详细介绍了如何使用SLF4J记录不同级别日志,感兴趣的可以了解下... 目录一、SLF4J简介二、添加依赖三、配置Logback四、记录不同级别的日志五、总结一、SLF4J

将Java项目提交到云服务器的流程步骤

《将Java项目提交到云服务器的流程步骤》所谓将项目提交到云服务器即将你的项目打成一个jar包然后提交到云服务器即可,因此我们需要准备服务器环境为:Linux+JDK+MariDB(MySQL)+Gi... 目录1. 安装 jdk1.1 查看 jdk 版本1.2 下载 jdk2. 安装 mariadb(my

Java字符串操作技巧之语法、示例与应用场景分析

《Java字符串操作技巧之语法、示例与应用场景分析》在Java算法题和日常开发中,字符串处理是必备的核心技能,本文全面梳理Java中字符串的常用操作语法,结合代码示例、应用场景和避坑指南,可快速掌握字... 目录引言1. 基础操作1.1 创建字符串1.2 获取长度1.3 访问字符2. 字符串处理2.1 子字

IDEA自动生成注释模板的配置教程

《IDEA自动生成注释模板的配置教程》本文介绍了如何在IntelliJIDEA中配置类和方法的注释模板,包括自动生成项目名称、包名、日期和时间等内容,以及如何定制参数和返回值的注释格式,需要的朋友可以... 目录项目场景配置方法类注释模板定义类开头的注释步骤类注释效果方法注释模板定义方法开头的注释步骤方法注

C++使用printf语句实现进制转换的示例代码

《C++使用printf语句实现进制转换的示例代码》在C语言中,printf函数可以直接实现部分进制转换功能,通过格式说明符(formatspecifier)快速输出不同进制的数值,下面给大家分享C+... 目录一、printf 原生支持的进制转换1. 十进制、八进制、十六进制转换2. 显示进制前缀3. 指

Python运行中频繁出现Restart提示的解决办法

《Python运行中频繁出现Restart提示的解决办法》在编程的世界里,遇到各种奇怪的问题是家常便饭,但是,当你的Python程序在运行过程中频繁出现“Restart”提示时,这可能不仅仅是令人头疼... 目录问题描述代码示例无限循环递归调用内存泄漏解决方案1. 检查代码逻辑无限循环递归调用内存泄漏2.

Python如何自动生成环境依赖包requirements

《Python如何自动生成环境依赖包requirements》:本文主要介绍Python如何自动生成环境依赖包requirements问题,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑... 目录生成当前 python 环境 安装的所有依赖包1、命令2、常见问题只生成当前 项目 的所有依赖包1、

前端CSS Grid 布局示例详解

《前端CSSGrid布局示例详解》CSSGrid是一种二维布局系统,可以同时控制行和列,相比Flex(一维布局),更适合用在整体页面布局或复杂模块结构中,:本文主要介绍前端CSSGri... 目录css Grid 布局详解(通俗易懂版)一、概述二、基础概念三、创建 Grid 容器四、定义网格行和列五、设置行

Node.js 数据库 CRUD 项目示例详解(完美解决方案)

《Node.js数据库CRUD项目示例详解(完美解决方案)》:本文主要介绍Node.js数据库CRUD项目示例详解(完美解决方案),本文给大家介绍的非常详细,对大家的学习或工作具有一定的参考... 目录项目结构1. 初始化项目2. 配置数据库连接 (config/db.js)3. 创建模型 (models/