코딩

• 폴더구조
• 타입관리
• 코딩 컨벤션
  • 컴포넌트
• 로컬 환경

  • eslint

  • prettier

    {
      "jsxSingleQuote": true,
      "bracketSameLine": true,
      "singleQuote": true,
      "printWidth": 90,
      "tabWidth": 2,
      "useTabs": false,
      "semi": true,
      "quoteProps": "as-needed",
      "trailingComma": "es5",
      "arrowParens": "always",
      "endOfLine": "lf",
      "bracketSpacing": true,
      "requirePragma": false,
      "insertPragma": false,
      "proseWrap": "preserve"
    }
    

  • stylelint : 스타일 순서 규칙 정해줌

  • nvmrc

  • editorconfig - IDE 설정 자동화

• git 관련
  • husky: prettier —write, eslint —fix ⇒ pre-commit, pre-push 필터링
  • lint-staged
    • stage-area 안먹는 husky 를 도와줌
• import 구문 simple sort
• 네이밍
  • 오타 x → 오타 찾아주는 extension
  • 명확하게 작성 - 짧은 것보단 길더라도 이해하기 쉽게
• 인라인으로 함수 작성하기보다는 이벤트 핸들러 함수를 만들어서 넘기기
  • 이벤트 핸들러 네이밍
• jsx 반환하는 컴포넌트 함수 파일은 tsx, jsx를 반환하지 않는 상수를 모아두는 파일이나 custom hook 파일은 ts
• 변수명 약자보다는 길더라도 이해할 수 있게 풀로 명시적으로 쓰기
• alias 절대 경로 지정
• component template