DEV Community ๐Ÿ‘ฉโ€๐Ÿ’ป๐Ÿ‘จโ€๐Ÿ’ป

DEV Community ๐Ÿ‘ฉโ€๐Ÿ’ป๐Ÿ‘จโ€๐Ÿ’ป is a community of 963,864 amazing developers

We're a place where coders share, stay up-to-date and grow their careers.

Create account Log in
Cover image for How to Learn Web3 (September 2022)
Francesco Ciulla
Francesco Ciulla

Posted on

How to Learn Web3 (September 2022)

Hi, I am Francesco, and I share daily content about Web3 (mainly on Twitter and YouTube)

In this article, I will summarize the steps you can take in order to learn Web3.


Where to Start?

ย 
When we want to start something new, we need some direction just to don't get stuck at the very beginning.

But we all are different and we have different ways of learning.

This article is based on my very personal experience in learning Web3.


Roadmap

ย 
I don't like Roadmaps! But reading at least one can help us to have an idea of what we are expecting and to check if we are missing something.

Don't get a Roadmap as a bible to trust and to follow blindly 100%, but as a reminder if you are on the right track.

There are many roadmaps, and I am working on one.

For now I feel recommending the following one:

Complete Web3.0 and Solidity Development Roadmap 2022)
Complete Web3.0 and Solidity Development Roadmap 2022


Intro Article

ย 
What about the very first piece of content?
I don't suggest jumping straight into code but hold our hands for a while and start by getting a general idea of what is Web3.

This article by Nader Dabit on freecodecamp is a good one to start.

What is Web3? The Decentralized Internet of the Future Explained


Blockchain Fundamentals

ย 
Starting with the basics concepts you can't really be wrong.

I will link specific resources for each of them, but don't take this as the only one you have to watch to understand the concepts. Take your time because all the time spent here ios time saved later!

Just remember that the Fundamentals are fundamental, so don't skip this part.

  • Web1, Web2, Web3: A good article about the differences between web1, Web2, and Web3
  • What is a Blockchain: an enlightening video to understand the basic of the Blockchain.
  • Distributed Ledger: It's the consensus of replicated, shared, and synchronized digital data that is geographically spread across many sites, countries, or institutions.
  • Cryptocurrencies basics: An intro for an introduction to cryptocurrencies.
  • Smart Contracts: Smart Contracts explained simply, in a 4-minutes video.
  • Crypto-Wallets: An introduction to crypto wallets, connected to the concept of authentication in Web3.
  • Block Explorers: A block explorer is an online tool that enables you to search for real-time and historical information about a blockchain, including data related to blocks, transactions, addresses, and more.
  • Blockchain Oracles: A blockchain oracle is a service that connects smart contracts with the outside world, to feed information from (but also to) the world.
  • NFT Intro: NFTs explained in 4 minutes.
  • DAO Intro: A DAO, or a Decentralized Autonomous Organization, is a company set up to run by code on the blockchain.
  • Dapp Intro: dApps, or Decentralized Applications are apps that run using blockchain technology.

Choose a Blockchain

ย 
Each Blockchain is an ecosystem, with pros/cons.

Choose a Blockchain to understand concepts and apply them, like deciding to use Node.js to build some API.

I suggest to choose Ethereum for many reasons, the main one is that there is more material about it online.

24 Blockchains


Ethereum Concepts

ย 

Once you choose the Blockchain you can start learning the fundamental of the specific Blockchain. Some concepts overlaps among the blockchains, but they can be slightly different for each of them.

For Ethereum:

  • Accounts: An account is an entity with an ether (ETH) balance that can send transactions on Ethereum. Accounts can be user-controlled or deployed as smart contracts.
  • Transactions: Transactions are cryptographically signed instructions from accounts.
  • Blocks: Blocks are batches of transactions with a hash of the previous block in the chain.
  • Ethereum Virtual Machine (EVM): The EVM allows developers to create Ethereum smart contracts.
  • Gas: Gas is essential to the Ethereum network. It is the fuel that allows it to operate, in the same way that a car needs gasoline to run.
  • Nodes & Clients: Ethereum is a distributed network of computers (known as nodes) running software that can verify blocks and transaction data. The software application, known as a client, must be run on your computer to turn it into an Ethereum node.
  • Networks: Networks are different Ethereum environments you can access for development, testing, or production use cases.
  • Consensus algorithms: Consensus mechanisms allow distributed systems to work together and stay secure.

