Getting Started

Prerequisites

  1. Install Node.js and NPM
  2. Install Yarn
  3. Request free Reservoir API key

Built With

Installation

Fork this repo and follow these instructions to install dependancies.

With yarn:

$ yarn install

With NPM:

$ npm install

Configuration

Reservoir Market is built to be fully configurable using environment variables. To preview your configuration locally you can copy the values you want to use from env.development or env.production into a new file called .env.local

Note: Environment variables can also be added during deployment via deployment platforms like vercel.

Admin Configuration

Environment Variable

Required

Description

Example

NEXT_PUBLIC_RESERVOIR_API_BASE

true

The Reservoir API base URL. Available Mainnet, Optimism and Goerli.

https://api.reservoir.tools/,
https://api-goerli.reservoir.tools, https://api-optimism.reservoir.tools

NEXT_PUBLIC_CHAIN_ID

true

The Ethereum network to be used. 1 for Etherem Mainnet and 5 for Goerli Testnet.

1, 5, 10

NEXT_PUBLIC_PROXY_API_BASE

true

The proxy API used to pass the Reservoir API key without exposing it to the client.

/api/reservoir

NEXT_PUBLIC_RESERVOIR_API_KEY

true

Reservoir API key provided by the Reservoir Protocol. Get your own API key.

123e4567-e89b-12d3-a456-426614174000

NEXT_PUBLIC_ALCHEMY_ID

true

Alchemy API key required for buying items on mobile. Get your own API key here.

123e4567-e89b-12d3-a456-426614174000

NEXT_PUBLIC_DATADOG_CLIENT_TOKEN

false

Datadog client token for configuring analytics.

pub4bec8e12515ec3458fe1acced2bidb321

NEXT_PUBLIC_DATADOG_APPLICATION_ID

false

Datadog application id for configuring analytics.

1dabcdsdaad-3953-125a-b412-815dgf31sfsd190

Marketplace Configuration

Environment VariableRequiredDescriptionExample
NEXT_PUBLIC_SOURCE_IDtrueDEPRECATED: The source ID used to attribute listings and offers from your marketplace.Reservoir Market
NEXT_PUBLIC_SOURCE_DOMAINtrueThe source ID used to attribute listings and offers from your marketplace. Must be in a domain format.reservoir.market
NEXT_PUBLIC_SOURCE_NAMEfalseThe source name used to attribute listings and offers from your marketplace, falls back to the domain.Reservoir Market
NEXT_PUBLIC_ORDER_KINDfalseThe order kind to be used when listing or making offers on your marketplace. Default will use seaport if not set.zeroex-v4. wyvern-v2.3, seaport
NEXT_PUBLIC_FEE_BPSfalseThe marketplace fee that will be earned from native listings and offers on your marketplace. Configured as basis points - eg. 100 = 1%, 1000 = 10% and 10000 = 100%.100
NEXT_PUBLIC_FEE_RECIPIENTfalseThe address that will receive marketplace fee.0xF296178d553C8Ec21A2fBD2c5dDa8CA9ac905A00
NEXT_PUBLIC_COLLECTIONfalseUse this to configure a single collection marketplace or set the default collection for your community marketplace.0x8d04a8c79ceb0889bdd12acdf3fa9d207ed3ff63
NEXT_PUBLIC_COLLECTION_SET_IDfalseUse this to configure a community marketplace. Generate your collection set ID here.f566ba09c14f56aedeed3f77e3ae7f5ff28b9177714d3827a87b7a182f8f90ff
NEXT_PUBLIC_COMMUNITYfalseUse this to configure a community marketplace. Note: Community IDs are only available for certain communities.artblocks
NEXT_PUBLIC_REDIRECT_HOMEPAGEfalseIf enabled, homepage will automatically redirect to collection page set in NEXT_PUBLIC_COLLECTION.true
NEXT_PUBLIC_OPENSEA_CROSS_POSTfalseDEPRECATED: When enabled users will have the ability to cross post listings to OpenSea.true
NEXT_PUBLIC_EXTERNAL_LINKSfalseExternal links to be displayed in the top navigation bar.Blog::<<https://blog.com,Docs::https://docs.com>>
NEXT_PUBLIC_COLLECTION_DESCRIPTIONSfalseCustomize descriptions on a per collection basis.0xb74bf94049d2c01f8805b8b15db0909168cabf46::test description,0xc751c84678d8e229e361f9b04c080256516f4a0a::another description
NEXT_PUBLIC_NAVBAR_LOGO_LINKfalseCustomize the marketplace navabar logo's link.https://blog.com
NEXT_PUBLIC_DEFAULT_TO_SEARCHfalseIf enabled, search bar will be displayed instead of collection switcher.true
NEXT_PUBLIC_LISTING_CURRENCIESfalseCustomize which currency users can list in.[{"symbol": "ETH", "decimals": 18, "contract": "0x0000000000000000000000000000000000000000"},{"symbol": "USDC", "decimals": 6, "contract": "0xA0b86991c6218b36c1d19D4a2e9Eb0cE3606eB48"}]

