09.30 Velog Front 코드 훑어보기

 

1. Velog front 코드 훑어보기

• 환경변수로 dev / test / prod 구분하기
  • 아래와 같은 방식으로 하던데, declare namespace에 대한 이해가 필요해보인다

    declare namespace NodeJS {
      interface ProcessEnv {
        readonly NODE_ENV: 'development' | 'production' | 'test';
        readonly PUBLIC_URL: string;
      }
    }​

  • d.ts 파일 형식
    • 기존에 js로 쓰인 파일의 코드를 파일 단위로 ts typing하기 위해 사용함
      e.g., example.js를 타이핑 → example.d.ts
  • CRA에서 환경변수 사용하기 → 블로그 참고
    • CRA에서 환경변수 typing → react-app-env.d.ts
• SSR을 적용할 때, loadableReady와 hydrate를 적용해야 한다
• route 파일을 따로 만들지 말고, routing을 걍 app 파일에서 해줄 수 도 있음
• Client side Error logging Lib → Sentry JS
• redux 적용 패턴 확인하기 → 링크
• component props typing pattern 적용해보기

  

• skeleton component 만드는 법 참고해보기 → 링크
• branch → fix, feature 등으로 나눔