\nWalletConnect is an open source protocol for connecting decentralised applications to mobile wallets with QR code scanning or deep linking

WalletConnect

walletconnect

We will create from scratch ERC-721 smartcontract, deploy it to Ethereum Goerli network using Hardhat + Solidity. For minting we will use NextJs + WalletConnect + Web3Modal Before we start, I would like to mention, that you can use any network you want. With the help of this article, you can deploy to Mainnet also. Smartcontract repo (erc721): https://github.com/gapon2401/erc721 Mint page repo (erc721-mint): https://github.com/gapon2401/erc721-mint Smartcontract: Etherscan Goerli link We need to go through the following steps to reach our goal: Creating NFT (ERC-721) smartcontract Configure hardhat.config.ts and .env Create deploy function Create tests Gas price for deployment and minting the smartcontract Creating images and metadata for NFT Deploy and verify smartcontract Create demo website for minting (optional) Deep dive and customize Step 1. Creating NFT (ERC-721) smartcontract Create new project and install — Ethereum development environment. Let’s call this project . https://hardhat.org erc721 In command line run npx hardhat Select . Create a Typescript project In order to continue you will be asked to install some dependencies. The text may vary on the hardhat version. I will run the following, because I will use : yarn yarn add -D hardhat@^2.10.2 @nomicfoundation/hardhat-toolbox@^1.0.1 We will use template for ERC-721 smartcontract, where all necessary functions have been implemented. You can take a look on it: https://www.openzeppelin.com/ https://github.com/OpenZeppelin/openzeppelin-contracts/blob/master/contracts/token/ERC721/ERC721.sol Install openzeppelin packages and dotenv: yarn add -D @openzeppelin/contracts dotenv Remove everything from the folder and create a file with the contents: contracts ERC721Contract.sol https://gist.github.com/gapon2401/d6bf2f0eef9b7e6721b98028f890004e If you have any difficulties with the code above, feel free to read more about the . Here is the summary: Solidity — on deployment we will set the base URI for all tokens, name and a symbol to the token collection. constructor — is our function, which will create new NFT’s for us. Only owner of the contract can call it. mintByOwner — public mint. mint — owner of the contract can change the base URI for tokens setBaseURI —owner can call this function to transfer money from the contract to it’s own wallet address withdraw All other necessary functions are inhereted in this contract from openzeppelin. The price of the tokens will be 0.1 ETH: uint256 public constant PRICE = 100000000000000000; Configure hardhat.config.ts and .env Step 2. Install the following dependencies in order to escape the errors in developing 😲 yarn add -D ethers @nomiclabs/hardhat-etherscan @typechain/hardhat hardhat-gas-reporter solidity-coverage @types/chai @types/mocha typescript ts-node @nomicfoundation/hardhat-chai-matchers chai @nomicfoundation/hardhat-network-helpers typechain @nomiclabs/hardhat-waffle @typechain/ethers-v5 @nomiclabs/hardhat-ethers Now configure your : hardhat.config.ts https://gist.github.com/gapon2401/4bd368815c075954f7cac6b43e1cd687 What do we have here: — we specified the settings and enabled optimization solidity — networks, that we are going to use networks — will show us gas units, that we need to spend for deployment or calling the functions gasReporter — plugin for integration with Etherscan’s contract verification service etherscan The next step is to create file in project root. You have to create 5 variables: .env — the private key of the wallet, that wil be the owner of the contract PRIVATE_KEY -etherscan key. Register on and on the page create and copy your key: ETHERSCAN_API_KEY https://etherscan.io https://etherscan.io/myapikey — Are we going to use gas reporter or not. We will use it REPORT_GAS=1 and — use or for getting the urls. GOERLI_URL MAINNET_URL https://infura.io/ https://www.alchemy.com/ For instance, infura URL for : MAINNET_URL Infura URL for : GOERLI_URL Now compile the code with the command: npx hardhat compile After that command some new folders will appear: , , . artifacts cache typechain-types Step 3. Create deploy function It’s time to write deploy function, we will use tasks for it. Remove folder , we don’t need it. scripts Create the folder and the file inside it: tasks deploy.ts https://gist.github.com/gapon2401/6dbb24a1308479d934897abf743c32e1 In this task we get smartcontract and deploy it. After the deployment in console we will see the address of the contract. We will come back to that function later. Create tests Step 4. We will write the tests for every exteral/public function. Clear the folder and create inside it with the contents: test index.ts https://gist.github.com/gapon2401/47162e377dde919f06108905ecdb847f Run . npx hardhat test You should get similar to that: All tests passed successfully! Gas price for deployment and minting the smartcontract Step 5. For determine the price of deployment and minting functions we have used module . It was enabled by default in , that’s why after all tests were passed, we got the table: hardhat-gas-reporter hardhat.config.ts In the table we can see the gas consumption for methods and deployment. This is the units of gas we need to deploy the contract. How much it will cost in ETH? Use the formula: (gas units) * (gas price per unit) = gas fee in gwei In this formula we don’t know the amount of . gas price per unit You can use or any other website to find this information. At the moment of writing this article, gas price is 17. https://ethgasstation.info/ The value can change greatly depending on the time of day. It may be 2 or 10 or 50 🙃. Be careful. So, the average cost will be: Deployment = 1 697 092 * 17 = 28 850 564 gwei = 0,028850564 ETH
mint = 88 753 * 17 = 1 508 801 gwei = 0,001508801 ETH
mintByOwner = 91 060 * 17 = 1 548 020 gwei = 0,001548020 ETH
setBaseURI = 32 153 * 17 = 546 601 gwei = 0,000546601 ETH
withdraw = 30 421 * 17 = 517 157 gwei = 0,000517157 ETH Now the ETH/USD price is $1 592, it means that deployment to mainnet will cost about $46 and calling a function will cost about $2.4. mint Creating images and metadata for NFT Step 6. Images and metadata for NFTs can be stored on your server or in . IPFS We will cover the first case. Assume, that you have a domain https://my-domain.com All NFT images will store here: https://my-domain.com/collection/assets/ All metadata here: https://my-domain.com/collection/metadata/ So, the base URI for our smartcontract will be https://my-domain.com/collection/metadata/ In our smartcontract by default all token URI’s will be counted from 0. Therefore, files for metadata should be like this: 0.json
1.json
....
1234.json If you use function, then you can change the name of the file for specific NFT, and it can be like this: mintByOwner custom.json Upload NFT images on your server. They should be available by links: https://my-domain.com/collection/assets/0.png
https://my-domain.com/collection/assets/1.png
https://my-domain.com/collection/assets/2.png Now create metadata for NFT’s. Here is an example of one file : 0.json {
    "name": "Test NFT #0",
    "image": "https://my-domain.com/collection/assets/0.png"
} Pay attention, that in we have defined the link to the image, which has been upoaded to the server. image about opensea metadata and available values in it. Read more Upload your metadata files, so they should be available by links: https://my-domain.com/collection/metadata/0.json
https://my-domain.com/collection/metadata/1.json
https://my-domain.com/collection/metadata/2.json Step 7. Deploy and verify smartcontract Everything is ready for deployment. Take a look on our , we’ve specified as tasks/deploy.ts baseUri https://my-domain.com/collection/metadata/ This is because all our metadata is available by this address. Here you can change the and the of the collection. name symbol In command line run: npx hardhat deploy --network goerli This command will deploy smartcontract to Goerli network. If you want to deploy to mainnet, you can run: npx hardhat deploy --network mainnet All these networks were described on file. hardhat.config.ts After the deployment you will get the following in your console: My smartcontract address is: 0xc191B6505B16EBe5D776fb30EFbfe41A9252023a From now, it is available on etherscan testnet: https://goerli.etherscan.io/address/0xc191B6505B16EBe5D776fb30EFbfe41A9252023a We need to verify our smartcontract, so everyone can check the code. Wait about 5 minutes and try to verify it. If you get an error while verifying, don’t worry, just try to wait more time. In Mainnet I was waiting for 10–15 minutes. In general verify function looks like this: npx hardhat verify --network <YOUR_NETWORK> <DEPLOYED_CONTRACT_ADDRESS> <arg1> <arg2> <argn> Let’s try to determine, what to specify in our verify function: <YOUR_NETWORK> - goerli <DEPLOYED_CONTRACT_ADDRESS> will be my contract address 0xc191B6505B16EBe5D776fb30EFbfe41A9252023a <arg1> — this is our base URI. You will find it in tasks/deploy.ts "https://my-domain.com/collection/metadata/" <arg2> — name of the token collection, that was specified in deployment: "My ERC721 name" <arg3> — symbol of the token collection, that was specified in deployment: "MyERC721Symbol" Arguments should be the same, that were in !!! tasks/deploy.ts So, in command line I will run: npx hardhat verify --network goerli 0xc191B6505B16EBe5D776fb30EFbfe41A9252023a "https://my-domain.com/collection/metadata/" "My ERC721 name" "MyERC721Symbol" The result should be the next: On you can check the code of deployed smartcontract. this page 🥳We have finished with the smartcontract. Here is the , where you can find all the code. repo Step 8. Create demo website for minting This will be our second project . erc721-mint For demo website I will use . NextJS To speed up the development clone my repository: https://github.com/gapon2401/erc721-mint Install all dependencies: yarn install Open file and fill in the variables: .env — address of your smartcontract from the paragraph Deploy and verify smartcontract. NEXT_PUBLIC_SMARTCONTRACT_ADDRESS — the network, where your smartcontract was deployed. We need this to switch the network. Specify , because we have deployed our smartcontact there. NEXT_PUBLIC_SMARTCONTRACT_NETWORK goerli — network endpoint. You can use to get the url. NEXT_PUBLIC_SMARTCONTRACT_INFURA_URL https://infura.io Go to your dashboard, select your project and copy : Api Key In our first smartcontract project open the file: erc721 artifacts/contracts/ERC721Contract.sol/ERC721Contract.json Copy : abi In current project open the file: erc721-mint src/components/smartcontract.ts Replace the value. abi Everything is done! 🎉 You can run the project and try to use it! yarn dev In the next section I will cover the main components. Step 9 (optional). Deep dive and customize Take a look on main components: src/components/smartcontract.ts Contains information about the smartcontract. It's better to dynamically load this file from the server, because we want our web page loads as soon as possible. In this demo mint form appears after the page loads.
2. This component communicates with blockchain. There are some functions and variables stored in React Context: src/components/Web3Provider.tsx - has user connected the wallet or not connected - the state of reconnecting isConnecting - function for connecting to network connect() – function for reconnecting. Cached provider will be used, that was selected by user at the last time reconnect() – function for disconnecting network – selected by user disconnect() : goerli, mainnet etc network – provider for communicating with the wallet: metamask, ledger, tokenary, etc provider - the owner of the wallet signer – ID of the selected network chainId – your wallet address accountId - error message for web3Modal error This component displays form for minting.
Function is called after the user clicks on the mint button.
Now look at the code: src/components/MintForm.tsx mint() const transactionResponse = await Contract.mint({ 
  value: ethers.utils.parseEther('0.1'), 
}) We are calling function from the smartcontract and send 0.1 ETH to it, because this function requires exactly that value. mint What if we want to call mintByOwner ? We can do it like this: const transactionResponse = await Contract.mintByOwner( '0x01234566', 'token_uri' ) But pay attention, that this function can be called only by the owner of the contract. Why? We have used modifier in smartcontract: onlyOwner function mintByOwner(address to, string calldata tokenUri) external onlyOwner A few more words about that function. - this is the address, for which you want to mint token. Make sure to write full address. 0x01234566 - this is custom token URI. In our deployed smartcontract the full address to token metadata looks like: token_uri ${baseUri + token_uri}.json Remember, we have specified : baseUri https://my-domain.com/collection/metadata/ So, the full address to metadata with token URI equals will be: token_url https://my-domain.com/collection/metadata/token_url.json Also, we don't need to pay for this transaction, except gas price. Function . prepareNetwork() On first connection this function can propose to change the network. In this function are used only and networks. You can change it, if you need, here: goerli mainnet chainId: smartContract.network === 'goerli' ? '0x5' : '0x1', Function . getBalanceOf This function checks is it enough money on the wallet to make a transaction. In the file you may find commented code in two places: /* reconnect ,*/ and /* Reconnect to the wallet */ 
// useEffect(() => {
 //   ;(async () => {
 //     await reconnect()
 //   })()
 // }, [reconnect]) Uncomment it to make reconnections every time the page reloads. Thank you for reading! ❤

Create, Deploy and Mint Smart Contract (ERC-721) with NodeJS + Hardhat + Walletconnect + Web3modal

EthCC 2024: Impressions and Insights about the Biggest European Blockchain Conference

EthCC 2024: বৃহত্তম ইউরোপীয় ব্লকচেইন সম্মেলন সম্পর্কে ইমপ্রেশন এবং অন্তর্দৃষ্টি

EthCC 2024: Eindrücke und Einblicke zur größten europäischen Blockchain-Konferenz

EthCC 2024: Impresiones y conocimientos sobre la mayor conferencia europea sobre blockchain

EthCC 2024 : impressions et aperçus de la plus grande conférence européenne sur la blockchain

EthCC 2024: सबसे बड़े यूरोपीय ब्लॉकचेन सम्मेलन के बारे में इंप्रेशन और अंतर्दृष्टि

EthCC 2024: ヨーロッパ最大のブロックチェーンカンファレンスについての印象と考察

EthCC 2024: 유럽 최대 블록체인 컨퍼런스에 대한 인상과 통찰

EthCC 2024: Impressões e Insights sobre a Maior Conferência Europeia de Blockchain

EthCC 2024: впечатления и идеи о крупнейшей европейской конференции по блокчейну

EthCC 2024: Avrupa'nın En Büyük Blockchain Konferansı Hakkında İzlenimler ve İçgörüler

EthCC 2024: Những ấn tượng và hiểu biết sâu sắc về Hội nghị Blockchain lớn nhất châu Âu

EthCC 2024：欧洲最大的区块链会议印象与见解

AMSTERDAM, Netherlands, July 9th, 2024/Chainwire/Sovereign Nature Initiative (SNI) has announced a collaboration with Unique Network and WalletConnect on Polkadot. Officially launching at Polkadot Decoded 2024, DOTphin will leverage NFTs to effect positive environmental change. This initiative was approved by strong community support through Polkadot OpenGov. Powered by dynamic NFTs, DOTphin is designed to enhance event engagement and deliver real-world ecological impact. The project transforms event participation into an interactive journey, aligning digital evolution with sustainability. As a result, events are more rewarding and user engagement is higher. DOTphin is an eco-linked dynamic multi-pass that supports biodiversity restoration. The avatar attached to each pass, represented as an NFT, evolves through a series of physical and digital events while bringing community engagement and sustainability support to the Polkadot ecosystem. The official launch of DOTphin will commence with the distribution of eco-badges to attendees at Polkadot Decoded 2024 on July 11. These serve as keys to claiming unique DOTphin NFTs. EthCC ticket holders can claim a free Decoded ticket and their first POAP which will unlock a multi-event, multi-month journey that will support marine conservation efforts. As a project focused on sustainability, DOTphin aligns with Polkadot’s credentials as a green blockchain with a low carbon footprint. Targeted at environmentally-conscious users and investors, DOTphin demonstrates another use case for Polkadot technology while showcasing blockchain’s ability to have a positive environmental impact. Thanks to the dynamic design of DOTphin NFTs, each token evolves based on user engagement, creating a personalized and interactive experience. With funds channeled towards marine conservation, every digital interaction has a tangible ecological benefit. DOTphin holders can use the purpose-built REAL Portal to check the status of their NFT and follow activities. By integrating real-world species data with evolving NFTs, DOTphin aims to showcase how blockchain can drive positive ecological impact. In combining web3 technology with ecological stewardship, DOTphin is pioneering new use cases for NFTs and uniting like-minded individuals who can collaborate to achieve shared goals. DOTphin will officially launch at Decoded on July 11 and will continue through eight additional blockchain gatherings including sub0, Token 2049, and DevCon. About DOTphin Developed by Sovereign Nature Initiative (SNI) with the support of Unique Network and WalletConnect, DOTphin makes use of dynamic NFTs on Polkadot. This supports ecological conservation while rewarding engagement, allowing communities to collaborate to achieve positive real-world change. Contact CEO Catherine Bischoff Sovereign Nature Initiative catherine@sovereignnature.com This story was distributed as a release by Chainwire under HackerNoon’s Business Blogging Program. Learn more about the program here. AMSTERDAM, Netherlands, July 9th, 2024/Chainwire/Sovereign Nature Initiative (SNI) has announced a collaboration with Unique Network and WalletConnect on Polkadot. Officially launching at Polkadot Decoded 2024, DOTphin will leverage NFTs to effect positive environmental change. This initiative was approved by strong community support through Polkadot OpenGov. Powered by dynamic NFTs, DOTphin is designed to enhance event engagement and deliver real-world ecological impact. The project transforms event participation into an interactive journey, aligning digital evolution with sustainability. As a result, events are more rewarding and user engagement is higher. DOTphin is an eco-linked dynamic multi-pass that supports biodiversity restoration. The avatar attached to each pass, represented as an NFT, evolves through a series of physical and digital events while bringing community engagement and sustainability support to the Polkadot ecosystem. The official launch of DOTphin will commence with the distribution of eco-badges to attendees at Polkadot Decoded 2024 on July 11. These serve as keys to claiming unique DOTphin NFTs. EthCC ticket holders can claim a free Decoded ticket and their first POAP which will unlock a multi-event, multi-month journey that will support marine conservation efforts. As a project focused on sustainability, DOTphin aligns with Polkadot’s credentials as a green blockchain with a low carbon footprint. Targeted at environmentally-conscious users and investors, DOTphin demonstrates another use case for Polkadot technology while showcasing blockchain’s ability to have a positive environmental impact. Thanks to the dynamic design of DOTphin NFTs, each token evolves based on user engagement, creating a personalized and interactive experience. With funds channeled towards marine conservation, every digital interaction has a tangible ecological benefit. DOTphin holders can use the purpose-built REAL Portal to check the status of their NFT and follow activities. By integrating real-world species data with evolving NFTs, DOTphin aims to showcase how blockchain can drive positive ecological impact. In combining web3 technology with ecological stewardship, DOTphin is pioneering new use cases for NFTs and uniting like-minded individuals who can collaborate to achieve shared goals. DOTphin will officially launch at Decoded on July 11 and will continue through eight additional blockchain gatherings including sub0, Token 2049, and DevCon. About DOTphin Developed by Sovereign Nature Initiative (SNI) with the support of Unique Network and WalletConnect, DOTphin makes use of dynamic NFTs on Polkadot. This supports ecological conservation while rewarding engagement, allowing communities to collaborate to achieve positive real-world change. Contact CEO Catherine Bischoff Sovereign Nature Initiative catherine@sovereignnature.com This story was distributed as a release by Chainwire under HackerNoon’s Business Blogging Program. Learn more about the program here. This story was distributed as a release by Chainwire under HackerNoon’s Business Blogging Program. Learn more about the program here . here here