Design Configuration

Environment VariableRequiredDescriptionExample
NEXT_PUBLIC_NAVBAR_LOGOfalseThe logo of your marketplace that appears on mobile.https://www.reservoir.market/reservoir.svg
NEXT_PUBLIC_DESKTOP_NAVBAR_LOGOfalseThe logo of your marketplace that appears on desktop.https://www.reservoir.market/reservoir-desktop.svg
NEXT_PUBLIC_FAVICONfalseThe favicon for your marketplace.https://www.reservoir.market/reservoir.svg
NEXT_PUBLIC_SOURCE_ICONfalseThe icon that appears on native listings.https://www.reservoir.market/reservoir.svg
NEXT_PUBLIC_DISABLE_POWERED_BY_RESERVOIRfalseUse this to disable the Powered by Reservoir tag on modals.true
NEXT_PUBLIC_DARK_MODEfalseUse this to enable dark mode theme.true
NEXT_PUBLIC_THEME_SWITCHING_ENABLEDfalseUse this to allow users to toggle between the dark and light theme. If NEXT_PUBLIC_DARK_MODE is enabled then that will be the default theme selected.true
NEXT_PUBLIC_PRIMARY_COLORfalseUse this to select your primary color.default, red, orange, lime, green, blue
NEXT_PUBLIC_FONT_FAMILYfalsePrimary sans font used in your marketplace.Inter, Montserrat, Open Sans, Playfair Display, Roboto, Druk, Nunito Sans, Lucida Grande, Gazpacho, Frank Ruh Libre, Chalkboard, Gothicus Roman, Styrene B Black, Montserrat Uppercase Bold Italic
NEXT_PUBLIC_BODY_FONT_FAMILYfalseSecondary font family used in your marketplace.Inter, Montserrat, Open Sans, Playfair Display, Roboto, Druk, Nunito Sans, Lucida Grande, Gazpacho, Frank Ruh Libre, Chalkboard, Gothicus Roman, Styrene B Black, Montserrat Uppercase Bold Italic
NEXT_PUBLIC_FONT_URLSfalseUse in conjunction with NEXT_PUBLIC_FONT_FAMILY and NEXT_PUBLIC_BODY_FONT_FAMILY to pull in a remote font, using services like google fonts, adobe fonts etc.https://fonts.googleapis.com/css2?family=Blaka&display=swap,https://fonts.googleapis.com/css2?family=Bebas+Neue&display=swap
NEXT_PUBLIC_BANNER_IMAGEfalseThe background banner image used on collection pages. If not set this will use the default collection banner.https://www.reservoir.market/banner.png
NEXT_PUBLIC_DISABLE_COLLECTION_BGfalseUse this to hide the background banners on collection pages.true
NEXT_PUBLIC_TAGLINEfalseA tagline to be displayed in the homepage. Only available if NEXT_PUBLIC_COLLECTION and NEXT_PUBLIC_COMMUNITY are unset.Buy, sell and collect NFTs!

SEO Configuration

Environment VariableRequiredDescriptionExample
NEXT_PUBLIC_META_TITLEfalseThe text used in the tag.Reservoir Market | Open Source NFT Marketplace
NEXT_PUBLIC_META_DESCRIPTIONfalseThe text used in the meta descriptionReservoir Market is an open source NFT marketplace built with Reservoir.
NEXT_PUBLIC_META_OG_IMAGEfalseThe image used in the meta og images .https://www.reservoir.market/og.png

Run the App

Once you have your setup ready, run:

With yarn:

$ yarn dev

With npm:

$ npm run dev

Deploy with Vercel

This is a Next.js app that can be easily deployed using Vercel. For more information on how to deploy your Github reposistory with Vercel visit their docs.

(back to top)

Contact

Twitter: @reservoir0x
Discord: Reservoir Protocol
Project Link: Reservoir Protocol

(back to top)


Did this page help you?