팀 컨벤션

• 변수명과 함수명을 정할 때는 카멜케이스를 사용 ex)userName,scrollLock,newTab

• 라이브러리를 추가로 설치시 디코방에 기록.

• git에서 pull한 이후에 npm install을 실행. 이후는 다른 사람이 라이브러리를 추가 설치시 종속성이 저장되어서 install 명령어만으로 설치가능

• 함수명은 동사+명사를 사용. ex)getName,fetchApi.

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

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

• 함수는 화살표 함수로 작성한다. (권장 사항)

• 컴포넌트 간에 종속성이 존재하는 경우(props로 데이터를 받는 경우), 서로 상의해서 props의 이름과 종류를 결정

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

• css파일은 분리해서 작성. 이름은 사용할 '컴포넌트명.style.js'명명

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

• 폴더명은 소문자로 한다. ex) folder-name

• 폴더명을 로컬에서 수정하고 push하면 레포에서는 변화가 없다. 따라서 폴더명을 변경하고 싶으면 github사이트에서 직접변경. 단, 변경시 경로가 꼬일 수 있기에 상의가 필요.

• import시 경로는 상대경로로 설정. 이렇게 하면 배포시 위험 할 수 있음 ex)../././

• 단, public폴더에 이미지를 저장. 사용하는 경로는 ./이미지파일명.확장자.
ex)만약 public폴더의 assets에 이미지가 존재한다면, ./assets/이미지파일명.확장자

• 상수는 대문자로 작성하고 띄어쓰기는 _를 사용한다. ex)const BASE_URL = 'http://localhost:8080/hello', const COUNT=20;

import 순서

1. 리액트 관련 (use~)

2. 컴포넌트 (Component)

3. CSS

주석

• // : 일반적인 경우

• /* */ : 특정 코드군의 타이틀 역할 or 주석이 엄청 길 경우

/* 아래부터는 이러이러한 용도로만 쓰이는 함수입니다 */

const a = 2;   // 코드와 주석 사이는 2칸 스페이스!

띄어쓰기

{ 내용 }   // O
{내용}     // X

let a = 2; // O
let a=2;   // X

a, b       // O
a , b      // X
a,b        // X

[가, 나, 다] // O
[가,나,다]   // X

폴더구조

client
ㄴpublic
  ㄴassets(사용할 이미지)
ㄴsrc
  ㄴcommon
    ㄴavatar.js
    ㄴbutton.js
    ㄴcard.js
  ㄴcomponents
    ㄴheader.js(상단)
    ㄴnav.js(좌측)
    ㄴfooter.js(하단)
    ㄴaside.js(우측)
  ㄴpages
    ㄴquestions.js(전체질문)
    ㄴquestion.js(질문세부)
    ㄴhome.js
    ㄴmypage.js
    ㄴlogin.js
    ㄴsignup.js
    ㄴaskquestion.js(새질문)
  ㄴstyles(글로벌 스타일)
  ㄴhook(hook 모음)
  ㄴreducer(redux)
	ㄴutil(함수)
ㄴindex.js
ㄴApp.js
ㄴ.env(주소용)