2022.01.27

한 일

• 우아한 테크 세미나 시청
• 알고리즘 1문제
• 고민... 고민... 또 고민...
• React Router V6 문서 읽기

배운 것

• React Route V6에서 추가된 Outlet 컴포넌트를 이용해 Nested Routes 처리가 가능하다.
  • Route 컴포넌트의 자식으로 Route를 넣어주면 경로가 일치하는 자식 Route의 element를 부모 Route의 element의 Outlet 컴포넌트 자리에 넣어줌
• 테스트란?
  • 널리 사용되기 전에 어떤 것의 품질 성능 또는 신뢰성을 확립하기 위한 절차
  • 그렇다면 프론트엔드에서는 무엇을 테스트 해야 할까?
    • 화면이 잘 그려지는가?
    • 기능이 잘 동작하는가?
  • 어떤 테스트를 해야할까?
    • 시나리오 테스트
      • 사용자의 사용 흐름에 따라 테스트를 진행
      • 작성하는데 비용이 많이 들고 좋은 테스트를 작성하기 어려움
    • 시각적 회귀 테스트
      • 보이는 화면이 이전 화면과 같은지 테스트 함
      • 렌더링된 결과물의 스크린샷을 찍어놓은 후 테스트 시점의 렌더링 결과물과 대조해 변경을 확인
      • 변경이 발견되어 테스트에 실패하면 CSS 디버깅...!
        • CSS는 에러를 발생시키지 않아 찾기 매우 힘들다...
        • MDN 피셜 모르겠으면 잠시 다른일을 하면서 머리를 식히라고ㅠㅠ
      • 어떤 문제로 실패한 것인지 알려주지 못함
    • 블랙 박스 테스트
      • 내부 구조나 작동 원리를 모르는 상태에서 동작만 테스트 하는 방식
        • 코드나 내부 구조에 대한 정보는 필요하지 않음
      • 입력에 대해 올바른 출력이 나오는지 테스트
        • 대체로 일반적인 상황을 테스트하는 경우가 많음
        • 엣지케이스에 대한 신경을 덜 씀
      • 사용자 입장에서 요구사항과 결과물이 일치하는지 확인하는 테스팅 기법이라고 할 수 있음
    • 화이트 박스 테스트
      • 내부 구조와 동작을 세밀하게 검사하는 테스트 방식
      • 사용자가 볼 수 없는 구간의 코드를 테스트 함
      • 개발자 관점에서 컴포넌트 등의 로직에 대한 테스트를 수행
        • 설계 단계에서 요구된 사항을 확인하는 개발자 관점의 테스팅 기법이라고 할 수 있음
      • 엣지 케이스를 잘 통과 하는가?
      • 모듈 1,2,3,4,...n의 코드가 모두 잘 동작하는가?
• puppeteer
  • node 환경에서 Chrome, Chromium을 Devtools Protocol을 통해 제어할 수 있도록 해주는 라이브러리
  • 테스트 자동화, 크롤링 등에 사용할 수 있음

https://kkhipp.tistory.com/158
https://ui.dev/react-router-nested-routes/
https://reactrouter.com/docs/en/v6/api#outlet
https://pptr.dev/

The Guide to Nested Routes with React Router - ui.dev

React Router | API Reference

https://pptr.dev/

화이트 박스 테스트 vs 블랙 박스 테스트

느낀 것

• 아직 최종 결과가 안나온 곳이 나를 애타게 만든다아ㅏ.. 나는 어디로 가게될까... ㅠㅠ
• 멘탈이 파들파들 떨려서 아무것도 손에 안잡힌다...
  • 불확실한 미래가 주는 스트레스가 어마무시 한 것 같다!
  • 확실히 스트레스 엄청나게 받고 있기는 하지만 너무 이걸 핑계로 게을러지지 않았나? 싶다.
    • polling, long polling, websocket 코드로 확인해 본지 일주일이 다 되어가는데 아직도 글로 정리를 못했다...
    • 임시 저장 멈춰!
      • 덕스코드 이사도 해야하는데 못하고 있고... 빨리 이사 안가면 돈내야돼!
• 프론트엔드 테스트는 어떻게 해야할까?
  • 테스트를 아직 많이 작성해보지 않았고, 복잡한 테스트 경험 또한 없지만 테스트라는 것을 접하고 나서 항상 고민이었다.
  • 여러 글을 읽고 세미나를 들어도 뭔가 답답하고 궁금증만 가득!
• 지금 내게 부족한 것
  • CS 지식
    • 운영체제, 네트워크, 자료구조 등 CS 지식이 부족하다.
    • CS 공부를 2달 조금 안되게 공부했다보니 기초적인 부분들을 얕게 알고 있음.
    • 책을 바탕으로 꾸준히 공부하자!
    • 사실 진작 했어야 했던 것 같은데... 이제라도 알았으면 잘 하자!