The Web3 Full Stack Guide

Here is the primary Web3 full Stack Guide

In Extrimian we want to help you understand all that Web3 can give you. That’s why we bring you a super complete guide with all the tools in the Web3 technology stack.

When building a web or mobile app in the traditional way, we usually turn to a set of building blocks to help us get the job done such as:

API servers / app servers; Authentication Capability (managed or manual); a Database; the File Storage; and on the Client side, Frameworks, platforms and libraries.

But what if I want to understand this from a Web3 point of view, what role does each component have and what kind of tools do I have available?

First we have to take into account that the paradigm on which web2 is based and created, is very different from that of web3. In addition, the tools and ecosystem of the latter are more mature and more developed. But to understand why, we must first define the concept of Web3.

What is web3?

There are infinite definitions, but we will try to take the one that we consider closest to what we believe in, to take as a starting point  

In its essence, Web3 uses blockchain, cryptocurrencies and NFT to give power back to users in the form of ownership. So we can consider that in summary Web3 is a protocol stack that enables fully decentralized applications. It is built, operated and owned by its users. Putting the power in the hands of individuals rather than large corporations.

A few of the core ideas that web3 brings:

Decentralization: Instead of large portions of the Internet controlled and owned by centralized entities, ownership is distributed among its creators and users.

Permissibility and Accessibility: Everyone has equal access to participate in Web3 and no one is excluded. Although it is possible that there may be some limitations in some operations due to the network gas fee (or transaction fee). But this could be solved with the scalability solutions provided by Layer 2, which we will talk about later.

Native payments: use cryptocurrencies to spend and send money online instead of relying on the outdated infrastructure of banks and payment processors.

Web3 is not trusted: it operates using incentives and economic mechanisms, and uses tokens like ETH to send money directly in the browser and requires no trusted third party.

The aforementioned digital native payments and public back-end infrastructure allow building entirely new types of applications, some of which have not yet been imagined.

But this does not mean that web3 will conquer the web or mobile app development market. Yes, it is true that for many applications it is really convenient to build using decentralized technology, it almost always depends on what you are building.

But what kind of categories can I find in the Web3 Stack?

• Blockchain
• Blockchain development environment.
• File storage
• Off-chain data protocols
• API (indexing & quering)
• Identity
• Client (frameworks and libraries)

Defining the Web3 Stack

Web 3 full Stack

1. Blockchain – Layer 1 + Layer 2s + Sidechains –While there are many blockchains to build on, we must understand what are the benefits of each of them.

Some of the most important tools to start developing as a web3 programmer, is to understand Solidity and EVM (Ethereum Virtual Machine). Although Rust is also starting to take some popularity with some blockchains (such as Solana, Polkadot, etc.), although not yet at the level of Solidity.

Taking this and the knowledge we will give you here, you might be ready to start building on different blockchains and sidechains.

Let’s detail below some of the most recognized and technologically valuable blockchains today:

• Ethereum: original smart contract platform.
• Celo: EVM-compatible Layer 1, designed to make it easy for anyone with a smartphone to send, receive and store cryptocurrencies.
• Solana: High performance, cheap transactions, fast block times. Writes smart contracts in Rust (more difficult than Solidity).
• Fantom & Avalanche: Both are layer 1 compatible with EVM.
• Cosmos: Is an ecosystem of interoperable blockchains.
• Polkadot: Blockchain-based computing platform that allows blockchains built on top of it to execute transactions with each other, creating an interconnected internet of blockchains.
• Tezos: Layer 1 not compatible with EVM. It is used by many NFT projects lately.
• NEAR: Layer 1 blockchain that can write smart contracts in Rust or Assembly Script.
• ZK rollups = ZKSync, Starknet: Layer 2 of Ethereum high performance, but not natively compatible with EVM.
• Optimism rollups = Arbitrum & Optimism: Layer 2 of Ethereum, compatible with EVM. 
• Polygon: Ethereum sidechain.

2. Blockchain development environments

For EVM development, there are some good development environments available:

• Brownie is a Python-based development and testing framework for smart contracts for Solidity / EVM development.
• Anchor is fast becoming the entry point for new developers for Solidity development. It provides a CLI (Command Line Interface) for scaffolding, building and testing Solana programs. It also provides client libraries that can be used for building front ends, and a DSL (digital subscriber line), which isolates various complexities that developers often encounter when getting into Solana development and handling Rust.
• Hardhat (JavaScript) is a newer option, but one that is gaining more and more popularity. Their docs are great, the tools and developer experience are polished, and it’s what I’ve personally been using to build dapps.
• Truffle (JavaScript) is a toolset for building and developing apps in the EVM. It is mature, proven and well documented. It has been around for a while and many developers use it.
• Foundry is a new Solidity development environment from Paradigm that promises a lot. Highlights include the ability to write tests in Solidity, support for fuzzing and speed (it is written in Rust).

3. File storage

We already know that storing very large files on a blockchain is a problem for us. So, you probably wondered how to store files on web3. 

Well, to solve this kind of issues, there are some “file storage” protocols that we can use. Let’s see some examples:

