

프론트엔드 테스트 자동화 전략 - 3. 구현하기
프론트엔드 테스트 자동화 전략에서 테스트 케이스를 바탕으로 테스트 코드를 구현하는 방법을 다룹니다. 요구사항 분석 결과를 실제 코드로 옮기는 흐름을 설명합니다.
새로운 기술 블로그가 추가되었어요


프론트엔드 테스트 자동화 전략에서 테스트 케이스를 바탕으로 테스트 코드를 구현하는 방법을 다룹니다. 요구사항 분석 결과를 실제 코드로 옮기는 흐름을 설명합니다.


프론트엔드 테스트 자동화를 시작할 때의 어려움과 진입 장벽을 정리했습니다. 프로젝트 상황에 맞는 테스트 작성 방법을 고민한 글입니다.


자바스크립트 프로젝트에서 API 통신과 응답 데이터 처리를 하며 비동기 동작의 필요성을 느낀 내용을 다뤘습니다. V8 엔진의 비동기 처리 흐름을 이해해보는 주제입니다.


프론트엔드 특성상 입력과 출력이 명확하지 않아 테스트 설계에 고민이 필요하다고 다뤘습니다. 테스트 자동화의 의미와 프론트엔드 관점의 방향성을 정리했습니다.


Jest를 선택한 배경과 실제 활용 경험을 바탕으로 테스트 작성과 구조화 방법을 정리했습니다. 코드 품질 향상 효과와 함께 일부 성능 이슈도 함께 살펴보았습니다.

X

Kubernetes 환경에 맞춰 로그 플랫폼을 다시 설계해 서비스 통합 비용을 줄였습니다. 로그 성격별 파이프라인 분리와 다양한 저장 형식 지원으로 확장성과 운영 효율도 높였습니다.

런칭 이후 리팩토링 과정에서 React Query를 도입한 경험을 소개했습니다. 데이터 로딩, 캐싱, 서버 상태 동기화 작업을 더 쉽게 다루는 관점이 핵심입니다.


Dash를 도입해 데이터 조회, 가공, 렌더링을 역할별로 분리하고 연결하는 구조를 만들었습니다. 또한 Mixin과 압축을 활용해 유지보수성과 데이터 전송 효율을 개선했습니다.


MSA 환경에서 BFF로 Frontend에 맞는 데이터 제공 구조를 적용했습니다. 또한 CircuitBreaker와 Resilience4J로 외부 장애 전파를 막고 트래픽을 조절했습니다.


유저 인터뷰가 어렵다면 짧게 진행하는 숏터뷰를 대안으로 제안했습니다. 빠르게 사용자 의견을 얻는 가벼운 방식에 초점을 맞췄습니다.

Kubernetes를 도입해 서버 환경을 구축한 과정을 공유합니다. IT팀의 긴 여정과 경험을 간단히 정리한 글입니다.