Ready to start your Web3 development journey?
→ Download our guide to developing smart contracts

A Comprehensive Guide to the Web3 Stack for Developers

In the internet today, users are the products whose data is farmed out for profit. But thanks to Web3, the internet is returning to its more egalitarian origins.

Type
Deep dive
Topic(s)
Published
October 10, 2022
Author(s)
Content Marketing Manager
The Web3 Stack
Contents
Copy link

Web3 is an open-source internet in which users have ownership of their data and permissionless access to applications without going through intermediaries. Instead of going through centralized intermediaries, blockchain-powered decentralized programs drive peer-to-peer trustless economic networks for exchanging value and information.

Web3 hopes to reduce the influence and power of centralized monopolies and make the internet a more democratic place. In this guide, we describe the different components of the Web3 stack to demystify Web3 app development.

The Internet (R)evolution: From Web1 to Web3

To understand Web3 and what it means for the future of the internet, let’s take a step back in time to understand how the internet has evolved.

  • Web1 (~1989 - 2004): read — The internet functioned as a portal of static web pages that presented information to the public in “read-only” formats. Web1 users could consume content but couldn’t interact with it, or with each other.
  • Web2 (~2005 - 2020): read-write — Web users evolved from being “readers” to “creators”, and websites evolved from being “read-only” static information portals to “read-write” platforms through which users could consume, create, and interact with information, and with each other.
  • Web3 (~2021 - present): read-write-own — The internet is transforming from “read-write” platforms to “read-write-own” networks. Now “users” and “creators” are also “owners”, of their own data but also often of the very platforms and apps they use. Web3 enables networks to align incentives with their users, so both participate in the rewards of growth and market adoption.

As a developer, building Web3 apps for this new paradigm may seem daunting because the underlying blockchain technology is new and complex, but if you know how to build Web2 apps, you already have the foundational knowledge. For developers interested in building the next generation of web applications, this post provides a comprehensive introduction to the Web3 stack.

What Is the Web3 Stack for Developers?

A tech stack refers to all of the technology and services used to build an application. A tech stack generally includes components like development frameworks, programming languages, and technical infrastructure. The six main components of the Web3 tech stack for decentralized applications are:

  • Blockchain
  • Smart contracts
  • Development environment
  • Testing frameworks
  • User identity management
  • UI/UX components

Blockchain: The Foundation for Web3 Apps

The blockchain is the foundation for the Web3 tech stack, and in order to interact with a blockchain, developers will use an application programming interface (API) that enables their app to query information and broadcast transactions to the blockchain network.

Luckily for developers, there are many different blockchain options for developers to choose from. Those options have different tradeoffs, ranging from different programming languages, varying levels of security, contrasting approaches to consensus, and more.  

In Web2, the equivalent of the blockchain layer is the operating system, with the most dominant being iOS, Android, macOS, Windows, Linux, and WebOS. The operating system often influences both the design and implementation decisions that developers make when designing Web2 applications, and the same is true with how the blockchain layer influences the applications built on top of it. 

As a result, the blockchain that serves as the foundation of a Web3 app has important ramifications for the adoption and success of the project. Here are some of the options developers can choose from:

Building on Bitcoin

Bitcoin is the most dominant blockchain in terms of adoption and market capitalization, and it is gradually evolving to support Web3 apps. Developers who want to build Web3 apps for Bitcoin can build them through the Stacks blockchain, which functions as a programmable layer for Bitcoin. Through Stacks, developers can build applications that tap into nearly $370 billion of latent capital locked in the Bitcoin ecosystem, as well as build on the most secure and decentralized blockchain released to date.

Building on Ethereum

Ethereum is the first smart contract platform, and as a result, a large number of decentralized applications run on Ethereum today. Ethereum has the largest developer community out of any blockchain and an even larger community of users. As a result of its popularity, many alternative blockchains to Ethereum are still compatible with Ethereum and the Ethereum Virtual Machine, such as Solana, Avalanche, and Fantom, which makes it easier to bridge applications between those blockchains.

