From a2d715574644f1b5e959566817c5cfb25f91d0e9 Mon Sep 17 00:00:00 2001 From: Yarden Shoham Date: Wed, 31 Jan 2024 05:47:22 +0000 Subject: [PATCH 1/4] Add htmx guidelines To make sure we don't abuse it. Signed-off-by: Yarden Shoham --- docs/content/contributing/guidelines-frontend.en-us.md | 3 +++ 1 file changed, 3 insertions(+) diff --git a/docs/content/contributing/guidelines-frontend.en-us.md b/docs/content/contributing/guidelines-frontend.en-us.md index aa1759d9c974d..02bd34fa95235 100644 --- a/docs/content/contributing/guidelines-frontend.en-us.md +++ b/docs/content/contributing/guidelines-frontend.en-us.md @@ -65,14 +65,17 @@ Recommended implementations: * Vue + Vanilla JS * Fomantic-UI (jQuery) +* htmx * Vanilla JS Discouraged implementations: * Vue + Fomantic-UI (jQuery) * jQuery + Vanilla JS +* htmx + anything else To make UI consistent, Vue components can use Fomantic-UI CSS classes. +We use htmx for simple interactions. You can see an example for simple interactions where htmx should be used in this [PR](https://github.com/go-gitea/gitea/pull/28908). Do not use htmx if you require more advanced reactivity, use another framework (Vue/Vanilla JS). Although mixing different frameworks is discouraged, it should also work if the mixing is necessary and the code is well-designed and maintainable. From 119c2d46b2f2b47ae3a3c9c8ea2edcb524ff067b Mon Sep 17 00:00:00 2001 From: Yarden Shoham Date: Wed, 31 Jan 2024 12:10:40 +0200 Subject: [PATCH 2/4] Update docs/content/contributing/guidelines-frontend.en-us.md Co-authored-by: wxiaoguang --- docs/content/contributing/guidelines-frontend.en-us.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/docs/content/contributing/guidelines-frontend.en-us.md b/docs/content/contributing/guidelines-frontend.en-us.md index 02bd34fa95235..e5d8055e562c2 100644 --- a/docs/content/contributing/guidelines-frontend.en-us.md +++ b/docs/content/contributing/guidelines-frontend.en-us.md @@ -65,7 +65,7 @@ Recommended implementations: * Vue + Vanilla JS * Fomantic-UI (jQuery) -* htmx +* htmx (partial reloading) * Vanilla JS Discouraged implementations: From 7935e3ba520e077d86e1d430f10a6792920adca3 Mon Sep 17 00:00:00 2001 From: Yarden Shoham Date: Wed, 31 Jan 2024 10:15:19 +0000 Subject: [PATCH 3/4] Clarify Signed-off-by: Yarden Shoham --- docs/content/contributing/guidelines-frontend.en-us.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/docs/content/contributing/guidelines-frontend.en-us.md b/docs/content/contributing/guidelines-frontend.en-us.md index e5d8055e562c2..15152248b40bc 100644 --- a/docs/content/contributing/guidelines-frontend.en-us.md +++ b/docs/content/contributing/guidelines-frontend.en-us.md @@ -72,7 +72,7 @@ Discouraged implementations: * Vue + Fomantic-UI (jQuery) * jQuery + Vanilla JS -* htmx + anything else +* htmx + any other framework which requires heavy JS code, or unnecessary features like htmx scripting (`hx-on`) To make UI consistent, Vue components can use Fomantic-UI CSS classes. We use htmx for simple interactions. You can see an example for simple interactions where htmx should be used in this [PR](https://github.com/go-gitea/gitea/pull/28908). Do not use htmx if you require more advanced reactivity, use another framework (Vue/Vanilla JS). From 148f67d534ddf43c42861d6e006c733b0ca2ce47 Mon Sep 17 00:00:00 2001 From: Yarden Shoham Date: Wed, 31 Jan 2024 12:29:29 +0200 Subject: [PATCH 4/4] Update docs/content/contributing/guidelines-frontend.en-us.md Co-authored-by: delvh --- docs/content/contributing/guidelines-frontend.en-us.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/docs/content/contributing/guidelines-frontend.en-us.md b/docs/content/contributing/guidelines-frontend.en-us.md index 15152248b40bc..edd89e1231d16 100644 --- a/docs/content/contributing/guidelines-frontend.en-us.md +++ b/docs/content/contributing/guidelines-frontend.en-us.md @@ -65,7 +65,7 @@ Recommended implementations: * Vue + Vanilla JS * Fomantic-UI (jQuery) -* htmx (partial reloading) +* htmx (partial page reloads for otherwise static components) * Vanilla JS Discouraged implementations: