{"id":13455638,"url":"https://github.com/Fulgurus/candy-machine-v2-responsive-ui","last_synced_at":"2025-03-24T08:33:20.454Z","repository":{"id":37599251,"uuid":"432815512","full_name":"Fulgurus/candy-machine-v2-responsive-ui","owner":"Fulgurus","description":"Solana Candy Machine V2 with a Prod-ready and easy to customize responsive UI.","archived":false,"fork":true,"pushed_at":"2023-06-01T06:50:58.000Z","size":1551,"stargazers_count":174,"open_issues_count":9,"forks_count":264,"subscribers_count":9,"default_branch":"main","last_synced_at":"2025-01-20T19:38:13.263Z","etag":null,"topics":["candy-machine","candy-machine-mint","candy-machine-v2","metaplex","mint","pre-sale","responsive","solana","spl-token","whitelist"],"latest_commit_sha":null,"homepage":"","language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":"exiled-apes/candy-machine-mint","license":"apache-2.0","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/Fulgurus.png","metadata":{"files":{"readme":"README.md","changelog":"CHANGELOG.md","contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2021-11-28T20:17:56.000Z","updated_at":"2025-01-08T16:20:28.000Z","dependencies_parsed_at":"2023-02-04T00:15:50.196Z","dependency_job_id":null,"html_url":"https://github.com/Fulgurus/candy-machine-v2-responsive-ui","commit_stats":null,"previous_names":[],"tags_count":4,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Fulgurus%2Fcandy-machine-v2-responsive-ui","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Fulgurus%2Fcandy-machine-v2-responsive-ui/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Fulgurus%2Fcandy-machine-v2-responsive-ui/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Fulgurus%2Fcandy-machine-v2-responsive-ui/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/Fulgurus","download_url":"https://codeload.github.com/Fulgurus/candy-machine-v2-responsive-ui/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":245235712,"owners_count":20582293,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["candy-machine","candy-machine-mint","candy-machine-v2","metaplex","mint","pre-sale","responsive","solana","spl-token","whitelist"],"created_at":"2024-07-31T08:01:08.538Z","updated_at":"2025-03-24T08:33:19.974Z","avatar_url":"https://github.com/Fulgurus.png","language":"TypeScript","funding_links":[],"categories":["🙏 Community-built Tools","TypeScript"],"sub_categories":["for Candy Machine"],"readme":"**FOR CANDY MACHINE V3, YOU CAN USE (Mine is V2 only) :**\n\nhttps://github.com/wearekite/candy-machine-v3-ui\n\n# Introduction\n\n**PROD-READY Candy Machine V2 Responsive UI** which can be easily customized in 5mn.\n\nAll Candy Machine V2 functionalities are implemented, auto detected and maintained up-to-date :\n\n- public mint (with countdown when date in future)\n- civic support (gatekeeper)\n- whitelist\n- presale true/false\n- end date / end number (endSettings)\n- spl-token to mint\n- latest MCC updates from Metaplex\n\n![Candy Machine Preview Image](https://i.ibb.co/yPrdrrF/cmv2.png)\n\nFor V3 functionalities, I recommend you to use the repository https://github.com/wearekite/candy-machine-v3-ui written by a friend.\n\n### Supported Wallets\n\n![Supported Wallets](https://i.ibb.co/DC6Wt66/wallets.png)\n\nFor instructions on how to set up a V2 candy machine, please refer to Metaplex's documentation [here](https://docs.metaplex.com/candy-machine-v2/Introduction)\n\n## One-Click Vercel Deployment\n\nOne-click solution to clone this project to your GitHub and deploy the prod package on a Vercel.\nYour only task will be to customize your GitHub fork of this project and commit updates.\nVercel will automatically deploy new prod packages for each new commit.\n\n[![Deploy with Vercel](https://vercel.com/button)](https://vercel.com/new/clone?repository-url=https%3A%2F%2Fgithub.com%2FFulgurus%2Fcandy-machine-v2-responsive-ui\u0026env=REACT_APP_CANDY_MACHINE_ID,REACT_APP_SOLANA_NETWORK,REACT_APP_SOLANA_RPC_HOST\u0026envDescription=Populate%20REACT_APP_CANDY_MACHINE_ID%20with%20your%20candy%20machine%20public%20key%2C%20REACT_APP_SOLANA_NETWORK%20with%20the%20solana%20network%20(devnet%2Fmainnet-beta)%20and%20REACT_APP_SOLANA_RPC_HOST%20with%20the%20RPC%20URL%20(example%20for%20devnet%20%3A%20https%3A%2F%2Fapi.devnet.solana.com)\u0026envLink=https%3A%2F%2Fdocs.solana.com%2Fcluster%2Frpc-endpoints%23mainnet-beta\u0026demo-title=My%20Demo%20Mint%20Page\u0026demo-description=A%20one-click%20generated%20solana%20minting%20responsive%20website.\u0026demo-url=https%3A%2F%2Fwww.mintgatsbyclub.net%2F\u0026demo-image=https%3A%2F%2Fi.ibb.co%2FyPrdrrF%2Fcmv2.png)\n\n## To thank me with a small SOL tip :]\n\n![Outfit Project Image](https://i.ibb.co/8sL24wB/artwork-4-small.png)\n\nMy personnal project : https://twitter.com/theoutfitnft\n\nMy SOL wallet : `58SevvhmaN4SfCop2HkepAWyM5zykr7Afiv91PAAfPqR`\n\n## Getting Set Up\n\n### Prerequisites\n\n**REQUIRE NODEJS VERSION \u003c= 16 (version 17 not supported)**.\n\n* Download a Code Editor such as Visual Studio Code.\n\n* Ensure you have both `nodejs` and `yarn` installed. `nodejs` recommended version is 16.\n\n* Follow the instructions [here](https://docs.solana.com/cli/install-solana-cli-tools) to install the Solana Command Line Toolkit.\n\n* Follow the instructions [here](https://hackmd.io/@levicook/HJcDneEWF) to install the Metaplex Command Line Utility.\n  * Installing the Command Line Package is currently an advanced task that will be simplified eventually.\n\n### Installation\n\n#### 1. Fork the project \u0026 clone it. Example:\n\n```\ngit clone https://github.com/Fulgurus/candy-machine-v2-responsive-ui.git\n```\n\n#### 2. Define your environment variables (.env file)\n\nRename the `.env.example` file at the root directory to `.env` and update the following variables in the `.env` file:\n\n```\nREACT_APP_CANDY_MACHINE_ID=__PLACEHOLDER__\n```\nset __PLACEHOLDER__ with the candy machine pubkey you get once you upload \u0026 create your candy machine in Metaplex project. You can find back the value from the `.cache/temp.json` file of your Metaplex project. This file is created when you run the `ts-node candy-machine-v2-cli.ts upload ...` command.\n\n```\nREACT_APP_SOLANA_NETWORK=devnet\n```\n\nThis identifies the Solana network you want to connect to. Options are `devnet`, `testnet`, and `mainnet`.\n\n```\nREACT_APP_SOLANA_RPC_HOST=https://api.devnet.solana.com\n```\n\nThis identifies the RPC server your web app will access the Solana network through.\n\n\nIf you are using a custom SPL Token to MINT, you have two additional environment parameters to set :\n\n\n```\nREACT_APP_SPL_TOKEN_TO_MINT_NAME=\n```\n\nSpl-token name to display next the price.\n\n```\nREACT_APP_SPL_TOKEN_TO_MINT_DECIMALS=9\n```\n\nSpl-token decimals were defined during its creation with --decimals parameter. If you didn't use that parameter, then by default your SPL Token got 9 decimals.\n\nMore info about it there : https://spl.solana.com/token\n\n#### 3. Build the project and test. Go to the root project directory and type the commands :\n\nTo install dependencies :\n\n```\nyarn install\n```\n\nTo test the app locally in the development mode (localhost:3000) :\n\n```\nyarn start\n```\n\nTo build the production package (generated in build folder of the project) :\n\n```\nyarn build\n```\n\n#### 4. Customize the website UI :\n\n##### 4.1 `App.css` : update 5 main CSS variables with your custom colors :\n\n```\n:root {\n  --main-background-color: #343A50;\n  --card-background-color: #804980;\n  --countdown-background-color: #433765;\n  --main-text-color:#F7F6F4;\n  --title-text-color:#3CBA8B;\n}\n```\n\nNext to that, make sure to update background image by overwriting your own background PNG file in src/img folder.\n\n##### 4.2 `public` folder :\n\n- Update existing demo cool cats images (cool-cats.gif, logo.png) with your owns images in project `public` folder. Make sure to name them identically.\n- Add your custom website title in `index.html` : `\u003ctitle\u003eMint Page\u003c/title\u003e`\n\n##### 4.3 `Home.tsx` :\n\nScroll down down to line 380 (`return \u003cmain\u003e [...]`) and start to update all titles/menu/text/images/text... as wished in the whole React HTML block.\n\nThat's it ! Enjoy your beautiful candy machine :)\n\n\n##  Available Commands Recap :\n\n### `yarn start`\n\nRuns the app in the development mode.\\\nOpen [http://localhost:3000](http://localhost:3000) to view it in the browser.\n\nThe page will reload if you make edits.\\\nYou will also see any lint errors in the console.\n\n### `yarn build`\n\nBuilds the app for production to the `build` folder.\\\nIt correctly bundles React in production mode and optimizes the build for the best performance.\n\nThe build is minified and the filenames include the hashes.\\\nYour app is ready to be deployed!\n\n## Need Help ?\n\nYou can ask for help in Stractors Discord : https://t.co/0VM0TkwiAn\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2FFulgurus%2Fcandy-machine-v2-responsive-ui","html_url":"https://awesome.ecosyste.ms/projects/github.com%2FFulgurus%2Fcandy-machine-v2-responsive-ui","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2FFulgurus%2Fcandy-machine-v2-responsive-ui/lists"}