팀 컨벤션

Git & GitHub

Commit message

# <타입>: #0 <제목>

# ------------------
#     제목은 최대 50 글자까지만 입력
#     본문은 한 줄에 최대 72 글자까지만 입력
#
#     타입은 영어로 작성하고 제목과 본문은 한글로 작성한다.
#     제목 끝에 마침표(.) 금지
#     제목과 본문을 한 줄 띄워 분리하기
#     본문은 "어떻게" 보다 "무엇을", "왜"를 설명한다.
#     본문에 여러줄의 메시지를 작성할 땐 "-"로 구분
#     관련된 이슈번호는 제목 맨 뒤에 추가한다. ex. (#1)
# ------------------

feat: #1 회원가입 페이지 제작

- 회원가입 페이지 라우팅 처리
- Axios 사용으로 데이터 전송 확인 완료

Branch

Branch 운영 규칙

Code Naming

Code Style

초기 환경 설정

ESLint

module.exports = {
  root: true,
  env: { browser: true, es2020: true, node: true },
  extends: [
    'eslint:recommended',
    'plugin:@typescript-eslint/recommended',
    'plugin:react-hooks/recommended',
    'plugin:prettier/recommended',
  ],
  ignorePatterns: ['dist', '.eslintrc.cjs', 'vite.config.ts'],
  parser: '@typescript-eslint/parser',
  plugins: ['react', 'prettier', '@typescript-eslint', "import", "unused-imports"],
  rules: {
    'no-console': 'error',
    'no-var': 'error',
    'prefer-template': 'error',
    'arrow-spacing': 'error',
    'no-duplicate-imports': 'error',
    'dot-notation': 'error',
    'no-useless-concat': 'error',
    'react/react-in-jsx-scope': 'off',
    'react/function-component-definition': [
      'error',
      {
        namedComponents: 'arrow-function',
        unnamedComponents: 'arrow-function',
      },
    ],

    '@typescript-eslint/naming-convention': [
      'error',
      {
        format: ['camelCase', 'UPPER_CASE', 'PascalCase'],
        selector: 'variable',
        leadingUnderscore: 'allow',
      },
      {
        format: ['camelCase', 'PascalCase'],
        selector: 'function',
      },
      {
        format: ['PascalCase'],
        selector: 'interface',
      },
      {
        format: ['PascalCase'],
        selector: 'typeAlias',
      },
    ],
	"import/order": [
      "warn",
      {
        groups: [
          "index",
          "sibling",
          "parent",
          "internal",
          "external",
          "builtin",
          "object",
          "type",
        ],
      },
    ],
		"unused-imports/no-unused-imports": "error",
    "import/newline-after-import": ["error", { count: 1 }],
    "padding-line-between-statements": [
      "error",
      { blankLine: "always", prev: "const", next: "return" },
    ],
  },
};

// npm i -D eslint-plugin-react
// npm i -D eslint-plugin-import eslint-plugin-unused-imports

/*
"no-unused-vars": "error", // 미사용 변수 금지
"react/jsx-key": "error", // 반복문 내 key값 강제화
*/

Prettier

{
    "singleQuote": true,
    "trailingComma": "all",
    "endOfLine": "auto",
    "bracketSameLine": true,
    "semi": true,
    "arrowParens": "always",
    "vueIndentScriptAndStyle": false,
    
    "jsxSingleQuote": true,
    "quoteProps": "as-needed",

    "embeddedLanguageFormatting" : "auto",
}

tsconfig

// ...

/* Linting */
"baseUrl": "./",
"paths": {
      "@/*": ["src/*"]
    }

vite config

import { defineConfig } from 'vite';
import react from '@vitejs/plugin-react';
import tsconfigPaths from 'vite-tsconfig-paths';

// <https://vitejs.dev/config/>
export default defineConfig({
  plugins: [react(), tsconfigPaths()],
});

// npm i -D @types/node vite-tsconfig-paths