Deploying to Vercel

The easiest way to deploy your ArtVault frontend is through Vercel — the creators of Next.js. It offers simple integration, fast global CDN, and automatic deployments from Git.

Important: All the following steps will be only applied to /client folder, so assume this folder the only folder you have.

1. Prepare Your Project

Make sure your project is working locally and that your environment variables are set correctly in your .env file:

NEXT_PUBLIC_TEMPLATE_CLIENT_ID=your-client-id
NEXT_PUBLIC_SUPPORTED_CHAIN=your-chain
NEXT_PUBLIC_COLLECTION_CONTRACT_ADDRESS='user-contract-address'
NEXT_PUBLIC_COLLECTION_CONTRACT_ADDRESS='nft-collection-contract-address'
NEXT_PUBLIC_MARKETPLACE_CONTRACT_ADDRESS='marketplace-contract-address'

2. Push Your Code to GitHub

1. Create a GitHub repository (or GitLab/Bitbucket).

2. Push your project code to the repository.

git init
git remote add origin https://github.com/your-username/artvault.git
git add .
git commit -m "Initial commit"
git push -u origin main

3. Deploy on Vercel

1. Go to vercel.com and log in (or create a free account).

2. Click "New Project".

3. Import your Git repository.

4. Vercel will auto-detect it's a Next.js app.

5. Set your Environment Variables (same as in .env).

6. Click "Deploy".

You can modify environment variables later in your Vercel dashboard under Project → Settings → Environment Variables.

After Deployment

• Vercel will provide you with a live URL like https://your-app.vercel.app.

• Any push to the main (or selected) branch will automatically redeploy.

• You can connect your custom domain if you want.

Automatic Deployments

Any push to your repo (main branch) will automatically trigger a new deployment.

Done!

You should now finlaized vercel deployment and see the app running on the internet, if you still need help, Reach out on our Support Page