DApp-SinglePage

This repository contains a Blockchain-based Web application. The objective of this repository contains necessary boilerplate code to implement any Blockchain-based web application. This would speed-up developers' application developers effort.

Technologies

• Ethereum, ReactJS, Solidity, Web.js framework, Rinkby Test Network, Infura
• Atom IDE is recommended due to Syntax highlighting packages for Solidity.

installation

• Clone this repository
• npm install to install necessary dependencies, listed in package.json
• node compile.js to compile the solidity contract

React UI Installtion

• npm install -g create-react-app to install dependencies for boilerplate.
• create-react-app <project-name> to generate ReactJS boilerplate code.

Directory Structure

• Contracts directory contains contract files. The contract file is compiled into Online Remix editor first.
• node_modules directory contains various dependencies for, mentioned in package.json file.
• compile.js file compiles the smart contract
• deploy.js file deploys the smart contract on Rinkby Network.
• package.json file list the dependencies of the project.
• react directory contains single page UI React code that interact with deployed contract.

Traditional vs Ethereum Web application Architecture

ReactJS and Deployed Contract Interaction, Rendering

react/web3.js file

react/lottery.js file

• Source of images: Ethereum and Solidity: The Complete Developer's Guide by Stephen Grider