<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0" xmlns:atom="http://www.w3.org/2005/Atom" xmlns:dc="http://purl.org/dc/elements/1.1/">
  <channel>
    <title>DEV Community: Jan Z</title>
    <description>The latest articles on DEV Community by Jan Z (@yawnxyz).</description>
    <link>https://dev.to/yawnxyz</link>
    <image>
      <url>https://media2.dev.to/dynamic/image/width=90,height=90,fit=cover,gravity=auto,format=auto/https:%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F315921%2Ff7d349ef-5607-40a8-9ea7-98b8b73b5744.jpeg</url>
      <title>DEV Community: Jan Z</title>
      <link>https://dev.to/yawnxyz</link>
    </image>
    <atom:link rel="self" type="application/rss+xml" href="https://dev.to/feed/yawnxyz"/>
    <language>en</language>
    <item>
      <title>GFTW Web monetization guest book!</title>
      <dc:creator>Jan Z</dc:creator>
      <pubDate>Thu, 18 Jun 2020 05:29:31 +0000</pubDate>
      <link>https://dev.to/yawnxyz/gftw-web-monetization-guest-book-3aao</link>
      <guid>https://dev.to/yawnxyz/gftw-web-monetization-guest-book-3aao</guid>
      <description>&lt;h2&gt;
  
  
  What I built 😅
&lt;/h2&gt;

&lt;p&gt;Ok so I started and finished this thing... today. It's really late, as in four days past the deadline kind of late, so it won't be eligible for the actual hackathon... BUT, I just heard about the hackathon (and the associated Grant for the Web request for proposal), and I decided I had to build a small sample app that uses Web Monetization in order to learn more about it!&lt;/p&gt;

&lt;p&gt;Also, this seems like the only project built on Svelte/Sapper and using Fauna and Vercel, so that's exciting! Someone'll probably glean something from this effort.&lt;/p&gt;

&lt;p&gt;Ok! So this is a guest book from the 90's that pays the people who sign the guest book with their username and payment pointer. The payment system is based on the Probabilistic Revenue Sharing example. Svelte pulls a new pointer every few seconds and swaps out the current pointer. Basically, the more messages you leave, the more you'll get paid.&lt;/p&gt;

&lt;h3&gt;
  
  
  Submission Category:
&lt;/h3&gt;

&lt;p&gt;Exciting Experiments&lt;/p&gt;

&lt;h2&gt;
  
  
  Demo
&lt;/h2&gt;

&lt;p&gt;Link to the live project: &lt;a href="https://gftw-guestbook.vercel.app/"&gt;https://gftw-guestbook.vercel.app/&lt;/a&gt;&lt;/p&gt;

&lt;h2&gt;
  
  
  Link to Code
&lt;/h2&gt;


&lt;div class="ltag-github-readme-tag"&gt;
  &lt;div class="readme-overview"&gt;
    &lt;h2&gt;
      &lt;img src="https://res.cloudinary.com/practicaldev/image/fetch/s--i3JOwpme--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev.to/assets/github-logo-ba8488d21cd8ee1fee097b8410db9deaa41d0ca30b004c0c63de0a479114156f.svg" alt="GitHub logo"&gt;
      &lt;a href="https://github.com/janzheng"&gt;
        janzheng
      &lt;/a&gt; / &lt;a href="https://github.com/janzheng/web-money-guestbook"&gt;
        web-money-guestbook
      &lt;/a&gt;
    &lt;/h2&gt;
    &lt;h3&gt;
      Web Monetized Guest Book Example
    &lt;/h3&gt;
  &lt;/div&gt;
  &lt;div class="ltag-github-body"&gt;
    
&lt;div id="readme" class="md"&gt;
&lt;h1&gt;
GFTW Web Monetized Guestbook&lt;/h1&gt;
&lt;p&gt;This is a demo of how to build a guest book using several JAMStack technologies (Svelte/Sapper, FaunaDB, and Vercel).&lt;/p&gt;
&lt;p&gt;You can find the writeup here: &lt;a href="https://dev.to/yawnxyz/gftw-web-monetization-guest-book-3aao" rel="nofollow"&gt;https://dev.to/yawnxyz/gftw-web-monetization-guest-book-3aao&lt;/a&gt;&lt;/p&gt;
&lt;h2&gt;
How to use&lt;/h2&gt;
&lt;p&gt;Visit the live demo (&lt;a href="https://gftw-guestbook.vercel.app/" rel="nofollow"&gt;https://gftw-guestbook.vercel.app/&lt;/a&gt;) and type in a username, your pointer, and a message, and watch the $ roll in as others visit the page!&lt;/p&gt;
&lt;h2&gt;
Developer Instructions&lt;/h2&gt;
&lt;p&gt;To run this locally, clone this repo and do a&lt;/p&gt;
&lt;div class="snippet-clipboard-content position-relative"&gt;&lt;pre&gt;&lt;code&gt;yarn install
&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;
&lt;p&gt;Run the project with&lt;/p&gt;
&lt;div class="snippet-clipboard-content position-relative"&gt;&lt;pre&gt;&lt;code&gt;yarn dev
&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;
&lt;p&gt;And open up a new browser window to&lt;/p&gt;
&lt;div class="snippet-clipboard-content position-relative"&gt;&lt;pre&gt;&lt;code&gt;localhost:4060
&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;
&lt;h2&gt;
Deploying to Vercel Now&lt;/h2&gt;
&lt;p&gt;To deploy, make sure you have the Vercel CLI from &lt;a href="https://vercel.com" rel="nofollow"&gt;https://vercel.com&lt;/a&gt;, then deploy with&lt;/p&gt;
&lt;div class="snippet-clipboard-content position-relative"&gt;&lt;pre&gt;&lt;code&gt;now --prod
&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;
&lt;/div&gt;



&lt;/div&gt;
&lt;br&gt;
  &lt;div class="gh-btn-container"&gt;&lt;a class="gh-btn" href="https://github.com/janzheng/web-money-guestbook"&gt;View on GitHub&lt;/a&gt;&lt;/div&gt;
&lt;br&gt;
&lt;/div&gt;
&lt;br&gt;


&lt;h2&gt;
  
  
  How I built it
&lt;/h2&gt;

&lt;p&gt;The demo is built on Svelte/Sapper, uses Fauna as a back-end database, and is deployed on Vercel (formerly Zeit Now) as a JAMStack project.&lt;/p&gt;

&lt;p&gt;I had to figure out Fauna along the way (it's excellent for JAMStack projects), and discovered all the limitations of Web Monetization. For example, there's no way to authorize / recognize the same payer each time (you can't attach an identity to the payer).&lt;/p&gt;

&lt;p&gt;The original idea for the hackathon was for people to designate a certain amount of $ to pay someone for content (e.g. like paying for a Substack subscription), but it seems this is impossible using Coil / Web Monetization right now, since it mostly focuses on the (outdated) model of time spent on a site. If Web Monetization supported other developers to build out a Coil-like experience (where you can charge users subscription $5-10/mo through Web Monetization), that would be incredible. But alas.&lt;/p&gt;

</description>
      <category>gftwhackathon</category>
      <category>fauna</category>
      <category>svelte</category>
      <category>showdev</category>
    </item>
  </channel>
</rss>