Building on Other Blockchains

Beyond Bitcoin and Ethereum, there are other blockchain platforms such as Solana, Cosmos, and Polkadot on which developers can build Web3 applications using different programming language implementations, including Python, JavaScript, and Rust, among others. However, for the sake of brevity, we will limit our exploration of the Web3 stack in this article to Bitcoin and Ethereum, the two largest blockchains.

Smart Contracts: The Code for Web3 Apps

After the blockchain, the next most important component in the Web3 stack is smart contracts. A smart contract refers to a program stored on a blockchain that is designed to be self-executing when predetermined conditions are met. What makes them “smart” is their self-execution: these programs do not have administrators or controllers—they are fully autonomous code.

Since Web2 applications are centralized, there is no need for the autonomous, self-executing functionality of smart contracts. Therefore, the closest “equivalent” to the smart contract layer is the actual code of the applications themselves. 

There are many different programming languages for writing software code. Developers choose programming languages based on the type of application they intend to build, their technical sophistication, and their personal preferences. The same is true for smart contract programming languages for Web3 applications. However, it’s worth noting that the choice of programming language is often dependent on the blockchain layer chosen.

Smart Contract Development in the Bitcoin Ecosystem

The Bitcoin ecosystem didn’t originally start out with smart contracts because Bitcoin had a limited scripting language by design. The arrival of the Stacks blockchain provided Bitcoin with a smart contract layer, and now, developers can create and use smart contracts for Bitcoin to build apps on the most secure blockchain.

Clarity Programming Language

To write smart contracts for Bitcoin, developers use the Clarity language, an open-source programming language that is optimized for security and predictability. Clarity is heavily influenced by LISP and benefits from the time-tested strengths of other LISP-like languages, such as brevity, being easier to reason about, and better composability.

Overview of Bitcoin’s Smart Contract Traction

Since the launch of the Stacks blockchain, Clarity has grown in popularity for the development of smart contracts and dApps. More than 7,500 smart contracts have already been written in Clarity and deployed on the blockchain. Some live Web3 applications written with Clarity include Arkadiko, CityCoins, Gamma, and dozens more.

Smart Contract Development on Ethereum

Ethereum popularized the idea of smart contracts by providing the first programming language to write them and a blockchain network on which they can be deployed. Ethereum is currently the most dominant smart contract platform, but its first-mover advantage is declining as it grapples with high transaction costs and scalability challenges.

Solidity Programming Language

Solidity is Ethereum’s programming language for writing smart contracts. Solidity is an object-oriented programming language with a syntax inspired by C++. The influence of C++ on Solidity’s syntax is apparent in concepts such as for loops, overloading functions, and variable declarations, among others. Solidity is specified for the Ethereum Virtual Machine (EVM) and code written in Solidity must be compiled to EVM’s bytecode before they can run. This means that the language is not human-readable once deployed on the blockchain.

Overview of Ethereum’s Smart Contract Traction

Ethereum currently leads other blockchains in the development of smart contracts (it has had a several-year head start after all). Electric Capital’s 2021 Developer Report observes that between 20% and 25% of new Web3 developers start out on the Ethereum blockchain. Some of the most popular Web3 applications, such as Uniswap, OpenSea, and Compound Finance, launched on Ethereum.

The Development Environment for Web3 Apps

The development environments in Web3 are not that different from what you may be used to in Web2. Most integrated development environments (IDEs) have built plugins to enable developers to write smart contract code even more easily.

Bitcoin Web3 Development Environment

Clarinet is the development environment for writing smart contracts and building Web3 applications on the Stacks blockchain for the Bitcoin ecosystem. It is designed to ease you into the world of smart contracts without much friction. 

Clarinet is a local Clarity language runtime packaged as a command-line application for smart contract development, testing, and deployment. Once installed, you can use Clarinet to create a new project, add new contracts to your project, check the syntax of your contracts, measure cost coverage, and make cost optimizations, among many other features.

