AirSwap Launcher

A web application that makes it easy for anyone to deploy an AirSwap NFT Marketplace to IPFS with customized environment variables.

Prerequisites

• Node.js (v16 or higher)
• Yarn package manager
• Infura account with IPFS access

How It Works

1. The user fills out a form with the necessary information (collection name, NFT address, etc.)
2. When the user clicks "Deploy to IPFS", the application:
   • Fetches the NFT marketplace build zip file from GitHub Pages
   • Extracts all files from the zip
   • Flattens the directory structure by removing any build/ directories
   • Replaces environment variables in text files (HTML, JS, CSS, JSON) with the user-provided values
   • Uploads all files to IPFS as a directory
   • Displays the IPFS URL to the user

Environment Variables

This project uses Vite's built-in environment variable handling. In Vite, environment variables are exposed on the special import.meta.env object instead of process.env.

Variables must be prefixed with VITE_ to be exposed to your Vite-processed code:

• VITE_INFURA_PROJECT_ID: Your Infura project ID
• VITE_INFURA_PROJECT_SECRET: Your Infura project secret
• VITE_GITHUB_TOKEN (optional): GitHub token for accessing private repositories
• VITE_DEFAULT_REPO_URL: URL to the NFT marketplace build on GitHub Pages

The application will replace the following environment variables in the marketplace build:

• REACT_APP_COLLECTION_NAME: The name of your NFT collection
• REACT_APP_COLLECTION_TOKEN: The Ethereum address of your NFT contract
• REACT_APP_COLLECTION_IMAGE: URL to the collection's image
• REACT_APP_CHAIN_ID: The blockchain ID (1 for Ethereum Mainnet)
• REACT_APP_CURRENCY_TOKEN: The token used for transactions (default is WETH)
• REACT_APP_STORAGE_SERVER_URL: URL of the storage server
• REACT_APP_WALLET_CONNECT_PROJECT_ID: Your WalletConnect Project ID
• REACT_APP_ALCHEMY_API_KEY: Your Alchemy API Key

The application handles multiple formats of environment variables:

• Standard format: {{REACT_APP_VARIABLE_NAME}}
• React environment variable format: %REACT_APP_VARIABLE_NAME%
• Compiled JS format: Object({...}).REACT_APP_VARIABLE_NAME
• Process env format: process.env.REACT_APP_VARIABLE_NAME
• JSON-like structures: "REACT_APP_VARIABLE_NAME": "value"

License

MIT