Code Convention

ESLint

{
  "parser": "@typescript-eslint/parser",
  "extends": [
    "prettier",
    "airbnb",
    "airbnb-typescript",
    "airbnb/hooks",
    "plugin:@typescript-eslint/recommended",
    "plugin:@typescript-eslint/recommended-requiring-type-checking"
  ],
  "plugins": ["prettier", "react", "@typescript-eslint", "react-hooks"],
  "parserOptions": {
    "project": "./tsconfig.json"
  }
}

export

값을 내보낼 때에는 export 사용합니다. 
export default는 사용하지 않습니다.

Prettier

{
  "printWidth": 80,
  "tabWidth": 2,
  "useTabs": false,
  "semi": true,
  "singleQuote": true,
  "quoteProps": "consistent",
  "trailingComma": "es5",
  "bracketSpacing": true,
  "arrowParens": "always"
}

Folder

폴더 이름은 **camelCase**로 작성합니다. **복수** 취급합니다.
ex) pages, components, hooks, utils

File

파일 이름은 **PascalCase**를 사용합니다. **용도**에 따라 **단수**, **복수** 취급합니다.
ex) File.tsx, Files.tsx

Variable

변수명은 **CamelCase**로 작성합니다.
ex) const variable:string = 'variableName'

Styled component

스타일 컴퍼넌트의 이름은 **_(언더바) + PascalCase**를 사용합니다.
ex) const _StyledComponent = styled.div``

Type, Interface

Type과 Interface, Component의 이름은 **PascalCase**를 사용합니다.
ex) type TypeName
interface InterfaceName
ComponentName

Function

함수명은 **camelCase**를 사용합니다. **arrow function**만을 사용합니다.
ex) const functionName = () => {}