The Clarity for Visual Studio Code plugin provides a familiar IDE experience for writing smart contract code in VS Code. The plugin provides syntax assistance and debugging features for Clarity smart contracts. Clarity VS Code natively supports auto-complete functionality and enables you to check your contracts and display errors inline.

Ethereum Web3 Development Environment

Setting up a development environment on Ethereum might seem daunting simply because there are many different options. Ethereum’s development environments include:

Remix is an open-source tool for creating smart contracts and building Web3 applications with Solidity. Remix functions both as a compiler and IDE, and it is available as a browser and a desktop application that you can run locally. Remix also provides educational modules for learning the Solidity programming language.

Truffle is a development environment for writing smart contracts for Ethereum and other blockchains with EVM compatibility. Truffle is outfitted with smart contract compilation, code linking, binary management, and contract deployment.

Embark is a framework that you can use to develop and deploy dApps on Ethereum, EVM chains, and decentralized storage networks such as IPFS and Swarm.

Hardhat is an Ethereum development environment that provides a one-stop shop for writing, compiling, and debugging smart contracts. You can also leverage its flexibility to automate recurring tasks when writing your smart contract code.

The Testing Environment for Web3 Apps

Web3 applications don’t exist in isolation; they have logic that interacts with the network, including the blockchain’s global state, decentralized storage systems (more on that in a bit), and other types of data. 

When you create a Web3 app, you not only need to test it in a local environment but in one that simulates real-life data sources from the blockchain, a testnet. A testnet refers to an instance of a blockchain that allows a Web3 app to interact with live blockchain data but without the finality and immutability of live blockchain transactions.

The Web2 equivalent of a testnet is the pre-deployment testing in a staging environment when apps are tested for compatibility, performance, stress, security, and usability. Pre-deployment testing is typically done via testing solutions such as Google App Engine or Selenium.

Stacks Testnet for Bitcoin

The Stacks testnet is a staging environment for testing Web3 applications built for the Bitcoin ecosystem. The Stacks testnet produces blocks at almost the same pace as the mainnet, and it maintains a network history similar to that of the Stacks mainnet. The Stacks testnet also includes a testnet faucet that provides test Stacks (STX) tokens to enable transactions on the testnet. The users on the testnet can use the faucet tokens to try all the app’s features without risking tokens with real-world value.

Ethereum Testnets

Ethereum offers multiple testnets to developers, and Rinkeby is one of the most popular options. It has a block time of about 15 seconds, similar to the block time on the Ethereum mainnet, and developers can get Rinkeby Faucet tokens to get ‘fake’ ether to test out gas prices, transactions times, and other parameters on their apps without having to spend real money during the test process. Other Ethereum testnets include Kovan and Ropsten.

File Storage Solutions for Web3 Applications

Apps generate data, and that data needs to be stored somewhere. Developers of both Web2 and Web3 applications need file storage, and different storage options can have different prioritizations of scalability, availability, and usability.

Web3 apps on Bitcoin, Ethereum, and other blockchain networks can use the same decentralized file storage options to securely store their data. With decentralized storage, you can significantly reduce downtime risks and ensure consistent availability because millions of computers serve as nodes to deliver content as needed. Decentralized file storage solutions make your Web3 apps more resistant to censorship because it is difficult to shut down decentralized and distributed servers. Decentralized file storage includes:

  • IPFS is a distributed file system designed to help store and access data across a peer-to-peer network. IPFS empowers developers to store, timestamp, and secure large files without having to put the data itself on-chain.
  • Arweave takes the idea of decentralized file storage further by ensuring the permanence of data. Arweave is building a permaweb, managed by a global community of users and developers who are incentivized to maintain the data storage layer.
  • Gaia is a decentralized storage platform available to developers building apps on the Stacks blockchain. The transactional metadata of the apps is stored on the blockchain itself, while user application data is stored in Gaia to ensure that users enjoy high performance and availability.

