How to create a Dapp - In this presentation I explain some Ethereum concepts to understand Dapps - and put this into practice using a real example : Allowance : A smart contract driven Dapp that allows a parent to give a weekly allowance to his/her kids. It was presented om aug 10 2016 in Antwerp in the API Craftsmanship Belgium meetup. Enjoy

1. Ingredients for
creating Dapps
by stefaan ponnet
API Craftsmanship Meetup aug 11 2016

2. The basics: Ethereum as a smart
contract platform
Blockchain
Nodes and mining
Transactions
EVM
Smart Contracts

3. Ethereum accounts : EOA and
Contract accounts
Regular Accounts : ( EOA : Externally Owned Accounts )
- consist of a public / private keypair
- controlled by a human - or whoever holds the private key
Contract account:
- contains the EVM code + the storage ( = smart contract )
- smart contracts are executed by an EOA ( an EOA starts a transaction )

4. The Ethereum Virtual Machine ( EVM )
- Place where Smart Contracts run on the Ethereum blockchain
- Ethereum is “Turing complete”. -> You can run any sort of application on
Ethereum
- the “distributed world computer”
- Dapp: Decentralized Application

5. EVM and the Ethereum nodes
- every Ethereum node runs instances of the EVM
- maintain state and transaction consensus across the blockchain
- contract code gets executed on every node
It is not efficient in terms of computing power , but gives:
- extreme levels of fault tolerance
- ensures zero downtime
- makes data stored on the blockchain forever unchangeable and
censorship-resistant.

6. 3 types of instructions in the EVM
1. Create new Smart Contracts ( programs on the blockchain )
2. Execute functions of a specific smart contract
3. Transfer Ether

7. EVM opcodes are specific for Ethereum
etc...

8. Preventing spam
Problem
Public blockchain : if anyone can deploy and run contracts - it gets
overloaded
Solution
Use a anti-spam payment token : Gas

9. Gas
Every instruction in the EVM uses up gas

10. - Gas is bought using Ether by the caller to fuel the EVM.
- There is a (dynamic) gasprice ( ETH / gas )
- You set a gas limit per transaction to avoid draining the caller’s account
- When the execution of the contract ends within the gas limit , the new
state is saved on the blockchain and the leftover gas is refunded.
Gas

11. Gas
When the EVM instance runs out of gas , the execution stops and no state changes
are saved on the blockchain.

12. What do we need ?
- A running Ethereum node to connect to the blockchain ( JSON/RPC interface)
- A client library (Web3) for talking to the JSON/RPC interface
- A wallet (lightwallet) to sign transactions
- A smart contract ( logic + storage )
- A frontend ( Dapp ) for interacting with the smart contract.

13. Ethereum node
There are several options :
Test on a real blockchain
- Ethereum has a public testnet to test your Dapp (‘morden’)
- run a local testnet node on your development machine ( geth ) or in the cloud
Simulating
- Use a transaction+API simulator e.g.
ethereumjs-testrpc
https://github.com/ethereumjs/testrpc

14. Web3 client library
https://github.com/ethereum/web3.js/

15. Lightwallet
https://github.com/ConsenSys/eth-lightwallet
Allows signing of transactions on the client / in the browser

16. A Smart contract
To create the EVM bytecode - we use a special programming language called
Solidity
and we need a compiler that converts out solidity files into EVM bytecode for us.

17. Compile solidity files in an online editor
https://ethereum.github.io/browser-solidity

18. Compile solidity files using Truffle
https://truffle.readthedocs.io/en/latest/

19. Compile your files using a Gulp-task
var solc = require('solc');

20. Example : Macaulay’s allowance
As a parent you want to give a weekly allowance to your kid - which your kid can
claim once every week.
We will create a contract that :
- Holds the allowance funds
- Allows the parent to define the kid’s wallet account (recepient of the funds)
- Allows the kid to periodically claim funds out of the allowance contract.

21. Create the contract
→ See example...

22. Creating the Dapp
We will use Polymer to create a quick app
we want to be able to
- As a parent : deploy a new contract and set the rules for our kid’s allowance
- As a kid : be able to get the allowance

23. Create a few Polymer components
- yo polymer → Scaffold out the base app
- bower install web3-wallet → add web3-wallet component
- yo polymer:el allowance-wallet → visualize your wallet & show balance
- yo polymer:el allowance-create → create a new allowance contract
- yo polymer:el allowance-claim → extract funds from the contract

24. Deploy and test the app
Only deploy the HTML/js files
There is no central backend server
Hosting can also be decentral ( IPFS : Interplanetary File System )
→ Demo time !

25. Thats it!
Get the code here : https://github.com/sponnet/allowance

26. DAO initiatives
If you like this & want to learn more and put it into practice :
We are rolling out several DAO’s ( https://www.ethereum.org/dao ) in which you can
participate immediately as
- developer
- curator
- investor
- marketing ...
e.g. decentralized video platform ( blocktu.be ) / a product DAO ( KimRadio ) / and a
blockchain expert group DAO

27. Next meetups
Starting in september we will host 1 meetup per month like this one
And every week we’ll be organizing free open-table discussions here at BIA.
Join our group to recieve updates: http://www.meetup.com/API-Craftsmanship/
Hope to see you soon !
@sponnet - stefaan@ponnet.com - https://www.linkedin.com/in/sponnet