Dapp Architecture (an Overview):
Here in the years 2021 and 2022, web development and app development grow to the next stages called "Web 3" and "Dapp."
Web3 is described as the next evolution of the Internet, and the term "dApp" expands "Decentralized Applications."
These both have the same place for running, called blockchain, and web3 is easy when you understand the web development process.
Here we'll see about the dApp and how the dApps work.
A dApp runs like a normal application but has some additional features to run and provides decentralized services. Let's see the anatomy of dApp.
Frontend app, Ether.js / Web3.js, Rainbowkit, Infura, Metamask / Coinbase wallet, Subgraph, IPFS, and Testnet / mainnet are some of the technologies used.

These are the components of a dApp architecture.
In this,
Frontend apps play a vital role in this architecture. The frontend app makes connections to Ethers.js, Subgraph, and Web3 storages like IPFS and Rainbow Kit.
Rainbowkit holds the second-vital role in this architecture. It is a react-based library for integrating digital asset wallets into web3 frontends (similar to middleware). It connects the front end, Wallet, and a node provider such as Infura here.
Ethers.js, a JS library that helps to interact with the blockchain, is used to call functions from the smart contract.
Networks like Goerli and Mumbai Matic were connected to Infura, and these networks get confirmed by the ether. js
The wallet is an application that helps select the networks, approves the transaction, and acts as a middleman to connect the front end and the user.
Infura, the node provider helps connect the testnet and mainnet networks to the wallet.
Subgraph is an indexing tool that takes data from the blockchain and stores it as entities, which helps to serve the data at fixed time intervals.
Web3 storage, like IPFS and Filecoin, decentralizes the storage of data from the front end.
These are the factors that make the dApp and the process appear to be lengthy when explained, but in reality, we are done in a matter of seconds.
I hope this new thing will help you understand the architecture of dApp.
