KDH's portfolio

Blog

개발 경험, 문제 해결 과정, 그리고 배운 것들을 기록합니다.

태그 필터

📌

Engineering Deep Dive

6개의 글
Engineering Deep Dive

Gemini 웹과 API의 현실: 유튜브 분석 구현 Deep Dive

#Trouble Shooting#OpenSource#Gemini+2
Engineering Deep Dive

HOC로 렌더링을 차단하고 성능 향상

#Kiosk#Stack Navigation#Stackflow+2
Engineering Deep Dive

MQTT 연결 유실과 자가 복구 아키텍처 설계

#MQTT#자가복구#연결유실+2
Engineering Deep Dive

Mutex로 해결한 영수증 프린터 모듈 충돌 문제

#Mutex#DeadLock#Singleton
Engineering Deep Dive

Shadow DOM 아키텍처 설계

#shadow DOM#Emotion#스타일 격리+2
Engineering Deep Dive

웹 기술의 한계를 넘어, 기능 구현 (N-API 네이티브 애드온)

#node-gyp#Addon#Electron+1
📌

Criti AI

47개의 글
Criti AI

API 통신과 Background Script 설계 - CORS 우회, 통신 아키텍처

#cors#proxy#Chrome Extension+1
Criti AI

Base64 인코딩: 안전한 문자열로 변환

#Base64#인코딩
Criti AI

CORS

#cors
Criti AI

Criti.AI 백엔드 구조

#아키텍처#backend#express
Criti AI

Criti.AI 백엔드 성능 최적화

#성능최적화
Criti AI

DB & 로그 파일 복사

#Docker
📌

OpenSource

9개의 글
OpenSource

CSS 애니메이션 & 성능 문제

#OpenSource#CSS
OpenSource

Google Lighthouse 오픈소스 기여

#OpenSource#Google#Lighthouse
OpenSource

GPT-snaplist 프로젝트

#Chrome Extension
OpenSource

i18n 구현 방법 비교

#국제화
OpenSource

ICU MessageFormat

#국제화#ICU
OpenSource

Lighthouse 구체적 개발 및 수정 내용

#OpenSource#Lighthouse
📌

log-central

16개의 글
log-central

(Grafana 공식 문서) Grafana를 코드 기반으로 자동화(provisioning)

#Grafana#Provisioning
log-central

dnd-kit 드래그 앤 드롭 기능

#Guide#drag-and-drop
log-central

Grafana provisioning 자동 폴더 구조 기반으로 구성하고 관리

#Grafana#Provisioning#folder-structure
log-central

Grafana 자동 대시보드 구성: VS Code + Docker + SSH

#Docker#Grafana#Provisioning+1
log-central

Grafana를 재시작하지 않고 dashboard.json만 갱신하는 방법

#Provisioning#Grafana
log-central

Grafana에서 CPU 사용률 시각화하는 쿼리 구성하는 과정

#Grafana
📌

스터디노트 Electron

31개의 글
스터디노트 Electron

autoUpdater 메소드

#자동 업데이트#Electron
스터디노트 Electron

autoUpdater모듈

#자동 업데이트#Electron#Desktop Application
스터디노트 Electron

electron ES모듈 구문 사용 오류

#Trouble Shooting
스터디노트 Electron

electron 빌드 및 설정

#Electron#node-gyp
스터디노트 Electron

Electron 설치

#Electron#React#TypeScript+1
스터디노트 Electron

ElectronJS로 데스크톱 앱 개발 템플릿

#Electron
🔬

Project

5개의 글
Project

<img>가 부모 요소를 꽉 채우지 못하는 문제

#Portfolio#CSS#Trouble Shooting+3
Project

stackFlow - Activity, Step 개념

#Stack Navigation#Stackflow#UX/UI
Project

stackFlow 시작 방법

#Stack Navigation#UX/UI#Stackflow+1
Project

Vercel 배포 환경에서 브라우저 뒤로가기 시 다크모드가 해제되는 문제