Sovereign Nature Initiative Launches DOTphin On Polkadot To Create Positive Environmental Impact

সার্বভৌম প্রকৃতি উদ্যোগ ইতিবাচক পরিবেশগত প্রভাব তৈরি করতে পোলকাডটে ডটফিন চালু করেছে

Sovereign Nature Initiative führt DOTphin auf Polkadot ein, um positive Auswirkungen auf die Umwelt zu erzielen

Sovereign Nature Initiative lanza DOTphin en Polkadot para crear un impacto ambiental positivo

Sovereign Nature Initiative lance DOTphin sur Polkadot pour créer un impact environnemental positif

सॉवरेन नेचर इनिशिएटिव ने पर्यावरण पर सकारात्मक प्रभाव डालने के लिए पोलकाडॉट पर डॉटफिन लॉन्च किया

ソブリン・ネイチャー・イニシアチブがポルカドットでDOTphinを立ち上げ、環境に良い影響を与える

Sovereign Nature Initiative는 환경에 긍정적인 영향을 미치기 위해 Polkadot에서 DOTphin을 출시했습니다.

Sovereign Nature Initiative lança DOTphin em Polkadot para criar impacto ambiental positivo

Sovereign Nature Initiative запускает DOTphin на Polkadot, чтобы оказать положительное воздействие на окружающую среду

Egemen Doğa Girişimi, Olumlu Çevresel Etki Yaratmak İçin Polkadot'ta DOTphin'i Başlattı

Sáng kiến Thiên nhiên có Chủ quyền ra mắt DOTphin trên Polkadot để tạo ra tác động tích cực đến môi trường

主权自然倡议在 Polkadot 上推出 DOTphin，以创造积极的环境影响

Bahamut Foundation has announced the Grants program to support the growing ecosystem of Bahamut and foster the expansion of decentralized projects and applications. This initiative provides multi-faceted support for a wide range of projects based on categories mainly revolving but not limited to DeFi, gaming, and NFTs. Bahamut Blockchain has already witnessed the successful results of the grants program with the latest launch of 3 DeFi projects - Lolik, Mutuari, and SilkSwap. These platforms have successfully passed all the qualification stages and, after an extensive development process, are now live on the Bahamut blockchain. The appearance of new DeFi projects will surely increase the scalability and adaptability of the native coin of Bahamut, FTN, and expand its usability and relevance. Mutuari is a lending protocol made for decentralized lending and borrowing of assets directly on Bahamut. Mutuari gives the users access to diverse crypto assets, including FTN, USTD, USDC, stFTN, and is accessible through all EVM-supporting non-custodial wallets, among them Fastex Wallet, Metamask, and WalletConnect. The project has been selected and successfully completed the task under the category of “Lending Protocol” with a prize of 60.000 FTN. Lolik is the next project that has received a grant from Bahamut Foundation. It is a liquid staking platform that supports staking on leading blockchains such as Bahamut, with other blockchains, including Ethereum and Polygon, coming soon. With Lolik, each user can earn rewards by participating in the validation processes of the blockchain directly with their Web3 wallet. \And the last one is the DeFi trading platform, SilkSwapthat allows users to enjoy peer-to-peer trading and easy and fast transactions. The application stays true to a pure Web3 concept, totally eliminating any third-party interactions.The application process continues, accepting more and more applications. The step-by-step description of the application process and information on preferable categories and their funding are available on Bahamut.io/grants. The process is transparent and fair, keeping it real with web3. Bahamut Foundation is currently announcing the list of approved applications that will start building their projects on Bahamut through the Bahamut Arena contest and wishes them the best of luck and successful completion of their projects. Gotbit Labs Category - DEX aggregator Category Prize fund - 40,000 FTN Delivery deadline - 2 months Lost Lore Category - NFT Marketplace Category Prize fund - 40,000 FTNDelivery deadline- 4 months Blockstars (Greedy Lottery) Category - Decentralized Game Category Prize fund - 13,000 FTN Delivery deadline - 1 month Erinaceus RNG Oracle Category - RNG Oracle Category Prize fund - 50,000 FTN Delivery deadline - 3 months Erinaceus Price Feed Oracle Category - Price Feed oracle Category Prize fund - 50,000 FTN Delivery deadline - 3 months Additionally, the Bahamut Foundation is hosting a series of meetups at the__ftNFT Phygital Spaces__ located in Dubai, Venice, and Yerevan. These events are designed to promote community engagement by bringing together Web3  developers, newcomers, and enthusiasts. The meetups aim to foster growth and development within the global and local Web3 sector through knowledge exchange and collaboration. Moreover,  a partnership with Yerevan State University has been announced to support blockchain education and community development in Armenia's growing Web3 industry. This collaboration--formalized through a memorandum of cooperation--represents a significant step towards integrating educational and research programs focused on blockchain and virtual assets, underscoring a shared commitment to promoting blockchain education and community development. About Bahamut Foundation The Switzerland-based Bahamut Foundation stays at the forefront of innovation, offering support and funding to the projects that foster advancements in the field, generate value for the blockchain ecosystem, and bring new users into the world of Web3, laying the foundations for future generations to learn and build upon. This story was distributed as a release by Btcwire under HackerNoon’s Business Blogging Program. Learn more about the program here. Bahamut Foundation has announced the Grants program to support the growing ecosystem of Bahamut and foster the expansion of decentralized projects and applications. This initiative provides multi-faceted support for a wide range of projects based on categories mainly revolving but not limited to DeFi, gaming, and NFTs. Bahamut Blockchain has already witnessed the successful results of the grants program with the latest launch of 3 DeFi projects - Lolik, Mutuari, and SilkSwap. These platforms have successfully passed all the qualification stages and, after an extensive development process, are now live on the Bahamut blockchain. The appearance of new DeFi projects will surely increase the scalability and adaptability of the native coin of Bahamut, FTN, and expand its usability and relevance. Mutuari is a lending protocol made for decentralized lending and borrowing of assets directly on Bahamut. Mutuari gives the users access to diverse crypto assets, including FTN, USTD, USDC, stFTN, and is accessible through all EVM-supporting non-custodial wallets, among them Fastex Wallet, Metamask, and WalletConnect. The project has been selected and successfully completed the task under the category of “Lending Protocol” with a prize of 60.000 FTN. Mutuari Mutuari Lolik is the next project that has received a grant from Bahamut Foundation. It is a liquid staking platform that supports staking on leading blockchains such as Bahamut, with other blockchains, including Ethereum and Polygon, coming soon. With Lolik, each user can earn rewards by participating in the validation processes of the blockchain directly with their Web3 wallet. Lolik Lolik \And the last one is the DeFi trading platform, SilkSwapthat allows users to enjoy peer-to-peer trading and easy and fast transactions. The application stays true to a pure Web3 concept, totally eliminating any third-party interactions.The application process continues, accepting more and more applications. The step-by-step description of the application process and information on preferable categories and their funding are available on Bahamut.io/grants . The process is transparent and fair, keeping it real with web3. SilkSwap that allows users to enjoy peer-to-peer trading and easy and fast transactions. The application stays true to a pure Web3 concept, totally eliminating any third-party interactions. The application process continues, accepting more and more applications. The step-by-step description of the application process and information on preferable categories and their funding are available on SilkSwap Bahamut.io/grants Bahamut Foundation is currently announcing the list of approved applications that will start building their projects on Bahamut through the Bahamut Arena contest and wishes them the best of luck and successful completion of their projects. Gotbit Labs Category - DEX aggregator Category Prize fund - 40,000 FTN Delivery deadline - 2 months Lost Lore Category - NFT Marketplace Category Prize fund - 40,000 FTN Delivery deadline- 4 months Blockstars (Greedy Lottery) Category - Decentralized Game Category Prize fund - 13,000 FTN Delivery deadline - 1 month Erinaceus RNG Oracle Category - RNG Oracle Category Prize fund - 50,000 FTN Delivery deadline - 3 months Erinaceus Price Feed Oracle Category - Price Feed oracle Category Prize fund - 50,000 FTN Delivery deadline - 3 months Additionally, the Bahamut Foundation is hosting a series of meetups at the__ ftNFT Phygital Spaces __ located in Dubai, Venice, and Yerevan. These events are designed to promote community engagement by bringing together Web3  developers, newcomers, and enthusiasts. The meetups aim to foster growth and development within the global and local Web3 sector through knowledge exchange and collaboration. ftNFT Phygital Spaces Moreover,  a partnership with Yerevan State University has been announced to support blockchain education and community development in Armenia's growing Web3 industry. This collaboration--formalized through a memorandum of cooperation--represents a significant step towards integrating educational and research programs focused on blockchain and virtual assets, underscoring a shared commitment to promoting blockchain education and community development. About Bahamut Foundation The Switzerland-based Bahamut Foundation stays at the forefront of innovation, offering support and funding to the projects that foster advancements in the field, generate value for the blockchain ecosystem, and bring new users into the world of Web3, laying the foundations for future generations to learn and build upon. Bahamut Foundation Bahamut Foundation This story was distributed as a release by Btcwire under HackerNoon’s Business Blogging Program. Learn more about the program here. This story was distributed as a release by Btcwire under HackerNoon’s Business Blogging Program. Learn more about the program here . here here

Bahamut Foundation Announces The Launch Of  Three DeFi Projects And The Winners Of Bahamut Arena

বাহামুত ফাউন্ডেশন তিনটি ডিফাই প্রজেক্ট চালু করার ঘোষণা করেছে এবং বাহামুত এরিনার বিজয়ীদের ঘোষণা করেছে

Bahamut Foundation gibt den Start von drei DeFi-Projekten und die Gewinner der Bahamut Arena bekannt

La Fundación Bahamut anuncia el lanzamiento de tres proyectos DeFi y los ganadores del Bahamut Arena

La Fondation Bahamut annonce le lancement de trois projets DeFi et les gagnants de la Bahamut Arena

बहामुट फाउंडेशन ने तीन DeFi परियोजनाओं के शुभारंभ और बहामुट एरिना के विजेताओं की घोषणा की

バハムート財団、3つのDeFiプロジェクトの立ち上げとバハムートアリーナの優勝者を発表

Bahamut Foundation, 3개의 DeFi 프로젝트 출시 및 Bahamut Arena 우승자 발표

Fundação Bahamut anuncia o lançamento de três projetos DeFi e os vencedores da Bahamut Arena

Фонд Бахамут объявляет о запуске трех проектов DeFi и победителях Bahamut Arena

Bahamut Vakfı Üç DeFi Projesinin Lansmanını ve Bahamut Arena'nın Kazananlarını Açıkladı

Bahamut Foundation thông báo ra mắt ba dự án DeFi và những người chiến thắng Bahamut Arena

Bahamut 基金会宣布启动三个 DeFi 项目以及 Bahamut Arena 获胜者

