안녕하세요 ~ 프론트엔드 개발자 이효린입니다 :D혹시 이런 경험 있으신가요?테스트 코드를 쓰고 싶지만, 작성 비용이 높아서 미뤄지는 상황테스트를 도입했지만, 결국 몇 명만 작성하게 되는 구조AI로 테스트 코드를 생성해봤지만, 실제로는 수정이 더 오래 걸리는 경험저희 팀도 비슷한 문제를 겪고 있었습니다.저희 팀이 딱 이 세 가지를 겪고 있었어요. 😇이 글은 QA 인력 없이 E2E 테스트를 도입하면서, AI가 정확한 테스트 코드를 생성할 수 있는 구조를 어떻게 설계했는지 정리한 글입니다.왜 E2E였나요?사실 처음부터 E2E를 생각한 건 아니었어요. 유닛 테스트, 통합 테스트도 고려했거든요.근데 저희 팀 상황을 생각해보면,수동 검증이 이미 "사용자 플로우 단위" 로 이루어지고 있었어요"이 버튼 누르면 이 모..

안녕하세요 ~ 프론트엔드 개발자 이효린입니다 :D 혹시 이런 경험 있으신가요? 다른 사람이 짠 코드를 인수인계 받았는데, 어디서부터 봐야 할지 모르겠는 경험.components/ 폴더를 열었더니 파일이 35개. 어떤 게 공통 컴포넌트인지, 어떤 게 특정 페이지에서만 쓰이는 건지 전혀 감이 안 잡히더라고요. 결국 파일을 하나하나 열어보면서 "이게 어디서 쓰이는 거지?" 하며 코드 탐정이 되어야 했어요. 😅 새로운 팀원이 합류했는데, 구조 설명에 30분이 걸리는 경험."이쪽은 이렇게 되어 있고, 근데 여기는 좀 달라요, 이건 예외적으로..." 설명하다 보면 저도 헷갈리기 시작하더라고요. 페이지 컴포넌트가 너무 커져서 쪼개기 시작했는데, depth만 깊어지는 경험.pages/DataSource/compone..

안녕하세요, 프론트엔드 개발자 이효린입니다 :) 저희 팀이 개발 중인 서비스 eXemble에는 실시간으로 서버 자원을 모니터링하는 대시보드를 제공하고 있습니다. 이 과정에서 여러 라인 차트를 동시에 hover할 때 모든 차트의 툴팁이 같은 시간에 동기화되어야 했습니다. 첫 번째 API 응답에서는 툴팁 동기화가 잘 동작했지만, 데이터가 지속적으로 유입되기 시작하자 이상한 현상이 발생했습니다. 일부 차트의 툴팁만 업데이트 되거나, 서로 다른 시간의 값이 표시되거나, 심지어 툴팁이 사라지는 버그가 랜덤하게 발생했습니다. 처음엔 단순한 상태 관리 문제라고 생각했습니다. 하지만 파고들수록 TanStack Query의 캐싱 전략, ECharts 인스턴스의 업데이트 타이밍, React 렌더링 사이클이 얽힌 복합적..

안녕하세요 ~ 프론트엔드 개발자 이효린입니다 :D 다들 어떤 노트패드 어플리케이션을 사용하시나요 ? 저는 Notion을 매우 애용했고, 약 5년간 Notion을 꾸준히 써오던 중 최근에 Obsidian이라는 툴을 알게되면서, 개인 노트 필기는 Obsidian만 사용하게 되었어요. 그 이유는파일이 내 로컬 컴퓨터에 저장된다.마크다운(.md) 기반이라 가볍고, 어떤 에디터에서도 열 수 있다.플러그인 생태계가 정말 풍부해서 내 입맛대로 커스터마이징이 가능하다.그래프 뷰(Graph View) 기능으로 내가 작성한 노트들이 서로 어떻게 연결되어 있는지 시각적으로 확인할 수 있다.위 장점들 중에서 1번, 내가 작성한 문서가 내 로컬 컴퓨터에 저장된다는 것이 가장 마음에 들었어요. 내가 작성한 문서가 내 로컬 컴퓨터..