Developers can also use centralized storage solutions like Google Cloud or Microsoft Azure (commonly used in Web2 apps) to manage their storage needs. If you choose a centralized storage solution, you can generally expect cheaper costs relative to on-site self-storage and decentralized options. You also get a solution that is optimized for performance. Centralized storage comes with product features like automated server-load balancing and extensive customizations to optimize app performance.

Identity Management in Web3 Applications

In order to fully realize the read-write-own promise of Web3, developers need a new way of managing digital identity for their users. Whether you are building DeFi apps, NFTs, DAOs, or other decentralized use cases, you need a way to identify your users.

Fundamentally, identity management revolves around user authentication and authorization to ensure that the right users have the correct privileges within the app and can access their accounts. Digital identity is critically important for the security and reliability of any application.

In Web1 applications, users needed to provide a unique login and password to identify themselves and access each application they used. Users were encouraged to have different passwords for every website for security. Good luck remembering 50 different passwords!

In Web2 applications, big tech companies, such as Google and Facebook, addressed that pain point and extended the portability of users’ identities to other apps. In many Web2 apps, users can leverage their Google or Facebook identities as credentials to sign in to other applications, but that ease comes with risk. If your Google account is hacked, for example, that could mean multiple accounts are compromised.

In Web3 applications, user identity is managed by wallets. A wallet is a unique address on a blockchain that provides a user with an identity and a place to store their digital assets. Wallets serve as a means of establishing users’ identities using public-private key cryptography. Public keys are used to encrypt data, and private keys are used to decrypt them. The possession of the correct combination of the public and private keys establishes the identity of the user.

Wallets also serve as the primary medium of interaction. They enable users to:

  • Buy, hold, and sell digital assets
  • Send and receive digital assets from other accounts
  • Connect to apps

In the Bitcoin ecosystem, users have many wallets they can choose from, including the Hiro Wallet, Boom Wallet, and Xverse Wallet. In the Ethereum ecosystem, users can choose from MetaMask, Rainbow, and MyEtherWallet, among others. In both ecosystems, these wallets are available as a combination of browser extensions, mobile applications or desktop applications.

The UI/UX for Web3 Apps

The user interface and experience design define how users interact with applications on the frontend. In Web3, that user interface is fairly similar to what you’ll find in Web2. Developers will often use HTML to structure the app, CSS for styling, and React for interactive elements, regardless of whether the app is built on Bitcoin, Ethereum, or a different blockchain altogether.

Similar to how, in Web2, an email or phone number can be used for identity management, in Web3, the user's wallet address is used for identification and authorization.

image

Most blockchains have Javascript libraries with general purpose commands for building applications and managing the user experience.

For Bitcoin, you can use the Stacks.js library to access a wealth of resources for managing  identity, authentication, storage, transactions, and more on the Stacks blockchain.

On the Ethereum network, Web3.js or Ether.js, are general-purpose libraries that you can use to manage the user experience of your Web3 app for access to local or remote Ethereum nodes.

Start Building the Decentralized Future Today

In a vacuum, it’s difficult for individual developers or entrepreneurs to build Web3 applications that can viably compete with existing Web2 incumbents—think about the technical, economic, and social resources that would be needed to build a Facebook competitor from scratch.

However, the permissionless nature of Web3 means that there are lower barriers to entry, and independent developers can easily collaborate to build Web3 applications that create entirely new paradigms. By contributing to existing or building new Web3 applications, you can advance the evolution of the internet toward open, transparent, and democratic ownership.

The Web3 stack for dApps has familiar origins in the technology stack for Web2 apps, and if you already know how to build Web2 applications, you can easily become a Web3 developer.

Ready to kickstart your development journey into Web3? Download our free guide to developing smart contracts.

Download the Guide
Copy link
Hiro news & product updates straight to your inbox
Only relevant communications. We promise we won’t spam.

Related stories