What you will be building, see our for the finished work and our . git repo live demo Introduction Welcome to our comprehensive guide on "Building a Web3 Events Marketplace with Next.js, TypeScript, and Solidity". In this tutorial, we'll construct a decentralized Events Marketplace that harnesses the power of blockchain technology. You'll gain a clear understanding of the following: Building dynamic interfaces with Next.js Crafting Ethereum smart contracts with Solidity Incorporating static type checking using TypeScript Deploying and interacting with your smart contracts Understanding the fundamentals of blockchain-based Events Marketplaces By the end of this guide, you'll have a functioning decentralized platform where users can list and participate in events, with all transactions managed and secured by Ethereum smart contracts. As an added incentive for participating in this tutorial, we're giving away a copy of our prestigious book on becoming an in-demand Solidity developer. This offer is free for the first 300 participants. For instructions on how to claim your copy, please watch the short video below. Prerequisites You will need the following tools installed to build along with me: Node.js Yarn Git Bash MetaMask Next.js Solidity Redux Toolkit Tailwind CSS To set up MetaMask for this tutorial, please watch the instructional video below: https://youtu.be/qV1mbFOtkxo?embedable=true Once you have successfully completed the setup, you are eligible to receive a free copy of our book. To claim your book, . please fill out the form to submit your proof-of-work Watch the following to receive up to 3-months of free premium courses on Dapp Mentors Academy, including: instructional videos Fullstack NFT Minting Course Fullstack NFT Marketplace Course Fullstack Blockchain Course etc. Join the Bitfinity ecosystem and be a part of the next generation of dApps. Apply your Bitfinity knowledge to create a Blockchain-based House Rental dApp in the final module. Deploy your smart contracts to the Bitfinity network and revolutionize the rental industry With that said, let’s jump into the tutorial and set up our project. Setup We'll start by cloning a prepared frontend repository and setting up the environment variables. Run the following commands: git clone https://github.com/Daltonic/dappEventX
cd dappEventX
yarn install
git checkout 01_no_redux Next, create a file at the root of the project and include the following keys: .env NEXT_PUBLIC_RPC_URL=http://127.0.0.1:8545
NEXT_PUBLIC_ALCHEMY_ID=<YOUR_ALCHEMY_PROJECT_ID>
NEXT_PUBLIC_PROJECT_ID=<WALLET_CONNECT_PROJECT_ID>
NEXTAUTH_URL=http://localhost:3000
NEXTAUTH_SECRET=somereallysecretsecret Replace and with your respective project IDs. <YOUR_ALCHEMY_PROJECT_ID> <WALLET_CONNECT_PROJECT_ID> : : YOUR_ALCHEMY_PROJECT_ID Get Key Here WALLET_CONNECT_PROJECT_ID Get Key Here Finally, run to start the project. yarn dev Our user interface is prepared to incorporate smart contracts, however, we still need to integrate Redux in order to facilitate the sharing of data. Building the Redux Store The above image represents the structure of our Redux store, it will be simple since we are not creating some overly complex project. We'll set up Redux to manage our application's global state. Follow these steps: Create a folder at the project root. store Inside , create two folders: and . store actions states Inside , create a file. states globalStates.ts https://gist.github.com/Daltonic/b8fbcc4d0594d807c8da8c05455e9280?embedable=true Inside , create a file. actions globalActions.ts https://gist.github.com/Daltonic/a0180bc1ca72eff8b3bd93106b2ce47f?embedable=true Create a file inside the folder. globalSlices.ts store https://gist.github.com/Daltonic/31834ef324af3ead415c0cebcf1a5c7e?embedable=true Create an file inside the folder. index.ts store https://gist.github.com/Daltonic/4e91a72da751a7122b10722e2a2282c3?embedable=true Update the file with the Redux provider. pages/_app.tsx https://gist.github.com/Daltonic/55aa1f2995b360b42752a7c2624011de?embedable=true We have implemented Redux toolkit in our application and plan to revisit its usage when integrating the backend with the frontend. Smart Contract Development Next, we'll develop the smart contract for our platform: Create a folder at the project root. contracts Inside , create a file and add the contract code below. contracts DappEventX.sol https://gist.github.com/Daltonic/f66b58a3f938d4d7b41da56c3c2d22be?embedable=true The above smart contract is designed to manage an Events Marketplace on the blockchain. It allows users to create, update, and delete events, buy tickets for events, and handle payouts. Here's a detailed breakdown of its functions: This function initializes the contract, sets the service fee percentage, and assigns initial token parameters. Constructor ( constructor(uint256 _pct) ERC721('Event X', 'EVX') ): This function allows a user to create a new event. It requires the title, description, image URL, capacity, ticket cost, and start and end times. It validates all input data and creates a new event structure, which is stored in the events mapping. createEvent Function: This function allows a user to update an existing event. It requires the same parameters as the createEvent function. It checks that the event exists and that the caller is the owner of the event before updating the event data. updateEvent Function: This function allows the owner of an event to delete it. It checks that the event exists, that the caller is the owner of the event or the contract owner, and that the event has not been paid out or refunded. It then refunds all tickets for the event and marks the event as deleted. deleteEvent Function: This function returns all existing events. It creates an array of the right size, then fills it with all events that have not been deleted. getEvents Function: This function returns all events owned by the caller. It creates an array of the right size, then fills it with all events owned by the caller that have not been deleted. getMyEvents Function: This function returns a specific event. It simply returns the event structure from the events mapping. getSingleEvent Function: This function allows a user to buy tickets for an event. It checks that the event exists, that the sent value is at least the total cost of the tickets, and that there are enough seats available. It then creates new ticket structures for each ticket and adds them to the tickets mapping. buyTickets Function: This function returns all tickets for a specific event. It simply returns the array of ticket structures from the tickets mapping. getTickets Function: This internal function refunds all tickets for a specific event. It marks each ticket as refunded, sends the ticket cost back to the ticket owner, and decreases the contract balance. refundTickets Function: This function handles payout distribution at the end of an event. It checks that the event exists, has not already been paid out, and is no longer ongoing. It then mints tickets for the event, calculates the revenue and fee, and sends the revenue minus the fee to the event owner and the fee to the contract owner. It marks the event as paid out and decreases the contract balance. payout Function: This internal function mints tickets for a specific event. It marks each ticket and the event as minted, and mints a new ERC721 token for each ticket. mintTickets Function: This internal function sends funds to a specified address. It uses the low-level call function to send the funds and checks that the call was successful. payTo Function: This internal function returns the current timestamp. It uses the block.timestamp global variable, multiplies it by 1000, and adds 1000. currentTime Function: Contract Deployment and Seeding Now, let's deploy our smart contract and populate it with some dummy data: Create a folder at the project root. scripts Inside , create a and a file and add the following codes. scripts deploy.js seed.js Deploy Script https://gist.github.com/Daltonic/021ee2f4d05f4f7c1e80452e6fdd263f?embedable=true Seed https://gist.github.com/Daltonic/118946bc263220b15162d36837de2758?embedable=true Run the following commands to deploy the contract and seed it with data: yarn hardhat node # Run in terminal 1 yarn hardhat run scripts/deploy.js # Run in terminal 2 yarn hardhat run scripts/seed.js # Run in terminal 2 If you did that correctly, you should see a similar output like the one below: At this point we can start the integration of our smart contract to our frontend. https://www.youtube.com/watch?v=JePa-DzZsJA&embedable=true Frontend Integration First, create a folder at the project root, and inside it, create a file. This file will contain functions to interact with our smart contract. services blockchain.tsx https://gist.github.com/Daltonic/4a6faf80873bc01162436ca6b8ddf703?embedable=true The above code is a service that interacts with a Events Marketplace contract. The service interacts with a smart contract deployed on the Ethereum blockchain using the ethers.js library. Here's a detailed breakdown of its functions: This function sets up a connection to the Ethereum blockchain and the smart contract. It uses the ethers library to create a provider (to interact with the Ethereum blockchain) and a signer (to sign transactions). Then, it creates a contract instance that can be used to interact with the smart contract. getEthereumContracts Function: This function creates a new event by calling the createEvent function of the contract. createEvent Function: This function updates an existing event by calling the updateEvent function of the contract. updateEvent Function: This function deletes an event by calling the deleteEvent function of the contract. deleteEvent Function: This function handles payout distribution at the end of an event. payout Function: This function allows a user to buy tickets for an event. buyTicket Function: These functions retrieve information about all events or the events owned by the caller. They call the corresponding functions in the contract and structure the returned data. getEvents and getMyEvents Functions: This function retrieves information about a specific event. It calls the corresponding function in the contract and structures the returned data. getEvent Function: This function retrieves information about the tickets for a specific event. It calls the corresponding function in the contract and structures the returned data. getTickets Function: These functions structure the data returned from the contract into a more manageable format. They convert the data types from the contract's format to JavaScript's format and sort the data. structuredEvent and structuredTicket Functions: Next, update the file inside to include the network using the following codes. provider.tsx services bitfinity https://gist.github.com/Daltonic/94b744897ef0914a11aa9fa7e74c6b99?embedable=true Page Interacting with Smart Contract Next, we'll link the functions in the blockchain service to their respective interfaces in the frontend: Update to get data from the function. No 1:  Displaying Available Events pages/index.tsx getEvents() https://gist.github.com/Daltonic/c7c6be46e11cbf145cdc86dbbced70bb?embedable=true Take a moment and observe how we implemented the load more button, I bet you’ll find it useful. Update to get data from the function. No 2:  Displaying User’s Events pages/events/personal.tsx getMyEvents() https://gist.github.com/Daltonic/363e75afca92a660ec3992c271d56c92?embedable=true Update to use the function for form submission.. No 3:  Creating New Event pages/events/create.tsx createEvent() https://gist.github.com/Daltonic/4cc8440375151be40f6526b23445de1a?embedable=true Update to get data from the and functions. No 4:  Displaying Single Event pages/events/[id].tsx getEvent() getTickets() https://gist.github.com/Daltonic/7e00b943e92bf6bdf07893891db89de5?embedable=true Change to retrieve data from the and update by calling . No 5:  Editing a Single Event pages/events/edit/[id].tsx getEvent() updateEvent() https://gist.github.com/Daltonic/9c3897daf46d0ad92b67d7607cc6ef3b?embedable=true Update to retrieve data from the function. No 6:  Displaying Event Tickets pages/events/tickets/[id].tsx getTickets() https://gist.github.com/Daltonic/ad1f5468ac8ae44d44279e83e82abcc5?embedable=true Components with Smart Contract Let's apply the same approach we used for the previous pages and update the following components to interact with the smart contract. Update file to use the function to call the function. No 1: Purchasing Ticket components/BuyTicket.tsx handleSubmit() buyTicket() https://gist.github.com/Daltonic/7ef4354e4bfbfde36a5e04e40c85e083?embedable=true Lastly, update file to use the and functions. No 2: Deleting and Paying out Events components/EventAction.tsx deleteEvent() payout() https://gist.github.com/Daltonic/885854d5d5b71a2d7434fd738fea3eed?embedable=true It should be noted that this component is a dropdown and contains the relevant actions for managing a specific event. All the components and pages of the project have been successfully connected to the smart contract, indicating the completion of the project after implementing these updates. If your Next.js server was offline, you can bring it back up by executing the command . yarn dev For further learning, we recommends subscribing to our and . YouTube channel visiting our website for additional resources https://www.youtube.com/watch?v=Ubom39y5jX8&embedable=true Conclusion In this tutorial, we have successfully built a Web3 Events Marketplace using Next.js, TypeScript, and Solidity. We've established the development environment, constructed the Redux store, and deployed our smart contract to our local chain. We've created dynamic interfaces, crafted Ethereum smart contracts, and managed shared data with Redux. By integrating the smart contract with the frontend, we've enabled users to list and participate in events, with transactions managed and secured by Ethereum smart contracts. Now, you're equipped with the skills to build your own Web3 Events Marketplace. We've also provided you with a live demo and the finished work in our git repo for reference. Happy coding! About Author I am a web3 developer and the founder of , a company that helps businesses and individuals build and launch decentralized applications. I have over 7 years of experience in the software industry, and I am passionate about using blockchain technology to create new and innovative applications. I run a where I share tutorials and tips on web3 development, and I regularly post articles online about the latest trends in the blockchain space. Dapp Mentors YouTube channel called Dapp Mentors Discord: X-Twitter: LinkedIn: GitHub: Website: Stay connected with us, join communities on Join Follow Connect Explore Visit

How to Create a Web3 Events Marketplace with Next.js, Typescript, and Solidity

What you will be building, see our for the finished work and our . git repo live demo Introduction Welcome to our comprehensive guide on "Building a Web3 Play-To-Earn Platform with Next.js, Typescript, and Solidity". In this tutorial, we'll build a decentralized Play-To-Earn platform that leverages the power of blockchain technology. You'll gain a clear understanding of the following: Building dynamic interfaces with Next.js Crafting Ethereum smart contracts with Solidity Incorporating static type checking using TypeScript Deploying and interacting with your smart contracts Understanding the fundamentals of blockchain-based Play-To-Earn platforms By the end of this guide, you'll have a functioning decentralized platform where users can participate in Play-To-Earn games, with all activities managed and secured by Ethereum smart contracts. As an added incentive for participating in this tutorial, we're giving away a copy of our prestigious book on becoming an in-demand Solidity developer. This offer is free for the first 300 participants. For instructions on how to claim your copy, please watch the short video below. Prerequisites You will need the following tools installed to build along with me: Node.js Yarn Git Bash MetaMask Next.js Solidity Redux Toolkit Tailwind CSS To set up MetaMask for this tutorial, please watch the instructional video below: https://www.youtube.com/watch?v=qV1mbFOtkxo&embedable=true Once you have successfully completed the setup, you are eligible to receive a free copy of our book. To claim your book, . please fill out the form to submit your proof-of-work With that said, let’s jump into the tutorial and set up our project. Setup We'll start by cloning a prepared frontend repository and setting up the environment variables. Run the following commands: git clone https://github.com/Daltonic/play2earnX
cd play2earnX
yarn install
git checkout 01_no_redux Next, create a file at the root of the project and include the following keys: .env NEXT_PUBLIC_RPC_URL=http://127.0.0.1:8545
NEXT_PUBLIC_ALCHEMY_ID=<YOUR_ALCHEMY_PROJECT_ID>
NEXT_PUBLIC_PROJECT_ID=<WALLET_CONNECT_PROJECT_ID>
NEXTAUTH_URL=http://localhost:3000
NEXTAUTH_SECRET=somereallysecretsecret Replace and with your respective project IDs. <YOUR_ALCHEMY_PROJECT_ID> <WALLET_CONNECT_PROJECT_ID> : YOUR_ALCHEMY_PROJECT_ID Get Key Here : WALLET_CONNECT_PROJECT_ID Get Key Here Finally, run to start the project. yarn dev Our user interface is prepared to incorporate smart contracts, however, we still need to integrate Redux in order to facilitate the sharing of data. Building the Redux Store The above image represents the structure of our Redux store, it will be simple since we are not creating some overly complex project. We'll set up Redux to manage our application's global state. Follow these steps: Create a folder at the project root. store Inside , create two folders: and . store actions states Inside , create a file. states globalStates.ts https://gist.github.com/Daltonic/f542e5769c9f9f92009c0ab97e26ffe0?embedable=true Inside , create a file. actions globalActions.ts https://gist.github.com/Daltonic/9d5487e2e3f2517b36a1a38805e5c989?embedable=true Create a file inside the folder. globalSlices.ts store https://gist.github.com/Daltonic/0af23b96f972b0f3a934c4a26b90286d?embedable=true Create an file inside the folder. index.ts store https://gist.github.com/Daltonic/7b7ec88441e0b03b3c11ada05aa49104?embedable=true Update the file with the Redux provider. pages/_app.tsx https://gist.github.com/Daltonic/b13c27143cfd13d5e2949a8e530f160d?embedable=true We have implemented Redux toolkit in our application and plan to revisit its usage when integrating the backend with the frontend. Smart Contract Development Next, we'll develop the smart contract for our platform: Create a folder at the project root. contracts Inside , create a file and add the contract code below. contracts PlayToEarnX.sol https://gist.github.com/Daltonic/4543f76e6a0731a8795f618248d663da?embedable=true The above smart contract is a Play-To-Earn (P2E) gaming platform, which is created with Solidity. The contract integrates features such as game creation, player invitations, score recording, and payout distribution. Here's a breakdown of its logic, function by function: This function initializes the contract. It sets the service fee percentage and assigns initial token parameters. Constructor ( constructor(uint256 _pct) ERC20('Play To Earn', 'P2E') ): This function allows a user to create a new game, specifying the title, description, number of participants, number of winners, start date, and end date. It requires a stake greater than zero and validates all input data. A new game and score structure are created and stored in their respective mappings. createGame Function: This function allows the owner of a game to delete it, provided no participants have joined. It refunds the stake to the game owner and marks the game as deleted. deleteGame Function: This function is an internal function that creates a new player for a game. It increments the total players count, adds the new player to the players mapping, and increases the game's acceptees count. playedSaved Function: This function allows a user to invite another player to a game. It checks if the game exists and if there is room for more players. An invitation is then created and added to the invitationsOf mapping. invitePlayer Function: This function allows a user to accept an invitation to a game, provided they send enough funds to cover the game's stake. It creates a new player for the game and updates the invitation status. acceptInvitation Function: This function allows a user to reject an invitation. rejectInvitation Function: This function handles the payout distribution at the end of a game. It checks if the game has ended and if it has not already been paid out. It calculates the total stakes, platform fee, creator fee, and game revenue. It pays out the platform fee to the contract owner, the creator fee to the game owner, and distributes the game revenue among the winners. It also mints new tokens for the winners. payout Function: This function sorts players based on their scores. It uses a simple bubble sort algorithm with a twist: it also takes into account whether a player has played the game or not. Players who have not played are sorted to the bottom. sortScores Function: This function allows a player to save their score for a game. It validates the game and player, then updates the player's score. saveScore Function: This function allows the contract owner to change the service fee percentage. setFeePercent Function: These functions return lists of games based on different criteria (all games, games that have been paid out, and games owned by the caller). getGames, getPaidOutGames, getMyGames Functions: This function returns the details of a specific game. getGame Function: This function returns all invitations for a specific game. getInvitations Function: This function returns all invitations received by the caller. getMyInvitations Function: This function returns all scores for a specific game. getScores Function: This internal function sends funds to a specified address. payTo Function: This internal function returns the current timestamp. currentTime Function: Contract Deployment and Seeding Now, let's deploy our smart contract and populate it with some dummy data: Create a folder at the project root. scripts Inside , create a and a file and add the following codes. scripts deploy.js seed.js Deploy Script https://gist.github.com/Daltonic/de4cb519cefa6baa8d3b2d37b24c6afd?embedable=true Seed https://gist.github.com/Daltonic/723ba48f1f3c7fdac38225afc5eb3466?embedable=true Run the following commands to deploy the contract and seed it with data: yarn hardhat node # Run in terminal 1 yarn hardhat run scripts/deploy.js # Run in terminal 2 yarn hardhat run scripts/seed.js # Run in terminal 2 If you did that correctly, you should see a similar output like the one below: At this point we can start the integration of our smart contract to our frontend. https://www.youtube.com/watch?v=fJIiqeevqoU&embedable=true Frontend Integration First, create a folder at the project root, and inside it, create a file. This file will contain functions to interact with our smart contract. services blockchain.tsx https://gist.github.com/Daltonic/1a1fc8d33d508ea39a8bdc640a3072ec?embedable=true The above code is a service that interacts with our Play-To-Earn gaming smart contract on the chain. It uses the library to interact with the Ethereum blockchain for contract interaction. Ethers.js Here's a detailed breakdown of its functions: This function sets up a connection to the Ethereum blockchain and the smart contract. It uses the ethers library to create a provider (to interact with the Ethereum blockchain) and a signer (to sign transactions). Then, it creates a contract instance that can be used to interact with the smart contract. getEthereumContracts Function: This function retrieves the owner of the contract. It calls the owner function of the contract, which is defined in the OpenZeppelin's Ownable contract. getOwner Function: These functions retrieve information about the games. They call the corresponding functions in the contract and structure the returned data. getGames, getMyGames, getGame Functions: These functions retrieve information about the game invitations. They call the corresponding functions in the contract and structure the returned data. getInvitations, getMyInvitations Functions: This function retrieves scores of a game. It calls the corresponding function in the contract and structures the returned data. getScores Function: This function creates a new game by calling the createGame function of the contract. It checks if the browser provider is installed and handles any errors that might occur. createGame Function: This function deletes a game by calling the deleteGame function of the contract. It checks if the browser provider is installed and handles any errors that might occur. deleteGame Function: This function invites a player to a game by calling the invitePlayer function of the contract. It checks if the browser provider is installed and handles any errors that might occur. invitePlayer Function: This function saves a player's score by calling the saveScore function of the contract. It checks if the browser provider is installed and handles any errors that might occur. saveScore Function: This function handles payout distribution by calling the payout function of the contract. It checks if the browser provider is installed and handles any errors that might occur. payout Function: This function allows a user to respond to an invitation by calling either the acceptInvitation or rejectInvitation function of the contract, based on the user's response. It checks if the browser provider is installed and handles any errors that might occur. respondToInvite Function: These functions structure the data returned from the contract into a more manageable format. They convert the data types from the contract's format to JavaScript's format and sort the data. structuredGames, structuredInvitations, structuredScores Functions: Next, update the file inside to include the network using the following codes. provider.tsx services bitfinity https://gist.github.com/Daltonic/5cfe4e97fe6d258a256f76c46cb7beaa?embedable=true Page Interacting with Smart Contract Next, we'll link the functions in the blockchain service to their respective interfaces in the frontend: Update to get data from the function. No 1:  Displaying Available Games pages/index.tsx getGames() https://gist.github.com/Daltonic/c275c2e007ad1d8ca56c2b5adc5f21c3?embedable=true Update to get data from the function. No 2:  Displaying User’s Games pages/games.tsx getMyGames() https://gist.github.com/Daltonic/c0226ed85d75fb5c1ea39909ab692b05?embedable=true Notice how we combined to dispatch the games into the store before rendering on screen. useEffect() Update to get data from the function. No 3:  Displaying User’s Invitations pages/invitations.tsx getMyInvitations() https://gist.github.com/Daltonic/d10d5dca4d8c8d7423345bbd39e83cbc?embedable=true We also combined to dispatch the invitations into the store before rendering on screen. useEffect() Update to use the , , and to retrieve a game invitations by specifying the game Id. No 4: Displaying Game Invitations pages/invitations/[id].tsx getServerSideProps() getGame() getInvitations() https://gist.github.com/Daltonic/232c8a64779ababf873a3e94e609b11d?embedable=true Update to use the , , and to retrieve a game players by specifying the game Id. No 5: Showcasing a Gameplay pages/gameplay/[id].tsx getServerSideProps() getGame() getScores() https://gist.github.com/Daltonic/fb73e1ed6f11043a5e63a6df903392ed?embedable=true The script mentioned above is the core of the frontend code for this page. It contains the necessary functions and behaviors to create a memory game where users can compete against each other. Update to use the , , and to retrieve a game score by specifying the game Id. No 6: Displaying Game Result pages/results/[id].tsx getServerSideProps() getGame() getScores() https://gist.github.com/Daltonic/e448bc7e13356314d7e7169dfd5d43ad?embedable=true It's worth mentioning that users can make a payout from this page after the game duration has ended. Components with Smart Contract Let's apply the same approach we used for the previous pages and update the following components to interact with the smart contract. Update file to use the function to call the function for form submission. No 1: Creating New Games components/CreateGame.tsx handleGameCreation() createGame() https://gist.github.com/Daltonic/6106948a6b3d49896ec1bb6847b51bad?embedable=true Update file to use the function to call the function. No 2: Handling Game Deletion components/GameActions.tsx handleDelete() deleteGame() https://gist.github.com/Daltonic/593b697b274e0fab608801bbc7e5515f?embedable=true Update file to use the function to call the function. No 3: Displaying Game Details Modal components/GameDetails.tsx closeModal() setResultModal() https://gist.github.com/Daltonic/f89025c44a207a710cf04ac79515d9dd?embedable=true Update file to use the function to call the function. No 4: Inviting Players components/GameInvitation.tsx handleResponse() respondToInvite() https://gist.github.com/Daltonic/4405f7b64b34177e6be707d29301ab25?embedable=true Update file to use the function to call the function. No 5: Launching Game Details Modal components/GameList.tsx openModal() setResultModal() https://gist.github.com/Daltonic/877971532ffa1a1e364bc1fb8ba03234?embedable=true Please note that this function actually launches the game details modal, that’s a little oversight in function name. setResultModal() Update file to the function, this will help us launch the create game form modal. No 6: Launching the Create Game Modal components/Hero.tsx dispatch setCreateModal() https://gist.github.com/Daltonic/cb1c9ee1024f9219a9813fc261d4befd?embedable=true Lastly, update file to use the function to call the function. No 7: Launching the Invite Modal components/InviteModal.tsx sendInvitation() invitePlayer() https://gist.github.com/Daltonic/6ca046aef2762c32a7c382b9c648d29f?embedable=true The project is now complete as all components and pages are connected to the smart contract through the implementation of these updates. If your Next.js server was offline, you can bring it back up by executing the command . yarn dev For further learning, we recommends watch the full video of this build on our and . YouTube channel visiting our website for additional resources https://www.youtube.com/watch?v=zi_6RWkOB1w&embedable=true Conclusion In this tutorial, we've successfully built a decentralized Play-To-Earn platform using Next.js, TypeScript, and Solidity. We've established the development environment, constructed the Redux store, and deployed our smart contract to our local chain. By merging the smart contract with the frontend, we've ensured a seamless gaming experience. This guide has equipped you with the skills to create dynamic interfaces, craft Ethereum smart contracts, manage shared data with Redux, and interact with smart contracts from the frontend. Now, you're ready to create your own Web3 Play-To-Earn platform. Happy coding! About Author I am a web3 developer and the founder of Dapp Mentors, a company that helps businesses and individuals build and launch decentralized applications. I have over 7 years of experience in the software industry, and I am passionate about using blockchain technology to create new and innovative applications. I run a where I share tutorials and tips on web3 development, and I regularly post articles online about the latest trends in the blockchain space. YouTube channel called Dapp Mentors Stay connected with us, join communities on Discord: Join X-Twitter: Follow LinkedIn: Connect GitHub: Explore Website: Visit

