jasperalexander / seaport-frontend

The frontend of an example implementation of the Seaport marketplace protocol for educational purpose.

Warning

16 april 2024: I'm archiving this repository because I don't have time to maintain it and the code is too outdated.

Seaport implementation (frontend)

Seaport is a marketplace protocol for safely and efficiently buying and selling NFTs. This is the frontend of an example implementation for educational purpose. The implementation also includes a backend.

The frontend is written in Typescript and uses Next.js as framework. The packages that are being used include Hardhat (Ethereum development environment), Vanilla-extract (styling), Zustand (global state management), SWR (database fetching) and Wagmi (blockchain fetching).

Installation

1. Install seaport-backend.

2. Install a web3-provider, like MetaMask.

3. Open a Command Line Interface (CLI) and clone this repository:

git clone https://github.com/JasperAlexander/seaport-frontend.git

4. Inside the repository, run the following command to install the dependencies:

yarn install

Getting Started

1. Run seaport-backend.

2. Open a new CLI. Compile the Seaport marketplace contracts:

npx hardhat compile

3. Spin up an instance of Hardhat Network:

npx hardhat node

4. Open a new CLI. Deploy the contracts to the instance of Hardhat Network:

npx hardhat run scripts/deploy.js --network localhost

5. Run the development server:

yarn dev

6. Open http://localhost:3000 with your browser to see the example implementation of the Seaport marketplace protocol.

Contributing

Contributions are very welcome. Feel free to ask questions at the Discussions tab or reach out to one of the contributors.

seaport-frontend's Issues

Repository images