Clipit is a platform for Twitch Streamers to earn additional revenue by rewarding their supporters with Clip NFTs.

Clipit started off as a project for me to play around and get some experience with Ethereum, Smart Contracts and Go, but with time we tried making it into a product and approached most of top 1000 English streamers to see if they'd be interested in something like this. TLDR: They were not.

Architecture

Smart Contracts

There are three main contracts:

• Clipit.sol extension of ERC721 responsible for verifying sender signature (ownership of the Clip and Ethereum address) and minting the Clip NFTs
• Market.sol responsible for Bids/Asks on Clip NFTs
• AuctionHouse.sol responsible for running Auctions for Clip NFTs

Contracts were build on top of Zora Protocol with Hardhat.

Contracts documentation.

Indexer

The Indexer is an off chain storage and indexing of Ethereum Smart Contract Events/Logs. The Indexer is deployed as a Subgraph on TheGraph protocol and accessible via GraphQL API.

Backend service

Clipit backend API is build in Go deployed via Google Cloud. It consumes couple of third party APIs:

• Twitch OAuth - to authenticate users calling the Clipit API
• Twitch API to verify users ownership of the Clip and to download the Clip
• IPFS via Pinata - to upload the Clip & generated Metadata

The Clipit API also generates cryptographic ECDSA signature which is used by the Clipit.sol to verify users Clip ownership and ETH address.

Servers documentation.

Clients

There are 3 frontend client modes:

All of the clients were build with React and deployed via Firebase.

1. App

App is the main frontend client, where users are able to:

• Login with Twitch
• Display their Twitch Clips
• Mint Twitch Clip into NFT
• Display owned Clip NFTs and their statis
• Create Auctions for the Clip NFTs

Interaction with Ethereum is done via integration with Metamask Wallet. The App also reads contract data via GraphQL from the Indexer or directly from the Smart contracts, calls Twitch OAuth and APIs and reads Clips metadata via Pinata from IPFS.

2. Demo Page

Demo Page is a basic "landing page" style client to collect interest about the platform. It could have been build as a static site, but it was not worth it to introduce another stack/app just for the existing purpose.

3. Twitch Extension

Twitch Extension was build to allow one click generation of Clips into NFTs via Streamers "Stream Manager".

Clients documentation.

clipit_extension.mp4

Things to improve

There is a very long list of things that could be improved - from smarter build/deployment tooling on server, automation of ABI updates, through optimazing Contracts gas cost, better test coverage, metrics & tracing in server, broken/inconsistent desings/CSS, to better documentation and TODOs within the codebase there's certainly a lot of stuff that could be better.

Acknowledgements

A lot of open source work has been used in this project. Some notable mentions include Zora Protocol and Ardan Labs Starter code for web services.

Disclaimer

No Twitch Clips created by Twitch streamers were turned into NFTs on Ethereum mainnet.