<aside>

javascript 관련

선언식 vs 화살표 함수

• 선언식 안의 함수 혹은 컴포넌트 안의 함수는 전부 arrow function을 사용

  function foo() {
  	const bar1 = () => {};
  	const bar2 = () => {};
  	
  	return null;
  }
  

• 이외에는 전부 선언식을 사용

export default

• export default 는 불가능한 경우를 제외하고는 선언시에 바로 작성

  export default function Home() {
  	...
  }
  

initialValue

• initailValue를 정리한 파일 별도 생성 및 사용시

  // constants/dashboardInit.ts
  
  export const INIT_MYDASHBOARDS_CONTEXT = {
    fetchedDashboards: [],
    localDashboards: [],
    loading: true,
    error: null,
    addDashboard: () => {},
    fetchDashboards: async () => {},
  };
  
  export const INIT_DASHBOARDS_REQUEST = {
    navigationMethod: 'pagination',
    page: 1,
    size: 1000,
  };
  
  export const INIT_DASHBOARDS_RESPONSE = {
    dashboards: [],
    totalCount: 0,
    cursorId: null,
  };
  

• 이외에 중복 사용되지 않을 것이 예상되는 경우에는 별도 파일 생성은 자유롭게 </aside>

<aside>

typescript 관련

interface, type 구분

• 객체에서는 interface를 사용
• 이외에는 주로 type을 사용

객체 리터릴 같은 경우 어떤 파일에 적을지 (Enum vs as const)

• 별 문제가 없으면 Enum을 사용

type 정의 위치

• api에서 사용하는 type들은 별도 폴더에서 관리한다. (dtos)
• props 정의 같은 경우에는 해당 함수의 위에서 정의한다.
• 이외에 재사용 되는 타입 같은 경우는 해당 타입을 사용하는 최상단에서 정의 해놓고 import해서 사용 </aside>

<aside>

기타

svg 파일 → svgr 사용

• https://jinist.tistory.com/365 </aside>