Krypt - Web 3.0 Blockchain Application

Overview

Krypt - Web 3.0 Blockchain Application

Krypt

Introduction

This is a code repository for the corresponding video tutorial.

Using Web 3.0 methodologies, Solidity and Metamask you'll learn how to build a your first real Web 3.0 Application - from start to finish.

Project created in collaboration with Enyel Sequeira: Portfolio - https://www.enyelsequeira.com E-mail - [email protected] Want me to cover the project you've created? Send me an e-mail 👌

Stay up to date with new projects

New major projects coming soon, subscribe to the mailing list to stay up to date https://jsmasterypro.com/newsletter

Comments
  • error :  TransactionContext.jsx

    error : TransactionContext.jsx

    Uncaught (in promise) Error: No ethereum object

    at checkIfTransactionsExists (:3000/src/context/TransactionContext.jsx:98:13)

    image

    I don't Know why it is happening

    image

    opened by sabarinathan145 5
  • Refresh after wallet connected and transaction completed

    Refresh after wallet connected and transaction completed

    Here I've implemented window.location.reload() in the connectWallet() and sendTransaction() function, to refresh the page automatically, whenever the wallet is connected or the transaction is completed.

    opened by developer-junaid 3
  • Error: No Ethereum Object

    Error: No Ethereum Object

    I was following the tutorial but I found the following error:

    ReferenceError: Cannot access 'transactionContract' before initialization at getEthereumContract (TransactionContext.jsx:13:89)

    Can anyone help me?

    opened by alexandregabriel 2
  • Private key

    Private key

    Hey man great tutorial as always, I was just wondering how would you store your private key in a more safe way, because right now everyone can see it 😅 do you think an env file would be a good idea?

    opened by lorenzosyku 2
  • addressFrom value doesnt show

    addressFrom value doesnt show

    I'm facing a problem with displaying the addressFrom data I cant figure out what I'm doing wrong. Everything is working as it should but I cant get the addressFrom: transaction.sender, value out for some reason.. This is how my function looks like,

    Screenshot from 2022-03-27 13-14-02_cropped

    and this is what I'm getting Screenshot from 2022-03-27 13-04-17_cropped

    as u can see it says that the addressFrom is undefined.

    need help

    opened by Thebks 1
  • Invalid transaction params: must specify

    Invalid transaction params: must specify "data"?

    Here is function sendTransaction : ` const sendTransaction = async () => { try { if(!ethereum) return alert("Please install metamask!")

            const { addressTo, amount, keyword, message } = formData
            const transactionsContract = getEthereumContract()
            const parsedAmount = ethers.utils.parseEther(amount)
    
            console.log(currentAccount)
            console.log("IN")
            await ethereum.request({
                method: "eth_sendTransaction",
                params: [{
                  from: currentAccount,
                  to: addressTo,
                  gas: "0x7530",
                  value: parsedAmount._hex,
                }],
              });
            console.log("OUT")
            const transactionHash = await transactionsContract.addToBlockchain(addressTo, parsedAmount, message, keyword)
    
            setIsLoading(true)
            console.log(`Loading - ${transactionHash.hash}`)
            await transactionHash.wait()
            console.log(`Success - ${transactionHash.hash}`)
            setIsLoading(false)
    
            const transactionsCount = await transactionsContract.getTransactionCount()
    
            setTransactionCount(transactionsCount.toNumber())
    
        } catch (error) {
            console.log(error)
    
            // throw new Error("No ethereum object.")
        }
    }`
    

    And I got error : MetaMask - RPC Error: Invalid transaction params: must specify "data" for contract deployments, or "to" (and optionally "data") for all other types of transactions. {code: -32602, message: 'Invalid transaction params: must specify "data" fo…ally "data") for all other types of transactions.'}

    opened by Wildanzr 1
  • Cannot get the Transaction address

    Cannot get the Transaction address

    I deployed the script but i didn't get the address ... I checked my codes but it didn't work for me . Any suggest ?

    i used " npx hardhat run scripts/deploy.js --network ropsten " Compilation finished successfully but transaction address didn't write the console

    opened by Srcndeveci 1
  • tailwindcss/forms issue when implementing the tailwind gist

    tailwindcss/forms issue when implementing the tailwind gist

    this is the error i am having and i dont exactly know how to fix but when i added the gist for tailwind con fig i get Cannot find module '@tailwindcss/forms' and here is full error

    [plugin:vite:css] Cannot find module '@tailwindcss/forms' Require stack:

    • C:\Users\tilab\Desktop\web3.0\client\tailwind.config.js
    • C:\Users\tilab\Desktop\web3.0\client\node_modules\tailwindcss\lib\lib\setupTrackingContext.js
    • C:\Users\tilab\Desktop\web3.0\client\node_modules\tailwindcss\lib\index.js
    • C:\Users\tilab\Desktop\web3.0\client\node_modules\vite\dist\node\chunks\dep-4b9dfa16.js
    • C:\Users\tilab\Desktop\web3.0\client\node_modules\vite\dist\node\cli.js
    • C:\Users\tilab\Desktop\web3.0\client\node_modules\vite\bin\vite.js C:/Users/tilab/Desktop/web3.0/client/src/index.css at Function.Module._resolveFilename (node:internal/modules/cjs/loader:933:15) at Function.Module._load (node:internal/modules/cjs/loader:778:27) at Module.require (node:internal/modules/cjs/loader:1005:19) at require (node:internal/modules/cjs/helpers:102:18) at Object. (C:\Users\tilab\Desktop\web3.0\client\tailwind.config.js:34:13) at Module._compile (node:internal/modules/cjs/loader:1101:14) at Object.Module._extensions..js (node:internal/modules/cjs/loader:1153:10) at Module.load (node:internal/modules/cjs/loader:981:32) at Function.Module._load (node:internal/modules/cjs/loader:822:12) at Module.require (node:internal/modules/cjs/loader:1005:19
    opened by devjakedom 1
  • CANT GET TRANSACTION ADDRESS

    CANT GET TRANSACTION ADDRESS

    I deployed the script but i didn't get the address ... I checked my codes but it didn't work for me . Any suggest ?

    i used " npx hardhat run scripts/deploy.js --network goerli " Compilation finished successfully but transaction address didn't write the console

    opened by Msdoshack 0
  • since ropsten is depricated i am using rinkeby by it's showing me the following error plss help me

    since ropsten is depricated i am using rinkeby by it's showing me the following error plss help me

    For more info go to https://hardhat.org/HH100 or run Hardhat with --show-stack-traces at ContractFactory. (C:\Users\ASUS\OneDrive\Desktop\web3.0\smart_contract\node_modules@ethersproject\contracts\src.ts\index.ts:1244:53) at step (C:\Users\ASUS\OneDrive\Desktop\web3.0\smart_contract\node_modules@ethersproject\contracts\lib\index.js:48:23) at Object.next (C:\Users\ASUS\OneDrive\Desktop\web3.0\smart_contract\node_modules@ethersproject\contracts\lib\index.js:29:53) at fulfilled (C:\Users\ASUS\OneDrive\Desktop\web3.0\smart_contract\node_modules@ethersproject\contracts\lib\index.js:20:58) { reason: 'non-payable constructor cannot override value', code: 'UNSUPPORTED_OPERATION', operation: 'overrides.value', value: BigNumber { value: "1000000000000000" } }

    opened by Jyotishmoy12 0
  • Where is your app paying a fee for adding a record to the blockchain ?

    Where is your app paying a fee for adding a record to the blockchain ?

    I'm in the process of learning how to write smart contracts and make transactions using the Ethereum blockchain.

    I'm following your tutorial and it looks like making a transaction and then adding a record of it in the blockchain are two separate actions.

    I'm confused as to the gas fee that needs to be paid for making the transaction. And whether another fee needs to then be paid for adding a record of that transaction to the blockchain.

    In your code, the transaction itself takes place here:

            await ethereum.request({
              method: "eth_sendTransaction",
              params: [{
                from: currentAccount,
                to: addressTo,
                gas: "0x5208",
                value: parsedAmount._hex,
              }],
            });
    
    1. You seem to have hardcoded a value for the gas fee: 0x5208. But isn't the value constantly changing? When the above method is called, the Metamask extension opens up (I'm assuming, I haven't run the code) and asks the user to confirm the transaction, so I guess maybe it is at that point that the user learns how much they will be paying in gas fees and the 0x5208 I'm looking at above is not what I think it is ?
    2. What if you, the developer, want to know the fee the user will be paying at that moment as well ? Is there a ethereum.getCurrentGasFeeFor(value) ?

    Once the above transaction is confirmed, then a record of that transaction is added to the blockchain here:

    const transactionHash = await transactionsContract.addToBlockchain(addressTo, parsedAmount, message, keyword);
    

    But in the above code there is no indication about the app itself (you the owner of the app, not the user) having to also pay a fee for adding a record of the transaction to the blockchain.

    1. I thought that (a) there is a limit on how big the record/block can be and (b) depending on the size of the record/block, the app itself would also have to pay a fee. What if in the above scenario your keyword is a 10byte String or a 800Kb string ?

    I would have expected something like:

    // pseudocode
    let block = { addressTo, parsedAmount, message, keyword }
    let fee = computeFeeFor(block)
    if (imOkWith(fee)) {
      const transactionHash = await transactionsContract.addToBlockchain(
        block,
        // so that the app is charged for adding this block to the blockchain
        appWalletAddress: '....'
      )
      .....
      ...
    } else {
      dealWithTheProblemSomehow() ?
    }
    

    Thank you in advance for your help. I understand that this does not qualify as an issue so feel free to close it if you wish.

    I have also posted this on SO.

    opened by Pixelik 0
  • Latest Transaction not Showing (URGENT)

    Latest Transaction not Showing (URGENT)

    Hi can anyone help me ? I am facing this error and i do not know what to do to solve it. The latest transaction is not showing up. TypeError: transactionContract.getTransactionCount is not a function image

    opened by yapboiboi 0
  • Error while trying to pass the test value in window object. Cannot link frontend to the connectwallet function in Welcome.jsx

    Error while trying to pass the test value in window object. Cannot link frontend to the connectwallet function in Welcome.jsx

    getting error browser-external:buffer:9 Module "buffer" has been externalized for browser compatibility. Cannot access "buffer.Buffer" in client code. get @ browser-external:buffer:9 I've tried using the globalThis.Buffer = Buffer ; after using the buffer pack but the error is still there. Untitled

    opened by Ritu1980 0
  • Ropsten network on Ethereum will no longer be supported on Alchemy

    Ropsten network on Ethereum will no longer be supported on Alchemy

    Ropsten network on Ethereum will no longer be supported on Alchemy so what should be alternative of this

    offical link of alchemy https://docs.alchemy.com/changelog/future-deprecation-of-ropsten-kovan-and-rinkeby

    opened by TakbeerAli 3
Owner
Adrian Hajdin - JavaScript Mastery
JavaScript Enthusiast & Educator
Adrian Hajdin - JavaScript Mastery
It is a very basic implementation of how blockchain works, mainly how the bitcoin blockchain.

How to run this program npm install node core/blockchain.js What is this It is a very basic implementation of how blockchain works, mainly how the bit

Anish Jain 12 May 9, 2022
Dfunds is a decentralized fundraiser and NFT minter application built on Conflux blockchain with ChainIDE

Dfunds is a decentralized fundraiser and NFT minter application built on Conflux blockchain with ChainIDE. Dfunds was inspired by Conflux Labs & ChainIDE Hydra Developer Bootcamp. It was built to solve the problem of individuals and foundations in need of funds.

Paschal 3 May 16, 2022
Using a Decentralized Application (DApp) to Sell artwork on the Ethereum blockchain with smart contracts written in Solidity.

Decentralized Applications For Selling Limited Time Artwork This repository houses the Solidity, JavaScript, and HTML code for a Decentralized Applica

Keyan Ahmadi 4 Mar 20, 2023
This is a full-stack exercise tracker web application built using the MERN (MongoDB, ExpressJS, ReactJS, NodeJS) stack. You can easily track your exercises with this Full-Stack Web Application.

Getting Started with Create React App This project was bootstrapped with Create React App. Available Scripts In the project directory, you can run: np

WMouton 2 Dec 25, 2021
Using decentralized identities with Web 2 to create a no login required website. Built using the Handshake blockchain.

Blending Web 2/3, is this Web .666? ( •̀ᴗ•́ )و ̑̑ Learn more by joining the Handshake Discord Community applause is a platform I built using centraliz

Publius Federalist 13 Mar 3, 2022
A framework for building blockchain-enabled web services

NOTE: Not ready for public use. Please reach out via twitter dm or email with any questions. Ponder A framework for building blockchain-enabled web se

Olias 23 Dec 19, 2022
A web application for a company that provides commercial and scientific space travel services. The application will allow users to book rockets and join selected space missions.

Space Travelers A web application for a company that provides commercial and scientific space travel services. The application will allow users to boo

Hector Torres 2 Apr 6, 2022
This plugin can be embedded in PHP application to give the web application specific routes/href

Routes Plugin PHP This plugin can be embedded in PHP application to give the web application specific routes/href location and for entering specific/l

Ifechukwudeni Oweh 7 Jul 17, 2022
This web application provides commercial and scientific space travel services. The application allows users to book rockets and join selected space missions.

space-hub About Project "Space Traveler's Hub" is A web application that provides commercial and scientific space travelling services, We are working

Nicholas Emmanuel 7 Nov 2, 2022
This a web application for a company that provides commercial and scientific space travel services. The application will allow users to book rockets, dragons and join selected space missions.

Space Travelers' Hub In this project, we have worked with the real live data from the SpaceX API. Our task was to build a web application for a compan

Apuabi Titilope 4 Oct 31, 2022
This web application provides commercial and scientific space travel services. The application allows users to book rockets and join selected space missions.

Space Traveler's Hub This web application provides commercial and scientific space travel services. The application allows users to book rockets and j

Michael Mesfin 6 Oct 4, 2022
How to create an NFT on the Cardano blockchain using JavaScript

How to create an NFT on the Cardano blockchain using JavaScript Youtube Video: https://www.youtube.com/watch?v=OeOliguGn7Y Who is this guide for? For

Armada Alliance 117 Dec 31, 2022
Nami Wallet is a browser based wallet extension to interact with the Cardano blockchain.

Nami Wallet Nami Wallet is a browser based wallet extension to interact with the Cardano blockchain. It's an open-source project and built by Berry Po

Berry 335 Dec 29, 2022
Solana blockchain candy machine app boilerplate on top of Metaplex Candy Machine. NextJS, Tailwind, Anchor, SolanaLabs.React, dev/mainnet automation scripts.

NFT Candy Factory NOTE: This repo will prob only work on unix-based environments. The NFT Candy Factory project is designed to let users fork, customi

Kevin Faveri 261 Dec 30, 2022
created a very simple blockchain. just for fun.

SimpleBlockChain created a very simple blockchain. just for fun. Run: node main.js What happens? basically we create a new blockchain, and later we ad

null 1 Dec 25, 2021
The one DAO to rule them all. A modular DAO written in Clarity for the Stacks blockchain.

ExecutorDAO The one DAO to rule them all. ExecutorDAO is designed to be completely modular and flexible, leveraging Clarity to the fullest extent. The

Marvin 31 Oct 5, 2022
An simple blockchain example on node + typescript.

node-ts-blockchain An simple blockchain example on node + typescript. Next steps: Create a usefull README. Add a architecture to store the chain/block

André Rebonato 4 May 30, 2022