Ethereum Concepts (Advanced)

ย 
If you want to dive a bit deeper, here are some articles and concepts you can look for:

  • Ethereum Whitepaper: An introductory paper to Ethereum, published in 2013 before its launch.
  • Ethereum Trilemma:
  • EndGame (Vitalik Buterin): Vitalik Buterin's vision for a plausible roadmap for Ethereum.
  • Ethereum Yellowpaper: A formal definition of the Ethereum protocol.
  • Beacon Chain: The Beacon Chain is a ledger of accounts that conducts and coordinates the network of stakers.
  • Sidechains: A sidechain is a separate blockchain that runs independent of Ethereum and is connected to Ethereum Mainnet by a two-way bridge.
  • The Merge: The Merge is the most significant upgrade in the history of Ethereum. Extensive testing and bug bounties were undertaken to ensure a safe transition to proof-of-stake.

These are optional!


Choose a Language

ย 

  • Solidity: good for JavaScript/C++/Python Developers.
  • Vyper: good for Python Developers.
  • Rust: good choice if you chose Solana as blockchain.

I suggest Solidity because it's the most popular one.


Solidity (a blazing fast intro)

ย 

  • It's an object-oriented, high-level language for implementing Smart Contracts.
  • It's statically typed.
  • It's a curly-bracket language designed to target the Ethereum Virtual Machine.
  • It supports: inheritance, libraries, and complex user-defined types.

This is how a Solidity file (extension: .sol) looks like

// SPDX-License-Identifier: MIT
pragma solidity ^0.8.13;

contract HelloWorld {
    string public greet = "Hello World!";
}
Enter fullscreen mode Exit fullscreen mode

In the next sections, some free resources you can use to learn and start using the solidity programming language.


Solidity Videos

ย 
Some good YouTube channels to know more about Solidity:


Solidity tools

ย 


Use a framework

ย 
Once you get the basics, you can dive deep using these tools and working in a local environment.

  • Metamask: MetaMask is a software cryptocurrency wallet used to interact with the Ethereum blockchain.
  • Vs Code Solidity Extension: VS Code extensions that integrates with the Nethereum code generator to create Contract integration definitions.
  • Truffle: Truffle is a development environment, asset pipeline, and testing framework for developing smart contracts.
  • Hardhat: Hardhat is an Ethereum development environment. Compile your contracts and run them on a development network.
  • Brownie: Brownie is a Python-based development and testing framework for smart contracts.
  • Foundry: Foundry is a fast, portable and modular toolkit for Ethereum application development written in Rust.

Connect the Dapp to Frontend

ย 
Are you a front-end developer? GOOD!

For once, you don't have to learn a new framework, just use a library to interact with the blockchain!

You can use any frontend Framework (React, Vue, Angular, Svelte...)

Use:

  • Web3.js: web3.js is a collection of libraries that allow you to interact with a local or remote ethereum node using HTTP, IPC or WebSocket.
  • Ether.js: The ethers.js library aims to be a complete and compact library for interacting with the Ethereum Blockchain and its ecosystem.

Decentralized storage

ย 
Here are some examples of storage you can use to store your data on the blockchain (something similar to databases).

  • IPFS: The InterPlanetary File System is a protocol, hypermedia and file sharing peer-to-peer network for storing and sharing data in a distributed file system.
  • Arweave: Arweave is a data storage protocol. It's built on a technology called "blockweave".
  • FileCoin: Filecoin is an open-source, public cryptocurrency and digital payment system intended to be a blockchain-based cooperative digital storage and data retrieval method. It builds on top of IPFS, and it allows to rent unused hard drive space.

