- 이번 주 항해 취업 리부트코스에서 내가 구현한 기능은 무엇인가요?
커머스라는 주제를 가지고 프로젝트를 하게 되었다. 나는 그 중 festa! 같은 컨퍼런스 및 이벤트 티켓 예약 플랫폼을 만들기로 하였다.
- 렌더링 최적화
- SEO 최적화
- 반응형 CSS 작업
- 번들 사이즈 최적화
- E2E 테스트
- 단위 테스트 (하는 중...)
- 해당 기능을 구현하기 위해, 어떤 기술적 의사결정을 거쳤나요?
Cypress를 활용한 E2E 테스트 구현 단계에서 로그아웃을 테스트할 때 어떤 방법을 통해 로그아웃 기능을 쓰는 게 더 효율적일지 고민이 됐었다.
- Firebase를 사용한 로그아웃
: Firebase 인증 API를 직접 사용하여 로그아웃을 처리한다. 이 방법은 백엔드와의 직접적인 통신을 통해 사용자가 실제로 로그아웃되었는지를 정확하게 확인할 수 있다. 테스트 자동화에서 사용자 세션을 빠르게 초기화할 필요가 있을 때 적합하며, 더욱 일관된 테스트 환경을 제공한다.- UI를 통한 로그아웃
: 사용자 인터페이스를 통해 로그아웃을 시뮬레이션하는 방법이다. 실제 사용자 인터랙션을 모방하여 로그아웃 버튼의 기능성을 포함한 UI 요소들이 정상적으로 작동하는지 검증한다. UI 변경 사항이 테스트에 영향을 주는지 확인하는 데 유리하며, 사용자 경험을 테스트하는 시나리오에 적합하다.
통일해서 하나의 방법으로 사용하는 것보다 테스트 시나리오에 따라 각각 다른 방법을 적용하는 것이 효율적인 방법일 거라고 생각이 되었다. 그래서 아래처럼 결정.
- 사용자 로그아웃 테스트
- 목적: 실제 사용자 경험을 재현하여 로그아웃 프로세스가 UI 상에서 정상적으로 작동하는지 확인
- 방법: UI를 통한 로그아웃
- 절차: 사용자가 로그아웃 버튼을 클릭하고, 성공적으로 로그아웃되어 로그인 페이지로 리디렉션되는지 검사
- 기능적 로그아웃 필요성 검증
- 목적: 다른 기능 테스트 전에 사용자 세션을 클리어하고, 테스트 간 상호 영향을 제거
- 방법: Firebase를 사용한 로그아웃
- 절차: 테스트 시작 전 Firebase API를 호출하여 사용자를 로그아웃시키고, 세션이 제대로 종료되었는지 확인
- 이번 주 겪은 트러블 슈팅이 있다면 무엇인가요?
- [Cypress] Firebase를 활용한 회원가입 자동화 테스트 트러블 슈팅
- React DevTools 프로파일러를 활용하여 컴포넌트 렌더링 성능 개선하기
- 단위 테스트 도입기
- Vite 환경에서 Bundle Analyzer로 빌드 최적화하기
기본적인 기능 구현은 완료되었고, 추가적으로 몇 가지 작업만 더 하면 될 것 같다.
- 단위 테스트 마무리
- Lighthouse를 활용하여 성능 개선
8주차까지 열심히 달렸고, 프로젝트 주차가 마무리되었다. 이제부터는 취업 준비를 위해 이력서를 보충하고 면접을 대비하는 시간이다.
이제 슬슬 지원서를 넣을 시기가 다가왔다니. ㅋㅋ 미치겠구만. ㅋㅋ 우하하. ㅋㅋ
항해99 취업 리부트 코스를 수강하고 작성한 콘텐츠 입니다.
#개발자포트폴리오 #개발자이력서 #개발자취업 #개발자취준 #코딩테스트 #항해99 #취리코 #취업리부트코스
