Web3 React Boilerplate and NFT Marketplace Boilerplate

I make a deploy test for a few days now why these template are not working when you deploy it on heroku and even in netlify?

do you have any guide how to deploy the boilerplate did we need missed something here? the template is really helpful to start your project but is not useful if it’s not working when you deploy it. It only work on localhost but not when you deploy it.

Hope you can really help us or someone give us a guide how to deploy this without problem.

Hey should’ve worked with netlify or any other static hosting platform, this is based on ethereum boilerplate and I deployed it personally in vercel.

What steps did you take to deploy the site?

i upload it on github and deploy from netlify

Hey can you give more steps and details how did you upload? it’s a bit too general to guess

the process

  1. I login on my netlify account and click Sites
  2. I click Add new site then select import from existing project
  3. I select Github then i got Authorized
  4. I select repository i want to deploy
  5. I check all build settings then click Deploy site

pls. check screenshot for settings

here’s the link
ethereum template

if you check the console you will see there it asking for .env file
do we also need to upload that file?

and here’s the issue

react-dom.production.min.js:216 Error: Missing Moralis Application ID or Server URL. Make sure to set your .env file.
    at at (index.js:18:11)
    at si (react-dom.production.min.js:157:137)
    at $s (react-dom.production.min.js:267:460)
    at Nu (react-dom.production.min.js:250:347)
    at ju (react-dom.production.min.js:250:278)
    at Su (react-dom.production.min.js:250:138)
    at yu (react-dom.production.min.js:243:163)
    at pu (react-dom.production.min.js:237:175)
    at ec (react-dom.production.min.js:285:27)
    at react-dom.production.min.js:289:301

i deploy also in Vercel still the same issue

did your deployment in vercel work?

you miss the APP ID and Server URL

You need to have them in the environment variables

i have that
do i need to add api key and app secret?
and do i need to upload this .env file?

Mandatory info for starting the app

REACT_APP_MORALIS_APPLICATION_ID = “id is added here”
REACT_APP_MORALIS_SERVER_URL = “url is added here”

Optional info for connecting your localChain and Moralis Database

moralisApiKey = xxxxx
moralisApiSecret = xxxxxxx
frpcPath = F:\frpc\frpc.exe
chain = ganache
moralisSubdomain = xxxxxxx.usemoralis.com
abiPath = “F:\ethereum-boilerplate\Truffle\build\contracts\Contract.json”

no .env shouldn’t be uploaded

and you should set the environment var in netlify dashboard like this

ohhh and yes :grinning_face_with_smiling_eyes: here you go https://ethereum-boilerplate-nine.vercel.app/quickstart

THANK YOU
it works now
template react-boilerplate

1 Like

Fantastic :star_struck:

i try to update the latest version of react-moralis and moralis

can i ask some help how to solve this warnings

Compiled with warnings.

./node_modules/moralis/lib/browser/Web3Connector/Web3AuthConnector.js
Module not found: Can’t resolve ‘@web3auth/web3auth’ in ‘/home/jamay/app/moralis/react/bnbtcpool/node_modules/moralis/lib/browser/Web3Connector’

Search for the keywords to learn more about each warning.
To ignore, add // eslint-disable-next-line to the line before.

can i ask how exactly we add abi and contract address here?
const [contractABI, setContractABI] = useState();
const [marketAddress, setMarketAddress] = useState();

and for this one what exactly this mean

Sync the MarketItemCreated event /src/contracts/marketplaceBoilerplate.sol contract with your Moralis Server, making the tableName MarketItems

event MarketItemCreated (
uint indexed itemId,
address indexed nftContract,
uint256 indexed tokenId,
address seller,
address owner,
uint256 price,
bool sold
);