by Halaprix.
Live preview here
1click deploy:
-
Prerequisities:
- node.js
- yarn -
npm add -g yarn
(run as root / su eg.sudo npm add -g yarn
)
-
Clone the repository:
git clone https://github.com/halaprix/shapes-mint-page-cm-v2
cd shapes-mint-page-cm-v2
-
use yarn to install all dependencies:
yarn install
-
Fill
.env-example
with your Candy Machine details (can be found in.json
file in.cache
directory, after CM upload). Rename the file to.env
. -
Run yarn start to start the developement server.
yarn start
-
If you are using traditional hosting, run
yarn build
and uplaod contents of thebuild
folder to your hostingspublic_html
-
(Optional) - If deploying to Vercel, use the ENV VARIABLES from
.env
file here or use one click prefilled deploy:
Devnet:
- REACT_APP_SOLANA_NETWORK=devnet
- REACT_APP_SOLANA_RPC_HOST=https://psytrbhymqlkfrhudd.dev.genesysgo.net:8899/
Mainnet-beta:
- REACT_APP_SOLANA_NETWORK=mainnet-beta
- REACT_APP_SOLANA_RPC_HOST=https://ssc-dao.genesysgo.net/
Favicon, Phantom styling - index.html
- Use this generator to generate favicons, metadata and images, to be put to
/public
.
Buttons - /src/MintButton.tsx
and src/Home.tsx
- Change the style of the buttons in
styled
components.background: linear-gradient(29deg, #34342F 0%, #44C3A1 100%);
is reponsible for the button gradient.
Images - /public
/public/logo.png
is the top logo/public/animation.gif
is the middle container image.
Styles - /src/index.css
- Change the styles of the website.
background: linear-gradient(29deg, #34342f 0%, #5ff1cb 50%, #44c3a1 100%);
is the background gradient. You can generate the gradient using this generator - change the
Paper
style (the three containers) in/src/Home.tsx
:const StyledPaper = styled(Paper)` padding: 24px; background-color: #34342f; border-radius: 6px; margin: 10px; `;