They are a p2p network of user-operators who hold a portion of the overall data.


Mid-level tools

ย 
Most of them are not complicated. To be honest, they simplify the process, but it's better to discover them after understanding the basics.

  • Testing Tools: Waffle, Ganache
  • OpenZeppelin
  • WalletConnect: WalletConnect is an open source protocol for connecting decentralised applications to mobile wallets with QR code scanning or deep linking.
  • Chainlink: Chainlink is a decentralized oracle networks provide tamper-proof inputs, outputs, and computations to support advanced smart contracts on any blockchain.
  • TheGraph: The Graph is an indexing protocol for organizing blockchain data and making it easily accessible with GraphQL.

SDKs

ย 
After getting an Idea of what a Dapp is and making some examples, you can decide you want some support and don't write everything on your own.

Here are 3 good ones you can check:

import { Alchemy } from 'alchemy-sdk';

// Using default settings - pass in a settings object to specify your API key and network
const alchemy = new Alchemy();

// Access standard Ethers.js JSON-RPC node request
alchemy.core.getBlockNumber().then(console.log);

// Access Alchemy Enhanced API requests
alchemy.core
  .getTokenBalances('0x3f5CE5FBFe3E9af3971dD833D26bA9b5C936f0bE')
  .then(console.log);

// Access the Alchemy NFT API
alchemy.nft.getNftsForOwner('vitalik.eth').then(console.log);

// Access WebSockets and Alchemy-specific WS methods
alchemy.ws.on(
  {
    method: 'alchemy_pendingTransactions'
  },
  res => console.log(res)
);
Enter fullscreen mode Exit fullscreen mode
// my_script.js
import { ThirdwebSDK } from "@thirdweb-dev/sdk";

// instantiate the SDK in read-only mode (our example is running on `polygon` here)
// all major chains and testnets are supported (e.g. `mainnet`, `rinkeby`, `goerli`, 'polygon', 'mumbai', etc.)
const sdk = new ThirdwebSDK("polygon");

// access your deployed contracts
const nftDrop = sdk.getNFTDrop("0x...");
const marketplace = sdk.getMarketplace("0x...");

// Read from your contracts
const claimedNFTs = await nftDrop.getAllClaimed();
const listings = await marketplace.getActiveListings();
Enter fullscreen mode Exit fullscreen mode
  • Moralis SDK: How to connect to a Moralis Server using the Moralis SDK guide.

This is how to initialize the Moralis SDK

import React from "react";
import ReactDOM from "react-dom";
import "./index.css";
import App from "./App";
import reportWebVitals from "./reportWebVitals";

ReactDOM.render(
  <React.StrictMode>
    <App />
  </React.StrictMode>,
  document.getElementById("root")
);
Enter fullscreen mode Exit fullscreen mode

Build projects

ย 
Build projects! I leave a couple of places where you can get inspiration for building projects, but there are way more on YouTube


Build in Public

ย 
Build in Public!

Not a Web3-specific thing, but if you build in public, there are some benefits for you:

  • You get a better understanding of the concepts.
  • You get an audience.
  • You connect with people with the same interests.

All I do is public:
https://github.com/FrancescoXX/free-Web3-resources

Here a video of me followign a tutorial on LearnWeb3 DAO
Image description


Join a Community!

ย 
Last but not least, joining a community can be super useful.

Good examples:

If you are a Content Creator, You can also join 4C, the Cool Community of Content Creators, the community I founded.

We have a specific section for Web3.

If you are still reading, just leave a feedback.


Thank you!

ย 
Thanks for reading!
You can find Francesco here

Top comments (45)

Collapse
 
wadecodez profile image
Wade Zimmerman • Edited on

I just don't understand Web3 the more I think about it.

Can someone explain the incentive/reasoning for Web3 (specifically dapps)? What are the actual benefits of making an decentralized app using the block chain versus a large cloud network such as AWS?

