I am a beginner to web development and I just created this hardhat project to test a smart contract for a charity donation DApp that has the following folder structure:
Now how do I add a frontend to this thing? I first initialized it using npm init, then I added hardhat using npm i hardhat, intialized the hardhat project using npx hardhat init and finally did all the testing yada yada...
Until it was done.
Now how do I add a react frontend to it? I thought about creating another frontend folder here itself in which I'll create all the web pages...
...And it's here where the node modules confusion comes up.
Won't this create 2 node modules folders? One in the main directory, one in the frontend directory?
Is that good practice?
Top comments (1)
Not sure this is the best place to ask questions but seeing as I'm also learning how to do this and I'm not new to development in general so maybe I can help a little.
Generally I would keep them as separate projects. The way most contracts work is they raise an event and call an endpoint you host on a separate app. The reason is that processing and storage is expensive on the chain so this relegates the chain to simply tracking ownership of things.
Your contract should keep track of the transactions and enforce restrictions on them. Your frontend should listen to events raised by the contracts (using web3.js) and handle the human interactivity side of things.
I would defiantly keep them separate, you could put them into one codebase but I don't think it's worth it for most people.