소니아 개발 블로그

소니아 개발 블로그 https://ckdtjs505.github.io 브라우저와 데스크톱(CEF), 보안과 빌드 도구의 경계에서 만난 문제의 원인과 의사결정을 기록하는 프론트엔드 개발 블로그입니다. ko 웹 캠페인 토큰 재사용(Replay Attack) 및 클라이언트 변조 취약점 개선 https://ckdtjs505.github.io/posts/code_artifact https://ckdtjs505.github.io/posts/code_artifact Tue, 29 Sep 2026 00:00:00 GMT 캠페인 인가 토큰 내 대상 식별자 누락으로 인한 리플레이 공격과 프론트엔드 평문 변조 취약점을 해결하기 위해 토큰 페이로드 바인딩 및 백엔드 종단 간 재검증 구조로 개선한 기술 사례 정리 도서 '먼저 온 미래' 회고 - AI 시대의 생존법과 지식 구조화 전략 https://ckdtjs505.github.io/posts/book_%EB%A8%BC%EC%A0%80%EC%98%A8_%EB%AF%B8%EB%9E%98 https://ckdtjs505.github.io/posts/book_%EB%A8%BC%EC%A0%80%EC%98%A8_%EB%AF%B8%EB%9E%98 Wed, 16 Sep 2026 00:46:28 GMT 바둑계 선례를 통해 본 AI 시대 인간의 3가지 계층과, GEM을 활용해 지식을 구조화하고 암기하는 실천 전략 CEF 환경에서의 모달 창 종료와 API 호출 Race Condition 트러블슈팅 https://ckdtjs505.github.io/posts/cef_troubleshooting https://ckdtjs505.github.io/posts/cef_troubleshooting Wed, 16 Sep 2026 00:00:00 GMT 대기 시간을 줄이려고 모달을 먼저 닫았더니, 배포 당일 요청이 간헐적으로 사라졌다. CEF에서 창이 닫히는 순간 무슨 일이 일어나는지, 왜 QA에서는 보이지 않았는지, 그리고 어떤 대안을 왜 버렸는지 정리했다. 기술 부채(Technical Debt)의 개념과 메커니즘 https://ckdtjs505.github.io/posts/technical_debt https://ckdtjs505.github.io/posts/technical_debt Tue, 15 Sep 2026 00:00:00 GMT 빠른 개발을 위해 품질을 희생하며 발생하는 기술 부채의 금융적 메커니즘과 주요 원인, 지속 가능한 상환 및 관리 전략 요약 [pnpm] 아키텍처 심층 분석 - CAS 해시 데이터의 가상 스토어 파일 복원과 링크 메커니즘 https://ckdtjs505.github.io/posts/pnpm-architecture-cas https://ckdtjs505.github.io/posts/pnpm-architecture-cas Mon, 14 Sep 2026 12:00:00 GMT pnpm의 아키텍처 심층 분석 CAS 해시 데이터의 가상 스토어 파일 복원과 링크 메커니즘 [pnpm]의 3계층 아키텍처와 링크 메커니즘 분석 https://ckdtjs505.github.io/posts/pnpm%EC%9D%98-3%EA%B3%84%EC%B8%B5-%EC%95%84%ED%82%A4%ED%85%8D%EC%B2%98%EC%99%80-%EB%A7%81%ED%81%AC-%EB%A9%94%EC%BB%A4%EB%8B%88%EC%A6%98-%EB%B6%84%EC%84%9D https://ckdtjs505.github.io/posts/pnpm%EC%9D%98-3%EA%B3%84%EC%B8%B5-%EC%95%84%ED%82%A4%ED%85%8D%EC%B2%98%EC%99%80-%EB%A7%81%ED%81%AC-%EB%A9%94%EC%BB%A4%EB%8B%88%EC%A6%98-%EB%B6%84%EC%84%9D Mon, 14 Sep 2026 00:00:00 GMT 3단계로 디스크 공간을 절약하고 유령 의존성을 차단하는 pnpm의 아키텍처와 링크 메커니즘 Git 브랜치 네이밍 컨벤션과 `feature/` 접두사의 역할 https://ckdtjs505.github.io/posts/git-prefix https://ckdtjs505.github.io/posts/git-prefix Mon, 14 Sep 2026 00:00:00 GMT Git 브랜치 네이밍 컨벤션 가이드 - feature/ 접두사의 역할 Chrome 확장 프로그램: VOD 데이터 패킷 대량 주입 파이프라인 분석 https://ckdtjs505.github.io/posts/chrome-extension https://ckdtjs505.github.io/posts/chrome-extension Wed, 09 Sep 2026 23:21:40 GMT 크롬 브라우저 확장 프로그램 개발 과정과 내부 아키텍처에 대한 정리입니다. [Refactoring] 1일차 https://ckdtjs505.github.io/posts/2022-08-01-Refactoring-1%EC%9D%BC%EC%B0%A8 https://ckdtjs505.github.io/posts/2022-08-01-Refactoring-1%EC%9D%BC%EC%B0%A8 Mon, 01 Aug 2022 00:00:00 GMT 마틴 파울러의 '리팩터링' 책 스터디 1일차 요약 내용과 배운 점. [초보를 위한 React] 3일차 https://ckdtjs505.github.io/posts/2021-02-03-%EC%B4%88%EB%B3%B4%EB%A5%BC-%EC%9C%84%ED%95%9C-React-3%EC%9D%BC%EC%B0%A8 https://ckdtjs505.github.io/posts/2021-02-03-%EC%B4%88%EB%B3%B4%EB%A5%BC-%EC%9C%84%ED%95%9C-React-3%EC%9D%BC%EC%B0%A8 Wed, 03 Feb 2021 00:00:00 GMT 리액트(React) 기초 입문 3일차: 생명주기와 훅(Hooks) 사용법. [초보를 위한 React] 2일차 https://ckdtjs505.github.io/posts/2021-02-02-%EC%B4%88%EB%B3%B4%EB%A5%BC-%EC%9C%84%ED%95%9C-React-2%EC%9D%BC%EC%B0%A8 https://ckdtjs505.github.io/posts/2021-02-02-%EC%B4%88%EB%B3%B4%EB%A5%BC-%EC%9C%84%ED%95%9C-React-2%EC%9D%BC%EC%B0%A8 Tue, 02 Feb 2021 00:00:00 GMT 리액트(React) 기초 입문 2일차: state와 props의 개념과 활용. [초보를 위한 React] 1일차 https://ckdtjs505.github.io/posts/2021-02-01-%EC%B4%88%EB%B3%B4%EB%A5%BC-%EC%9C%84%ED%95%9C-React-1%EC%9D%BC%EC%B0%A8 https://ckdtjs505.github.io/posts/2021-02-01-%EC%B4%88%EB%B3%B4%EB%A5%BC-%EC%9C%84%ED%95%9C-React-1%EC%9D%BC%EC%B0%A8 Mon, 01 Feb 2021 00:00:00 GMT 리액트(React) 기초 입문 1일차: 컴포넌트와 JSX 문법의 이해. [알고리즘/프로그래머스/JS] 가장 큰수 https://ckdtjs505.github.io/posts/2021-01-13-%ED%94%84%EB%A1%9C%EA%B7%B8%EB%9E%98%EB%A8%B8%EC%8A%A4-%EA%B0%80%EC%9E%A5-%ED%81%B0-%EC%88%98 https://ckdtjs505.github.io/posts/2021-01-13-%ED%94%84%EB%A1%9C%EA%B7%B8%EB%9E%98%EB%A8%B8%EC%8A%A4-%EA%B0%80%EC%9E%A5-%ED%81%B0-%EC%88%98 Wed, 13 Jan 2021 00:00:00 GMT 프로그래머스 '가장 큰 수' 정렬 알고리즘 문제에 대한 해결 과정과 로직입니다. [알고리즘/프로그래머스/JS] K번째수 https://ckdtjs505.github.io/posts/2021-01-12-%ED%94%84%EB%A1%9C%EA%B7%B8%EB%9E%98%EB%A8%B8%EC%8A%A4-K%EB%B2%88%EC%A7%B8%EC%88%98 https://ckdtjs505.github.io/posts/2021-01-12-%ED%94%84%EB%A1%9C%EA%B7%B8%EB%9E%98%EB%A8%B8%EC%8A%A4-K%EB%B2%88%EC%A7%B8%EC%88%98 Tue, 12 Jan 2021 00:00:00 GMT 프로그래머스 'K번째수' 배열 정렬 알고리즘 문제 풀이 방법입니다. [알고리즘/프로그래머스/JS] 기능개발 https://ckdtjs505.github.io/posts/2021-01-11-%ED%94%84%EB%A1%9C%EA%B7%B8%EB%9E%98%EB%A8%B8%EC%8A%A4-%EA%B8%B0%EB%8A%A5%EA%B0%9C%EB%B0%9C https://ckdtjs505.github.io/posts/2021-01-11-%ED%94%84%EB%A1%9C%EA%B7%B8%EB%9E%98%EB%A8%B8%EC%8A%A4-%EA%B8%B0%EB%8A%A5%EA%B0%9C%EB%B0%9C Mon, 11 Jan 2021 00:00:00 GMT 프로그래머스 '기능개발' 스택/큐 알고리즘 문제 풀이 과정입니다. [알고리즘/프로그래머스/JS] 베스트 엘범 https://ckdtjs505.github.io/posts/2021-01-06-%ED%94%84%EB%A1%9C%EA%B7%B8%EB%9E%98%EB%A8%B8%EC%8A%A4-%EB%B2%A0%EC%8A%A4%ED%8A%B8-%EC%97%98%EB%B2%94 https://ckdtjs505.github.io/posts/2021-01-06-%ED%94%84%EB%A1%9C%EA%B7%B8%EB%9E%98%EB%A8%B8%EC%8A%A4-%EB%B2%A0%EC%8A%A4%ED%8A%B8-%EC%97%98%EB%B2%94 Wed, 06 Jan 2021 00:00:00 GMT 프로그래머스 '베스트앨범' 문제 풀이: 장르별 재생 횟수 정렬과 해시 활용. [js] js-datepicker 사용하기 https://ckdtjs505.github.io/posts/2021-01-03-JS-daypicker https://ckdtjs505.github.io/posts/2021-01-03-JS-daypicker Sun, 03 Jan 2021 00:00:00 GMT 자바스크립트 Datepicker 라이브러리 활용법과 날짜 선택 컴포넌트 구현 방법을 다룹니다. [Electron] import, export 모듈 사용하기 https://ckdtjs505.github.io/posts/2021-01-02-Electron-%EB%AA%A8%EB%93%88-%EC%82%AC%EC%9A%A9 https://ckdtjs505.github.io/posts/2021-01-02-Electron-%EB%AA%A8%EB%93%88-%EC%82%AC%EC%9A%A9 Sat, 02 Jan 2021 00:00:00 GMT 일렉트론(Electron) 환경에서 IPC와 주요 모듈들을 사용하는 방법을 정리합니다. [gitlab] Create MR Template https://ckdtjs505.github.io/posts/2020-12-10-JS-%EA%B4%80%EC%8B%AC-%EA%B8%B0%EC%88%A0 https://ckdtjs505.github.io/posts/2020-12-10-JS-%EA%B4%80%EC%8B%AC-%EA%B8%B0%EC%88%A0 Thu, 10 Dec 2020 00:00:00 GMT GitLab에서 Merge Request 기본 템플릿을 만들고 적용하는 방법을 정리합니다. [JS] 코딩 기술 맵(map)편 https://ckdtjs505.github.io/posts/2020-08-01-Skill-JS-Map https://ckdtjs505.github.io/posts/2020-08-01-Skill-JS-Map Sat, 01 Aug 2020 00:00:00 GMT ES6에서 추가된 Map 객체의 특징과 일반 Object와의 차이점을 분석합니다. [JS] 코딩 기술 객체(object)편 https://ckdtjs505.github.io/posts/2020-07-29-Skill-JS-Object https://ckdtjs505.github.io/posts/2020-07-29-Skill-JS-Object Wed, 29 Jul 2020 00:00:00 GMT 자바스크립트 객체(Object)의 생성, 속성 접근, 순회 방법 등 객체 다루기의 기본을 익힙니다. [JS] 코딩 기술 배열(Array)편 https://ckdtjs505.github.io/posts/2020-07-27-Skill-JS-Array https://ckdtjs505.github.io/posts/2020-07-27-Skill-JS-Array Mon, 27 Jul 2020 00:00:00 GMT 자바스크립트 배열(Array)의 기초적인 다루는 방법과 유용한 내장 메서드들을 살펴봅니다. [JS] 코딩 기술 변수 선언편 https://ckdtjs505.github.io/posts/2020-07-26-Skill-JS-Variable https://ckdtjs505.github.io/posts/2020-07-26-Skill-JS-Variable Sun, 26 Jul 2020 00:00:00 GMT 자바스크립트 변수 선언 방식(var, let, const)의 차이점과 호이스팅 현상을 정리합니다. [Programmers] 위장 https://ckdtjs505.github.io/posts/2020-07-25-%ED%94%84%EB%A1%9C%EA%B7%B8%EB%9E%98%EB%A8%B8%EC%8A%A4-%EC%9C%84%EC%B0%BD https://ckdtjs505.github.io/posts/2020-07-25-%ED%94%84%EB%A1%9C%EA%B7%B8%EB%9E%98%EB%A8%B8%EC%8A%A4-%EC%9C%84%EC%B0%BD Sat, 25 Jul 2020 00:00:00 GMT 프로그래머스 '위장' 알고리즘 문제의 경우의 수와 해시를 이용한 해결 과정을 다룹니다. [Programmers] 완주하지 못한 선수 https://ckdtjs505.github.io/posts/2020-07-23-%ED%94%84%EB%A1%9C%EA%B7%B8%EB%9E%98%EB%A8%B8%EC%8A%A4-%EC%99%84%EC%A3%BC%ED%95%98%EC%A7%80-%EB%AA%BB%ED%95%9C%EC%84%A0%EC%88%98 https://ckdtjs505.github.io/posts/2020-07-23-%ED%94%84%EB%A1%9C%EA%B7%B8%EB%9E%98%EB%A8%B8%EC%8A%A4-%EC%99%84%EC%A3%BC%ED%95%98%EC%A7%80-%EB%AA%BB%ED%95%9C%EC%84%A0%EC%88%98 Thu, 23 Jul 2020 00:00:00 GMT 프로그래머스 '완주하지 못한 선수' 알고리즘 문제의 해시를 활용한 풀이 방법입니다. [Development Tip #7] 조건문을 깔끔하게 작성하기 https://ckdtjs505.github.io/posts/2020-07-22-DevelopmentTip7 https://ckdtjs505.github.io/posts/2020-07-22-DevelopmentTip7 Wed, 22 Jul 2020 00:00:00 GMT 거짓 값의 종류를 정리하고, 삼항 연산자와 단락 평가로 조건문을 간결하게 작성하는 방법을 다룹니다. [Development Tip #6] 나머지 매개변수로 여러개 인수를 전달 https://ckdtjs505.github.io/posts/2020-07-22-DevelopmentTip6 https://ckdtjs505.github.io/posts/2020-07-22-DevelopmentTip6 Wed, 22 Jul 2020 00:00:00 GMT 나머지 매개변수(...rest)로 개수가 정해지지 않은 인수를 받아 확장성 있게 처리하는 방법을 다룹니다. [Development Tip #5] 구조 분해 할당 https://ckdtjs505.github.io/posts/2020-07-22-DevelopmentTip5 https://ckdtjs505.github.io/posts/2020-07-22-DevelopmentTip5 Wed, 22 Jul 2020 00:00:00 GMT 구조 분해 할당의 개념과 필요성, 그리고 구조 분해 할당으로 코드를 리팩터링한 사례를 정리합니다. [Development Tip #4] 매개변수의 기본값을 생성하라 https://ckdtjs505.github.io/posts/2020-07-22-DevelopmentTip4 https://ckdtjs505.github.io/posts/2020-07-22-DevelopmentTip4 Wed, 22 Jul 2020 00:00:00 GMT 매개변수 기본값이 필요한 이유와, 기본값으로 기존 코드에 영향 없이 요구사항 변경에 대응하는 방법을 다룹니다. [Development Tip #3] 적절한 메서드를 발견하라 https://ckdtjs505.github.io/posts/2020-07-22-DevelopmentTip3 https://ckdtjs505.github.io/posts/2020-07-22-DevelopmentTip3 Wed, 22 Jul 2020 00:00:00 GMT hasOwnProperty로 객체 속성을 확인하는 방법과, 값의 유효성을 검사할 때 배열로 변환해 비교하는 방법을 정리합니다.