Also apps become decentralized, does that mean corporations lose their stake in apps? Do the apps become autonomous/self-sufficient? If so, isn't that the same thing as a public stock exchange (investors become partial owners)?

Collapse
 
tiguchi profile image
Thomas Iguchi

As far as I am concerned, web3, cryptocurrencies and NFTs are just a pyramid scheme scam, and the crypto-based implementation of blockchains is a convoluted, wasteful solution to a problem no one has. It's all just a grift. So there's really nothing to understand about it. It will crash and fade away into obscurity. And if it doesn't then I truly lose all hope for humanity.

Collapse
 
darkwiiplayer profile image
๐’ŠฉWii ๐Ÿ’–๐Ÿ’›๐Ÿ’š๐Ÿ’™๐Ÿ’œ๐Ÿ’๐Ÿ’Ÿ

Yep. It's snake oil, except the salesman doesn't even know what problem it solves, he just tells you it's "good", because it comes from magic snakes.

Thread Thread
 
toddpress profile image
Todd Pressley • Edited on

Ironically, itโ€™s a beautiful analogyโ€ฆ I can certainly understand why many people are justifiably (although perhaps a bit self-righteously) repulsed by the straw man theyโ€™ve built of web 3.

But because a salesman doesnโ€™t understand his own snake oil doesnโ€™t make it not valuable.

โ€œweb 3โ€ is a concept, not a specification or initiative. So, why not also explore its merit?

Thread Thread
 
darkwiiplayer profile image
๐’ŠฉWii ๐Ÿ’–๐Ÿ’›๐Ÿ’š๐Ÿ’™๐Ÿ’œ๐Ÿ’๐Ÿ’Ÿ

โ€œweb 3โ€ is a concept, not a specification or initiative. So, why not also explore its merit?

Because there is no merit.

Thread Thread
 
toddpress profile image
Todd Pressley

Isnโ€™t there, tho? Seems you accept the notion that โ€œweb 3โ€ is conceptualโ€ฆ so, is it that it is without merit - for any use case whatsoever - or that youโ€™re without sufficient imagination? ๐Ÿคทโ€โ™‚๏ธ

Thread Thread
 
darkwiiplayer profile image
๐’ŠฉWii ๐Ÿ’–๐Ÿ’›๐Ÿ’š๐Ÿ’™๐Ÿ’œ๐Ÿ’๐Ÿ’Ÿ

The only merit web 3 has as a concept is of purely academic nature. It's an interesting concept to think about, but at the end of the day, the downsides make it mostly useless for any real world applications, and the few cases where the unique properties of a public append-only ledger would outweigh its deficits are way too few to reasonably justify migrating the entire web to interact with and support this niche technology.

Collapse
 
vikkio88 profile image
Vincenzo

it is just buzzwords

Collapse
 
thorstenhirsch profile image
Thorsten Hirsch

You don't make a decentralized app if your use-case works with an AWS server. The only valid reason to make a decentralized app is because you couldn't implement that use-case without a blockchain.

Yes, this limits the use-cases for web3 considerably.

Collapse
 
revoltez profile image
revoltez

web3 is just about creating services that are not controlled by central authorities because centralization is most of the time bad, thats it. blockchain is one way of achieving that decentralization and it is really helpful in the case of private chains with big companies not wanting to pay huge amount of money to a middleman, when it comes to public chains we got cryptocurencies and thats where it is unstable and its filled with a lot of subjective premises.

Collapse
 
lschiavini profile image
Lucas Schiavini • Edited on

It all boils down to the principle of Robustness of systems. Have a single point of failure (if all your cloud services are on AWS, if it ever goes down, your business goes with it).

So how do we improve our systems beyond that point?
We can divide among several cloud services, using Oracle Cloud, Azure, Google cloud, so that if one service goes down, you can still recover and offer your products).

Then there's the next level of paranoia on top of it. What if every service goes down? Or all of them become a mafia and just raise prices beyond what's profitable to my business?