How to Build a Web3 Play-To-Earn Platform with Next.js, Typescript, and Solidity

What you will be building, see the at Bitfinity test network and the . live demo git repo Introduction Welcome to our second comprehensive guide on “Building a Decentralized House Rental Platform with Next.js, Redux, and Solidity”. We'll be developing a Decentralized House Rental Platform using Next.js, Solidity, and TypeScript. Throughout this tutorial, you'll gain a clear understanding of the following: Building dynamic interfaces with Next.js Crafting Ethereum smart contracts with Solidity Incorporating static type checking using TypeScript Deploying and interacting with your smart contracts Understanding the fundamentals of blockchain-based rental platforms By the end of this guide, you will have a functioning decentralized platform where users can list and rent houses, all managed and secured by Ethereum smart contracts. As an added incentive for participating in this tutorial, we're giving away a copy of our prestigious book on becoming an in-demand Solidity developer. This offer is free for the first 300 participants. For instructions on how to claim your copy, please watch the short video below. Prerequisites You will need the following tools installed to build along with me: Node.js Yarn Git Bash MetaMask Next.js Solidity Redux Toolkit Tailwind CSS To set up MetaMask for this tutorial, please watch the instructional video below: https://www.youtube.com/watch?v=qV1mbFOtkxo&embedable=true Once you have successfully completed the setup, you are eligible to receive a free copy of our book. To claim your book, . please fill out the form to submit your proof-of-work With that said, let’s jump into the tutorial and set up our project. Setup We'll start by cloning a prepared frontend repository and setting up the environment variables. Run the following commands: git clone https://github.com/Daltonic/dappBnbX
cd dappBnbX
yarn install
git checkout no_redux Next, create a file at the root of the project and include the following keys: .env NEXT_PUBLIC_RPC_URL=http://127.0.0.1:8545
NEXT_PUBLIC_ALCHEMY_ID=<YOUR_ALCHEMY_PROJECT_ID>
NEXT_PUBLIC_PROJECT_ID=<WALLET_CONNECT_PROJECT_ID>
NEXTAUTH_URL=http://localhost:3000
NEXTAUTH_SECRET=somereallysecretsecret Replace and with your respective project IDs. <YOUR_ALCHEMY_PROJECT_ID> <WALLET_CONNECT_PROJECT_ID> : : YOUR_ALCHEMY_PROJECT_ID Get Key Here WALLET_CONNECT_PROJECT_ID Get Key Here Finally, run to start the project. yarn dev Our frontend is ready for smart contract integration, but we need to implement Redux to enable shared data space. Building the Redux Store The above image represents the structure of our Redux store, it will be simple since we are not creating some overly complex project. We'll set up Redux to manage our application's global state. Follow these steps: Create a folder at the project root. store Inside , create two folders: and . store actions states Inside , create a file. states globalStates.js https://gist.github.com/Daltonic/730e0819128d70d5881e00f5d8429e08?embedable=true Inside , create a file. actions globalActions.js https://gist.github.com/Daltonic/fa755c554d2d4bcb3768f17b5075f976?embedable=true Create a file inside the folder. globalSlices.js store https://gist.github.com/Daltonic/47f743789f5d7b075c193cddafcb948e?embedable=true Create an file inside the folder. index.js store https://gist.github.com/Daltonic/187fbf81056b88f2723da8b701f81ea2?embedable=true Update the file with the Redux provider. pages/_app.jsx https://gist.github.com/Daltonic/9c242246cfaa297a1b1bb6c90ac4457a?embedable=true We have implemented Redux toolkit in our application and plan to revisit its usage when integrating the backend with the frontend. Smart Contract Development Next, we'll develop the smart contract for our platform: Create a folder at the project root. contracts Inside , create a file and add the contract code below. contracts DappBnb.sol https://gist.github.com/Daltonic/ba8ddb07089839d2d8219b15a2f97787?embedable=true The contract represents a decentralized house rental platform where users can list apartments for rent, book available apartments, and leave reviews. DappBnb Let's go through each part of the contract: The contract imports , , and from the OpenZeppelin library. provides basic authorization control functions, is used for counting variables, and helps prevent re-entrancy attacks. Contract Setup and Libraries: Ownable Counters ReentrancyGuard Ownable Counters ReentrancyGuard The contract defines three structs: , , and . These define the data structures for apartments, bookings, and reviews respectively. Struct Definitions: ApartmentStruct BookingStruct ReviewStruct The contract declares several state variables, including security fees, tax percentages, and mappings to keep track of apartments, bookings, reviews, and other related data. State Variables: The constructor function initializes the and state variables. Constructor: taxPercent securityFee Functions like , , , , and are used to manage apartment listings on the platform. Apartment Functions: createApartment updateApartment deleteApartment getApartments getApartment Functions like , , , , , , , and are used to manage the booking process and interactions between tenants and apartment owners. Booking Functions: bookApartment checkInApartment claimFunds refundBooking getUnavailableDates getBookings getQualifiedReviewers getBooking The and functions manage the review process, allowing tenants to leave reviews for apartments they've booked. Review Functions: addReview getReviews The and functions are utility functions used in multiple other functions. is used to transfer funds between addresses, and returns the current block timestamp. Utility Functions: payTo currentTime payTo currentTime Contract Deployment and Seeding Now, let's deploy our smart contract and populate it with some dummy data: Create a folder at the project root. scripts Inside , create a and a file and add the following codes. scripts deploy.js seed.js Deploy Script https://gist.github.com/Daltonic/33dd48c1b599610d7fa5e81e838ae9d7?embedable=true Seed Script https://gist.github.com/Daltonic/5b258259081ddcf8d0b8ce5f6960e7bf?embedable=true Run the following commands to deploy the contract and seed it with data: yarn hardhat node # Run in terminal 1 yarn hardhat run scripts/deploy.js # Run in terminal 2 yarn hardhat run scripts/seed.js # Run in terminal 2 If you did that correctly, you should see a similar output like the one below: At this point we can start the integration of our smart contract to our frontend. https://www.youtube.com/watch?v=Ubom39y5jX8&embedable=true Frontend Integration First, create a folder at the project root, and inside it, create a file. This file will contain functions to interact with our smart contract. services blockchain.jsx https://gist.github.com/Daltonic/b6fc5166eb220378d79f854f125ce804?embedable=true The above script is a service that interacts with a smart contract deployed on the chain. In a joint effort with EthersJs, it provides functions to read and write data on the blockchain via the contract's methods. Here's a breakdown of the functions: This function establishes a connection to the Ethereum network either through a browser provider (if available) or via a JSON-RPC endpoint. It then creates an instance of the smart contract using its ABI and address. If a user is connected via their wallet, the contract instance is linked to the user's account. Otherwise, a random account is generated and linked to the contract. getEthereumContracts: These functions fetch all apartments and a specific apartment respectively from the smart contract. getApartments, getApartment: Fetches all bookings for a specific apartment from the smart contract. getBookings: Fetches all addresses that are qualified to leave reviews for a specific apartment. getQualifiedReviewers: Fetches all reviews for a specific apartment from the smart contract. getReviews: Fetches all dates that are booked for a specific apartment from the smart contract. getBookedDates: Fetches the security fee from the smart contract. getSecurityFee: These functions allow a user to create, update, and delete apartments respectively. createApartment, updateApartment, deleteApartment: This function allows a user to book an apartment for specific dates. bookApartment: This function allows a user to check into an apartment. checkInApartment: This function allows a user to get a refund for a booking. refundBooking: This function allows a user to add a review for an apartment. addReview: Update the file inside to include the network using the following codes. provider.jsx services bitfinity https://gist.github.com/Daltonic/a811673bd1fe4b0c0011ae1b3b59af0d?embedable=true Page Interacting with Smart Contract Next, we'll link the functions in the blockchain service to their respective interfaces in the frontend: Update to get data from the function. No 1:  Displaying Available Apartments pages/index.jsx getApartments() https://gist.github.com/Daltonic/e9f1338669629696eb0502dc75331c25?embedable=true Update to use the , , and the other functions to retrieve apartment and booking details by the room’s Id. No 2: Displaying Single Apartment pages/room/[roomId].jsx getServerSideProps() getApartment() getBookedDates() https://gist.github.com/Daltonic/644a31568918fbf7d2d7149ae89124db?embedable=true Update to use the function for form submission. No 3: Creating New Apartments pages/room/add.jsx createApartment() https://gist.github.com/Daltonic/6435864d609e010ec5e8cc775254cdf3?embedable=true Update to use the function to retrieve apartment by Id and populate the form fields. No 4: Editing Existing Apartments pages/room/edit/[roomId].jsx getApartment() https://gist.github.com/Daltonic/f231fadbce1d6f58ab53eef044311f33?embedable=true Update to get data from the and functions. No 5:  Displaying All Bookings pages/bookings/roomId.jsx getApartment() getBookings() https://gist.github.com/Daltonic/c4bae4f5f8be07dc1509d7a3cd8623de?embedable=true Components with Smart Contract Like we did with the pages above, let’s Update the following components to interact with the smart contract: Update file to use the function to call the functions. No 1: Handling Apartment Deletion components/Actions.jsx handleDelete() deleteApartment() https://gist.github.com/Daltonic/b66fcb35c423e2795c1328388f6870bc?embedable=true Update modal to use the function to call the function. No 2: Adding Reviews to Apartment components/AddReview.jsx handleSubmit() addReview() https://gist.github.com/Daltonic/6901c666280934c5e9b8b6c145d449f5?embedable=true Observe how Redux was used to open and close the review modal. Update file to use the and functions. No 3: Adding Reviews to Apartment components/Booking.jsx handleCheckIn() handleRefund() https://gist.github.com/Daltonic/4042c750d7a8741af607aabaebbfd3fd?embedable=true Lastly, update file to use the function to call the function. No 4: Adding Reviews to Apartment components/Calendar.jsx handleSubmit() bookApartment() https://gist.github.com/Daltonic/438126facc462f32cc78d4b5a3514413?embedable=true Also notice that we are using Redux to retrieve the security fee which is necessary to calculate the cost of booking an apartment. The project is now complete as all components and pages are connected to the smart contract through the implementation of these updates. If your Next.js server was offline, you can bring it back up by executing the command . yarn dev For further learning, we recommend watching the full video of this build on our . YouTube channel https://www.youtube.com/watch?v=Qoa6z6c_wYQ&embedable=true Conclusion In this tutorial, we've built a Decentralized House Rental Platform using Next.js, Redux, and Solidity. We set up the development environment, built the Redux store, and deployed the smart contract to the blockchain. By integrating the smart contract with the frontend, we created a seamless user experience. Throughout the tutorial, you gained valuable skills in building Web3 applications, crafting smart contracts, and incorporating static type checking. You also learned how to use Redux for shared data space and interact with smart contracts from the frontend. Now, you're ready to create your own Decentralized House Rental Platform. Happy coding and unleash your innovation in the world of Web3! About Author I am a web3 developer and the founder of Dapp Mentors, a company that helps businesses and individuals build and launch decentralized applications. I have over 7 years of experience in the software industry, and I am passionate about using blockchain technology to create new and innovative applications. I run a where I share tutorials and tips on web3 development, and I regularly post articles online about the latest trends in the blockchain space. YouTube channel called Dapp Mentors Discord: X-Twitter: LinkedIn: GitHub: Website: Stay connected with us, join communities on Join Follow Connect Explore Visit

