Developing Web Applications with Haskell and Yesod

Found in 1 comment on Hacker News
one-punch · 2020-05-11 · Original thread
Reminds me of the “Shakespearean Templates“ [1] from the Yesod web framework [2].
[1]: https://www.oreilly.com/library/view/developing-web-applicat...
Copied below to save you a click:
Hamlet (HTML)
    $doctype 5                           #{pageTitle} - My Site             <link rel=stylesheet href=@{Stylesheet}>         <body>             <h1 .page-title>#{pageTitle}             <p>Here is a list of your friends:             $if null friends                 <p>Sorry, I lied, you don't have any friends.             $else                 <ul>                     $forall Friend name age <- friends                         <li>#{name} (#{age} years old)             <footer>^{copyright} </code></pre> Cassius (CSS)<p><pre><code>    #myid         color: #{red}         font-size: #{bodyFontSize}     foo bar baz         background-image: url(@{MyBackgroundR}) </code></pre> Lucius (CSS)<p><pre><code>    section.blog {         padding: 1em;         border: 1px solid #000;         h1 {             color: #{headingColor};         }     } </code></pre> Julius (JavaScript)<p><pre><code>    $(function(){         $("section.#{sectionClass}").hide();         $("#mybutton").click(function(){document.location = "@{SomeRouteR}";});         ^{addBling}     }); </code></pre> For those curious, the above is implemented in the metaprogramming framework of Template Haskell.</p></p></p></p></p></p></p></p>
                        </div>                </div>            </div>
        </div>

<div class="row newsletter-signup">
  <div class="twelve columns signup-grid">
    <div class="logo-box">
      <img class="logo" src="https://static.hackernewsbooks.com/hnb_icon_220x220.png" alt="HNB_Logo" />
    </div>
    <div class="ml-embedded" data-form="20E16I"></div>
  </div>
</div></div><div class="footer-wrapper">
  <div class="container">
    <footer>
      <div class="row">
        <div class="four columns">
          <a class="logo" href="/"><img src="https://static.hackernewsbooks.com/hnb_icon_220x220.png" /></a>
          <a class="logo" href="/">Hacker News Books</a>
	    <ul class="list-clean">
            <li>
              <a href="https://x.com/hnbbooks">
                <i class="fa-brands fa-x-twitter" aria-hidden="true"></i>
                <span>Follow @hnbbooks on X</span>
              </a>
            </li>
            <li>
              <a rel="me" href="https://mastodon.social/@hackernewsbooks">
                <i class="fa-brands fa-mastodon" aria-hidden="true"></i>
                <span>Follow @hackernewsbooks on Mastodon</span>
              </a>
            </li>
            <li>
              <a href="https://bsky.app/profile/hackernewsbooks.com">
                <i class="fa-brands fa-bluesky" aria-hidden="true"></i>
                <span>Follow @hackernewsbooks.com on Bluesky</span>
              </a>
            </li>
            </ul>
        </div>
        <div class="three columns">
          <ul class="list-clean">
            <li><a href="/">Home</a></li>
            <li><a href="/about">About</a></li>
	    <li><a href="/newsletter" target="_blank">Subscribe</a></li>
            <li><a href="/terms">Terms</a></li>
            <li><a href="/privacy">Privacy</a></li>
          </ul>
        </div>
        <div class="five columns">
          <ul class="list-clean">
            <li><a href="/programming-languages">Best Programming Books</a></li>
            <li><a href="/reading-lists">Reading Lists</a></li>
            <li><a href="/interviews">Interviews</a></li>
            <li><a href="/archives">Yearly Archives</a></li>
            <li><a href="/random">Random Book</a></li>
          </ul>
        </div>
      </div>      <div class="row">
        <div class="disclaimer eight offset-by-four columns">
          HackerNewsBooks.com is a participant in the Amazon Services LLC Associates Program, an affiliate advertising program designed to provide a means for sites to earn advertising fees by advertising and linking to Amazon.com.
        </div>
      </div>    </footer>
  </div></div></body>
</html>
ISBN: None