#Trouble Shooting#Style
Project

배리어프리 키오스크 규정 자료

#Kiosk#Intern#Barrier-Free+1
📌

Side Project

1개의 글
Side Project

얼굴 인식 사이트 구현

#Vite#TypeScript#React+3
📌

Side Project twitter

23개의 글
Side Project twitter

API key securitys

#Firebase
Side Project twitter

Comment 기능 추가

#Firebase
Side Project twitter

Firebase

#Firebase
Side Project twitter

firebase - database

#Firebase
Side Project twitter

firebase authentication 설정

#Firebase
Side Project twitter

firebase security rules

#Firebase
📌

TIP

24개의 글
TIP

antd import오류

#ANTD#Trouble Shooting
TIP

browser-image-compression

#성능최적화#Trouble Shooting
TIP

copyfiles -u 옵션

#script
TIP

CSS - 버튼 클릭시 파란색 박스 문제 해결(WebView)

#Trouble Shooting#CSS#UX/UI
TIP

floating 버튼 만들기 (z-index)

#UI/UX
TIP

gh-pages로 배포 후, 빈 화면 - 경로 해결

#Trouble Shooting
📌

UI/UX

7개의 글
UI/UX

alert창 (react-toast)

#Style#UI/UX#React
UI/UX

ANT Design (ANTD)

#ANTD#UX/UI
UI/UX

동적 전역 테마 관리 적용

#Theme#Dynamic#UI/UX+2
UI/UX

디지털 정부 서비스 가이드라인

#UI/UX
UI/UX

모달창 라이브러리 (react-modal)

#UI/UX#Modal
UI/UX

이미지 style

#UI/UX#FrontEnd
📌

기타

4개의 글
기타

Oracle 마이크로 서버

#Oracle Cloud#Server#성능최적화+1
기타

React-bits 오픈소스 기여 기록

#OpenSource#ReactBits
기타

SQLite3 vs better-sqlite3

#SQLite#Better-SQLite3
기타

생각의 사슬(Chain-of-Thought, CoT) 프롬프팅 논문

#Prompt#CoT
📌

모듈 분석

12개의 글
모듈 분석

16진수 → 2진수 배열로 변환 (각 비트 비교)

#Kiosk#Module#Bit Mask
모듈 분석

시리얼 포트 지정하는 법

#Kiosk#Module#Serial Port
모듈 분석

여권 MRZ 데이터

#MRZ#Scanner
모듈 분석

영수증 프린터 모듈 분석

#Module#Kiosk
모듈 분석

영수증 프린터 상태 및 오류처리

#Kiosk#Module
모듈 분석

영수증 프린터 출력 가능 문자 수 설정

#Kiosk#Module
📌

스터디 노드 React

20개의 글
스터디 노드 React

a태그 대신, Link를 사용하는 이유

#Study
스터디 노드 React

CRA 구성 및 작동

#Study
스터디 노드 React

custom hook 만들기

#Study
스터디 노드 React

debounce 개념

#Study
스터디 노드 React

JS 중요 개념(let vs var)

#JavaScript#Study
스터디 노드 React

JSON 서버를 이용, rest api만들기

#Study
📓

스터디 노트

25개의 글
스터디 노트

@emotion/react & @emotion/styled (스타일링 라이브러리)

#Emotion
스터디 노트

async 함수 병렬 처리

#JavaScript#Study
스터디 노트

CORS 문제

#cors
스터디 노트

forms API (유사 백엔드)

#OpenAPI
스터디 노트

Node.js vs Bun vs Deno

#Study
스터디 노트

Promise & resolve

#JavaScript#Promise#Resolve
📌

스터디노트 Docker

7개의 글
스터디노트 Docker

Docker

#Docker#Container
스터디노트 Docker

네트워크 연결 흐름

#Docker
스터디노트 Docker

도커 container run

#Docker#Container
스터디노트 Docker

도커 설치

#CSS#Docker#Container
스터디노트 Docker

도커 이미지 pull (설치)

