Codex로 포트폴리오 QA 자동화하기

자동 QA를 붙인 이유

포트폴리오의 첫 화면, 개인 프로젝트 탭, 이미지 갤러리, 블로그 목차는 모두 사용자가 직접 눌러보는 흐름이다. 테스트와 빌드만으로는 클릭 후 화면이 실제로 바뀌는지, 새 창 링크가 살아 있는지, 모바일 폭에서 잘리는 부분이 없는지 확인하기 어렵다.

그래서 브라우저 QA는 단순 캡처가 아니라 클릭 기반으로 구성했다. 개인 프로젝트 탭을 누르고, 썸네일을 바꾸고, 큰 이미지를 새 창으로 열고, 블로그 목차 링크가 heading으로 이동하는지 확인한다.

확인한 흐름

• 개인 프로젝트 탭을 누르면 castleCms 카드가 보여야 한다.
• 썸네일을 누르면 큰 이미지 링크가 다른 이미지로 바뀌어야 한다.
• 큰 이미지를 누르면 원본 이미지가 새 창에서 열려야 한다.
• 블로그 목차를 누르면 URL hash가 heading id로 이동해야 한다.
• 모바일과 다크모드 화면을 캡처해 레이아웃 깨짐을 확인한다.

운영 경험과 연결되는 지점

이 QA는 단순히 도구를 붙이는 작업이 아니라 운영 중인 서비스의 변경 검증 흐름과 닮아 있다. 사용자가 실제로 지나가는 경로를 먼저 고르고, 실패했을 때 원인을 좁히기 쉬운 단위로 체크를 나누고, 빌드와 타입체크 뒤에도 브라우저에서 최종 확인한다.

AI 도구는 이 과정에서 테스트 후보를 빠르게 뽑고 반복 확인을 자동화하는 보조 역할을 한다. 판단 기준은 여전히 요구사항, 사용자 흐름, 배포 후 위험도에 둔다.