Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/adekoreday/react-decentralized-app
A decentralized app built with react, drizzle, and truffle which consume a smart contract written in solidity running on Ethereum blockchain network. Shows how to write clean and testable Dapps using react hooks.
https://github.com/adekoreday/react-decentralized-app
drizzle ethereum react solidity truffle
Last synced: 7 days ago
JSON representation
A decentralized app built with react, drizzle, and truffle which consume a smart contract written in solidity running on Ethereum blockchain network. Shows how to write clean and testable Dapps using react hooks.
- Host: GitHub
- URL: https://github.com/adekoreday/react-decentralized-app
- Owner: Adekoreday
- Created: 2021-01-01T04:34:42.000Z (almost 4 years ago)
- Default Branch: main
- Last Pushed: 2021-06-29T08:37:18.000Z (over 3 years ago)
- Last Synced: 2024-05-21T01:47:53.620Z (6 months ago)
- Topics: drizzle, ethereum, react, solidity, truffle
- Language: JavaScript
- Homepage:
- Size: 1.9 MB
- Stars: 2
- Watchers: 3
- Forks: 1
- Open Issues: 0
-
Metadata Files:
- Readme: readme.md
Awesome Lists containing this project
README
### React Smart Contract
This repository consist of react application that consumes a typical smart contract running on ethereum blockchain
- as an owner of the contract, I should be able to create a new Status type
- as an owner of the contract, I should be able to create a new Status
- as an owner of the contract, I should be able to see the list of Statuses
Getting Started
Watch A brief intro [SHORT DEMO VIDEO](https://www.loom.com/share/d970f55db6cb49b68a2831d02ceb5514)
Run the following
> Truffle is the framework we'll use to help us easily manage and deploy our Solidity codes.
```
npm i -g truffle
truffle develop
```
Compile the contracts and ensure build artificats are the react app directory
*Note I Upated the truflle config file to enable this*
```
truffle compile
truffle migrate --network development
```
After deploying to our local blockchain then we run our smart contract test
```
truffle test
```
### Start The React/Drizzle App
Install Metamask chrome extension
[MetaMask](https://chrome.google.com/webstore/detail/metamask/nkbihfbeogaeaoehlefnkodbefgpgknn?hl=en)
Run the Following
```
cd app/
npm run start:dev
```
Open the browser and go to PORT 8080
### Tests
to run unit test for the front end application
> Major Pages Were tested, You could find them in
app/src/components/pages
```
cd app/
npm run test
```
### Tools
- React
- Drizzle
- Truffle Suite
- Solidity
I always love feedbacks/contribution )
[email protected].
@AdeyemiAdekore2 (twitter)