How to Build a Decentralized House Rental Platform with Next.js, Redux, and Solidity

What you will be building, see the at Bitfinity test network and the . live demo git repo Introduction Welcome to this comprehensive guide where we'll build a Web3 Decentralized Charity Platform using Next.js, Solidity, and TypeScript. By the end of this tutorial, you'll have a clear understanding of: Building dynamic interfaces with Next.js Crafting Ethereum smart contracts with Solidity Incorporating static type checking using TypeScript Deploying and interacting with your smart contracts Understanding the fundamentals of blockchain-based charity platforms As a bonus for partaking in this tutorial, you can easily win a copy of our prestigious book on becoming an in-demand developer. This offer is free for the first , for instructions on how to win watch the short video below. solidity 300 people Prerequisites You will need the following tools installed to build along with me: Node.js Yarn Git Bash MetaMask Next.js Solidity Redux Toolkit Tailwind CSS To set up MetaMask for this tutorial, please watch the instructional video below: https://www.youtube.com/watch?v=qV1mbFOtkxo&embedable=true Once you have completed the setup, you are eligible to receive a free copy of our book. To claim your book, . please fill out the form to submit your proof-of-work Watch the following to receive up to 3-months of free premium courses on instructional videos Dapp Mentors Academy, including: Fullstack NFT Minting Course Fullstack NFT Marketplace Course Fullstack Blockchain Course etc. Start your journey with Bitfinity today. Experience a fast, simple, and hassle-free development process as you build your first Charity Donation Tracking dApp. Deploy your smart contracts to the Bitfinity network and make a positive impact. With that said, let’s jump into the tutorial and set up our project. Setup We'll start by cloning a prepared frontend repository and setting up the environment variables. Run the following commands: git clone https://github.com/Daltonic/dappFundsX
cd dappFundsX
yarn install
git checkout no_redux_no_blockchain Next, create a file at the root of the project and include the following keys: .env NEXT_PUBLIC_RPC_URL=http://127.0.0.1:8545
NEXT_PUBLIC_ALCHEMY_ID=<YOUR_ALCHEMY_PROJECT_ID>
NEXT_PUBLIC_PROJECT_ID=<WALLET_CONNECT_PROJECT_ID>
NEXTAUTH_URL=http://localhost:3000
NEXTAUTH_SECRET=somereallysecretsecret Replace and with your respective project IDs. <YOUR_ALCHEMY_PROJECT_ID> <WALLET_CONNECT_PROJECT_ID> : : YOUR_ALCHEMY_PROJECT_ID Get Key Here WALLET_CONNECT_PROJECT_ID Get Key Here Finally, run to start the project. yarn dev Our frontend for this project is solid and ready for some smart contract integration, but we will need Reduxify our application to enable a shared data space. Building the Redux Store The above image represents the structure of our Redux store, it will be simple since we are not creating some overly complex project. We'll set up Redux to manage our application's global state. Follow these steps: Create a folder at the project root. store Inside , create two folders: and . store actions states Inside , create a file. states globalStates.ts https://gist.github.com/Daltonic/157a49fef39e3a1ac8b9a8883c6213f8?embedable=true Inside , create a file. actions globalActions.ts https://gist.github.com/Daltonic/c2217eff616b28a2261888ba77c236e7?embedable=true Create a file inside the folder. globalSlices.ts store https://gist.github.com/Daltonic/69a29357cf1b9484425776a6ad4b26dd?embedable=true Create an file inside the folder. index.ts store https://gist.github.com/Daltonic/7b3a9db8902d8ce831384ad42ca7231b?embedable=true Update the file with the Redux provider. pages/_app.ts https://gist.github.com/Daltonic/ef67f453bc38c4038edc627644d25e2a?embedable=true Our application has been wrapped with Redux toolkit, and we will revisit Redux when integrating the backend with the frontend. Smart Contract Development Next, we'll develop the smart contract for our platform: Create a folder at the project root. contracts Inside , create a file and add the contract code below. contracts DappFund.sol https://gist.github.com/Daltonic/4e3f367d2b3a2227c951e74f4d58cbe8?embedable=true The contract will facilitate the creation, update, and donation to charities, as well as administrative functions like changing the charity tax and banning a charity. DappFund Here is a function-by-function breakdown: : This function sets the initial charity tax when the contract is deployed. It's executed only once during the contract's deployment. constructor() : This function allows users to create a new charity. It requires several parameters such as the name, description, image, profile, and amount of the charity. It checks that these parameters are valid and then creates a new and adds it to the mapping. createCharity() CharityStruct charities : This function allows the owner of a charity to update its details. It checks that the charity exists and that the sender is the owner of the charity before updating the charity's details. updateCharity() : This function allows the owner of a charity to mark it as deleted. It checks that the charity exists and that the sender is the owner of the charity before marking it as deleted. deleteCharity() : This function allows the contract owner to ban or unban a charity. It checks that the charity exists before toggling its banned status. toggleBan() : This function allows users to donate to a charity. It checks that the charity exists, is not banned, and has not yet reached its fundraising goal. It then increments the total donation count, creates a new , and adds it to the mapping. It also updates the raised amount and donation count of the charity. donate() SupportStruct supportersOf : This function allows the contract owner to change the charity tax. It checks that the new tax percentage is valid before updating the tax. changeTax() : This function allows anyone to get the details of a charity. It returns the associated with the given ID. getCharity() CharityStruct : This function allows anyone to get the details of all active charities. It returns an array of objects. getCharities() CharityStruct : This function allows a user to get the details of all their active charities. It returns an array of objects. getMyCharities() CharityStruct : This function allows anyone to get the details of all supporters of a specific charity. It returns an array of objects. getSupports() SupportStruct : This internal function is used to transfer funds. It sends the specified amount of Ether to the given address. payTo() : This internal function returns the current time in seconds since the Unix Epoch. It's used to timestamp donations and charity creations. currentTime() Contract Deployment and Seeding Now, let's deploy our smart contract and populate it with some dummy data: Create a folder at the project root. scripts Inside , create a and a file and add the following codes. scripts deploy.js seed.js Deploy Script https://gist.github.com/Daltonic/e4038d184c36bf69ac9b6b75da321ca1?embedable=true Seed Script https://gist.github.com/Daltonic/65ca0f2dfdf0ec91bfcf78f49654b36e?embedable=true Run the following commands to deploy the contract and seed it with data: yarn hardhat node # Run in terminal 1 
yarn hardhat run scripts/deploy.js # Run in terminal 2 
yarn hardhat run scripts/seed.js # Run in terminal 2 If you did that correctly, you should see a similar output like the one below: At this point we can start the integration of our smart contract to our frontend. https://www.youtube.com/watch?v=mVxRzkvX_w0&embedable=true Frontend Integration First, create a folder at the project root, and inside it, create a file. This file will contain functions to interact with our smart contract. services blockchain.tsx https://gist.github.com/Daltonic/449b493fe7492386f6221329f3ee918b?embedable=true The provided code is a TypeScript implementation of our blockchain service for interacting with our smart contract. This service enables users to perform actions on our charity platform, including creating and updating charities, making donations, and more. Here is a function-by-function breakdown: : This function gets the Ethereum contract instances that the service will interact with. It checks if the user has a connected Ethereum account and uses that to interact with the contract, otherwise, it uses a randomly created wallet. getEthereumContracts() : This function returns the owner of the contract. getAdmin() , , : These functions fetch all charities, the charities created by the current user, and a specific charity by its ID, respectively. getCharities() getMyCharities() getCharity() : This function fetches the supporters of a specific charity by its ID. getSupporters() , : These functions allow a user to create a new charity or update an existing charity, respectively. createCharity() updateCharity() : This function allows a user to make a donation to a specific charity. makeDonation() : This function allows the owner of a charity to delete it. deleteCharity() : This function allows the contract owner to ban a charity. banCharity() , : These are helper functions that structure the returned data from the contract into a more usable format. structuredCharities() structuredSupporters() Update the file inside to include the network using the following codes. provider.tsx services bitfinity https://gist.github.com/Daltonic/88476a8b642f0d1f879644ce7521e735?embedable=true Page Interacting with Smart Contract Next, we'll link the functions in the blockchain service to their respective interfaces in the frontend: Update to get data from the function. No 1:  Displaying all Charities pages/index.tsx getCharities() https://gist.github.com/Daltonic/c7b5205c0a352e715ea6d369c4c5a739?embedable=true Notice how Redux is used to store blockchain data before it is displayed on the screen. Update to use the hook to get the current user’s charities. No 2: Displaying User’s Charities pages/projects.tsx useEffect() https://gist.github.com/Daltonic/55de269f6d41727ad2ca283adfea241e?embedable=true Please note the use of the hook to retrieve the current user's charities and how Redux is used to handle and display data from the blockchain across multiple components. This will be a repeated pattern across the pages and components. useEffect() Update to use the function for form submission. No 3: Creating New Charities pages/donations/create.tsx createCharity() https://gist.github.com/Daltonic/58f3f813b5ee8bad45815545734c7410?embedable=true Update to use the , and functions to retrieve charity and supporters by Id. No 4: Displaying Single Charity pages/donations/[id].tsx getServerSideProps() getCharity() getSupporters() https://gist.github.com/Daltonic/96c4908e8a5406ab4e85822bb16a4b6f?embedable=true Update to use the function to retrieve charity by Id and populate the form fields. No 5: Editing Existing Charities pages/donations/edit/[id].tsx getCharity() https://gist.github.com/Daltonic/045ec20e60ba4aaac4d9ae62620bff51?embedable=true Did you see how the function was used to retrieve charity by Id and also how it was used to populate the form fields? getCharity() Components with Smart Contract Like we did with the pages above, let’s Update the following components to interact with the smart contract: Update to use the function to call the function. No 1: Handling Charity Banning components/Ban.tsx handleBanning() banCharity() https://gist.github.com/Daltonic/3890759a4c5a9d83b292c1e8cbb31d91?embedable=true Update file to use the and functions to execute a charity unlisting procedure. No 2: Handling Charity Deletion components/Delete.tsx handleDelete() deleteCharity() https://gist.github.com/Daltonic/a9dd133448062c32990435e9a762d17d?embedable=true Update file to use the function to send the payment to the smart contract using the function. No 3: Making Donations to Charities components/Donor.tsx handleSubmit() makeDonation() https://gist.github.com/Daltonic/9e82883fd17884330d2a82d5cf641eae?embedable=true Other Components Here are the rest of the components you should also update because the integration of Redux in them. Review and update the component that enables users to navigate, delete, and edit charity information. Utilize Redux to trigger the delete modal upon clicking. The NavBtn Component https://gist.github.com/Daltonic/38280dec93f6046187f4e438dbbb9007?embedable=true Review and update the implementation of Redux to trigger the donation, supporters, and ban modals upon clicking their respective buttons. The Payment Component https://gist.github.com/Daltonic/37f2724bec3380f9ff6dbf7771278541?embedable=true Review and update the implementation of Redux to close the supporters modal when the close button is clicked. The Supports Component https://gist.github.com/Daltonic/59c6788386f9e0bc28b93094da25fa14?embedable=true By implementing these updates, all components and pages are now connected to the smart contract, marking the completion of the project. If your server was down all this while, you can spin it up again by running . Nextjs yarn dev For further learning, we recommend watching the full video of this build on our . YouTube channel Conclusion In this tutorial, we've built a Decentralized Charity Platform using Next.js, Solidity, and TypeScript. We set up the development environment, built the Redux store, and deployed the smart contract to the blockchain. By integrating the smart contract with the frontend, we created a seamless user experience. Throughout the tutorial, you gained valuable skills in building Web3 applications, crafting smart contracts, and incorporating static type checking. Now, you're ready to create your own Decentralized Charity Platform. Happy coding and unleash your innovation in the world of Web3!

How to Build a Decentralized Charity Platform with Next.js, TypeScript, and Solidity

Next.js, TypeScript এবং সলিডিটি সহ কীভাবে একটি বিকেন্দ্রীভূত দাতব্য প্ল্যাটফর্ম তৈরি করবেন

So bauen Sie eine dezentrale Wohltätigkeitsplattform mit Next.js, TypeScript und Solidity auf

Cómo construir una plataforma benéfica descentralizada con Next.js, TypeScript y Solidity

Comment créer une plateforme caritative décentralisée avec Next.js, TypeScript et Solidity

Next.js, टाइपस्क्रिप्ट और सॉलिडिटी के साथ एक विकेंद्रीकृत चैरिटी प्लेटफ़ॉर्म कैसे बनाएं

Next.js、TypeScript、Solidity を使用して分散型慈善プラットフォームを構築する方法

Next.js, TypeScript 및 Solidity를 사용하여 분산형 자선 플랫폼을 구축하는 방법

Como construir uma plataforma de caridade descentralizada com Next.js, TypeScript e Solidity

Как создать децентрализованную благотворительную платформу с помощью Next.js, TypeScript и Solidity

Next.js, TypeScript ve Solidity ile Merkezi Olmayan Yardım Platformu Nasıl Oluşturulur

Cách xây dựng nền tảng từ thiện phi tập trung với Next.js, TypeScript và Solidity

如何使用 Next.js、TypeScript 和 Solidity 构建去中心化慈善平台

133 Stories To Learn About Solidity