That's where DApps have an edge, it runs on the internet and on each computer where the app is installed, the only way for the service to completely be shut down is if the internet itself gets shutdown (or energy, whenever there's a civil war and all that).

Collapse
 
larsonnn profile image
Lars Feldeisen

Tell me one App which would make sense on a blockchain.

Collapse
 
lucaboriani profile image
Luca • Edited on

Uhm, not a big fan of web3 but I think some sort of donation tracker for charities, ngos, political parties, etc could make sense. Maybe not ๐Ÿ˜„

Collapse
 
nombrekeff profile image
Keff

Just don't, waste your time with something usefull and with a future. This is just a waste of time, for you and for the world. I'm sure the article is useful and well thought out though. I just don't see a future for web3 if I'm honest.

Collapse
 
fairolesia profile image
Olesia_Fair • Edited on

Great list, Francesco!
I'd like to add few pretty solid resources.
If you don't know too much about blockchain and crypto, start with Binance Academy.

Finematics is a good YT channel for learning about DeFi and Web3 protocols and how they work.

Podcasts like Bankless and Unchained are good for conceptualizing Web3 and where it's headed. Podcasts like Blockchain Software Engineering Daily, Hashing it Out, and Zero Knowledge Podcast help understand more of the engineering side of things.

Collapse
 
clay profile image
Clay Ferguson

For a while I was interested in "Decentralized Social Media" but then I finally decided "Federated" was acceptable. Here's a little app I wrote that works on the Fediverse....

Quanta - Welcome to the Fediverse

Collapse
 
weptwithoutwit profile image
โšซ๏ธ aha hah • Edited on

"This idealized version didnโ€™t quite pan out due to technological limitations..."0

cope. y'all come & get your sisyphean boulder

just fielding things

Collapse
 
surajondev profile image
Suraj Vishwakarma

Thanks, Francesco to breaking down such a complex domain into simpler formโšก

Collapse
 
francescoxx profile image
Francesco Ciulla Author

you are welcome Suraj! Trying my best to help as many people as possible.

Collapse
 
marcellathorn profile image
MarcellaThorn
Collapse
 
hrodveltz profile image
Adrian Rodriguez

What is the value of putting all the responsibility on a system instead of people? What is the value of transparency on the processes that occurs behind?
What means to you get out of society of the spectacle and start building organizational structures that requires people involvement?
Putting the focus on systems instead of people, that's what blockchain brings to the table.
(I don't like web3 cause is an incorrect nomenclature.)

Collapse
 
perseon profile image
perseon

I'll think I'll pass this version.

Collapse
 
francescoxx profile image
Francesco Ciulla Author

๐Ÿ‘Œ

Collapse
 
mr_destructive profile image
Meet Rajesh Gor

This is really a great read! Thanks for sharing Francesco

Collapse
 
francescoxx profile image
Francesco Ciulla Author

Thank you Meet!

Collapse
 
nicolasbiondini profile image
NicolasBiondini

I love this article! Thank you so much, it helps me a lot!

Collapse
 
francescoxx profile image
Francesco Ciulla Author

thank you so much!

Collapse
 
yongchanghe profile image
Yongchang He

Thank you for sharing this!

Collapse
 
francescoxx profile image
Francesco Ciulla Author

you are welcome!

Collapse
 
joelbonetr profile image
JoelBonetR

Nice recap! This is a must have in the bookmarks ๐Ÿ˜

Collapse
 
francescoxx profile image
Francesco Ciulla Author

thank you Joel!

Collapse
 
sumusiriwardana profile image
Sumudu Siriwardana

This is a great guide, Francesco! Thank you for putting this together!

Collapse
 
francescoxx profile image
Francesco Ciulla Author

you are welcome Sumudu!

Collapse
 
olanetsoft profile image
Olubisi Idris Ayinde๐Ÿ’ก

Great Post.

Thanks for sharing, Francesco.

Collapse
 
francescoxx profile image
Francesco Ciulla Author

Thank you Idris!

๐ŸŒš Browsing with dark mode makes you a better developer.

It's a scientific fact.