Complete Blockchain Web Application On Ethereum

  1. Home
  2. Blockchain
  3. Complete Blockchain Web Application On Ethereum

Tags: Blockchain

The only course you need to learn development of decentralized web application powered by Ethereum blockchain!

Last updated 2022-01-10 | 4.6

- Develop full decentralized web application on Ethereum blockchain
- Learn smart contract fundamentals and interaction
- Learn how to connect your web application to blockchain

What you'll learn

Develop full decentralized web application on Ethereum blockchain
Learn smart contract fundamentals and interaction
Learn how to connect your web application to blockchain
How to react to blockchain events
How to deploy and run local blockchain

* Requirements

* Basic web development knowledge (Angular
* React
* Vue...)
* Prepare to build real blockchain web app!
* Be ready to learn lot of cool stuff

Description

Over 39,000 happy students from 136 countries!

Hello! Welcome to the Complete Blockchain Web Application Development course, the only course you need to build decentralized web applications.

What does blockchain have to do with web development?

Blockchain technology has become synonymous with cryptocurrencies and token crowd sales. However, there are a variety of blockchain applications that could be applied to web development. Blockchain technology is one of the latest trends in the web development industry. There has been a lot of hype surrounding this buzzword, and most people are still wondering what the real use cases of blockchain technology are, and if they can actually apply it to make profitable business models.

You will learn all fundamental aspects of creating and connecting blockchain application to website and interacting with it.

Course is divided into 3 main sections:

  • Frontend application - developed in Angular, completely decoupled from blockchain.

  • Smart Contract and blockchain - learning the fundamentals of developing, deploying (locally) and interacting with smart contract.

  • Middleware - The most important "glue" between the frontend and smart contract.

Hurry though… the price might change at any point

And if you don't think it live up to promise I've made you...

Or you think you cannot develop your own blockchain web app in the end...

There is a 30-Day Money-Back Guarantee...

All risk is lifted from your shoulders and placed squarely on mine. Join the BEST Blockchain Web Development on Udemy today!

See you on the inside!

Who this course is for:

  • Web developers
  • Blockchain enthusiasts
  • Ethereum enthusiasts

Course content

4 sections • 40 lectures

Introduction 4 lectures

How To Get The Most Out Of This Course Preview 01:56

Project Architecture Preview 02:51

Get an overview of the whole project structure which consists of:

  • Frontend build in Angular

  • Smart Contract written in Solidity

  • Middleware using web3js

Setting up environment Preview 08:44

We will install the requirements for development: Visual Studio Code and NodeJS and setup sample Angular project.

Dependencies Preview 02:00

To make sure we are having the same dependencies:

- delete package-lock.json file

- delete node_modules

- replace package.json content with the following and then run "npm install" :

{

  "name": "blockchain-poll",

  "version": "0.0.0",

  "scripts": {

    "ng": "ng",

    "start": "ng serve",

    "build": "ng build",

    "test": "ng test",

    "lint": "ng lint",

    "e2e": "ng e2e"

  },

  "browser": {

    "http": false,

    "https": false,

    "os": false

  },

  "private": true,

  "dependencies": {

    "@angular/animations": "~9.1.3",

    "@angular/common": "~9.1.3",

    "@angular/compiler": "~9.1.3",

    "@angular/core": "~9.1.3",

    "@angular/forms": "~9.1.3",

    "@angular/platform-browser": "~9.1.3",

    "@angular/platform-browser-dynamic": "~9.1.3",

    "@angular/router": "~9.1.3",

    "apexcharts": "^3.19.0",

    "bootstrap": "^4.4.1",

    "jquery": "^3.5.0",

    "rxjs": "~6.5.4",

    "tslib": "^1.10.0",

    "web3": "^1.2.7",

    "zone.js": "~0.10.2"

  },

  "devDependencies": {

    "@angular-devkit/build-angular": "~0.901.3",

    "@angular/cli": "~9.1.3",

    "@angular/compiler-cli": "~9.1.3",

    "@angular/language-service": "~9.1.3",

    "@types/node": "^12.11.1",

    "@types/jasmine": "~3.5.0",

    "@types/jasminewd2": "~2.0.3",

    "codelyzer": "^5.1.2",

    "jasmine-core": "~3.5.0",

    "jasmine-spec-reporter": "~4.2.1",

    "karma": "~5.0.0",

    "karma-chrome-launcher": "~3.1.0",

    "karma-coverage-istanbul-reporter": "~2.1.0",

    "karma-jasmine": "~3.0.1",

    "karma-jasmine-html-reporter": "^1.4.2",

    "protractor": "~5.4.3",

    "ts-node": "~8.3.0",

    "tslint": "~6.1.0",

    "typescript": "~3.8.3"

  }

}

