Ethereum with Solidity, React & Next.js - The Complete Guide

Build Smart Contracts in Solidity and Web3 DApps with React/Next. Learn Ethereum, Polygon, Solana, Hardhat and Ganache.

What is this course covering?

The course covers everything you need to become a blockchain developer. Students of this course will learn what Ethereum blockchain is and how it works on the base level and from a developer's perspective.

Students will learn what smart contracts are and how to create them. Smart contracts are going hand in hand with dApps(decentralized apps). The course covers them as well.

The front end for dApps covered in the course use React library and Next JS framework. CSS and design are built with the help of Bulma and Tailwind frameworks.

Three real-world applications are created in the course.
Faucet Application: This straightforward app encompasses React JS, Solidity, and Ganache. It provides an introduction to the fundamentals.

Marketplace: This advanced application involves Next JS, Solidity, and Ganache, along with deployment to an actual blockchain.

Adopt Pet: A bonus section focusing on React JS, this section utilizes Hardhat to manage the smart contract and deploys it to the Polygon network.

Solana NFT Minting App: This bonus section teaches you to build an NFT minting application on Solana using React, TypeScript, and the Metaplex Umi framework. You'll integrate Solana wallet adapters, create NFT metadata, and mint tokens on the Solana devnet.

Every part of application creation is well explained and documented.

Faucet application:
The initial application in the course provides students with a hands-on experience to learn the fundamentals and core concepts of the Ethereum network.

The application's frontend is developed using the React library and the Bulma framework. The Truffle development environment and Ganache (a private blockchain) are utilized for smart contract creation.

The faucet application allows users to donate and withdraw funds from the smart contract. Users can interact with the smart contract through a website connected to the blockchain network via the Metamask wallet.

The primary objective of this first application is to provide a practical learning experience while covering the basics in an enjoyable manner.

The application addresses several essential questions, including:

• Understanding Ethereum, transactions, and the blockchain.

• Exploring the EVM (Ethereum Virtual Machine) and its components like bytecode and storage.

• Learning how to create smart contracts and decentralized applications (dapps).

• Discovering the process of integrating smart contracts with React.

  
  

Marketplace application:

This application focuses on building an interactive marketplace where clients can purchase courses using Ether digital currency, allowing students to select their preferred products.

Having covered the basics in the previous application, the emphasis now shifts toward practical development within the Ethereum network. The topics become more challenging, and the lectures revolve around practical coding aspects.

The second application encompasses various features, including a marketplace page that displays real-time updates of Ether currency and course prices compared to the US dollar. Additionally, there is a dedicated modal window for placing orders, an email hashing solution to safeguard client privacy, an order view with filtering and pagination options, and more.

For the development of this application, the Next JS framework is employed, with Tailwind serving as the CSS framework. Next JS internally utilizes the React library, offering ease of use and default server-side rendering (SSR) capabilities.

While SSR brings numerous benefits, it also poses some challenges regarding integration with the blockchain. However, the entire integration process of Next JS with the blockchain is comprehensively covered, explained, and documented. The final application will be deployed on the Internet, and the smart contract will be deployed on the live Sepolia Test Network.

The notable topics covered in this application include:

• Integrating Next JS (with SSR) with Web3 and the blockchain.

• Developing a more complex smart contract.

• Implementing email hashing and order verification features.

• Providing a testing solution that covers every aspect of the smart contract.

• Enabling pagination and filtering for orders.

Adopt Pet Application:

As an additional component, this section consolidates the knowledge you have acquired in the course and applies it to a React JS app. Hardhat is utilized for smart contract management, ensuring a clean and straightforward application architecture.

The emphasis is on minimal design and simplicity. By the end of this section, you will have the opportunity to deploy a smart contract to the Polygon blockchain.

What is Ethereum?

Ethereum is a technology that lets you send cryptocurrency to anyone, but in the first place, It also powers applications that everyone can use, and no one can take down. It's the world's programmable blockchain.

Ethereum builds on Bitcoin's innovation, with some big differences.

Both let you use digital money without payment providers or banks. But Ethereum is programmable so that you can use it for many digital assets – even Bitcoin!

This also means Ethereum is for more than payments. It's a marketplace of financial services, games, and apps that can't steal or censor your data. It's the Future.

What is Solidity?

Solidity is an object-oriented, high-level language for implementing smart contracts. Smart contracts are programs that govern the behavior of accounts within the Ethereum state.

Solidity is a curly-bracket language. It is influenced by C++, Python, and JavaScript, and is designed to target the Ethereum Virtual Machine (EVM).

Solidity is statically typed and supports inheritance, libraries, and complex user-defined types, among other features.

With Solidity, you can create contracts for uses such as voting, crowdfunding, blind auctions, and multi-signature wallets.

Solana NFT Minting App (Bonus Section):

This bonus section introduces you to building NFT applications on the Solana blockchain. You'll create a React-based minting app using TypeScript and the Metaplex Umi framework, allowing users to connect their Solana wallet, upload artwork, and mint NFTs directly on the Solana devnet.

Key topics covered:

• Integrating Solana wallet adapters with React

• Building NFT minting workflows using Metaplex Umi SDK

• Creating NFT metadata following Solana standards

• Handling blockchain transactions and wallet signatures

• Working with decentralized storage for NFT assets

By completing this section, you'll expand your Web3 development skills beyond Ethereum and gain practical experience with the high-performance Solana ecosystem. This broadens your ability to build NFT applications across multiple blockchain platforms.