- **Viewer:** The person using the Frame on a client.
- **User:** The person who created the Frame on FrameTrain.
- **Creator:** The person who created the template from which the Frame was created. This is you, creating a template right now!
- **View:** A React component that is called by a **`handler`** (like a controller in MVC architecture), which then gets rendered using Satori and returned as image.
- **BasicView:** A specific, existent, pre-made React component imported from **`@/sdk/components`** that is used for common scenarios where you need just a title, a (optional) subtitle and a (optional) bottom message. It was made so creators don’t write the same basic component over and over again. It also comes with a matching component to use in your Inspector to let the User customize it named **`BasicViewInspector`**, click here for details.
- **Handler:** A function that receives the **VALIDATED** `POST` message from a Farcaster client, does the handling it needs, and returns either Frame data (metadata + a **`View`** or an image), or transaction data.
- **Inspector:** A required React component present in each template that appears as the “Configuration” panel on FrameTrain. It’s the right side of the editor, and is made up of one **`Configuration.Root`** and multiple **`Configuration.Section`**'s (see below). You import the **`Configuration`** parent from **`@/sdk/inspector`**.
- **Section:** In order to not overwhelm the user with all the settings at once, we separate these in tabs that the user can navigate to one at a time. This is done internally, you only have to structure the content of your Inspector in multiple **`Section`** components.
- **Page:** A an optional React component present in a template’s folder, that is displayed on the **`/${FRAME_ID}/show`** route. You can include such a component in your template to display a Page with a detailed view of the votes in the case of a poll template, achieving the same functionality as WePonder for example.
- **SDK:** The FrameTrain SDK, located in the **`@/sdk`** folder. It provides **`components`** and utilities for **`gating`**, **`fonts`** and much more. [Start reading about the SDK here.](https://github.com/FTCHD/frametrain/wiki/Home)
- **Config:** The configuration data the User sets in the Inspector for the current Frame being edited, which is saved in the DB and fed into the template at runtime.
- **Storage:** Think of this like the **`state`**, but persisted in the DB. You receive the **`storage`** in your **`handler`**, and can return a new value for it, which updates the column in the DB.
Description
A mini game type of Frame that lets the Viewer ask a question and get a random answer from a predefined list set by the User.
Includes gating options so not everyone can receive an answer.
The Page.tsx component of this template displays the list of all questions asked, and their answer. If the config is set to private, then we show only the answers of the current user. We have this data because after each question is answered, we add it, as well as the answer, timestamp and Viewer fid to the storage.
Inspector
Has Section s for “General”, “Cover”, “Answer”, and “Gating”.
The User can configure the style of the Cover (when BasicView) and Answer slides.
The User can configure the title, subtitle, and bottomMessage of the Cover slide.
The User can configure the title and bottomMessage of the Answer slide, the subtitle is used to display the picked answer.
The User can set a cooldown (pause between getting answers, -1 means you can only get an answer once)
The User can make it public or private. Public means all questions and their answer can be seen on the Page.tsx component.
Gating is done in the same as the existing Cal/Poll/Gated templates, using the GatingInspector component and runGatingChecks function. For more details see the Gating section of the SDK.
Views
Cover: displays either an image or BasicView, has an inputField for asking the question and an “Ask” button.
Answer: displays a BasicView with the answer as subtitle, the other fields, as well as customization options, are set by the User or have a default value set by the template creator.
Part of FrameHack2 (300 PTS)
- **Viewer:** The person using the Frame on a client. - **User:** The person who created the Frame on FrameTrain. - **Creator:** The person who created the template from which the Frame was created. This is you, creating a template right now! - **View:** A React component that is called by a **`handler`** (like a controller in MVC architecture), which then gets rendered using Satori and returned as image. - **BasicView:** A specific, existent, pre-made React component imported from **`@/sdk/components`** that is used for common scenarios where you need just a title, a (optional) subtitle and a (optional) bottom message. It was made so creators don’t write the same basic component over and over again. It also comes with a matching component to use in your Inspector to let the User customize it named **`BasicViewInspector`**, click here for details. - **Handler:** A function that receives the **VALIDATED** `POST` message from a Farcaster client, does the handling it needs, and returns either Frame data (metadata + a **`View`** or an image), or transaction data. - **Inspector:** A required React component present in each template that appears as the “Configuration” panel on FrameTrain. It’s the right side of the editor, and is made up of one **`Configuration.Root`** and multiple **`Configuration.Section`**'s (see below). You import the **`Configuration`** parent from **`@/sdk/inspector`**. - **Section:** In order to not overwhelm the user with all the settings at once, we separate these in tabs that the user can navigate to one at a time. This is done internally, you only have to structure the content of your Inspector in multiple **`Section`** components. - **Page:** A an optional React component present in a template’s folder, that is displayed on the **`/${FRAME_ID}/show`** route. You can include such a component in your template to display a Page with a detailed view of the votes in the case of a poll template, achieving the same functionality as WePonder for example. - **SDK:** The FrameTrain SDK, located in the **`@/sdk`** folder. It provides **`components`** and utilities for **`gating`**, **`fonts`** and much more. [Start reading about the SDK here.](https://github.com/FTCHD/frametrain/wiki/Home) - **Config:** The configuration data the User sets in the Inspector for the current Frame being edited, which is saved in the DB and fed into the template at runtime. - **Storage:** Think of this like the **`state`**, but persisted in the DB. You receive the **`storage`** in your **`handler`**, and can return a new value for it, which updates the column in the DB.ℹ️ Terminology
Description
Page.tsxcomponent of this template displays the list of all questions asked, and their answer. If the config is set to private, then we show only the answers of the current user. We have this data because after each question is answered, we add it, as well as the answer, timestamp and Viewer fid to the storage.Inspector
Sections for “General”, “Cover”, “Answer”, and “Gating”.Cover(whenBasicView) andAnswerslides.title,subtitle, andbottomMessageof theCoverslide.titleandbottomMessageof theAnswerslide, the subtitle is used to display the picked answer.-1means you can only get an answer once)Page.tsxcomponent.Cal/Poll/Gatedtemplates, using theGatingInspectorcomponent andrunGatingChecksfunction. For more details see the Gating section of the SDK.Views
BasicView, has aninputFieldfor asking the question and an “Ask” button.BasicViewwith the answer assubtitle, the other fields, as well as customization options, are set by the User or have a default value set by the template creator.