nprasad2077/docs
1
1
Fork 0
mirror of https://gitea.com/gitea/docs.git synced 2026-09-20 04:58:52 +00:00
Code Issues Packages Projects Releases Wiki Activity

Fix project board bug and improve documents (#17753)

Browse Source 
* the project board was broken, this PR fixes it, and refactor the code, and we prevent the uncategorized column from being dragged.
* improve the frontend guideline (as discussed in https://github.com/go-gitea/gitea/pull/17699)
This commit is contained in:
wxiaoguang
2021-11-22 19:40:17 +08:00
committed by GitHub
parent 3f187b5151
commit 85958c5ac7
1 changed files with 26 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files
doc/developers/guidelines-frontend.md
+26
View File
@@ -40,6 +40,19 @@ We recommend [Google HTML/CSS Style Guide](https://google.github.io/styleguide/h
7. Simple pages and SEO-related pages use Go HTML Template render to generate static Fomantic-UI HTML output. Complex pages can use Vue2 (or Vue3 in future). 7. Simple pages and SEO-related pages use Go HTML Template render to generate static Fomantic-UI HTML output. Complex pages can use Vue2 (or Vue3 in future).
### Framework Usage
Mixing different frameworks together is highly discouraged. A JavaScript module should follow one major framework and follow the framework's best practice.
Recommended implementations:
* Vue + Native
* Fomantic-UI (jQuery)
* Native only
Discouraged implementations:
* Vue + jQuery
* jQuery + Native
### `async` Functions ### `async` Functions
Only mark a function as `async` if and only if there are `await` calls Only mark a function as `async` if and only if there are `await` calls
@@ -98,6 +111,19 @@ $('#el').on('click', async (e) => { // not recommended but acceptable
}); });
``` ```
### HTML Attributes and `dataset`
We forbid `dataset` usage, its camel-casing behaviour makes it hard to grep for attributes. However there are still some special cases, so the current guideline is:
* For legacy code:
* `$.data()` should be refactored to `$.attr()`.
* `$.data()` can be used to bind some non-string data to elements in rare cases, but it is highly discouraged.
* For new code:
* `node.dataset` should not be used, use `node.getAttribute` instead.
* never bind any user data to a DOM node, use a suitable design pattern to describe the relation between node and data.
### Vue2/Vue3 and JSX ### Vue2/Vue3 and JSX
Gitea is using Vue2 now, we plan to upgrade to Vue3. We decided not to introduce JSX to keep the HTML and the JavaScript code separated. Gitea is using Vue2 now, we plan to upgrade to Vue3. We decided not to introduce JSX to keep the HTML and the JavaScript code separated.