Dafne Records is a record label showcasing underground artists and soundscapes.

‍

Dafne Records

Dafnerecords.com is a web application for the promotion of, and interaction with, the label, comprising a CMS-driven marketing site and an Ethereum-based NFT marketplace.

‍

Marketing Site

Product Objective

Create a performant marketing website for the label to showcase its artists, soundscapes and vision, with the ability for administrators to edit and update content as needed.

‍

NFT Marketplace

Product Objective

Create an NFT marketplace where users have the ability to buy, sell and interact with (listen to) NFTs which are minted by an admin. Admins must accept a user’s application to the platform before they are able to interact with the NFT marketplace.

‍

Technical Summary

The site is built using React framework Next.js which provides out-of-the-box benefits such as hybrid static & server rendering and smart bundling. This enables the creation of a static website resulting in better performance and SEO. NextAuth is leveraged for authentication and authorization.

‍

Tailwind CSS is used for CSS and allows rapid prototyping along with creating a small CSS bundle size for production. Content management is achieved via DatoCMS, a headless content management system with an easy-to-use GraphQL API and benefits such as a preview mode.

‍

The Spotify API is used to fetch music data programmatically and reduce overhead for admins who are editing content. Framer Motion ensures that the animation-heavy designs can be implemented without sacrificing performance or code cleanliness, by providing a declarative API for animations and transitions.

‍

The Ethers.js library is used to interact with the Ethereum blockchain for the NFT marketplace portion of the project. Solidity is used to write the smart contract in line with the ERC721 standard. Truffle/Ganache are used for local blockchain testing. Vercel is used for hosting, which allows for easy deployment, and comes with the benefit of out-of-the-box serverless functions/API routes and preview deployments.