Content Overview What is dApp? What client-side technologies should be used for a dApp? Which type of domain should you choose? Authentication: MetaMask's Dark Side Blockchain Selection: Which Chains Are Best for dApps? Funding Your Idea Through Grants What is dApp? The commonly accepted definition of a is, in short, an application that can operate autonomously using a distributed ledger system. At first glance, it seems straightforward. But, when you begin to question and list examples of dApps, it appears most dApps wouldn't qualify. It may even seem as if true dApps don't exist. dApp If one developer tried to explain to another what a dApp is in 2023, they'd probably say, "Well, it's like a website that calls various APIs working with blockchain." Just like that, the magic of the term 'dApp' would vanish. The other developer would think, "What's the big deal? Why so much fuss about it?" The reason is that the genuine concept of dApps has long been sacrificed for user convenience. Originally, the term implied that every instance of the application runs on the user's device. You'd fetch wallet balances from your node, and you'd send transactions from it as well. The application itself should be stored on a distributed storage system resistant to censorship, outages, and attacks. All user-generated data should also be stored in such storage or directly in a blockchain smart contract. It's a captivating concept, but it clashes with reality. Blockchain data can weigh gigabytes or even terabytes. Decentralized storage requires specific software and space for distributed data, isn't as fast as AWS, and often needs specialized browsers. Interacting with smart contracts costs money in cryptocurrency, and purchasing it isn't straightforward for first-timers. Then, factor in the complexity of setup, the need for specialized knowledge, ample free time, and the myriad of blockchains out there. So, dApp developers started offloading the most complex parts for users to separate services, interfacing with them solely via APIs. Now, almost every blockchain has its API. This means dApps have to store settings for each network to cater to more users. While APIs for distributed storage exist, hosting the dApp on them isn't efficient. Most solutions can't compete with web2 in speed and convenience. Hence, such storage systems are only used for tasks where response time isn't a priority. Even on Hackernoon, Arweave is used only for backing up articles. What client-side technologies should be used for a dApp? Well, if we aim to reach the maximum number of people in 2023 and 2024, then client-side web technologies are the way to go for . True, backend technologies like PHP and Python won't cut it, but any framework based on JavaScript/Typescript will do the trick. You can pick from the top 3 frameworks: React, Angular, or Vue.js. However, in my experience, Web3 components for Angular are rarer. My personal choice is React with Typescript. Of course, nobody's stopping you from using plain JavaScript, but why would you? creating a dApp Further, to interact with smart contracts, you'll need some kind of library. The most popular ones are Web3.js and ethers.js. In my opinion, both aren't the most elegant. Their APIs frequently change, and code examples older than a year might not work straight away. My personal pick is ethers.js. Its structure feels more intuitive to me, and compared to Web3.js, the solutions tend to be more concise. In the documentation of various projects, examples are usually provided for at least these two libraries. First and foremost, create an empty project (React + Typescript). npx create-react-app project-name --template typescript Navigate to the project directory. cd project-name Install ethers. This will ensure you have the most up-to-date version. Keep in mind that older examples from the internet might not work without adjustments. npm i ethers Which type of domain should you choose? No, I'm not talking about top-level domains like .com, .org, and the like. I'm discussing whether one should opt for decentralized domains instead of traditional ones. Yes, domains can be decentralized, too. Instead of the usual top-level domains, you might come across ones like .eth, .nft, .wallet, .crypto, and .go. Unfortunately, using them in popular browsers (like Chrome and Safari) without additional extensions won't work. Various companies have been trying for years to establish a domain zone that functions both in web2 and web3. So far, agreements have only been reached with less popular browsers like Opera and Brave. In these browsers, Web3 domains work. So, if your target audience primarily uses the most popular browsers, the choice is clear: you need a Web2 domain. However, if your application becomes popular, domain squatters might purchase a domain with your project's name. When the Web3 revolution takes place and domains become accessible in all browsers, these squatters will likely demand a hefty price for that domain. From this, it emerges that Web3 domains might be worth purchasing as a safeguard against squatters or for a hardcore audience using specific browsers. Furthermore, such domains can serve as an alternative to unreadable wallet addresses. Instead of a complex address like 0x5301b241879e66EC45fD284D3D97A5C51472D6f3, you could use a domain like “mydapp.crypto” to send and receive funds. Authentication: MetaMask's Dark Side Currently, MetaMask stands as the most popular browser extension for storing people's wallet private keys. The private key is the most crucial element - "Not Your Keys, Not Your Crypto.” Entrusting such a vital component to anyone is a no-go, making it preferable to store it on one's device. MetaMask, in this context, allows users to keep their private key locally and doesn't share it with anyone, not even dApps, no matter how nicely they ask. Despite its millions of users, getting started with MetaMask isn't straightforward. One has to go through a myriad of not-so-simple steps to set up an initial empty wallet. And then an equal number of steps are required to fund that wallet. I can confidently say that the next billion users will opt for a different solution. But as of now, it's the industry standard, and . every dApp should support MetaMask But what if I told you there are over a hundred other wallets out there? It would be ideal to support those as well. But don't pull your hair out just yet! Solutions already exist that support all popular wallets. Typically, apart from browser extensions, these solutions also cater to mobile apps, significantly broadening the potential user base. Examples of services you can use are Web3Auth and WalletConnect. Blockchain Selection: Which Chains Are Best for dApps? If you delve into the website of nearly any blockchain project, you're often met with bold claims: their blockchain is the fastest, most user-friendly, cheapest, and boasts millions of users now or will very soon. So, with this vast array of blockchains and ecosystems, how do you pick the right one? In my view, the answer is clear-cut: if the blockchain is EVM-compatible, you're already halfway there. EVM, or Ethereum Virtual Machine, backed by the Ethereum Foundation, is a standard that any blockchain project can adopt. Critically, all tools for testing, debugging, deployment, linting, explorers, etc., will seamlessly integrate with this new chain. This means that if you create a dApp for one EVM-compatible project, it can, with minimal configuration, work across nearly all others. Sounds like magic, right? Regarding non-EVM compatible projects, for them, you must have a clear rationale. Recognize that targeting these chains may limit your user base, offer fewer tools, and present more unprecedented bugs. The smart contract languages also differ, sometimes drastically. Here are the languages used for smart contract development in the top 20 capitalization projects: Solidity, Plutus, and FunC. Each of these languages is tailored specifically for individual blockchains. Grasping each requires considerable time, as their operational principles vary substantially. when developing dApps Of course, you can architect your dApp to operate across a majority of these diverse chains. However, that's an advanced move and quite time-consuming. Straddling two worlds isn't always straightforward. Let's dive right back into building our dApp with the newfound knowledge at our disposal. For this walkthrough, I'll be using the Gnosis Chain as our EVM-compatible blockchain. It's an L2 network that boasts cost-efficient transactions. For several years now, I've deployed a public notes smart contract on it, allowing users to create textual notes under their usernames. You can find it at this address: `0xf6b270136Da7F8a2113B93a3b9Eeaf5160C45bA0`. To read data from this contract, you first need to instantiate a provider. A provider essentially acts as an RPC API to a specific blockchain node. The server delivering the data is already in sync with the blockchain network and provides the most up-to-date state. const provider = new JsonRpcProvider('https://rpc.gnosischain.com/'); To fetch data from our contract, we'll create an instance of `Contract` from `ethers`. const contract = new Contract('0xf6b270136Da7F8a2113B93a3b9Eeaf5160C45bA0', notesAbi, provider); If I had linked my contract address with a .eth domain, then you could access the contract like this. const contract = new Contract('myapp.eth', notesAbi, provider) In this instance, we're passing in my smart contract's address, the provider, and the ABI (Application Binary Interface). The ABI ensures that the node can interpret state data from binary correctly. The ABI content is quite detailed for this article, so I've moved it to a separate URL. Next, we need to prepare the username in the required format to use it for data retrieval: const usernameHash = keccak256(toUtf8Bytes('igor')); Then, you can fetch all the records I've saved in the smart contract like this: const items = await contract.getNotes(usernameHash); You can check out the entire code for `App.tsx` . here Also, a quick heads-up: In the example, I'm using a free provider. If you're scaling a dApp with a significant user base, it might not be suitable. In such cases, you'd either want to set up your node or opt for paid providers from services like Alchemy or Infura. Funding Your Idea Through Grants In the fast-paced world of dApps, innovative ideas can often operate at a loss for extended periods. It's great if you've got a plan to turn a profit swiftly and a few thousand dollars to sustain yourself in the meantime. But if you don't, fret not. Ideas with sound financial potential always catch the eye of venture angels and investors. But in the Web3 universe, innovation is additionally fostered through grants provided by major foundations such as Ethereum, Binance, and Optimism. These grants are often disbursed without any strings attached, either in phases or as a lump sum. Unlike venture capital, grants don't come with the business obligations typical of angel investors. Projects awarded grants from a specific foundation should, in the long run, positively impact that specific ecosystem. The conditions and allocated amounts vary from one foundation to another, with grant amounts ranging from hundreds to hundreds of thousands of dollars. These are often disbursed in the project's native tokens. To gauge if your project idea aligns with a particular grant program, study previously awarded grants and benchmark against your own. Do you think you can deliver something similar or even better? You're likely grant material. But bear in mind that securing a grant can be a long process. Despite being a fantastic avenue to bring your project to life, be prepared for stage to take weeks or even months. The stages you'll navigate are: each Application Preparation. Many grant applications are straightforward. You'll be detailing your idea and showcasing your team's expertise. Put forward a compelling pitch about both the project and the team. Lack of experience in Web3 might reduce your chances of securing a grant. Project Evaluation. After submitting your application, anticipate a long evaluation phase. The higher the grant amount requested, the longer the evaluation. Typically, you'll receive an approval or rejection email. However, some projects might ghost your application. A month post-submission, don't hesitate to follow up on the application status. And feel free to apply to multiple foundations. Some projects might even qualify for grants from various foundations. Just be wary of potential conflicts of interest and clarify the feasibility of securing multiple grants upfront. Contract Signing. Post-grant approval, you'll engage in a phase of document preparation and signing by all committee members. While you can often start working before the contract signing, there's no guarantee that the contract will get finalized. The hold-up isn't always on the foundation's end; sometimes, sanctions might prevent a grant's disbursement based on your citizenship or residency. Project Acceptance. Acceptance of your grant can be slow-paced. Every committee member will thoroughly vet your solution. Prep a top-tier demo of your project since some members might have less technical knowledge and will evaluate based solely on your demo resources: demo sites and video presentations. Grant Payout. Post a successful grant review, the approval decision goes to accounting. Here, too, payments can get held up, especially if multiple people's confirmations are required. Often, these individuals are engaged across various projects, not just grants. To obtain a list of nearly all projects offering grants, search for "List Web3 Grants" online. As you can see, if you have experience in web2 development, not all concepts in web3 will be clear at first. Many things might raise questions. Nevertheless, this article calls for a part 2, where we could build a full-fledged application using different networks, with the capability to store data in a decentralized manner, as well as interact with smart contracts either at the user's expense or the developer's. See you in the next part!

Dive Into dApps: Your Ultimate Guide to Start Crafting Them Today!

An Introduction for the Rest of Us In traditional web3 interactions, users often face the burden of performing repetitive tasks to  enable smart contracts to execute specific actions, such as signing transactions and granting approvals. This manual process can become tedious and time-consuming. However, by utilizing programmable key pairs, an additional layer of abstraction is introduced. With programmable key pairs, developers can incorporate logic into a pair of public/private key systems, allowing smart contracts to autonomously carry out advanced actions like executing transactions and automating tasks. This eliminates the need for constant user interaction, streamlining the user experience and enhancing the capabilities of smart contracts. With this innovation, developers can enhance the onboarding experience for web2 users entering web3 by utilizing seedless phrase wallets, web2 authentication for easy sign-on, and automation services for streamlined interactions with decentralized applications. PKP (Or What We Call Programmable Key Pairs) The creation of programmable key pairs (PKP) involves a technique called Distributed Key Generation (DKG). In DKG, multiple parties or nodes contribute to calculating a shared public and private key set. Each node holds a share of this key for signing purposes. DKG was first introduced in 1991 by Torben Pedersen and later improved upon in 1999 by Rosario Gennaro, Stanislaw Jarecki, Hugo Krawczyk, and Tal Rabin. https://en.wikipedia.org/w/index.php?title=Distributed_key_generation&oldid=1171811810 Lit protocol has popularized the application of DKG in creating PKPs. Lit actions, which are smart contracts written in JavaScript, allow developers to code logic into PKPs and customize applications according to their specific goals. This process provides more flexibility compared to self-custody wallets. In the implementation of pkp from Lit protocol, the distributed key pair is controlled by minting it as an ERC 721 NFT. This process is facilitated through Lit's platform( ). The ERC 721 NFT serves as a "symbol" for controlling the distributed key within the Lit network. https://explorer.litprotocol.com/mint-pkp Only the wallet address or smart contract holding this NFT has the authority to determine its usage, set access permissions, revoke permissions, and control what can be signed using the distributed key. PKP and Self-Custodial Wallets (A Differential Look) Prior to PKPs, self-custodial wallets like Metamask were the main way for users to interact with smart contracts and the blockchain. These wallets give users direct control over their actions and assets, but they are not distributed and can be vulnerable to security flaws. They operate on a one-user-to-one private key system and are not programmable. PKPs represent a groundbreaking approach to smart contracts and blockchain interaction, introducing a wide array of innovative possibilities. These include the design of multi-signature wallets that require multiple signatures before transactions can be executed and the automation of smart contracts, enabling them to take actions without the need for end-user involvement. This opens up opportunities for creating subscription-based decentralized applications (dApps) and enhancing the user experience in Decentralized Finance (DeFi) – a suite of blockchain-based applications providing lending, borrowing, and other financial services within the Web3 ecosystem. In their fundamental form, PKPs are distributed, programmable, and immutable. Through the utilization of Lit Actions, which become unmodifiable once published, PKPs maintain a high level of data integrity. Applying PKPs (A Peek Into Their Goodies) With the added advantage of being programmable, pkps hold a lot of potential to further enhance the web3 experience in building innovative applications and enhancing available ones. These use cases include: Defi Automation When it comes to leveraging cryptocurrency in the world of finance, centralized exchanges offer significant advantages. They are easier to set up and provide a wide array of trading tools, making the process more convenient. One crucial tool is the availability of a limit order system, which allows orders to be executed at specific times or price points. PKPs have the potential to bring this functionality to decentralized exchanges and DeFi platforms. By programming such services into dApps and contracts that leverage the programmability of PKPs, these platforms can achieve similar functionalities. Another important use case for PKPs is the ability to handle recurring payments and subscription-based services, similar to what we see in traditional web2 platforms. With PKPs, the execution of transactions can be automated, making it feasible to implement a system that handles recurring payments seamlessly. This feature brings convenience and efficiency to decentralized applications, allowing users to subscribe to services and make regular payments without manual intervention. Infrastructure Decentralized Key Custodian Due to their distributed nature, PKPs are ideal for creating multi-signature wallets that require multiple signatories to confirm a request before a transaction can be fully executed. This feature enhances security and reduces the risk of unauthorized transactions. Additionally, PKPs open up opportunities for designing wallet systems that utilize a multiple seedless approach, where the private keys are not stored in a single location, further enhancing security. One notable project that offers such a solution is Magic Wallet. Magic Wallet ensures that there is no single point of failure or compromise of private keys, providing users with a robust and secure wallet experience. PKPs also play a crucial role in building cross-chain bridges, facilitating the seamless transfer of tokens between different blockchains. These bridges enable interoperability and liquidity across multiple blockchain networks, allowing users to bridge a specific token from one blockchain to another. PKPs provide the programmability and flexibility necessary to create smart contracts and protocols that facilitate the secure and efficient transfer of assets between blockchains. This functionality is vital for the growth and development of decentralized finance (DeFi) ecosystems, as it enables the integration of different blockchain networks and expands the possibilities for asset utilization and liquidity provision. Web3 Social Token-Gated-Content PKPs are ideal for social platforms that offer exclusive content and rewards based on specific criteria like owning a particular NFT. With their programmability, PKPs allow for conditional logic and executions, automating the distribution of rewards and access to exclusive features. This enhances user engagement, gamification, and transparency while reducing reliance on centralized intermediaries. Account Abstraction with support for Web2 Auth methods and on-chain reputation-building PKP, through Account Abstraction with lit action, provides a way for users to access dApps and applications built on web3 using traditional sign-in methods like Google authentication and more. This approach allows for a seamless onboarding experience for users into web3, eliminating the complexities of handling private keys, while still maintaining the secure and decentralized nature of web3. They can also be utilized to track users' activities on apps that aim to rank users based on their participation and diligence, such as regular posting, liking, or commenting activities. By using PKPs, app developers can securely and transparently monitor and record user actions, which can then be used to calculate user rankings and distribute rewards accordingly. This helps incentivize active user engagement, promote community involvement, and fairly distribute rewards based on user contributions. Gaming Wallet Abstraction and Condition-Based Automation Aside from its potential to seamlessly onboard new gamers that are unfamiliar with web3 wallets They can drastically reduce the time players spend manually claiming in-game rewards and selling in-game assets by automating such actions. Quick Start Guide (A Developer’s Approach) Getting started with PKP is as easy as following the developer documentation on ( ) https://developer.litprotocol.com/v2/ For the purpose of this article, I will take you through a quick start on how to use PKP as a wallet. Minting a PKP To begin working with pkps and using them in application logic, one first needs to mint one. Lit protocol provides various ways of minting a PKP. Let’s explore how to mint via webAuthn which works by presenting valid webAuthn credentials generated by your browser to the lit relayer server. To do this, head over to and follow the provided instructions. https://pkp-walletconnect.vercel.app/ Obtaining an AuthSig To initialize a pkpetherswallet, an AuthSig will be needed in order to authorize signing requests. This can be obtained in the browser using the which can be used to obtain an AuthSig from an Externally Owned Account. checkAndSignAuthMessage() import { checkAndSignAuthMessage } from '@lit-protocol/lit-node-client';

const authSig = await checkAndSignAuthMessage({
  chain: "ethereum",
}); When called, triggers a wallet selection popup in the user's browser. The user is then asked to sign a message, confirming ownership of their crypto address. The signature of the signed message is returned as the authSig variable. checkAndSignAuthMessage() Using PKP as a Wallet A comprehensive breakdown of this process can be obtained from the lit documentation ( ) https://developer.litprotocol.com/v2/pkp/usage/ For a basic walkthrough, an installation of the package is required pkp-ethers npm install @lit-protocol/pkp-ethers After installation, the is then initialized with the AuthSig received earlier, and the PkP public key is generated when a pkp is minted. pkpetherswallet import { PKPEthersWallet } from "@lit-protocol/pkp-ethers";

const pkpWallet = new PKPEthersWallet({
  controllerAuthSig: "<Your AuthSig>",
  // Or you can also pass in controllerSessionSigs
  pkpPubKey: "<Your PKP public key>",
  rpc: "https://chain-rpc.litprotocol.com/http",
});
await pkpWallet.init(); This initialized can then be used to sign messages and transactions pkpwallet Sign a Message const message = "Free the web";
const hexMsg = ethers.utils.hexlify(ethers.utils.toUtf8Bytes(message));
await pkpWallet.signMessage(hexMsg); Sign a Transaction const from = address;
const to = address;
const gasLimit = BigNumber.from("21000");
const value = BigNumber.from("10");
const data = "0x";

// @lit-protocol/pkp-ethers will automatically add missing fields (nonce, chainId, gasPrice, gasLimit)
const transactionRequest = {
  from,
  to,
  gasLimit,
  value,
  data,
};