Frontend application 13 lectures

Overview Preview 00:14

Frontend architecture Preview 01:21

We will describe the frontend architecture and components which we will develop.

Website mockup Preview 07:24

We will define interfaces and mockup a simple website design with implementation using Bootstrap.

JavaScript requires jQuery Preview 00:12

PollCreate component view Preview 05:06

We will develop PollCreate component (view) which will be responsible for handling input form data, for creating polls.

PollCreate component logic Preview 06:52

We will implement PollCreate component (logic), setup reactive form and verify we are getting correct data.

Poll component view Preview 05:35

We will implement Poll component (view) responsible for displaying short information about the poll.

Poll component logic Preview 07:20

We will implement Poll component remaining logic.

PollVote component voting Preview 06:00

We will implement PollVote component logic for voting.

PollVote component results (charts) Preview 06:42

We will implement PollVote component logic for displaying charts using Apex charts.

Displaying active poll Preview 06:33

We will implement displaying of active poll in the PollVote component.

PollService setup Preview 05:52

We will implement and mock-up PollService, responsible for executing functions.

Wiring up components Preview 09:52

We will wire up outputs of components and make sure the data flow from components to PollService works.

Smart Contract and blockchain 14 lectures

Overview Preview 00:43

In this section you will learn about:

  • where to create smart contract

  • how to create smart contract

  • solidity fundamentals

  • contract interaction

Remix introduction Preview 02:13

Learn basics of Remix editor, structure and plugins needed.

Solidity - types Preview 07:59

Solidity types: uint, bool, string, bytes...

Solidity - functions Preview 08:20

Solidity functions: types, visibility etc.

Solidity - restrictions and modifiers Preview 04:22

Learn about function modifiers and require statements.

Contract interaction Preview 05:26

Learn how you can interact with your smart contract and execute functions to test if it works as expected.

PollContract - defining types Preview 03:42

Now we will develop our PollContract and we start by defining the types we need.

PollContract - creating poll Preview 05:55

We will implement creatingPoll function and handle possible errors.

PollContract - getting poll Preview 03:41

We will define getPoll function and return data we need for our frontend.

PollContract - voting Preview 04:11

We will implement vote function which handles the logic of voting and possible errors.

PollContract - getting voter Preview 02:56

We will implement function for getting voter and data we need for our frontend.

Metamask setup Preview 02:21

We will setup Metamask and learn basics.

Ganache setup Preview 02:15

We will setup Ganache, local blockchain, and learn the basics.

Deploying contract to local blockchain Preview 03:34

We will learn how to deploy your own smart contract to local blockchain using Remix.

Connecting it all together - middleware 9 lectures

Overview Preview 00:19

In this section you will learn how to connect your frontend with the smart contract. How to glue them together by writing the middleware.

Connecting to blockchain - Web3 Service Preview 09:18

Setting up middleware service and connecting to Metamask from frontend.

Fixing version of Web3 Preview 00:12

Executing transactions Preview 06:51

Execute transactions from f

Writing to blockchain - PollService Preview 05:06

Reading from blockchain - Web3Service Preview 05:13

Normalizing data - PollService Preview 08:41

Reacting to blockchain events Preview 06:42

Conclusion Preview 01:43