... | ... | @@ -18,24 +18,25 @@ Coding style: black, flake8 |
|
|
### Frontend
|
|
|
|
|
|
#### Coding style
|
|
|
##### Formatting
|
|
|
A mindenkori prettier config alapján (jelenleg a `package.json` része). Dockerben fejlesztők számára a prettier-vscode extension használata ajánlott.
|
|
|
|
|
|
##### Exports
|
|
|
Ne legyenek névtelen default exportok. Így az IntelliSense felismeri és fel tudja ajánlani.
|
|
|
|
|
|
**DO:**
|
|
|
|
|
|
DO:
|
|
|
```jsx
|
|
|
const MyComponent = () => <div />;
|
|
|
export default MyComponent;
|
|
|
```
|
|
|
or:
|
|
|
or
|
|
|
```jsx
|
|
|
const MyComponent = () => {
|
|
|
return <div />;
|
|
|
}
|
|
|
export default MyComponent;
|
|
|
```
|
|
|
or:
|
|
|
or
|
|
|
|
|
|
```jsx
|
|
|
function MyConponent() {
|
... | ... | @@ -45,11 +46,32 @@ function MyConponent() { |
|
|
export default MyComponent;
|
|
|
```
|
|
|
|
|
|
**DO NOT:**
|
|
|
|
|
|
DO NOT:
|
|
|
```jsx
|
|
|
export default () => <div />;
|
|
|
```
|
|
|
|
|
|
##### Imports
|
|
|
Az importok sorrendje:
|
|
|
1. Telepített package importok
|
|
|
2. `//`
|
|
|
3. Lokális fájl importok
|
|
|
4. `//`
|
|
|
5. Style importok
|
|
|
pl.:
|
|
|
```jsx
|
|
|
import { useState } from "react";
|
|
|
import cx from "clsx";
|
|
|
import { Check } from "react-feather";
|
|
|
//
|
|
|
import Vote, { VOTE_STATE as VOTE } from "../question/vote";
|
|
|
import Comment from "../question/comment";
|
|
|
import Checkbox from "../common/Checkbox";
|
|
|
import Button from "../common/Button";
|
|
|
//
|
|
|
import "../../global.css";
|
|
|
```
|
|
|
|
|
|
#### Mappaszerkezet és fájl elnevezés
|
|
|
Komponens fájl elnevezés: `PascalCase.jsx`
|
|
|
|
... | ... | |