From fc3deb9ef6fb6b90b2689ed7f5540cd0e846231e Mon Sep 17 00:00:00 2001 From: Charles Iliya Krempeaux Date: Sun, 4 Feb 2024 16:57:34 -0800 Subject: [PATCH] initial commits --- index.xhtml | 105 +++++++++++++++++++++++++++++++++++++++++++--------- 1 file changed, 88 insertions(+), 17 deletions(-) diff --git a/index.xhtml b/index.xhtml index d804175..094d739 100644 --- a/index.xhtml +++ b/index.xhtml @@ -19,10 +19,10 @@ The Frames Protocol, also known Farcaster Frames, is a simple web-based technology used for making applications.

- Although the Frames Protocol could be used outside of Farcaster, at the time of writing, Farcaster clients are the only major (client-side) platform to support it. + Although the Frames Protocol could be used outside of Farcaster, at the time of writing, Farcaster clients (such as Warpcast) are the only major (client-side) platform to support it.

- (The server-side of the Frames Protocol, which is called a Frame Server, is an HTTP resource — which some might loosely call an HTTP (or HTTP) URL.) + (The server-side of the Frames Protocol, which is called a Frame Server, is an just HTTP resource — which some might loosely call an HTTP (or HTTP) URL.)

@@ -57,12 +57,15 @@

HTML looks like this:

+ 

 The following is <b>bold</b> and <a href="http://example.com/">this</a> is a link.
+

Although typically, HTML comes as a whole page (rather than a fragment), and thus usually looks more like this:

+ 

 <!DOCTYPE html>
 <html xmlns="http://www.w3.org/1999/xhtml" lang="en">
@@ -79,36 +82,38 @@ The following is <b>bold</b> and <a href="http://example.com/">
     </body>
 </html>
+

The Frames Protocol actually only uses a tiny part of HTML.

-

HTML <meta> Element

+

HTML <meta> Element

- When creating a Frames Protocol application, you can effectively ignore almost all of HTML except for one HTML element — the HTML <meta> element. + The HTML <meta> element has been around since the 1990s.

- The Frames Protocol only uses the HTML <meta> element. - And it (the Frames Protocol) uses the HTML <meta> element in a very particular way. + If you look at the old HTML 2.0 specification (i.e., IETC RFC-1866 in section 5.2.5.), which was created back in the 1990s, you can see how the HTML <meta> element was defined back then.

- The HTML <meta> element has been around since the 1990s. + When creating a Frames Protocol application, you can effectively ignore almost all of HTML except for one HTML element — the HTML <meta> element.

- If you look at the old HTML 2.0 specification (i.e., IETC RFC-1866 in section 5.2.5.), which was created back in the 1990s, you can see how the HTML <meta> element was defined back then. + The Frames Protocol only uses the HTML <meta> element. + And it (the Frames Protocol) uses the HTML <meta> element in a very particular way.

OpenGraph

- The Frames Protocol usage of the HTML <meta> element takes inspiration from the OpenGraph protocol. + The Frames Protocol usage of the HTML <meta> element takes inspiration from the OpenGraph protocol.

- Here is an example of the OpenGraph protocol: + Here is an example of a web-page using the OpenGraph protocol:

+ 

 <!DOCTYPE html>
 <html xmlns="http://www.w3.org/1999/xhtml" lang="en">
@@ -133,21 +138,87 @@ The following is <b>bold</b> and <a href="http://example.com/">
     </body>
 </html>
-

- Since there is a lot of HTML code there, let's just focus on the OpenGraph part of it: -

+
+

+ Since there is a lot of HTML code there, let's just focus on the OpenGraph part of it: +

+ 

 	<meta property="og:title" content="Hello world!" />
 	<meta property="og:type"  content="article" />
 	<meta property="og:image" content="/images/4aigvXF62jMY8iRzFN8x.jpeg" />
 	<meta property="og:url"   content="http://www.example.com/article/hello-world.xhtml" />
-

- It is rather simple. - It is just name-value pairs. -

+
+

+ It is rather simple. + It is just name-value pairs. +

+

+ The "og" part (in "og:title", "og:type", "og:image", and "og:url") is short for "OpenGraph". + And thus all these OpenGraph names are namespaced. +

+
+

Frames <meta>

+

+ The Frames Protocol defines its own list of name-value pairs also using the HTML <meta> element, similar to OpenGraph. +

+

+ When creating a Frames Protocol application, you MUST include these: +

+ +

+ (Note that the last required name is from OpenGraph! + Where the first two have been created by the Frames Protocol.) +

+

+ Here is an example of these in HTML <meta> elements: +

+
+

+	<meta property="fc:frame"       content="vNext" />
+	<meta property="fc:frame:image" content="/images/4aigvXF62jMY8iRzFN8x.jpeg" />
+	<meta property="og:image"       content="/images/4aigvXF62jMY8iRzFN8x.jpeg" />
+
+
+

+ Or the same in a more fjll HTML document: +

+
+

+<!DOCTYPE html>
+<html xmlns="http://www.w3.org/1999/xhtml" lang="en">
+    <head>
+        <meta charset="utf-8" /<
+
+
+	<meta property="fc:frame"       content="vNext" />
+	<meta property="fc:frame:image" content="/images/4aigvXF62jMY8iRzFN8x.jpeg" />
+	<meta property="og:image"       content="/images/4aigvXF62jMY8iRzFN8x.jpeg" />
+
+
+        <title>Example Frame Server</title>
+    </head>
+    <body>
+
+        <p>
+		This is an example Frame Server.
+        </p>
+
+    </body>
+</html>
+
+
+

+ So what does that actually do‽ +

+