프로그래밍 메모장

Saas 런칭 2~3주만에 뜬금없이 패들을 통한 첫 구독자가 생겨서, 급하게 로깅 관련 기능을 넣기로 했는데 Google Tag Manager를 사용하기로 했다.대충 아래와 같은 코드를 넣는 식이다.window.dataLayer= window.dataLayer || [];window.dataLayer.push({ event:"template_created", template_id:template.id,});Google Tag Manager에서도 dataLayer.push({ event: "event_name" }) 형태로 이벤트를 전달하고, GTM이 그 이벤트를 기준으로 태그를 실행하는 구조를 사용한다. 즉, 기술적으로는 이 방식 자체가 틀린 건 아니다. 문제는 React 코드 안에 이걸 직접 넣기 ..

보호되어 있는 글입니다.

2월쯤에 스타트업으로 이직했는데요.스타트업가면 으쌰으쌰 분위기에 재밌겠다! 싶어 왔는데 와서 보니 유사 디스토피아더라고요;;충격과 공포의 업무량을 소화하기 위해 사용한 방식을 소개합니다! 1. 물리적으로 작업 공간을 분리하는 방법: Git Worktree + TmuxAI 에이전트를 활용한 개발에서 가장 먼저 마주하게 되는 문제는 작업 공간 충돌입니다.기존의 단일 브랜치 기반 작업 방식은 구조적으로 순차적인 작업을 강제하기 때문에, 여러 AI를 활용한 병렬 작업에 한계가 있습니다. 1.1 단일 브랜치 방식의 한계와 컨텍스트 오염 문제예를 들어, 로그인 기능을 개발하시다가 갑작스럽게 결제 관련 긴급 버그를 수정해야 하는 상황을 가정해 보겠습니다.이 경우 일반적으로는:작업 내용을 stash 하거나 임시 커밋을..

🧐 왜 버그는 항상 '끝'에서 터질까? : 경계값 분석(BVA) 깊게 파보기테스트 케이스를 짤 때 모든 경우의 수를 다 검사하는 건 불가능에 가깝습니다. 그렇다면 가장 효율적으로 버그를 잡아낼 수 있는 지점"은 어디일까요? 경험 많은 테스터들은 입을 모아 말합니다. 바로 '경계(Boundary)'라고요.1. 경계값 분석(BVA)이란?경계값 분석은 동등 분할(Equivalence Partitioning)의 연장선에 있는 기법입니다. 데이터나 상태의 범위가 있을 때, 그 범위의 최솟값과 최댓값 근처에서 결함이 발생할 확률이 높다는 가설을 바탕으로 테스트 케이스를 설계하는 방법이죠.우리가 흔히 겪는 'Off-by-one error'(부등호를 >로 쓸 걸 >=로 써서 생기는 1 차이의 버그)를 잡아내는 데 특..

AI와 mcp를 써보고, 느낀 점을 적어보았습니다.앞으로는 잘 정리된 히스토리(문서)가 개발에서 가장 중요한 자산이지 않을까 생각됩니다.문서화 기반 개발(Document-Driven Development)문서화 기반 개발이란 말 그대로 문서를 중심으로 요구사항 도출, 디자인, 개발, 테스트를 하나의 피드백 루프로 통합하는 접근 방식입니다. 기존의 코드 중심 개발(Code-Driven Development)과 달리 개발의 진입점(entry point)이 문서입니다. 팀은 문서를 작성하며 시스템의 동작을 정의하고, 이 문서가 곧바로 설계 명세서가 되며, 나아가 테스트의 기준선 역할까지 수행합니다. 문서가 곧 팀의 공통 언어이자 설계서이고, 또 코드에 대한 검증 기준이 되는 셈입니다. 잘 정립된 문서는 개발자..

요즘 MCP(Model Context Protocol)를 활용해 실무에 어떤 기능들을 적용할 수 있을지 살펴보고 있습니다. 그중에서도 특히 Cursor 에디터와 Figma를 MCP로 연동하여 디자인-to-코드 퍼블리싱 워크플로우를 자동화하는 방법을 테스트해보았는데요. 이번 글에서는 그 과정을 정리해서 공유드리고자 합니다. 개인적으로는 GAN(생성적 적대 신경망) 구조에서 영감을 받아, 마치 Generator(코드 생성)와 Discriminator(코드 리뷰)가 서로 경쟁하며 결과물을 개선하는 형태로 구현해 보았습니다. ** GAN이 뭐냐면?더보기쉽게 말해서: “서로 경쟁하며 발전하는 두 AI”GAN(Generative Adversarial Network)은 두 개의 인공지능이 서로 경쟁하면서 더 나은 ..

