This is a design for a main page of an NFT marketplace. It gets data from Opensea using a variety of APIs.
- Consume API data from places like Looksrare and other NFT aggregators
- Query Messari's Opensea subgraph
- Implement Dark Mode
- Implement Localization feature to allow users to change language with a click
- Live Site URL: NFT Website
- Semantic HTML5 markup
- CSS custom properties
- Flexbox
- CSS Grid
- Mobile-first workflow
- React - JS library
- Next.js - React framework
- Tailwind CSS - For styles
One of the goals with this project was to handle Server Side Rendering in a website that has to serve somewhat updated data. Currently it updates itself if the current build is older than 5 minutes, but the Messari subgraph has a much slower update rate. Also I ran into issues with Vercel's serverless function time limit, currently 10 seconds in the free tier. I've shaved it down to around 9-12 seconds per build, so unfortunately the update feature sometimes doesn't work as it just times out. Rate limits increase significantly in the paid tiers.
More Typescript practice!
- Twitter - @uncoolzero