GithubHelp home page GithubHelp logo

isabella232 / nft-box Goto Github PK

View Code? Open in Web Editor NEW

This project forked from truffle-box/nft-box

0.0 0.0 0.0 1.28 MB

Boilerplate for creating an NFT collection

License: MIT License

JavaScript 67.22% CSS 3.93% HTML 9.84% Solidity 19.01%

nft-box's Introduction

Truffle NFT Box

This box is still a work in progress but for now can be used to mint create an NFT collection and mint and NFT.

Requirements

The NFT Box has the following requirements:

  • Node.js 10.x or later
  • NPM version 5.2 or later
  • Windows, Linux or MacOS

Helpful, but optional:

Setup

Installation

First ensure you are in a new and empty directory.

  1. Run the unbox command via npx and skip to step 3. This will install all necessary dependencies. A Create-React-App is generated in the client directory.

    npx truffle unbox nft-box
  2. Alternatively, you can install Truffle globally and run the unbox command.

    npm install -g truffle
    truffle unbox nft-box
  3. In the root directory install the required dependices. This will install a few things along with Open Zeppelin Contracts check them out here for more info.

       npm install @openzeppelin/contracts
  4. Add the contructor arguments to deployer function in 2_deploy_contracts.js. The URI for your NFT images must be passed as the first argument. The name and symbol of the token will be passed as the second and third respectively.

    module.exports = function(deployer) {
    deployer.deploy(NFTCollection,"YOUR URI","TOKEN NAME","TOKEN SYMBOL");
    };
  5. In the root directory install the required dependices. This will install a few things along with Open Zeppelin Contracts check them out here for more info.

       npm install
  6. Run the development console.

    truffle develop
  7. Compile and migrate the smart contracts. Note inside the development console we don't preface commands with truffle.

    compile
    migrate
  8. In the client directory, we run the React app. Smart contract changes must be manually recompiled and migrated.

    // in another terminal (i.e. not in the truffle develop prompt)
    cd client
    npm install
    npm run start
  9. After migrating your contracts head to the client directory and run npm run start to view the application in your http://localhost:3000/. Connect your wallet and mint your first NFT!

  10. You can check the developer console to see the transaction has and if you deploy to rinkeby you will be able to see the NFT on their test-net site here.

  11. To build the application for production, use the build script. A production build will be in the client/build folder.

    // ensure you are inside the client directory when running this
    npm run build

Deployment

To deploy your contracts to a public network (such as a testnet or mainnet) there are two approaches. The first uses Truffle Dashboard which provides "an easy way to use your existing MetaMask wallet for your deployments". The second, requires copying your private key or mnemonic into your project so the deployment transactions can be signed prior to submission to the network.

Using Truffle Dashboard (recommended)

Truffle Dashboard ships with Truffle and can be started with truffle dashboard. This in turn loads the dashboard at http://localhost:24012 and beyond that you'll just need to run your migration (truffle migrate). A more detailed guide to using Truffle Dashboard is available here.

Using the env File

You will need at least one mnemonic to use with the network. The .dotenv npm package has been installed for you, and you will need to create a .env file for storing your mnemonic and any other needed private information.

The .env file is ignored by git in this project, to help protect your private data. In general, it is good security practice to avoid committing information about your private keys to github. The truffle-config.js file expects a MNEMONIC value to exist in .env for running commands on each of these networks, as well as a default MNEMONIC for the Arbitrum network we will run locally.

If you are unfamiliar with using .env for managing your mnemonics and other keys, the basic steps for doing so are below:

  1. Use touch .env in the command line to create a .env file at the root of your project.
  2. Open the .env file in your preferred IDE
  3. Add the following, filling in your own Infura project key and mnemonics:
MNEMONIC="<YOUR MNEMONIC HERE>"
INFURA_KEY="<Your Infura Project ID>"
RINKEBY_MNEMONIC="<Your Rinkeby Mnemonic>"
MAINNET_MNEMONIC="<Your Mainnet Mnemonic>"
  1. As you develop your project, you can put any other sensitive information in this file. You can access it from other files with require('dotenv').config() and refer to the variable you need with process.env['<YOUR_VARIABLE>'].

Support

Support for this box is available via the Truffle community available here.

nft-box's People

Contributors

emilyjlin95 avatar kevinbluer avatar leeftk avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.