요즘 회사에서 일하던 프로젝트가 잘되서(?) 사업의 스케일이 커졌고, 모듈리식 레포지토리에서 작은 도메인 단위의서브 프로젝트 여러개로 쪼개는 모노레포 리펙토링 작업을 진행하고 있다 공통 로직이랑 중복 코드를 추출하면서, 자연스럽게 추출 및 활용이 쉬운 코드와 어려운 코드가 나뉘는 걸 체감하고 있다. 처음엔 단순히 코드 복잡도나 의존성 때문이라고 생각했는데, 계속 리팩토링을 하다 보니까 그 차이의 본질이 결국 오염(contamination) 이라는 생각이 들었다. 한 모듈의 상태나 로직이 다른 곳에 얼마나 퍼져 있느냐, 그게 오염의 정도다.오염이 심할수록 추출이 어렵고, 반대로 모듈 경계가 깔끔하게 지켜진 코드일수록 손쉽게 분리된다. 이를 “모듈화 관점에서의 오염(contamination)”은, 한 모듈의..

이전에 면접 준비하며 준비했던 내용 공유합니다 운영체제 기본 개념1. 하드웨어 (Hardware)중앙 처리 장치(CPU): 명령어 해석 및 실행.메모리(Memory): 프로그램과 데이터를 저장.입출력 장치(I/O devices): 사용자와 시스템 간 데이터 교환.1. 부트스트랩 (Bootstrap)저장 위치: ROM(Read-Only Memory)에 저장.역할:시스템 전원이 켜지면 실행됨.운영체제의 커널(kernel) 을 찾아 주 메모리(RAM) 에 적재.결과: 커널이 실행되면서 시스템 초기화가 진행됨.2. 커널과 시스템 프로세스커널(Kernel): 운영체제의 핵심 부분, 자원 관리와 제어 담당.시스템 프로세스 / 시스템 데몬(Daemon):커널 수행 중 계속 동작.백그라운드에서 시스템 기능(예: 스케줄..

이전에 면접 준비하며 정리했던 내용 공유합니다.📌 CORS란?Cross-Origin Resource Sharing(교차 출처 리소스 공유)브라우저 보안 정책인 **SOP(Same-Origin Policy, 동일 출처 정책)**을 완화해주는 메커니즘기본적으로 브라우저는 다른 출처(origin)의 리소스 요청을 제한합니다.출처 = 프로토콜 + 도메인 + 포트예: http://example.com:3000 ≠ https://example.com:3000👉 즉, CORS는 “다른 출처의 리소스를 클라이언트가 안전하게 요청할 수 있도록 서버가 허용하는 정책”이에요.📌 CORS 동작 방식단순 요청 (Simple Request)특정 조건 만족 시(예: GET/POST + 특정 헤더만) 브라우저가 바로 요청을 보..

최근 회사에서 커서를 구매해줘서 써봤는데, 인생이 달라졌습니다.. 지금까진 뗀석기로 개발한 기분인데요 아무튼 cursor를 쓰면서, 내가 원하는 스크립트를 미리 입력하는 방법을 찾고 있었는데"rule" 이라는 방법을 찾아서 간단히 공유하고, 제가 실제로 어떻게 쓰는지 몇가지 케이스를 공유해볼려고 합니다. Cursor AI IDE의 룰(Rule), 이렇게 활용합니다 Cursor AI IDE의 룰(Rule)은 개발자가 원하는 코딩 원칙과 팀 규칙을 AI에게 전달하는 일종의 “가이드라인 문서”입니다.보통 코드 스타일이나 문법 규칙은 ESLint, Prettier 같은 도구가 처리합니다. 하지만 Cursor 룰은 그보다 상위 개념으로, AI가 코드를 생성하는 순간부터 개발자 또는 팀의 철학과 컨벤션을 반영할 ..