mirror of
				https://gitee.com/gitea/gitea
				synced 2025-11-04 16:40:24 +08:00 
			
		
		
		
	Fix project board bug and improve documents (#17753)
* 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:
		@@ -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).
 | 
			
		||||
 | 
			
		||||
 | 
			
		||||
### 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
 | 
			
		||||
 | 
			
		||||
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
 | 
			
		||||
 | 
			
		||||
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.
 | 
			
		||||
 
 | 
			
		||||
		Reference in New Issue
	
	Block a user