Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/ftchd/frametrain
Infinitely growing Frames builder with integrated Farcaster Hub APIs and Revenue Sharing.
https://github.com/ftchd/frametrain
coinbase farcaster farcaster-frames farcaster-protocol framesjs frog merkle-manufactory no-code no-code-framework onchainkit viem warpcast
Last synced: 12 days ago
JSON representation
Infinitely growing Frames builder with integrated Farcaster Hub APIs and Revenue Sharing.
- Host: GitHub
- URL: https://github.com/ftchd/frametrain
- Owner: FTCHD
- Created: 2024-03-30T00:52:37.000Z (8 months ago)
- Default Branch: dev
- Last Pushed: 2024-10-27T21:31:30.000Z (16 days ago)
- Last Synced: 2024-10-28T00:58:30.831Z (16 days ago)
- Topics: coinbase, farcaster, farcaster-frames, farcaster-protocol, framesjs, frog, merkle-manufactory, no-code, no-code-framework, onchainkit, viem, warpcast
- Language: TypeScript
- Homepage: https://frametra.in
- Size: 28.2 MB
- Stars: 27
- Watchers: 4
- Forks: 30
- Open Issues: 16
-
Metadata Files:
- Readme: README.md
- Funding: .github/FUNDING.yml
Awesome Lists containing this project
README
# 🚂 FrameTrain
https://github.com/FTCHD/frametrain/assets/144691102/6c901347-1a28-4a25-93f5-c6bc54076d5a
### FrameTrain is Canva for Farcaster Frames.
- Open Source
- Revenue Sharing
- Integrated Farcaster Hub APIs, so you can just build™️This repository is mostly geared towards template artists. If you're looking to create and posts Frames, visit [FrameTrain.](https://frametra.in)
# Templates
![Farcaster Frames Templates](https://raw.githubusercontent.com/FTCHD/frametrain/main/.github/templates.png)
Templates live in the **`@/templates`** folder. Each template follows a clear folder structure:- **`handlers`** — a collection of 1 or more functions, used as controllers for displaying the **`views`**. Must contain at least an **`initial`** handler.
- **`views`** — a collection of 1 or more React components, rendered as the Frames’ image using **`satori`**. Must contain at least a **`Cover`** view.
- **`Inspector`** — a React component displayed in the Frame Editor. Used to get input from the user, transform it as needed and saving it as the Frame’s config. This config will be used by the **`handlers`** to properly display the **`views`**.
- **`cover`** — a cover image for the template, displayed in the template selection screen.Everything else is completely up to you. You can have a **`hooks`**, **`types`**, **`utils`**, or an **`assets`** folder if you want.
# Integrated Hub API
FT validates each message without requiring template creators to integrate external APIs. In order to enable message validation for your template, just set the **`requireValidation`** flag in the template config.Right now, the API provider used is Neynar. Neynar requests seem cheap at first, but having hundreds or thousands of Frames making requests hasn't been tested.
The choice stands between an internal Hub run by FT, continuing to use Neynar, or switching to Airstack. It’s not clear right now which option is the right one. Reach out if you have any suggestions!
# Revenue Sharing (WIP)
![Farcaster Revenue Sharing](https://raw.githubusercontent.com/FTCHD/frametrain/main/.github/monetize.png)Hosting Frames is currently free, however that will change.
Soon you will be able to subscribe and host your Frames with no imposed limits (as opposed to the always free tier which would have some limits). The revenue from subscriptions will be shared with template creators, depending on usage.
Usage is counted as calls coming from a Farcaster client to any of the template’s **`handlers`**. The more Farcaster users interact with a Frame, the more its template creator earns.
At the end of the month, costs are subtracted, the number of calls are added to calculate a ratio, and each creator is rewarded.
This part is still a WIP, and the train has to run for a bit in order to make further decisions on the exact mechanism.
# SDK
The FrameTrain Frames SDK includes many useful **Functions**, **Hooks**, and **UI Components**. View the full documentation [here.](https://github.com/FTCHD/frametrain/wiki/%5BSDK%5D-Hooks)### APIs
- Neynar Frame Validation
- Neynar User Info
- Gating
- Webhooks
- Transactions
- Loading Google Fonts
- Uploading Images
- Running Code on the Server
- Running Code on the Client
- Scraping### Hooks
- **`useFarcasterName`**
- **`useFarcasterId`**
- **`useFrameId`**
- **`useFrameConfig`**
- **`useFrameStorage`**
- **`useFramePreview`**
- **`useResetPreview`**
- **`useUploadImage`**# Contributing
Thank you for considering making FrameTrain better.The project currently needs help with:
- TS Generics. I skipped **[generics class](https://www.youtube.com/watch?v=ATdXeuQh_Ws&t=1m40s)** and I've tried implementing them but it always leads to spaghetti. The base template types should be generics based on the initial config received, this would make everything much more cleaner and modular.
- Bug Fixes & More. If you see something that sucks, and you know how to do it better, open a PR and let’s see that confidence. It would be really appreciated actually.For a good experience, please install the [Biome](https://biomejs.dev) extension. This repository uses Biome, not ESLint.
# Acknowledgements
FrameTrain either uses, has used, or got inspired by the following libraries:
- [Frog](https://github.com/wevm/frog) by [@wevm](https://github.com/wevm) and [@dalechyn](https://github.com/dalechyn)
- [Frames.js](https://github.com/framesjs/frames.js) by [@davidfurlong](https://github.com/davidfurlong) and [@stephancill](https://github.com/stephancill)
- [Onchainkit](https://github.com/coinbase/onchainkit) by [@coinbase](https://github.com/coinbase)We are very grateful for their contributions to the Frames ecosystem!