Lesson 1: Discovering Another Aspect of DApp Development

Welcome to a new side of Solana DApps! Here, we'll focus on how users interact with the smart contract. We'll set up wallet connections on the user's side using two tools: Anchor and Next.js.

Remember Anchor? We've covered it in earlier lessons.

We've already learned about using Solang Solidity, which lets us create and send Solana tokens. Now, we're going to build a complete setup – we'll connect a user interface (UI) to our Solana program, so people can easily use it.

Here, we can use different types of templates and tools to make this happen.

• solana-dapp-scal: This Solana dapp scaffold provides pre-made hooks and state management utilities for building Solana dApps and interacting with the blockchain. (We're using this for this dapp.)
• create-sol-dapp: This is an npm package that provides a template to build the UI for your Solana dapp.

Just like a regular website needs a user interface, we need a way for users to interact with the Solana blockchain.

How to Connect with the Blockchain →

Solana uses something called JSON RPC, which is like a special set of commands, to talk with the blockchain. We use a library called solana-web3js to send these commands easily.

In this library, there's a Connection object. Think of it as a messenger that knows where to send your commands. It needs a Cluster – a kind of Solana network – to work.

Remember, we've learned about Solana clusters like devnet, testnet, and mainnet in previous lessons. The Connection Object uses these clusters.

Anchor provides a Wallet object, which needs a key pair (like a secure ID) to sign off transactions. But there's more – it also has a Provider object. This combines the Connection and the Wallet, and it automatically signs your transactions with your wallet. This makes it easy to use the Solana blockchain with a wallet.

Program, Provider, Wallet - these are key to integrating contracts.

Setting up and customizing our Solana DApp

We've set up the full environment for our DApp. Now, we'll tweak the Solana DApp scaffold (a basic framework) to fit our needs. We'll also show you how to configure the front end with Next.js.

Next, we'll modify and create parts of our DApp for token minting and managing token accounts. This includes creating tokens in your wallet and then sending them to a friend's wallet.

Finally, we'll explore the essential parts of frontend Solana programs, like connecting to the cluster and wallet through Anchor, handling program objects, making RPC calls, and sending instructions and transactions to our Solana program on the cluster.