#Docker#image
스터디노트 Docker

명령어 실행

#Docker#Container
📌

스터디노트 Express

5개의 글
스터디노트 Express

cookie-parser (쿠키에 저장하는 라이브러리)

#Cookie#express
스터디노트 Express

Express 설치 및 실행

#express
스터디노트 Express

Express 세팅

#express#NodeJS
스터디노트 Express

내부 구성 (app.js, www)

#express
스터디노트 Express

페이지 라우팅

#routing#express
📌

스터디노트 MongoDB

4개의 글
스터디노트 MongoDB

bycrypt (비밀번호 암호화)

#Security#DB#NoSQL+1
스터디노트 MongoDB

MongoDB

#MongoDB#NoSQL#DB
스터디노트 MongoDB

MongoDB 프로그램 설치

#MongoDB#NoSQL#DB
스터디노트 MongoDB

영화 API (TMDB)

#OpenAPI
📌

스터디노트 NextJS

10개의 글
스터디노트 NextJS

@alias (별칭)

#TypeScript#React#NextJS
스터디노트 NextJS

fetch 방법

#NextJS#TypeScript#성능최적화
스터디노트 NextJS

NextJS api키 인식 못하는 오류

#Trouble Shooting#NextJS
스터디노트 NextJS

NextJS cors 설정

#NextJS#cors
스터디노트 NextJS

NextJS data fetch (cache)

#NextJS#성능최적화#TypeScript
스터디노트 NextJS

NextJS post 후, refresh를 통해 데이터 다시 가져오기

#NextJS
📌

스터디노트 NodeJS

18개의 글
스터디노트 NodeJS

API 서버 만들기

#NodeJS#Study
스터디노트 NodeJS

CORS 이슈 해결

#cors#NodeJS#Study
스터디노트 NodeJS

Express

#NodeJS#Study
스터디노트 NodeJS

Express 사용하여 REST 서버 구축

#Server#REST
스터디노트 NodeJS

File System 모듈

#FileSystem 모듈#Study
스터디노트 NodeJS

get, 라우팅

#NodeJS#Study
📌

스터디노트 RX패턴

15개의 글
스터디노트 RX패턴

MS는 Rx를 왜 만들었을까?

#RX 패턴
스터디노트 RX패턴

Reactive X의 3가지 핵심요소

#RX 패턴
스터디노트 RX패턴

Rx 핵심 개념 비유

#RX 패턴
스터디노트 RX패턴

RxJS - Observable

#RX 패턴#옵저버 패턴
스터디노트 RX패턴

RxJS - Observer

#RX 패턴#옵저버 패턴
스터디노트 RX패턴

RxJS - Operator

#RX 패턴#옵저버 패턴
📌

스터디노트 React Query

6개의 글
스터디노트 React Query

React Query 설치 및 기본 설정

#React Query
스터디노트 React Query

React Query란

#React Query
스터디노트 React Query

useQuery (get)

#React Query
스터디노트 React Query

리액트 쿼리 vs 기존 방식

#React Query
스터디노트 React Query

리액트 쿼리 병렬요청

#React Query
스터디노트 React Query

클라이언트 상태 vs 서버 상태

#React Query
📌

스터디노트 Redis

4개의 글
스터디노트 Redis

Publisher / Subscriber

#Redis
스터디노트 Redis

Redis 기본 사용 방법

#Redis
스터디노트 Redis

Redis 설치하기

#Redis
스터디노트 Redis

Redis란?

#Redis
📌

스터디노트 Spring

35개의 글
스터디노트 Spring

alt + insert (generator 여는 단축키)

#단축키#Spring
스터디노트 Spring

basePackages

#Spring#BasePackages
스터디노트 Spring

enum

#enum#Java
스터디노트 Spring

final

#개념#Java#Spring+1
스터디노트 Spring

Gradle이란?

#Gradle#Spring#Java
스터디노트 Spring

IntelliJ 전체 프로젝트 검색

#IntelliJ