• Arweave: It gives us the possibility to deposit our files permanently, paying a single transaction fee.
• Filecoin: Developed by Protocol Labs, Filecoin is a protocol designed to provide a persistent data storage system. It includes a web3.storage that is very pleasant to use.
• Skynet: This is an open protocol used for data hosting and web applications. It uses Sia,
• IPFS: Also developed by Protocol Labs, this is a p2p (peer-to-peer) file system protocol. The good thing about IPFS is that it is reliable, well documented and has a great ecosystem. But the bad thing about this protocol is that if the data is not anchored it can be lost.

4. Off-chain data protocols

In addition to file storage and on-chain storage, you may also need to store data off-chain. You can use these types of solutions in a similar way as you would a database in a traditional technology stack, but instead they replicate across a number of nodes in a decentralized network, and are therefore more reliable (at least in theory). Let’s review some alternatives:

• Ceramic Network: a decentralized open source platform for creating, hosting and sharing data. Ceramic also has a great identity protocol (to be discussed later).
• Textile ThreadDB: This is a multi-party database built on top of IPFS and Libp2p that provides an alternative architecture for data on the web.
• GunDB: This is a decentralized p2p database. GUN is a small, easy, and fast protocol for syncing data. And because this API is small, it can be added to your app to improve a single feature.

There is still a long way to go in this segment. One of the biggest problems to solve is the handling of real-time data, and without going any further, the overall experience of developers using these solutions.

5. API (indexing & querying)

The Graph is a decentralized protocol for indexing and querying blockchain data, which makes it easy to collect, process and access relevant information that is difficult to query directly and expose it through open APIs based on GraphQL. These APIs are called subgraph and can tailor their utility to the needs of a particular application.

The Graph is a great tool as it overcomes the initial technological barrier for developers to start getting into the Web3 space. Anyone can build and publish open GraphQL APIs, called sub graphs, making it easy to query blockchain data.

The big drawback of this API is that, so far, The Graph has focused primarily on building its Ethereum and IPFS data stores.

6. Identity

Web3 and the concept of Decentralized Identity have the same objective: to promote more transparent, private and reliable information exchange schemes, without ceding our digital sovereignty to large power groups that currently own our private data.

As on Web3 , decentralized identity is based on blockchain technology. It is through this technological layer that the authenticity of the personal and private information that is shared is validated, thus enabling an ecosystem and a flow of trust between the parties involved, and returning control of personal data and identity to the users.

ID Wallets are, in essence, applications installed on users’ personal devices that allow users to securely and privately store all their identity information. In this way, users’ personal data is only guarded by the users themselves, avoiding the presence of an entity in the middle that takes control of that information and stores it in its centralized database. This means that there is no longer a central authority or hyper-identity provider that controls this personal data. In this way, then, we could solve or prevent the privacy risk suffered by users’ personal data in centralized models, while eliminating the unauthorized use of their personal data.

But what does a developer need to know to understand in a simple way the process flow, and the control involved in this Web3 Identity technology?

Initially, a very common process is to request access to the user’s wallet. So, to do this you can typically access the user’s wallet in the context of the window context (web browser), or by using tools such as Wallet Connect or the Solana Wallet Adapter.

For example, if they have an Ethereum wallet available, they will be able to access window.ethereum. The same for Solana (window.solana), or Arweave (window.arweaveWallet), and so on with several more examples. In the case of Wallet Connect it is ideal for mobile web and React Native, because it allows the user to authorize the use of their mobile wallets, giving access directly from the device.

If instead you prefer to handle the authentication yourself without delegating it to the user, you can have the user sign a transaction that will then be decoded elsewhere to authenticate him. But for this, we require a server. It is not so “practical” anymore.

A very interesting case in terms of decentralized protocols in the field of Identity is the Ceramic Network. Ceramic Self.ID is a simple SDK ( Software development kit), which requires minimal configuration and provides access to the full Ceramic stack with support for popular environments such as React and web. It supports Ethereum accounts and EVM-based wallet authentication, so users don’t have to install new wallets or create new accounts to use Ceramic, but could even connect multiple wallet accounts to their Ceramic account if they wanted to. On their blog they detail in a series of documents, the tools they have, and how to start building with Ceramic self.id.

Both Ceramic Self.ID and SpruceID, implement the DIDs (W3C Verifiable Credentials) specification.

7. Client

Nowadays many projects are built with React, and more and more libraries offer utilities for this programming language. This is the case, for example, of Solana Wallet Adapter. So as we said initially, we recommend training in React.

For client-side SDKs in Ethereum, there’s web3.js and ethers.js. Finally in Solana, you’ll probably be working with @solana/web3.js or Anchor.

Wrapping up

Like everything in the web3 ecosystem, this article is in constant evolution and modification. Every day a new technology or novelty that this technology allows to develop is added.

From Extrimian we want to promote the development of new applications and decentralized protocols and that is why we provide solutions and APIs that are at your fingertips and make it easier for you to carry out that idea that is going around in your head.

If you have questions, suggestions or you think there is a key app that we overlooked in this article, please contact us. Let’s keep building in a democratic and decentralized way.