const signedTransactionRequest = await pkpWallet.signTransaction(
  transactionRequest
); The Present Versus the Future The concept of Web3 and the process of creating a secure wallet can initially seem daunting to the average person, as it may appear to require a high level of expertise or even genius-like intelligence to understand. The idea of protecting keys without any means of recovery can be quite intimidating at first glance. Programmable key pairs seek to eliminate this barrier and make accessing Web3 systems as user-friendly as their Web2 counterparts. Furthermore, PKPs empower developers by providing them with the tools to implement complex logic that would have otherwise been challenging to achieve without their use. Although still in their early stages of development, PKPs are paving the way for a more user-friendly Web3 interaction system. This, in turn, is poised to facilitate the wider dissemination and adoption of Web3 technologies.

Understanding Programmable key Pairs From Lit Protocol: A Guide

Learning from the past to build the new future of the web The Evolution of the Internet as We Know It… As the web evolves, we don't just discard the old structures -- we integrate what's effective into the next generation and refine what doesn’t work. Web1 was like inventing a newspaper that could be delivered anywhere, instantly. A huge 0 to 1 moment, but it looked nothing like the vibrant patchwork of kingdoms that sprung up in web2, when readers transformed into creators, curators, and customers. Web3 and crypto are rooted in a protest against traditional systems, as evidenced by Bitcoin's inception a year after the global financial crash, and a growing skepticism towards centralized control over information (i.e., high-profile account bans, , etc.). This era ignited a desire to transcend the limitations of web2. Cambridge Analytica Web3's philosophy of "read/write/own" emphasizes user ownership and data autonomy. Who ultimately owns your X handle, Gmail address, or Medium articles? Web3 offers irrevocable ownership and verifiable provenance, but it also presents challenges, especially for mainstream adoption. Scholar aptly labels Web3 as the modern , highlighting its transformative power in challenging traditional structures and making information more accessible and open to all. Josh Rosenthal post-Gutenberg renaissance However, if we learned one thing from web2 it's that centralization can be a competitive advantage. Unmediated, web3 shifts the burden to the end user and doesn't offer applications much room to handle convenient features on their behalf. Its nuances and intricacies - wallets, keys, gas, RPCs, block explorers - are all barriers to mainstream adoption. Defining Web2.5 As we architect a new chapter of the web, we integrate proven systems from previous eras. Web2 brought us seamless user experiences, intuitive onboarding, and high-speed applications. In contrast, Web3 introduced concepts like universal identities, unified sources of truth, and clear provenance and ownership. Web2.5 isn't just a halfway point between these two extremes. It aims to synergize the user-centricity of web2 with the transparency and foundational principles of web3. Web2.5 should combine these features in a new way that isn't just a middle ground with the worst of both worlds. Web2.5 merges web2's UX with web3's transparency, sensible primitives, and open standards. This "best tools for the job" model makes trivial sacrifices in centralization for non-trivial leaps in user autonomy and interoperability. Consider a scenario where an application operates on the . While it utilizes a public smart contract for computations in a private environment, it ensures the state is permanently recorded on the blockchain. storage-based consensus paradigm With both inputs and outputs being transparent, yet the computation being centralized, it poses a question: If the integrity of inputs and outputs is verifiable, does it matter that the computation is off-chain? This exemplifies how web2.5  balances the strengths of both web3 and web2, ensuring scalability without compromising power. Building Web2.5 When assessing your tech stack, it's essential to pinpoint which components thrive on Web3's features and which face limitations. Web2, grounded in formal standards like HTTP, REST, DNS, TCP, and IMAP, often sees its boundaries pushed. The rapid evolution of consumer-centric apps and the emergence of isolated ecosystems compel developers to sidestep these standards in pursuit of innovation. Often, maintaining secrecy becomes a centralized company's competitive edge. As a result, web2 tends to resemble a collection of . isolated cathedrals rather than an expansive sprawling bazaar Conversely, web3 offers a paradigm shift. Its foundation on shared, permanent ledgers ensures inherent interoperability, eliminating concerns about deprecated operator APIs. The EOA identity model further exemplifies this shift, making third-party sign-in systems redundant, thanks to the universality of the wallet connect approach. While Web3's robust primitives have immense potential, it's crucial to deploy them judiciously to avoid overwhelming users. Striking the right balance is key ⚖️. The Middleware Paradox Web3 is in its early stages. Many intricate projects targeting mainstream adoption lean heavily on a combination of smart contracts, centralized APIs, and custom middleware. While web2 technology can refine web3's complexities, there's a looming question: Does this compromise the overarching goal of decentralization? Decentralization spans a wide range, and our perspective posits that the blend of verifiable computation and open-source software can balance out centralization, even when channeled through centralized avenues. Yet, a very prevalent threat and concern is the rise of centralized middleware, which could potentially undermine the overall vision of decentralization. In the web2.5 landscape, a typical approach involves managing on-chain activities through a centralized ‘black box’ layer. In this model, the smart contracts are rendered symbolic if they can't be used permissionlessly. This challenge underscores ' motivation to develop . Decent Land Labs MEM Our aim? To champion the Web2.5 era while navigating around the pitfalls of centralized middleware, introducing a new wave of serverless functions ready for Web3. Molecular Execution Machine Unpacking MEM’s Potential empowers web3 developers to build and deploy lightning-fast dApps without the burden of creating middleware from the ground up or grappling with the costs of expensive cloud infrastructure. MEM MEM smart contracts live forever on Arweave, preserving both their state and transaction history. Leveraging efficient , computations are executed in a highly scalable off-chain setting, sidestepping the common constraints and bottlenecks often encountered on chains like Ethereum. SmartWeave's lazy evaluation Anchored by this architectural foundation, MEM provides: . Write MEM contracts in JS, Rust, C++, Solidity, and more. There's no need to deviate from the languages your team is already proficient in. Multi-Lingual Support MEM combines AWS Lambda's scalability with blockchain transparency, ensuring decentralization without compromising UX. Trustless, Serverless Computation: Easily incorporate identity and data, whether from another blockchain or a Web2 source. Universal Interoperability: Integrate MEM seamlessly with any existing stack on any chain or build a future-proof app that isn't anchored to a single ecosystem. Chain-Agnosticism: Your application data will never be lost and will always be accessible, thanks to storage on Arweave. Permanent Storage: MEM applications can be designed to be both gasless and walletless, eliminating tedious setup processes for end users. 🚫 Barrier to Entry: MEM's streamlined programming interface is adaptable across browsers and server context natively, eliminating the need for specialized tooling. Use it just like an API. Intuitive Interface: Regardless of whether a project utilizes a hybrid stack with both on-chain and off-chain elements, or is initiating a Web2.5 build from the ground up, MEM can revolutionize the development landscape by offering a seamless integration of Web2 user-centricity with Web3's transparent principles. It can function as a serverless layer or, as demonstrated by platforms like , , , and , serve as an entire comprehensive backend solution. ANS namespace.gg permacast.app Ark Protocol . 👈 Sign up for the beta and start building here Additional resources Documentation Twitter Discord Stay tuned and to Decent Land Labs on for the latest updates. SUBSCRIBE HackerNoon

Web2.5: Combining Web2 UX With Web3 Primitives

Web2.5: combinación de Web2 UX con primitivas Web3

Web2.5 : combiner l'UX Web2 avec les primitives Web3

Web2.5: Web2 UX को Web3 प्रिमिटिव के साथ संयोजित करना

Web2.5: Web2 UX と Web3 プリミティブの組み合わせ

Web2.5: Combinando Web2 UX com Web3 Primitivos

Web2.5: Kết hợp Web2 UX với Web3 nguyên thủy

Web2.5：将 Web2 UX 与 Web3 原语相结合

About the Everspace is a mobile crypto wallet that offers a fast, safe, and feature-packed experience via a simple, intuitive interface. The wallet allows users to effortlessly purchase crypto assets using a card in a couple of clicks. Users can reap benefits from staking coins on different blockchains, as well as storing crypto assets and NFTs all in one place. The intuitive interface makes it possible to easily swap crypto tokens using different chains with low fees and swift and seamless execution. Everspace Intro So, I continue to review the Everscale ecosystem. I am glad to present an exclusive interview with Vitaliy Gritsai, Everspace Crypto Wallet Product Manager. In this interview, we take a deep dive into Everspace's journey, from ideation to the long-awaited release of the multi-chain wallet. Everspace has attracted significant attention for its cutting-edge approach to integrating cryptocurrencies and NFTs into the gaming experience. Join us to hear from Vitaliy Gritsai, who played a key role in shaping Everspace's product development and strategic vision. Let’s begin! Hello, Vitaly! Can you give us an overview of the benefits and features of Everspace, the non-custodial multichain crypto wallet? Why should users use your wallet instead of others? Sure! Our wallet can work with all common TVM networks (Everscale, TON, Venom), and we support working not only with native coins but also with altcoins based on these networks. Also, our application can work with two more major networks: Ethereum and Binance Smart Chain Our wallet is the most convenient way to view and interact with NFT, and in this direction, we plan to make a qualitative leap forward in the coming months - to integrate our wallet very closely with NFT investment and loyalty platform GrandBazar. Our wallet is the most convenient way of steaking coins EVER (see the last update where we completely revamped this section). Our wallet is the most convenient way to create and interact with multisig wallets - you can create such wallets in networks (Everscale and TON), initiate transactions and see the number of signatures needed to finalize the transaction. Our wallet supports the maximum number of different Smart Contracts of different wallets and, unlike others, provides the user to decide for himself which smart contract to use to create his wallet. We also add all new contracts promptly so that our clients can use Everspace without thinking about it. How does Everspace ensure the security of users' crypto assets within the wallet? Could you tell us more about it? The user's Sid Phrases are stored in specialized secure storage on the user's phone (this is the officially recommended solution from iOS & Android for such information) and are NEVER revealed or sent to the outside world. To access the app, the user is required to set a pin code and, if desired, set up Face ID. A new version will be available soon, in which it will be possible to customize backup settings for phrases so that the risk of loss is minimized (with the user setting a master password for mandatory data encryption) Could you explain the process for setting up and activating a wallet within Everspace? The wallet is set up in a typical way, just like other similar applications: the user installs the application, imports or creates a passphrase, and this passphrase is used to automatically search for his assets in all networks supported by the wallet, after that, the user can fully work with the application. But at the moment, we are working on a version that will significantly change this process and make it even more beautiful and intuitive, as well as significantly expand the possibilities of the user. Are there any specific cryptocurrencies or blockchains that Everspace supports? Everscale +  Altcoins + NFT TON +  Altcoins Venom Ethereum  +  Altcoins BSC  +  Altcoins Does Everspace provide a feature for users to easily exchange or trade their cryptocurrencies within the wallet? We developed this solution, but due to Apple policy and changes on FlatQube, we had to disable this functionality. We are currently working on a solution to restore it. How does Everspace handle transaction fees, and what options are available for users to adjust these fees? The app does not charge any additional fees to the user. Does Everspace offer any additional services or tools to help users manage their crypto investments effectively? Like Portofolio management integrations, etc.? For now, we will focus mainly on integrating with NFT's investment and loyalty platform and expanding our NFT and SBT capabilities. GrandBazar Can you discuss any plans for future development and potential integrations with other platforms or services? We have already implemented for the Everscale network the possibility of working with WalletConnect and supported this mechanism in Everspace. We plan to introduce this method of connection in all system-forming services of the network. Close integration with NFT investment and loyalty platform GrandBazar will be realized. GrandBazar will provide users with advanced possibilities to create and set up loyalty and investment programs on the basis of NFT Everscale for business, and Evespace will be one of the possible client applications for this. Very active work in this direction is now underway. Is Everspace available on multiple platforms, such as web, mobile, or desktop? At the moment, we provide two native apps for iOS and Android. In the future, we may provide a solution for Telegram and the Web. There are no plans to create a browser plugin yet. How does Everspace handle software updates and ensure compatibility with different blockchain networks? Everspace has inbuilt functions to detect and inform users about new versions of the application. If the user updates the Everspace application in a timely manner, then he will not have problems with updates at the network level because our team handles such changes as quickly as possible. Can you provide some examples of use cases where Everspace's multichain functionality can be especially beneficial for users? It's very convenient to have all your assets available to view and manage from a single interface, no need to jump from one app to another. What level of customer support does Everspace offer to address users' questions or concerns? We are as open as possible and try to solve problems very quickly. Unfortunately, it is not always possible to do this day to day, but we strive to do so. Support is provided in general chat in Telegram. Are there any fees associated with using Everspace's wallet services, and if so, how are they structured? No, as long as the app is completely free for users and does not charge any additional fees Can you share any success stories or testimonials from users who have found value in using Everspace as their crypto wallet? We quite often receive positive feedback from our clients, but as we value confidentiality, we do not purposefully collect such information. How are you integrating other networks? Do you plan to integrate the Venom/TON/LayerZero network? We have recently added support for BSC and plan to expand this list further Venom/TON - already supported. What else would you like to tell our readers? I suggest you install our wallet and make your own opinion about it. We will be very grateful if you also write us your impressions of the results it will be very valuable for us. Keep an eye on our updates. This year we will have some really great and interesting innovations. I hope you liked this interview; write comments, share, and like it! If you have any questions or if you need help — you can write me on or . Twitter Linkedin

Exclusive Interview with Everspace Team: From Idea to Multichain Wallet Release

289 Stories To Learn About Typescript

The entire crypto market has of its value, and things are generally not looking so great. While a lot of people in crypto argue that this was caused by a cocktail of causes — such as the Russian-Ukraine war and rising interest rates, there is a reason why Web3 is simply not as resilient as we would like it to be. lost over two trillion These same issues affected traditional finance, and the world did not slip into a worldwide global recession. The problem with Web3, it seems, is that the entire ecosystem is still somewhat exotic. Users have to read blogs and watch videos to learn how to safely use a crypto wallet. They have to download special extensions to connect with certain markets. And through all of this, they still run the significant risk of losing all their money through a hack. Most people don’t want to go through all this. That is the primary reason why Web3 adoption – while encouraging — is still extremely low. The problem is that Web3 has a across all interfaces. It is so complex that most people would just rather not use it. Now, one may argue that this is a design problem that can be fixed with better emphasis on design but that is not entirely true. buggy UX Yes, some of these problems can be fixed by better design, but this problem pervades all Web3 products. It doesn't matter whether it is a business worth hundreds of millions or one worth just tens of millions. All dApps have the same problem. Hence, this isn’t an issue that one can leave at the doorsteps of faulty design and call it a day. Web3’s UX problem is not a design issue. Instead, it's a network issue. Most Web3 products are built in such a way that necessitates annoying complexities like the omnipotent 12-word seed phrase. Most Web3 products can literally not be built in a better way, and that is not a problem of design, it is one of the underlying technologies powering these dApps. It follows that to improve the UX of Web3, the entire full stack of Web3 development must be improved. In short, Web3 products and the network they are built on must be built differently. While there is no wholesale  solution to this problem, there are certain innovations that can start this process. Solving The Seed Phrase Problem One often overlooked UX problem of Web3 is the question of the seed phrase. People don’t want to always have to remember a 12-word string of passwords to have access to their accounts. Despite its unwieldy nature, the seed phrase model has continued because it is the only sustainable way people can get access to their accounts. The reason this model is vital is that an account on a DeFi network is merely a key, and the data on it is the key’s entry in a thousand different asset smart contracts. Hence when users lose the phrase, they have lost access to the key, and that means they have lost access to the key’s entries — which means they have lost all their stuff. That problem can be solved if instead of being a key’s entry on a ledger, accounts are actually digital containers for assets. If the container has logic that supports multi-factor control and recovery, users won't have to bother about keeping a 12-word seed phrase. They would simply be able to sign in to the “container” through multiple avenues — including emails and regular passwords. Personalizing Web3 When you want to use a dApp like Metamask, you have to connect your Web3 wallet. That connection is supposed to be your “login”. That is quite different from the Web2 model where users can personalize their login experience. For example, people can currently login into their accounts with Apple, Facebook, and Google using passkeys, which means they never have to use a real password. A similar innovation can be created in Web3. Blockchains could have an on-ledger identity that has multi-factor features. These on-ledger identities could be on the crypto wallet and could be used to connect to its on-ledger counterpart instantly. The main innovation of this feature is that users will be able to create multiple accounts on the same wallet since they can have different personalities. What this means is that users will be able to “log in” to different networks using different personalities. They will also be able to keep certain data on each account, which means that if a dApp asks for information concerning that account, it can be immediately provided through the wallet and then forgotten. A New Way For Assets To Exist A blockchain is basically a way to keep track of the movement of assets from one place to another. However, the EVM dApps today actually have no idea of what an asset is. Instead, the idea of assets is usually implemented as balance entries in smart contracts requiring complex messaging channels that tell different smart contracts what the “current balance” on a smart contract is. In essence, what we know as balances are not the dApps themselves telling us how many assets they have, but they are just reading the balances on independent smart contracts that the dApp has to trust. In short, there are no "assets" anywhere – just balances all through. In most cases, this is enough to complete basic and somewhat complex transactions. However, this complexity means that scalability is very difficult and that hackers can hack balances by manipulating the current balances on a smart contract. That is what precisely happened in the $30 million Spartan hack. A Complete Wallet Connect Users of DeFi today are completely confined to connecting to DeFi dApps through a mobile wallet. To connect through a desktop, they need to run a browser extension wallet that a) does not travel with you and b) is extremely insecure. A better solution might be to create a secure link between the wallet on the mobile phone with the desktop browser through a one-time QR code. That way, the desktop browser can easily connect to the wallet on the mobile without having to download an extension each time users want to connect to DeFi dApps. Transaction Manifests Outside the general unwieldy UX of DeFi dApps, there is also the question of the massive technical barrier to competently using a dApp. For example, if a user wants to sign a smart contract and wants to be sure of what is in the contract, they need to have the technical know-how to read the source code of the smart contract. That means they must be able to understand code. Most people simply can’t do that, and an overwhelming majority do not want to learn how to read code so that they can keep their assets secure. Rather than do that, most people would simply not bother about DeFi solutions. The real problem with not understanding smart contract language is that users can unintentionally sign faulty smart contracts that would drain them of their tokens. Unfortunately, this in Web3. A better way would be to have a wallet that natively understands the assets on the platform and can let users, define the set of outcomes that must happen in relation to assets if the transaction is signed. happens a lot That list of outcomes could be called a transaction manifest. The reason why this approach is not used in transactions is that most blockchains are not built to understand assets - they are not . A network that would be able to implement this has to contain logic that understands what an asset is. Most networks don’t. And that is why it has been very difficult to get around this problem by just creating transaction manifests. asset-oriented Are These Innovations Possible? The good thing about these five technologies is that they are not only feasible but are also currently being created and improved on. One such network being built with these principles is Radix — specifically the Babylon mainnet upgrade. The future of DeFi technology rests on whether the developer community will implement these innovations, or redesign blockchain dApps to have even better UX. That is the only way DeFi can ever get massive adoption. Watch to learn more about these five game-changing technologies that will radically improve Web3 user experience. the RadFi keynote

