From 20767c4081d9dd7040527531b941f97ab64d8bce Mon Sep 17 00:00:00 2001
From: Ivan Sanchez <ivan@gourame.com>
Date: Fri, 4 Oct 2024 09:59:49 +0100
Subject: [PATCH] Convert "in action" projects to data

---
 src/website/content/http4k-in-action.md   | 45 ----------------------
 src/website/content/http4k_in_action.md   | 19 +++++++++
 src/website/data/in_action.yaml           | 47 +++++++++++++++++++++++
 src/website/layouts/in_action/single.html | 36 +++++++++++++++++
 4 files changed, 102 insertions(+), 45 deletions(-)
 delete mode 100644 src/website/content/http4k-in-action.md
 create mode 100644 src/website/content/http4k_in_action.md
 create mode 100644 src/website/data/in_action.yaml
 create mode 100644 src/website/layouts/in_action/single.html

diff --git a/src/website/content/http4k-in-action.md b/src/website/content/http4k-in-action.md
deleted file mode 100644
index b9db6107..00000000
--- a/src/website/content/http4k-in-action.md
+++ /dev/null
@@ -1,45 +0,0 @@
----
-title: http4k in Action
-description: Example applications and usages of http4k, including TDD approach
----
-
-### Media:
-
-- *"Exploring the Testing Hyperpyramid with Kotlin & http4k" @ KotlinConf 2023* ([video](https://bit.ly/hyperpyramid-kotlinconf) / [slides](https://speakerdeck.com/daviddenton/exploring-the-testing-hyperpyramid-with-kotlin-and-http4k) / [repo](https://github.com/http4k/exploring-the-testing-hyperpyramid) )
-- *"Talking Kotlin ep. 99: HTTP as a function with http4k"* ([video](https://www.youtube.com/watch?v=mPmUjJhdYME) / [podcast](https://overcast.fm/+QCXbEUw4Q))
-- *"http4k: Server as a Function"* ([video](https://www.youtube.com/watch?v=NjoCjupV8HE)), part of JetBrain's [Webinar series](https://blog.jetbrains.com/kotlin/2021/05/server-side-with-kotlin-webinar-series-vol-3/)
-- *"Server as a Function. In Kotlin. _______________" @ KotlinConf 2018* ([video](http://bit.ly/serverasafunction) / [slides](https://speakerdeck.com/daviddenton/server-as-a-function-in-kotlin)), by [David Denton](https://twitter.com/tarkaTheRotter) and [Ivan Sanchez](https://twitter.com/s4nchez)
-- *"Writing Test Driven Apps with http4k"* ([video](https://bit.ly/tdd-http4k-kotliners)), by [David Denton](https://twitter.com/tarkaTheRotter) and [Ivan Sanchez](https://twitter.com/s4nchez), presented at Kotliners 2020.
-- *"Designing Microservices in Functional Style"* ([video](https://bit.ly/uberto-functional-microservices)) by [Uberto Barbini](https://twitter.com/ramtop), presented at VirtualJUG 2020.
-- *"Introduction to http4k"* ([video](https://www.youtube.com/watch?v=FVvn-aFO--Q)) by [Dmitry Kandalov](https://twitter.com/dmitrykandalov), based on previous conference talks, recorded in 2021.
-- *"Test Driven Gilded Rose in Kotlin"* ([video series](https://www.youtube.com/playlist?list=PL1ssMPpyqocg2D_8mgIbcnQGxCPI2_fpA)) by [Duncan McGregor](https://twitter.com/duncanmcg), recorded in 2021-24.
-
-Also, check out the [YouTube Playlist](https://bit.ly/http4k-talks) for the latest collection of talks featuring http4k.
-
-### See http4k in action in these example projects and repos:
-
-There is a repository of helpful examples at [http4k/examples](https://github.com/http4k/examples), covering how to build **http4k** applications using various features.
-
-### Standalone projects...
-Each project is tagged with the http4k features it demonstrates:
-
-#### [TDD'd example application](https://github.com/http4k/http4k-by-example)
-<span class="pill">Templates</span>
-<span class="pill">Testing</span>
-<span class="pill">JSON / Lenses</span>
-<span class="pill">CD pipeline</span>
-<span class="pill">Approval Testing</span>
-<span class="pill">OpenApi</span>
-<span class="pill">Static resources</span>
-#### [Dropbox clone in 100 lines of Kotlin](https://github.com/http4k/http4kbox)
-<span class="pill">Templates</span> <span class="pill">Testing</span> <span class="pill">Http Client</span> <span class="pill">Multipart</span> <span class="pill">AWS</span> <span class="pill">CD pipeline</span> <span class="pill">Serverless</span> <span class="pill">GraalVM</span>
-#### [Simple websocket driven chat-server in 30 lines of Kotlin](https://github.com/http4k/http4k-irc)
-<span class="pill">Testing</span> <span class="pill">Websockets</span> <span class="pill">CD Pipeline</span> <span class="pill">Static resources</span>
-#### [Stage-by-stage example of London-style TDD development process](/tutorial/tdding_http4k/)
-<span class="pill">Testing</span>
-#### [Todo backend (standard routing)](https://github.com/http4k/http4k-todo-backend)
-<span class="pill">Testing</span> <span class="pill">JSON / Lenses</span> <span class="pill">CD pipeline</span>
-#### [Todo backend (contract routing)](https://github.com/http4k/http4k-contract-todo-backend)
-<span class="pill">Testing</span> <span class="pill">JSON / Lenses</span> <span class="pill">OpenApi</span> <span class="pill">CD pipeline</span>
-#### [Real World example (Medium clone)](https://github.com/alisabzevari/kotlin-http4k-realworld-example-app)
-<span class="pill">Testing</span> <span class="pill">Contracts</span> 
diff --git a/src/website/content/http4k_in_action.md b/src/website/content/http4k_in_action.md
new file mode 100644
index 00000000..7f20ecaf
--- /dev/null
+++ b/src/website/content/http4k_in_action.md
@@ -0,0 +1,19 @@
+---
+title: http4k in Action
+description: Example applications and usages of http4k, including TDD approach
+type: in_action
+---
+
+### Media:
+
+- *"Exploring the Testing Hyperpyramid with Kotlin & http4k" @ KotlinConf 2023* ([video](https://bit.ly/hyperpyramid-kotlinconf) / [slides](https://speakerdeck.com/daviddenton/exploring-the-testing-hyperpyramid-with-kotlin-and-http4k) / [repo](https://github.com/http4k/exploring-the-testing-hyperpyramid) )
+- *"Talking Kotlin ep. 99: HTTP as a function with http4k"* ([video](https://www.youtube.com/watch?v=mPmUjJhdYME) / [podcast](https://overcast.fm/+QCXbEUw4Q))
+- *"http4k: Server as a Function"* ([video](https://www.youtube.com/watch?v=NjoCjupV8HE)), part of JetBrain's [Webinar series](https://blog.jetbrains.com/kotlin/2021/05/server-side-with-kotlin-webinar-series-vol-3/)
+- *"Server as a Function. In Kotlin. _______________" @ KotlinConf 2018* ([video](http://bit.ly/serverasafunction) / [slides](https://speakerdeck.com/daviddenton/server-as-a-function-in-kotlin)), by [David Denton](https://twitter.com/tarkaTheRotter) and [Ivan Sanchez](https://twitter.com/s4nchez)
+- *"Writing Test Driven Apps with http4k"* ([video](https://bit.ly/tdd-http4k-kotliners)), by [David Denton](https://twitter.com/tarkaTheRotter) and [Ivan Sanchez](https://twitter.com/s4nchez), presented at Kotliners 2020.
+- *"Designing Microservices in Functional Style"* ([video](https://bit.ly/uberto-functional-microservices)) by [Uberto Barbini](https://twitter.com/ramtop), presented at VirtualJUG 2020.
+- *"Introduction to http4k"* ([video](https://www.youtube.com/watch?v=FVvn-aFO--Q)) by [Dmitry Kandalov](https://twitter.com/dmitrykandalov), based on previous conference talks, recorded in 2021.
+- *"Test Driven Gilded Rose in Kotlin"* ([video series](https://www.youtube.com/playlist?list=PL1ssMPpyqocg2D_8mgIbcnQGxCPI2_fpA)) by [Duncan McGregor](https://twitter.com/duncanmcg), recorded in 2021-24.
+
+Also, check out the [YouTube Playlist](https://bit.ly/http4k-talks) for the latest collection of talks featuring http4k.
+
diff --git a/src/website/data/in_action.yaml b/src/website/data/in_action.yaml
new file mode 100644
index 00000000..27188828
--- /dev/null
+++ b/src/website/data/in_action.yaml
@@ -0,0 +1,47 @@
+projects:
+    - title: "TDD’d example application"
+      github_slug: http4k/http4k-by-example
+      tags:
+        - Templates
+        - Testing
+        - JSON / Lenses
+        - CD pipeline
+        - Approval Testing
+        - OpenApi
+        - Static resources
+    - title: "Dropbox clone in 100 lines of Kotlin"
+      github_slug: http4k/http4kbox
+      tags:
+        - Testing
+        - Http Client
+        - Multipart
+        - AWS
+        - CD pipeline
+        - Serverless
+        - GraalVM
+    - title: "Simple websocket driven chat-server in 30 lines of Kotlin"
+      github_slug: http4k/http4k-irc
+      tags:
+        - Testing
+        - Websockets
+        - CD Pipeline
+        - Static resources
+    - title: "Todo backend (standard routing)"
+      github_slug: http4k/http4k-todo-backend
+      tags:
+        - Testing
+        - JSON / Lenses
+        - CD pipeline
+    - title: "Todo backend (contract routing)"
+      github_slug: http4k/http4k-contract-todo-backend
+      tags:
+        - Testing
+        - JSON / Lenses
+        - OpenApi
+        - CD pipeline
+    - title: "Real World example (Medium clone)"
+      github_slug: alisabzevari/kotlin-http4k-realworld-example-app
+      tags:
+        - Testing
+        - Contracts
+
diff --git a/src/website/layouts/in_action/single.html b/src/website/layouts/in_action/single.html
new file mode 100644
index 00000000..a7eb4637
--- /dev/null
+++ b/src/website/layouts/in_action/single.html
@@ -0,0 +1,36 @@
+{{ define "main" }}
+<div class="layout">
+	<main class="main-content">
+		<article>
+			<h1>{{ .Title }}</h1>
+			<div>
+				{{ .Content }}
+			</div>
+            <h3>See http4k in action</h3>
+            <div class="row row-cols-4">
+                <div class="card m-2 p-2">
+                    <div class="card-body">
+                        <a class="" href="https://github.com/http4k/examples"><strong>http4k/examples</strong></a>
+                        <div class="pt-2 pb-3">A collection of examples using various http4k features.</div>
+                    </div>
+                </div>
+            </div>
+            <h3>Standalone projects</h3>
+            <p>Each project is tagged with the http4k features it demonstrates:</p>
+            <div class="row row-cols-4">
+            {{ range .Site.Data.in_action.projects }}
+            <div class="card m-2 p-2">
+                <div class="card-body">
+                <a class="" href="https://github.com/{{ .github_slug }}"><strong>{{ .github_slug }}</strong></a>
+                <div class="pt-2 pb-3">{{ .title }}</div>
+                {{ range .tags }}
+                <span class="badge text-bg-secondary" style="display:inline">{{ . }}</span>
+                {{ end }}
+                </div>
+            </div>
+            {{ end }}
+            </div>
+        </article>
+	</main>
+</div>
+{{ end }}