상황인프라 온보딩을 받으면서 kubeconfig 열 개 남짓을 한 번에 병합했다. kubectl, helm, k9s, Lens… 툴체인 설치만 한나절이었는데, 정작 설치가 끝나고 나니 더 막막했다. 이름만 듣던 도구들이 한꺼번에 쏟아졌는데 각자 뭘 하는 앱이고, 언제 열어봐야 하는지가 정리가 안 됐다.그래서 도구라던지, 사용법 자체를 이해하는 걸 포기하고, 내 코드가 배포돼서 사용자 화면에 뜨기까지의 흐름을 순서대로 세워봤다. git push → CI (Docker 이미지 빌드 → 레지스트리 저장) → Helm values 에 새 이미지 버전 기록 → ArgoCD 가 그걸 보고 Kubernetes 에 반영 → Kubernetes 가 새 파드로 교체 → 운..

상황도면 위에 lamp 요소를 수십 개 배치하는 작업이 잦았다.열 맞춰서 나열하다보면 1px, 2px로 같은 가로인데 두번 세번 반복작업이 짜증이 나더라,,사용자 입장에서도 이건 손떨림 방지라던지, 가이드 표시를 해주는 게 나을 것 같단 생각이 들었다. 다른 요소와 좌표가 가까워지면 자동으로 스냅 + Figma 처럼 흰 점선 가이드가 짠 하고 뜰 수 있도록..?다만 문제가 하나 있었다. 캔버스가 transform: scale(N) 으로 줌이 적용된 상태였다는 것. 구체적 배경캔버스 안의 요소 좌표는 unscaled 좌표 (예: bodyX: 100)고, 시각적 위치는 scale 만큼 곱해져서 화면에 그려진다.가이드 라인은 두 요소를 잇는 흰 점선이어야 하는데, 어디에 그릴 것인가가 문제였다.선택지는 둘이..

상황 도면을 띄우고 그 위에 lamp 같은 요소들을 자유롭게 배치하는 캔버스 편집 모드를 만들고 있었다. 요소 이동은 jQuery UI draggable 로 처리하는 레거시 코드 위에서 일하던 중이었다. 편집 모드를 켜고 lamp 를 드래그하면 잠깐 따라오다가 다시 원위치로 튀는 현상이 있었다. 콘솔에 에러는 없고, jQuery UI 자체도 정상 동작하고, Vuex 도 멀쩡했다. 다른 페이지에서 같은 라이브러리로 만든 드래그는 잘 됐는데 이 화면만 이상했다.CSS transition: none !important 까지 박아봐도 똑같았다. 무언가 외부에서 위치를 계속 덮어쓰고 있다는 감만 있었다. ..

기록일: 2026-04-29출처: Claude(Opus 4.7) 대화정리 목적: 컨텍스트 추출과 프롬프팅 참고 원래 요청"합본 파일을 보면 도면이 떨어져있어 중간에 여백이 있거든? 배경과 여백이 있는데, 이걸 없애주고 도면을 합쳐줬으면 좋겠어" 표면적으로는 "여백 제거 + 합치기" 두 가지만 명시되어 있는 요청.두가지의 요청을 통해 만들어졌다. 1. 단순히 합쳐줘 (기존의 요청)2. 부자연스러운데, 이어지게끔 다시 합쳐줘 (추가적인 요청) 이를 통해 나는 원래 하나였던 것과 같은 멀쩡한 상태의 도면을 받았고, 이에 궁금증을 느껴 질문한 결과를 기록하게 되었다.파이썬에 있는 모든 라이브러리를 적재적소에 쓴다? 라기 보단 적재적소에 이걸 써야겠다라고 느낀 의식의 흐름이 궁금했다. 실제 사고 흐름 (4단계..

들어가며AIoT 플랫폼 개발사에서 프론트를 담당하고 있다. 프론트 개발자라고 해서 React/Vue만 알면 될 것 같지만, 산업 IoT 도메인에서는 센서가 어떻게 서버로 데이터를 쏘는지? 까지 이해해야 하는 순간이 온다...프론트 개발자로 일하면서 "게이트웨이"라는 단어를 제대로 이해해야 할 날이 올 줄 몰랐다. 알람 카운트 버그 하나를 쫓다가, 결국 센서 → 게이트웨이 → 서버 → 프론트로 이어지는 데이터 흐름 전체를 머릿속에 그려야 했다. 오늘은 그 과정에서 배운 Level-triggered vs Edge-triggered 개념을 정리해본다. 상황 — 미확인 알람이 34,560건, 일주일 간 누적 합 69180건IoT 모니터링 서비스에서 글로벌 알람 뱃지에 34,560건이라는 비정상적인 숫자가 찍..

상황레거시 Vue 3 프로젝트에서 규칙 생성 화면을 손보던 중이었다.유저가 라디오 버튼을 클릭해도 저장 시 서버로 나가는 payload에는 초기값만 찍혀 있는 상황이었다.컴포넌트는 대충 이런 구조였다. "아, local options ref가 별도 객체라서 스토어 반영이 안 되는 건가?" 라고 생각했다. 첫 번째 대응 — watch 5개 박기스토어로 값을 밀어넣는 watch를 추가했다.watch( options, () => { ruleStore.setAlarmTask(props.id, { options: { ...options.value } }); }, { deep: true } );이걸 알람 / 이메일 / SMS / 제어명령 / 외부서버 요청 5개 컴포넌트에 전..