• 변수명, 함수명에는 camelCase를 사용한다.

• 파일명은 파스칼 케이스를 사용한다.

• 상수는 대문자로 작성하고 띄어쓰기는 _를 사용한다.

  const BASE_URL = 'http://localhost:8080/hello'

• 컴포넌트 확장자는 .jsx 로 한다

• 컴포넌트 파일 내 import 순서는 모듈 → 컴포넌트 → CSS로 한다.

• 리액트 컴포넌트는 rfce 코드스니펫을 사용한다.

  • 스니펫 익스텐션

    https://marketplace.visualstudio.com/items?itemName=dsznajder.es7-react-js-snippets

    사용법: https://www.hanl.tech/blog/vs-code-react-time-awesome-snippets/

  https://mine-it-record.tistory.com/620

  https://basketdeveloper.tistory.com/68

• **재할당이 불가능하면 const를, 재할당이 가능한 변수는let을 사용하여 선언한다.

• **var는 절대로 사용하지 않도록 한다.

• 변수를 한꺼번에 여러 개 선언해야 할 경우 **const 를 let보다 먼저 선언한다.

• ⚠️ 전역 변수를 사용하지 않는다.

• **변수 등을 조합해서 문자열을 생성하는 경우 템플릿 문자열(backtick ````)을 이용한다.

• 함수는 화살표 함수로 작성한다.

❌ 변수, 클래스명에는 동사를 넣지 않는다

class: FeatureExtract (X)
class: FeatureExtractor (O)
const: work (X)
const: worker (O)

❌ 변수명에 굳이 관사를 넣지 않는다.

const: a_cat (X)
const: cat (O)

❌ 변수명에 전치사는 최대한 생략한다.

const : the_number_of_worker (X)
const : worker_num (O)

❌ 배열 복사 시 순환문을 사용하지 않는다.

복잡한 객체를 복사할 때 **전개 연산자**를 사용하면 좀 더 명확하게 정의할 수 있고 가독성이 좋아진다.

// Bad
const len = items.length;
let i;
for (i = 0; i < len; i++) {
  itemsCopy[i] = items[i];
}
// Good
const itemsCopy = [...items];

🗣️ 함수명에는 동사를 넣는다

function: feature() (X)
function: get_feature() (O)
function: trainer() (X)
function: train() (O)

💫 Module CSS 사용할 때, 작명법

import styles from './컴포넌트명.module.css';