jasonkang14 / wanted_preonboarding_frontend_august

15 stars 1 forks source link

[사전과제] 프리온보딩 프론트엔드 챌린지 #159

Open Whoknow77 opened 1 year ago

Whoknow77 commented 1 year ago
  1. 유닛테스트 vs 통합테스트 vs E2E테스트를 비교하여 설명해주세요
    • 유닛테스트(단위테스트) : 함수 하나하나와 같이 코드의 작은 부분을 테스트 하는 것으로 각 함수에 이런저런 입력 값을 줘봐서 잘 되는지 테스트 하는 것
    • 통합테스트 : 서로 다른 시스템들의 상호작용이 잘 이뤄지는지 테스트하는 것으로 유저가 어떤 행동을 하면 실제로 DB에 잘 저장됐는지 테스트 하는 것
    • E2E테스트(종단 간 테스트) : 사용자와 어플리케이션의 상호작용이 잘 이뤄지는지 테스트하는 것으로 실제 유저가 되어 이 모든 일련의 과정이 정상적으로 돌아가는지 테스트 하는 것
  2. 리액트 테스트에 사용되는 도구들을 비교하여 설명해주세요
    • Jest : facebook에서 오픈소스화한 javascript 테스트 프레임워크로 CRA(Create-React-App)에는 기본적으로 내장되어 있으며, 전반적인 기능 테스트를 하는데 도움이 된다.
    • RTL(Rect-Testing-Library) : jest를 확장하여, 개발자가 좀 더 쓰기 편하게 도와주는 라이브러리로 React의 컴포넌트를 렌더링하고 테스트하기 위해서 필요하다. 위의 둘은 상호보완관계이다.
  3. CDN(Content Distributed Network)에 대해 설명해주세요
    • CDN : 서버의 데이터를 여러 곳으로 분산시키고 캐싱을 이용하여 서버의 부담을 줄여주는 기법으로 바이러스에 대항해 서버를 보호할 수 있다.
  4. Web Vitals에 대해 설명해주세요
    • 구글이 사용자 경험을 향상하고자 노력한 것을 수치화한 것
      • LCP, Largest Contentful Pain : 로딩 성능을 측정하는 LCP는 사용자가 페이지에 접속했을 때(정확히 말하자면 URL을 요청한 시점부터) 페이지 내에서 가장 큰 콘텐츠 요소를 렌더링하는 데 걸린 시간을 의미
      • FID, First Input Delay : 사용자가 페이지의 링크를 클릭하거나 버튼을 클릭하는 등의 상호작용을 처음했을 때부터 브라우저가 이에 반응할 때까지의 시간
      • CLS, Cumulative Layout Shift : CLS는 어떤 콘텐츠를 읽다가 링크를 클릭하려고 한 순간, 갑자기 광고나 다른 요소가 나오며 원하지 않은 요소를 클릭하는 속임수를 방지하기 위한 척도
  5. Lighthouse에 대해 설명해주세요
    • 구글에서 개발한, 웹 페이지의 품질을 개선할 수 있는 오픈 소스 형태의 자동화 도구로 여러 성능 지표들을 확인할 수 있다.