공통

• 타입 한곳에 모아두기. dto 파일 만들어서 정리하기.
• 원칙적으로 카멜케이스.
• FE, BE 둘다 화살표 함수로 통일. (참고 - rafc)
• FE : export const postarticle = () ⇒ {} BE : export default articleService; → articleService.postarticle();
• import 경로 : 멀리 있는 건 절대경로, 가까이 있는 건 상대경로(1~2 뎁스)
  • 가까우면 일단 상대경로 쓰다가 나중에 멀어지면 절대경로로 변경.
  • 현 시점 기준으로 멀다면 절대경로 적용

프론트엔드

• 반응형 : 모바일 퍼스트 + 바로 반응형까지.

• CSS : 테일윈드 CSS

• 컴포넌트 :

  • 앱 라우터 안에는 라우팅을 위한 최소한의 파일만 존재.
  • 페이지 컴포넌트는 반드시 ‘…Page’ 붙이기

• Turbo pack 사용.

• 네이밍 컨벤션

  1. 폴더: 카멜 케이스

  2. 파일: 카멜 케이스

  3. 컴포넌트 이름 : 파스칼 케이스 (예: UserProfile, CommentList)

  4. 변수/Props : 카멜 케이스 (예: firstName, isLoading)

  5. 타입/인터페이스 : 파스칼 케이스 (예: TUserType, IPostProps) → ex) 프롭스는 I, 나머진 T → 타입확장 할땐 I 정도.

  6. 상수 : 밑줄로 구분된 대문자 (예: API_URL, DEFAULT_THEME)

  7. 파일 : 카멜 케이스.

  8. 커스텀 Hook : use…으로 시작하기 use + 카멜케이스

     https://ko.react.dev/learn/reusing-logic-with-custom-hooks

  • 폴더 구조 예시

  라우팅 폴더 구조

백엔드

• BE MVC 패턴 article.service.ts , article.router.ts 이런 식으로.
• 이미지 저장소 : multer-s3 라이브러리 사용
• RDS + porstgresql
• WAS + 점프서버 = EC2
• ALB + Route53 + ACM?