Solana Smart Contract Tutorial: Using Phantom Wallet to create a DApp | React, Anchor
In this video we will learn how to use the Solana's wallet adapter library to safely retrieve your user's Phantom wallet (or any Solana wallet) and then make transactions for them to your Solana Program by creating a very simple React.js application.
This video will assume some understanding of creating a Solana Smart Contract using the Anchor Framework from my previous video:
https://www.youtube.com/watch?v=CmG5_sIas1Q
📙 Solana Playlist: https://www.youtube.com/watch?v=-AAtfPHEMbA&list=PL53JxaGwWUqCr3xm4qvqbgpJ4Xbs4lCs7
💰 Donations accepted (but optional): 2hYca42EE2kwmFZPV7M4skev1za7atWBh5ctzQWfsTD7
00:00 - Intro
00:12 - Video Overview
01:48 - Installing Phantom Wallet
02:02 - React Crash Course
05:04 - Learning about the Solana Wallet Adapter
06:45 - Setting up the wallet adapter for your front end
13:42 - Using the wallet adapter for your front end
14:47 - Anchor Setup Overview
16:38 - Setting up an anchor project to generate an IDL JSON file
22:02 - Frontend Overview to use Phantom Wallet
22:57 - Setting up the Front End Starter Project
27:09 - Importing the IDL JSON file
28:17 - Implementing getProvider
33:25 - Implement Sending Transactions Part 1
44:55 - Airdropping SOL to test initialization transaction
47:05 - Implement Sending Transactions Part 2
Resources:
Phantome Wallet:
https://phantom.app
Solana Wallet Adapter Github:
https://github.com/solana-labs/wallet-adapter
Starter Project:
https://github.com/solana-labs/wallet-adapter/tree/master/packages/starter/create-react-app-starter
https://github.com/solana-labs/wallet-adapter/blob/master/packages/starter/create-react-app-starter/src/index.tsx
https://github.com/solana-labs/wallet-adapter/blob/master/packages/starter/create-react-app-starter/src/App.tsx
WalletAdapterNetwork:
https://github.com/solana-labs/wallet-adapter/blob/master/packages/core/base/src/types.ts
Wallets to integrate :
https://github.com/solana-labs/wallet-adapter/tree/master/packages/wallets
Wallet Adapter for React:
https://github.com/solana-labs/wallet-adapter/tree/master/packages/core/react
@solana/wallet-adapter-react-ui:
https://github.com/solana-labs/wallet-adapter/tree/master/packages/core/react
Anchor Installation Instruction:
https://project-serum.github.io/anchor/getting-started/installation.html
Anchor Github Project:
https://github.com/project-serum/anchor
Helpful Fullstack Example:
https://dev.to/edge-and-node/the-complete-guide-to-full-stack-solana-development-with-react-anchor-rust-and-phantom-3291
Видео Solana Smart Contract Tutorial: Using Phantom Wallet to create a DApp | React, Anchor канала Josh's DevBox
This video will assume some understanding of creating a Solana Smart Contract using the Anchor Framework from my previous video:
https://www.youtube.com/watch?v=CmG5_sIas1Q
📙 Solana Playlist: https://www.youtube.com/watch?v=-AAtfPHEMbA&list=PL53JxaGwWUqCr3xm4qvqbgpJ4Xbs4lCs7
💰 Donations accepted (but optional): 2hYca42EE2kwmFZPV7M4skev1za7atWBh5ctzQWfsTD7
00:00 - Intro
00:12 - Video Overview
01:48 - Installing Phantom Wallet
02:02 - React Crash Course
05:04 - Learning about the Solana Wallet Adapter
06:45 - Setting up the wallet adapter for your front end
13:42 - Using the wallet adapter for your front end
14:47 - Anchor Setup Overview
16:38 - Setting up an anchor project to generate an IDL JSON file
22:02 - Frontend Overview to use Phantom Wallet
22:57 - Setting up the Front End Starter Project
27:09 - Importing the IDL JSON file
28:17 - Implementing getProvider
33:25 - Implement Sending Transactions Part 1
44:55 - Airdropping SOL to test initialization transaction
47:05 - Implement Sending Transactions Part 2
Resources:
Phantome Wallet:
https://phantom.app
Solana Wallet Adapter Github:
https://github.com/solana-labs/wallet-adapter
Starter Project:
https://github.com/solana-labs/wallet-adapter/tree/master/packages/starter/create-react-app-starter
https://github.com/solana-labs/wallet-adapter/blob/master/packages/starter/create-react-app-starter/src/index.tsx
https://github.com/solana-labs/wallet-adapter/blob/master/packages/starter/create-react-app-starter/src/App.tsx
WalletAdapterNetwork:
https://github.com/solana-labs/wallet-adapter/blob/master/packages/core/base/src/types.ts
Wallets to integrate :
https://github.com/solana-labs/wallet-adapter/tree/master/packages/wallets
Wallet Adapter for React:
https://github.com/solana-labs/wallet-adapter/tree/master/packages/core/react
@solana/wallet-adapter-react-ui:
https://github.com/solana-labs/wallet-adapter/tree/master/packages/core/react
Anchor Installation Instruction:
https://project-serum.github.io/anchor/getting-started/installation.html
Anchor Github Project:
https://github.com/project-serum/anchor
Helpful Fullstack Example:
https://dev.to/edge-and-node/the-complete-guide-to-full-stack-solana-development-with-react-anchor-rust-and-phantom-3291
Видео Solana Smart Contract Tutorial: Using Phantom Wallet to create a DApp | React, Anchor канала Josh's DevBox
Показать
Комментарии отсутствуют
Информация о видео
Другие видео канала
Solana Whitepaper Artchitecture Reaction ft. @the.york.weiValid Parentheses Leet Code Problem ExplainedClimbing Stairs Interview Question Explained | Top Down Dynamic Programming | JavaBuilding a Web3 Reddit using Solana Smart Contract sCoin Change Interview Question Explained | Bottom Up Dynamic Programming | JavaVisual Intro: Best Time to Buy and Sell Stock | Coding Interview Question and Answer Study GuideRemove Duplicates from Sorted List II LeetCode Question Explained | Linked List SolutionLongest Increasing Subsequence Explained | Bottom Up Dynamic Programming | JavaTwo Sum LeetCode Question Explained | Full Map Solution WalkthroughK Closest Points to Origin Leet Code Question Explained | Sorting and HeapsUnique Paths 2 LeetCode Question | Top Down Memoization SolutionSOLdit Whitepaper: The Future of Social Media using the Solana Blockchain (Parody)Implement Trie (Prefix Tree) LeetCode Question ExplainedCardano Plutus Project Starter Fix | Plutus Playground Smart Contracts + Haskell ExplanationN Queens Leet Code Problem | Recursive Backtracking and Caching SolutionNumber of Islands Coding Interview Question | Recursive Backtracking | Pair ProgrammingThree Sum LeetCode Question Explained | Two Pointer and Two Sum SolutionMove to cold storage NOW! FTX Collapse and Contagion EffectsCardano Plutus Tutorial #3: Game Project | Smart Contracts DApp and Haskell ExplanationSolana Reddit Smart Contract Architecture Part 4: Comment UpvoteLinked List Cycle LeetCode Problem Explained