[번역] 프론트엔드 맥시멀리즘

출처: https://www.natemeyvis.com/front-end-maximalism/항상 나오는 질문은 같습니다:Q: 지금 프론트엔드가 백엔드에 요청을 보내서 어떤 일을 처리하고 있는데, 앞으로는 해야 할 일이 더 많아질 수도 있습니다. 이런 상황에서 데이터를 프론트엔드로 보내기 전에 백엔드에서 얼마나 필터링이나 전처리를 해두는 게 좋을까요?여기서 제 대답은 아래와 같습니다.A: 가능한 한 적게몇 예제를 들어보겠습니다:긴 제품 목록이 있는 제품 페이지가 있다고 가정해보겠습니다. 유저는 한 제품의 상세정보를 보기 위해 선택할 수 있습니다. 먼저 목록을 검색한 다음 선택이 이루어지면 특정 제품의 상세정보를 검색하고 싶을 수 있습니다. 하지만 그것은 전체 제품의 상세 정보를 모두 가져오고, 어떤 상세..

• format_list_bulleted 개발
• · 2025. 11. 11.

[번역] 소프트웨어 엔지니어링에서 좋은 취향은 뭘까?

출처: https://www.seangoedecke.com/taste/소프트웨어 엔지니어링에서 좋은 취향은 뭘까?기술적 취향은 기술 능력과 다릅니다. 기술적인 면에서 뛰어나지만 나쁜 취향을 가지거나, 기술적으로 약하지만 좋은 취향을 가질 수 있습니다. 일반적인 취향과 마찬가지로 기술적 취향은 때때로 능력보다 앞설 수 있습니다. 요리를 할 줄 몰라도 좋은 음식과 맛있는 음식을 구분할 수 있듯이, 소프트웨어를 만들 줄 모르더라도 어떤 소프트웨어를 좋아하는지 알 수 있습니다. 기술적 능력은 공부와 반복을 통해 키울 수 있지만, 좋은 취향은 신비한 방식으로 키울 수 있습니다.소프트웨어 취향을 나타내는 몇 가지 지표는 다음과 같습니다.어떤 코드가 좋고, 나빠보이나요?어떤 결정을 했을때 기분이 좋거나 그저 그랬나요..

• format_list_bulleted 개발
• · 2025. 11. 9.

[번역] 심층 분석: Microtasks와 Javascript 실행 환경

출처: https://developer.mozilla.org/en-US/docs/Web/API/HTML_DOM_API/Microtask_guide/In_depth심층 분석: Microtasks와 Javascript 실행 환경디버깅을 하거나, tasks와 microtasks의 스케줄링 및 타이밍과 관련된 문제를 해결하는 좋은 방법을 결정하기 위해선 자바스크립트 런타임이 어떻게 동작하는지에 대한 몇 가지 사항들이 이해하는데 유용할 수 있습니다.자바스크립트는 근본적으로 싱글 스레드 언어입니다. 자바스크립트는 싱글 스레드가 좋은 선택이였던 시절에 만들어졌습니다. 일반 대중이 멀티 프로세스 컴퓨터가 가능한 컴퓨터는 거의 없었고, 자바스크립트가 처리할 것으로 예상되는 코드 양이 상대적으로 적었습니다.물론, 시간이 ..

• format_list_bulleted 개발
• · 2025. 10. 26.

React StrictMode에서 log가 왜 두 번 안나오지..!?

우선 StrictMode란?개발 모드에서 StrictMode가 활성화되면 리렌더링이 두 번 실행된다.이는 StrictMode의 의도된 동작으로, 리렌더링 과정에서 발생할 수 있는 잠재적인 버그를 조기에 발견하기 위한 장치다.다만, 비즈니스 코드 작성 중에 디버깅 과정에서 console.log 출력이 예상과 다르게 나타나는 현상이 있었다.동기 함수의 로그는 한 번만 출력됨비동기 함수의 로그는 두 번 출력됨예시 코드아래는 위 상황을 간단히 표현한 코드이다.import { useMemo } from 'react';let num = 0;function App() { useMemo(() => { const id = num++; console.log(id); setTimeout(() => { ..

• format_list_bulleted 개발
• · 2025. 9. 27.

교보문고 MCP를 만들면서, Chrome Devtools Protocol을 사용해봤다.

교보문고 MCP를 만들기 시작한 이유사내에서 책 한 권을 골라 서로 의견을 나누는 방식으로 스터디를 진행 중인데, ebook으로 진행하다 보니 공부하는 과정에서 요약하고 싶은 부분이 자주 생긴다. 그래서 지금은 그 부분을 캡처해서 GPT에 물어보며 스터디를 하고 있다. (다만, 이게 저작권에 문제가 없는지는 따로 확인이 필요할 것 같다.)그런데 시간이 지날수록 요약할 부분을 직접 캡처해서 올리는 일이 점점 번거로워졌다. 그래서 "이 과정을 Agent가 대신 해주면 좋겠다"는 생각이 들어 MCP를 만들기 시작했다. (교보문고 측이 직접 만들어주면 좋겠다..) 내가 생각한 교보문고 MCP의 기능- 내가 구매한 서적들 좀 알려줘- 내가 구매한 서적들 중 A란 이름을 가진 책이 있을까?- A의 100페이지부터 ..

• format_list_bulleted 개발
• · 2025. 8. 16.

redis clustering, tunneling을 통해 접근하는 방법 with Node.js

프로젝트를 진행하다 보면, 로컬 환경에서 사설망(VPC) 안에 있는 Redis 클러스터에 접근해야 하는 경우가 있다.이때 가장 흔히 쓰는 방법이 SSH 터널링이다. SSH 터널링을 통해 Redis Clustering에 접속하던 중 문제가 발생해 해결 방법을 공유한다.상황1. SSH 터널링 실행ssh -L 1234:bastionhost:bastionport ec2-user@ 2. Node.js에서 Redis Clustering 연결 시도const cluster = new Redis.Cluster([ { host: 'localhost', port: 1234 },]).connect(); 3. Connection Error 발생!?아무리 뜯어봐도 Connection Error가 발생할 부분이 없는데, 열심히..

• format_list_bulleted 개발
• · 2025. 8. 9.