In this post we're going to cover the basics of Ethereum DApp Development. DApp stands for Decentralized Apps. We're all used to centralized apps, where there is a central server and database where all the data is stored and all the requests are sent, for example: Facebook, Google etc. But in a Decentralized App or DApp there are several computers or nodes connected together to make a network which runs a Blockchain, each node in the network has a copy of the Blockchain
Blockchain Basics
Blockchain is chain of blocks that are arranged in chronological order to store some record. To understand blockchain in more detail, I want you to go to Anders's Blockchain Demo. When you will visit there you will find 2 videos by Anders and he will explain you the basics of Blockchain in a great detail. These 2 videos should be watched by anyone who wants to learn the basics of Blockchain.
Bitcoin
Let's start from Bitcoin. Bitcoin is Peer to Peer money transfer technique that uses Blockchain to remove the necessity of a middleman such as a Bank. It was created by Satoshi Nakamoto (Unknown)
Ethereum
The purpose of Bitcoin was to only to make transactions and transfer money without the needs of a middleman. Ethereum used the Peer to Peer Blockchain technology on which Bitcoin runs and used it to create a system on which we can create very complex Decentralized Apps (DApps).
What is Ethereum?
Ethereum is a network of nodes connected together to transfer money and store data which allow us to create very complex DApps. There is one thing to keep in mind that there are many ethereun networks, some are private networks, some are public networks, some are for testing, but there is a main ethereum network on which the ethereum currency Ether (ETH) is worth real money.
Connect with the Ethereum network
There are 3 main ways to connect with the Ethereum network.
1. Web3.js: This method is used by developers to connect with the ethereum network using code in their apps.
2. Metamask: Metamask is a web browser extension that can be used by normal users to connect with the ethereum network.
3. Mist Browser: These are special browsers that are designed specifically to connect with the ethereum network.
Creating an Ethereum account using Metamask
For creating an ethereum account you need to download and install Metamask extension in your browser. This extension is currently only available on Chrome, Firefox and Opera. So, once you have downloaded Metamask you will be prompted to accept some Privacy Policy or Terms and Conditions. After that you will need to set a password to encrypt your wallet. Next you will be shown a seed phrase, store this seed phrase somewhere safe. This seed phrase will be used to recover your wallet in case you delete this extension or something happened to your computer. Now, once the wallet is ready you can see on the top left corner that you can select different networks of ethereum to connect with. As I said above only on the Main Ethereum network the Ethereum currency Ether is worth real money, on any other network Ether is fake.
Difference between Account and Wallet
An ethereum account is just an account that can be used to send and receive money whereas a wallet is a software that can be used to create and mange multiple accounts.
Ethereum Accounts
Each ethereum account is made up of the following information.
1. Address: You can share the address with anyone in the world. This address is used to receive money in your Ethereum account
2. Public Key: Your address is the hashed version of you public key, and this public key is also used to send money from your account
3. Private Key: The private key should be kept very secret because this is the authorization to your account and can be used to send money from your account. If you don't have this key then you don't have authorization to your account. The public key and the private key are combined together to make a send a transaction from your account.
All this information is stored on your wallet software. In this case we used Metamask so the Address, Public Key and the Private key is stored on your wallet. You can access your address in Metamask by clicking on the three dots next your account name and clicking copy address to clipboard. You can access your private key by again clicking on the three dots and then clicking export private keys.
Another thing to note is that, I told you above that there are many ethereum networks. But an ethereum account can be used on any ethereum network. For example the account that you created using metamask can be used with any ethereum network, but all the ethereum network will treat your account differently. For example: If you have 1 ether in a test ethereum network then this ether cannot be used in the main ethereum network.
Mnemonic Phrase
Now let's perform an exercise. To do this you should have your seed phrase that was generated while creating your ethereum account and you should have your Account Address and Private Key which you can obtain through you Metamask wallet as described above.
Now to perform this exercise.
1. Go to https://iancoleman.io/bip39/
2. Enter your seed phrase in the "BIP39 Mnemonic" field.
3. In the "Coin" field select "ETH - Ethereum"
4. Scroll down to the "Derived Addresses" section.
5. Here you will see a table in which you can see "Address" and "Private Key" column. On the first row in the table you will see an Address and a Private Key, compare this to the Address and Private Key that you obtained from Metamask.
You will observe that both are the same. Now, let me explain what's that seed phrase. Metamask encrypted that seed phrase to generate your Address, Private Key and Public Key. This seed phrase can be used to create as many account as you want. And this seed phrase can be decrypted to get those account's Address, Public Key and Private key back. Now, I want you create another account using the same metamask wallet that we created above. Just click on the user icon on top right corner and click create an account. Now you will have two accounts in you metamask wallet. Now, get the Address and the Private key from the second account that you just created using the steps described above, and compare this Address and Private key with second row in the "Derived Addresses" table. You will again find that these are the same.
Transactions
Now, a transaction is created through the following steps.
1. Create and send the transaction to the Ethereum network
The first step is that the transaction object is created by the sender by using his private key, here are the values stored in the transaction object:
1. nonce: This is the amount of transactions that took place from the sender's account in the past. For example if you are sending your 100th transaction then this value will be 99. Note: Do not confuse this nonce with the block nonce. This nonce is stored in the transaction object and the block nonce is stored in the block.
2. to: This field contain the address of the receiver.
3. value: This is the amount of ether that is sent.
4. gasPrice: We will discuss this later.
5. startGas/gasLimit: We will discuss this later.
The 6th, 7th and 8th value that is stored in the transaction object is v, r and s. These three fields are the cryptographic hash of the sender's private key. These values can be decrypted to get the sender's account address. Note: these values cannot reveal the private key of the sender.
Once the transaction object is created it is sent to the ethereum network. The transaction can be sent using web3.js, metamask, mistbrowser or any other ethereum client.
2. Approval of the transaction
Once the transaction is sent to the ethereum network, then it is bundled up with other transactions which are pending, in a single block. Then the block is mined by the miners using the proof-of-work algorithm. The miner which first finish the proof-of-work algorithm will get the reward for mining the block. The time which is taken to mine the block is called the Blocktime. After the mining is completed the whole network collectively will check the work of the miner and approve the block. After this the block is added to the blockchain and the transaction is completed.
Smart Contract
Smart contract is what allow us to build complex applications on ethereum blockchain. You can think of a smart contract as an account that is controlled by code. The normal account that we created using Metamask is used by us(human). But the contract account is controlled by code which the developers write to instruct the contract what to do. Like a normal account contain Account Address, Private Key and Public Key. The contract account contain the following information
1. balance: Amount of Ether stored in the contract.
2. storage: This is where the data related to our contract is stored.
3. code: The developer write some code for this contract which is compiled into machine code that is stored in this account.
This smart contract is deployed to an ethereum network which stores the contract account. Note: Unlike a normal account the contract account can be used only on the network on which it is deployed.
Relationship between Contract source code and Contract account
The contract source code is what developer write. If you know OOP programming, then you can think of it like this. The contract source code is the class and this class is compiled into machine code and it's instance is deployed on the ethereum network as a contract account. So, the source code is only the class and the contract account is the instance of the class which runs on ethereum network.
Writing Smart Contract using Solidity
Solidity is the language which is used to write smart contract. Solidity is very similar to JavaScript. We're going to use remix IDE which can be used to write solidity smart contract. It is a web based IDE so you can access it at http://remix.ethereum.org. After reaching to remix editor delete all the sample code and create a new file, and write the following code.
pragma solidity ^0.4.17;
contract Message {
string public message;
constructor(string initalMessage) public {
message = initalMessage;
}
function setMessage(string newMessage) public {
message = newMessage;
}
}
Let's break down the code the first line pragma solidity ^0.4.17; defines the version of solidity that we are using in this case 0.4.17. The second line contract Message { starts the definition of the contract just like how we define a class. In the next line we have string public message; In this line we are defining a class variable the first word "string" means that this variable is a string the second word "public" means that the variable is available to anyone on the ethereum network and finally we have the variable name. Defining our variable as public also makes us a getter function for this variable. In the next line we are defining a constructor function constructor(string initalMessage) public { this function takes in the initial value and set the value our variable "message". Also making this function public makes this function available to anyone on the network. Next we are defining a setter function function setMessage(string newMessage) public { which sets the variable to some value.
We can also define a getter function for our variable "message" but it is not necessary because making the variable public automatically makes the getter function for us. But for example let's make a getter function
function getMessage() public view returns (string) {
return message;
}
Notice that this getter has returns (string) which defines that this function will be returning a "string". Also notice that this function has a keyword "view". This is the function type. Here are a few function type that we can use in solidity.
1. view/constant: This defines that the function return some data and does not modify the contract's data. Note: "constant" keyword was used in previous versions of solidity.
2. pure: The function will not modify or read contract's data.
3. payable: This defines that whoever is calling this function on the network will send some ether to the contract.
Deploying the Contract
We're now going to deploy the contract that we just build. We're going to deploy this contract on a test ethereum network that is inbuilt in remix. On the right side we can see a compile tab, on the compile tab click "Start to compile". Next go to the run tab and in the environment field select "Javascript VM". Then you will see a deploy button and in front of the deploy button you will see that, before deployment we can set an initial value of our message variable. This field is only shown because we included initialMessage as a parameter in our contstructor function. So, set the initial value and click deploy. When you will deploy you will notice that in the account field the account which was selected to deploy the app has reduced balance. This is because whenever you try to deploy a contract to the blockchain a transaction is created by your account which request the network to make contract account on the network and this transaction cost some ether. Next you will see on the bottom right that you can interact with the you contract account. You can get message variable and set message variable. Note whenever you try to interact with the setMessage function in your deployed contract. The account which is selected in the account field loose balance this is because when we call setMessage function it creates a transaction to update the contract's data. Always remember that whenever you try to update something on the blockchain or on the contract it creates a transaction which transfer some ether from your account to the contract's account.
Behind the scenes of deployement
When we deploy our contract to the blockchain it created a transaction. Let's see the transaction object for contract deployment.
1. nonce: This nonce stores how many times the sender has sent the transaction.
2. to: This is left blank to tell the blockchain that it is a contract transaction.
3. data: This is the byte code of contract.
4. value: This is the amount of ether to send to contract while deploying.
5. gasPrice: We will discuss it later.
6. startGas/gasLimit: We will discuss this later.
7th, 8th, and 9th are v, r and s values which are generated from the private key of the person who is delpoying the contract. After making the contract transaction it sent to the network and mined by miners and then the contract is deployed.
Also note that when you call the setMessage function it also creates a transaction because you are updating the blockchain which takes some either from the person's account who is calling the function. So, always remember whenever you update the blockchain it always create a transaction.
Types of functions
There are two types of ways to execute a function
1. 'Calling' a function: This is just like calling a function in other programming language, an example of this function is the getter function that we created to get the message.
2. Sending a Transaction to a Function: In this type, a transaction is created and some money is send by the person who is calling the function to the contract. An example of this function is the setter function that we created to get the message variable. In this type a transaction is created and this transaction is to be mined that's why the it takes some time to call the setter function.
Units of Ether
Just like we have 100 cents in 1 dollar. In the same way we have 1000000000000000000 Wie in 1 Ether.
Gas
When we build a centralized application we have to rent a server and pay the server host to run our code. The same thing happens on ethereum when some operation is run on the blockchain it's cost is measured in gas. You can check the gas price of each operation at Gas Cost Table.
Now let's talk about the two properties in transaction object that we left
gasPrice: This is the amount of Wei that you are willing to pay per gas to complete the transaction.
startGas/gasLimit: It the maximum amount of gas that the transaction can consume.
For example if we want to add two number, according to the gas cost table, it cost 3 gas and if you set the gasPrice to 10. then you will be paying 3 gas * 10 wie/gas = 30 Wie. So, In short when we create a transaction to create a contract account or when we try to execute a function that change data on a blockchain/contract we create a transaction for which we have to pay in gas.
CONGRATULATIONS! You have reached to the end of this post. It was a very big post hopefully you didn't get bored. Now you should know the basics of Ethereum DApp Development. Note that we didn't created any DApp in this post. This post was intended so that you can get basics of Ethereum DApp Development. Now you are ready to create Ethereum DApps. So, if you want to create awesome DApps then please follow me 
Thank You, Steemit Community!