5 Web3 UX Innovations That Can Encourage Mass Adoption of Web3 Technology

5 Web3 UX উদ্ভাবন যা Web3 প্রযুক্তির ব্যাপক গ্রহণকে উৎসাহিত করতে পারে

5 Web3-UX-Innovationen, die die Masseneinführung der Web3-Technologie fördern können

5 innovaciones de Web3 UX que pueden fomentar la adopción masiva de la tecnología Web3

5 innovations Web3 UX qui peuvent encourager l'adoption massive de la technologie Web3

5 वेब3 यूएक्स नवाचार जो वेब3 प्रौद्योगिकी के बड़े पैमाने पर अपनाने को प्रोत्साहित कर सकते हैं

Web3 テクノロジーの大量採用を促進できる 5 つの Web3 UX イノベーション

Web3 기술의 대량 채택을 촉진할 수 있는 5가지 Web3 UX 혁신

5 inovações UX do Web3 que podem incentivar a adoção em massa da tecnologia Web3

Web3 Teknolojisinin Kitlesel Benimsenmesini Teşvik Edebilecek 5 Web3 UX Yeniliği

5 đổi mới Web3 UX có thể khuyến khích việc áp dụng hàng loạt công nghệ Web3

可以鼓励大规模采用 Web3 技术的 5 项 Web3 UX 创新

Lead Image by Alesia Kozik Yield farming is the new high-risk, high-reward strategy that's taken the DeFi world by storm. This investment strategy has exploded in popularity, with . $74.6 billion worth of staked assets in DeFi protocols in January 2023, according to Cointelegraph Since December 2022, the total value locked in DeFi protocols has grown by . But what is yield farming, exactly? In this article, you will get the scoop on this popular investment method and will explore potential gains and pitfalls. Let's dive into the exciting world of yield farming! over 26% What is Yield Farming? Yield farming essentially refers to earning more through the assets that a yield farmer already has by lending them to a borrower through smart contracts. It’s a high-risk activity that generates high rewards, and is carried out using different strategies to maintain impressive return rates. cryptocurrencies For example, imagine having or borrowing some money from someone and then lending it to someone else at a higher interest rate. Then, repeating this process several times with different people and multiple sources of funds. This is how yield farming works! Lending your cryptocurrency adds to the liquidity pool that also generates rewards. These rewards are generated by the fees charged by the platforms or a different source. DeFi Sometimes, when the individual adds to the liquidity pools, rewards are given in the form of tokens. Now, that individual can re-invest these to a different liquidity pool to earn more rewards, and so on. tokens How does Yield Farming work? Now that it is clear what yield farming is, you can start practicing it to generate returns. How does it work, though? First, you will have to register on any DeFi platform like Compound, Uniswap, Binance Smart Chain, etc., and start acquiring cryptocurrencies that work on that particular platform. These can be (ETH), (BTC), or any other stablecoins such as USDT, USDC, etc. Ethereum Bitcoin Next, you will have to download a decentralized wallet to store these cryptocurrencies such as Trustwallet, Metamask, Wallet Connect, etc. Now, register when prompted for details and keep the private key and seed secure used for the wallet in a safe place. Next, transfer funds to your wallet and then go to the dApp section of the wallet to start your yield farming journey. Now, you will be able to lend your crypto to the borrowers and earn interest on the loan. These interest rates might be fixed or may vary depending on the platform you are using. Sometimes, for lending, the platform also rewards you with its native token, for instance, Compound, that you can again use to lend and keep the cycle going to earn high returns. While borrowing though, the borrower will have to deposit an amount that is in proportion to the amount that is to be borrowed as collateral before the transaction happens to safeguard the funds of the lender. This entire system is done through smart contracts. They enable these transactions to be trustless, decentralized, and seamless. The value of the funds in the smart contract can fluctuate depending on the market price. Hence, if it turns out that the collateralized amount pledged by the borrower is less than the amount that was lent, the smart contract will get triggered. Post that, the borrower’s account will get liquidated to pay interest to the lender. Consequently, the lender is never at a loss even if the borrower defaults on the loan. For instance, let’s say the borrower takes out a $100 loan from the lender and pledges an article worth $80 as collateral. Now, if the price of the article drops to $70 as per the market, the smart contract will be triggered. The borrower’s article would be sold to pay interest to the lender. How to calculate Yield Farming returns? Yield farming is a competitive space, and consequently, the incentives earned change pretty rapidly. As soon as a farming strategy starts working, other yield farmers take note of it and start profiting off it, making it less profitable within a short period. However, the returns yielded can be calculated via two methods: Annual Percentage Rate or APR When an investor re-invests the gains accrued over a span to gain more, the annual returns are calculated on that, using the Annual Percentage Rate or APR. Compounding is not taken into account for this metric. Annual Percentage Yield or APY Here also, the returns are calculated over a period but compounding is taken into account when annual returns are being calculated. However, as yield farming generally involves short-term gains, there are other ways as well to calculate returns for a short period rather than every year. Also, these return calculations have been automated now by several platforms to make things easier for the farmers. Platforms such as Zapper, Aave, Harvest Finance, Yearn.finance, etc. Risks of Yield Farming As lucrative yield farming can get, it also comes with risks that can make you bear huge losses, especially in times of financial turbulence in the crypto ecosystem. The losses can be impermanent, and the investors may see the prices of their crypto assets slipping drastically low. Also, the regulation part of the crypto space is still clouded with uncertainty. Some of the risks associated to yield farming are mentioned below: Rug Pulls Yield farmers are particularly vulnerable to these kinds of exit scams because they’re often lured in to invest in new and untested projects being built by developers. The projects are incentivized by high APY when compared to the standard 10%-15% returns that investments generally lead to. The amount of APY depends on the project, protocols, etc though. Also, the farmers may not have access to all the information they require to make informed investment decisions. Moreover, smart contracts may have loopholes that the investors may be unaware of. Hence, the developer, after collecting the desired amount of funds, may disappear, leaving the investors looking at a financial loss. A good example would be the rug pull that happened in 2017. It was a cryptocurrency ponzi scheme in which the founder disappeared after raising $4 billion. OneCoin Volatility Volatility can be a major concern for yield farmers, especially during bear or bull runs in the environment. The value of the tokens can rise or fall drastically due to instability. crypto Yield farmers can face impermanent losses due to this, as the tokens are locked up. As such, the changing prices of the tokens in the liquidity pools consequently change the ratio of the tokens in the pool to stabilize their total value. Smart Contract Hacks DeFi is comparatively a new space, and continuous improvements are being made to advance it. Hence, its components are vulnerable to bugs and hacks. One of these components is a smart contract that is used for secure transactions but is prone to hacks that can lead to losses for investors. Yield farmers often use multiple protocols and smart contracts to maximize their returns, which increases their exposure to potential smart contract hacks. A single vulnerability in any of the smart contracts used by the yield farmer could lead to a loss of funds across all the protocols they are invested in. For instance, a very popular decentralized exchange called because of a bug in their smart contract called RouteProcess02. Luckily, only those individuals were affected by this that had swapped during the last four days leading to this event. SushiSwap suffered a loss worth $3.3 million One crypto advocate called Sifu was majorly impacted by this, as the user lost 1800 ETH. Although the exchange recovered the majority of the funds, this event showed how vulnerable a position user can get into. Although technological advancements are in line such as third-party audits and vetting the basic code. They make smart contracts more secure, but yield farmers should be careful. Farm your yields or let them wilt away? Though yield farming protocols offer lucrative returns, they’re not guaranteed. Although it is a high-risk activity that produces enticing gains within the short term, it also comes with multiple risks such as volatility, regulatory risks, smart contract hacks, rug pulls, impermanent losses, etc. Hence, yield farmers need to conduct thorough research and due diligence before diving into investing in any DeFi project! The yield farming space is continually evolving and brimming with new trends and innovations. For instance, , which uses a two-token structure to optimize market position tells us what might be in store for the future. Spiral DAO's novel yield farming model Also, the expansion of DeFi beyond the Ethereum ecosystem is offering more yield farming opportunities, as Binance Smart Chain and Solana gain popularity. This space may also experience regulatory scrutiny as regulators seek to protect the space to prevent illicit activities. Overall, the future of yield farming may be shaped by a lot of innovations, regulatory developments, competition, and much more in the coming years!

What is Yield Farming and How Does It Work?

¿Qué es la agricultura de rendimiento y cómo funciona?

Qu'est-ce que l'agriculture de rendement et comment ça marche ?

उपज की खेती क्या है और यह कैसे काम करती है?

イールドファーミングとは何ですか？

O que é Yield Farming e como funciona?

Yield Farming là gì và nó hoạt động như thế nào?

什么是增产农业，它是如何运作的？

Slash Fintech Ltd., led by CEO Shinsuke Sato, released last August in the year 2022, in an attempt to improve the current state of decentralized crypto payments worldwide by providing seamless settlements and a sophisticated UX for the payments flow. Slash web3 payments Slash Web3 Payments creates the possibility for cryptocurrency holders to pay for their everyday purchases directly, with almost any tokens they want, as long as those tokens possess sufficient liquidity. For merchants or shops, this means that they are no longer limited to receiving specific and often a reduced selection of cryptocurrencies and tokens as payment in their online or offline stores. The Slash initiative can already support more tokens than many of the crypto payment alternatives currently found in the market. Slash Web3 Payments supports more than 1400 tokens from at least 6 different protocols and is constantly expanding to increase those options. Another key difference is that Slash does not charge their merchants any installation fees or transaction fees. Instead, a percentage from the slippage is taken. As an example, in order to pay for a transaction in USDC, payers are not restricted to paying with existing USDC tokens in their wallet. They can choose from their own available tokens, such as, perhaps, MATIC. Slash will compare and select the best on-time rate from decentralized exchanges and do the conversion automatically. It is required to have a Metamask wallet or any of the Walletconnect-supported alternatives. After clicking the generated payment link or scanning the QR, the payers will see the amount and will have the possibility to choose from their own available tokens the currency that they want to pay with. Slash is working actively to increase its customers and partners primarily in Japan, but also, in other regions across the globe such as LATAM, USA, Canada, EU, Africa, and Asia. Among the current targets, Slash is appealing mainly to restaurants, retail & e-commerce (fashion, travel), luxury, and multi-payment providers, among other industries. The startup raised 1.5 Million USD last year in a seed funding round from MZWeb3Fund and several private investors. It is currently raising a Series A. This will help with Slash’s efforts to become one of the global leaders in cryptocurrency payments. If you want to learn more about Slash, have any questions, comments, or wish to send collaboration requests, please contact the team directly at discord . Slash Web3 Payments Or, follow their online presence: Website: https://slash.fi/ Twitter: https://twitter.com/SlashWeb3 Medium: https://medium.com/@SlashWeb3

This Service Will Transform the Way Companies Receive Cryptocurrencies in 2023

Este servicio transformará la forma en que las empresas reciben criptomonedas en 2023

Ce service transformera la façon dont les entreprises reçoivent les crypto-monnaies en 2023

यह सेवा 2023 में कंपनियों द्वारा क्रिप्टोकरेंसी प्राप्त करने के तरीके को बदल देगी

このサービスは、2023 年に企業が暗号通貨を受け取る方法を変革します

Este serviço transformará a maneira como as empresas recebem criptomoedas em 2023

Dịch vụ này sẽ thay đổi cách các công ty nhận tiền điện tử vào năm 2023

这项服务将改变公司在 2023 年接收加密货币的方式

Many experts agree that after almost two decades of Web 2.0 it’s time to move on, and now we find ourselves at the beginning of Web 3.0. Web 3.0 promises a collective future in which any participation or contribution is rewarding - an encouragement for participants to act in the interest of the system. Compared to Web 3.0, Web 2.0 has two models: the system is owned by the state (China) or corporations (USA). While these models have their advantages, they end up having a single point of failure or control and do not motivate participants to contribute to development. In short, Where web 2.0 is more like a monarchy or an oligarchy, web 3.0 is a democracy. Security in Web 3.0 The thing about the transition from Web 2.0 to Web 3.0 is that we are used to having our security taken care of by the services we use, but it's . Now, we have to take care of it ourselves. not the case in Web 3.0 Over time, control over your private key becomes the main concern of personal information security. The more your money, information, and identity is controlled by you and not the bank, Google, or government – the more important it is to keep it private and unavailable to others. We can't expect information security expertise from billions of Web 3.0 users, so security tools will be balancing between being easy-to-use, custodial, and really secure. We'll see a spectrum of solutions: from centralized, fully managed, and guaranteed by "Coinbases" and "Binances" of this world; to completely decentralized, in CLI format under Kali Linux. Most will be somewhere in between. It's unlikely that only one wallet will get a monopoly, but hundreds of wallets will operate based on a single standard, such as, for example, WalletConnect today. Social recovery methods will become increasingly popular: when the user's key is not stored in one centralized repository but is divided into several pieces. One of those parts is not enough to access the wallet, but for example 5 out of 7 will be enough. In this case, there is no single seed phrase you can lose along with access to thousands of your BTCs and ETHs. But you are not 100% relying on some service that can run away with your money at any time. The more popular crypto gets, the more scam and fraud is out there. Here are the must-haves for everyone in this market: At least use a separate email for crypto only.
This will spare you some of the spam and phishing.
Better: have a secure e-mail address that encrypts data. E-mail Wallet Have at least two wallets. One is for your daily transactions, but not for the long-term storage of crypto. The second one is for storing your funds. Better: get a cold wallet, for example, Ledger. Never store your seed phrase in a digital form like a screenshot or text on a device or in the cloud.
Pen and paper will do. Seed phrase Always pay attention to the domain of the website you are using. Is it the real one or does it just look like it? Websites Turn on 2FA everywhere when it's available.
Use an authentication app for code generation as emails can get hacked. 2FA Already got these covered? In that case, here are some additional tips: When you use open public Wi-Fi connection, people can intercept your traffic using special apps and tools.
That doesn’t necessarily mean that they can steal your crypto, but still that is not the kind of attention you would want. Avoid public Wi-Fi VPN can protect you from the man-in-the-middle ( ) attack. MITM attack is where a hacker places themselves between you and a website you’re accessing. This way, they can see if you are using crypto, which later may lead them to scamming you. For example, by showing you fake sites or convincing you to install a fake wallet. Use a VPN service MITM And most importantly: Create strong passwords. No matter what type of wallet you use, most require you to set up a password or PIN. A password is your first line of defense, and creating it should not be taken lightly. A few things to keep in mind: Your password should be at least eight characters long. Use a combination of letters (uppercase and lowercase), numbers, and symbols. Avoid passwords that are already used for other platforms or services. Do not use your personal information to create a password. Never share your password with anyone, not even with friends or family. Instead of typing your password, you can use a password manager.

A Crypto Security Checklist for Every User 

Stories, News & Mentions about WALLETCONNECT

Walletconnect’s Stories on HackerNoon