problem_solving 7

6. 아무튼 내 잘못은 아닌 거 같은데

0. Intro가족이 내가 만든 페이지를 그럭저럭 쓰는데, 어느 날 숫자가 안나온다는 이야길 했더랬다.1. 무슨 상황일까지금의 내 페이즈는 야후 API를 못 받아오면 아무 로직이 동작할 수 없는 구조라, 빠르게 확인을 했었다.확인해보니 API를 못받아오는 게 아니라, API를 받아올 때 58초정도나 기다려야 했던 것.2. 뭐가 문제였을까문제는 간단했다. 야후 API 서버 상태가 안좋아서, 전반적으로 응답 속도가 느렸던 것. 이 날 부랴부랴 확인해보니, 다운디텍터에서는 이 날 모든 야후 서비스에서 장애징후를 표시하고 있었다. 3. 그러면 왜 58초나?이건 더 간단했다. 이전 코드 return Promise.all(items.map(([ticker, range, interval]) => { ..

5. 기획이 엉성하면 몸이 고생한다.

최근(2026-04-07 ~ 2026-04-09)에는 Market Radar를 프로토타입에서 운영 가능한 서비스로 만드는 작업이 대부분이었다. 3/28~3/29에 했던 작업이 보안/성능/기능 추가(RSS, RateLimit, DOMPurify, CORS, 프롬프트 최적화 등)였다면, 이번 구간은 외부 의존성(RSS/Yahoo/Gemini) 때문에 생기는 데이터 계약(contract) 문제React + Chart.js 경계에서 생기는 UI stale/리렌더링 문제“내일 시장 주가”라는 제품 컨셉 때문에 생기는 시간대/거래일 계산 문제i18n 확장으로 인해 생기는 상태 꼬임 / stale 결과 문제CORS / RateLimit 같은 보안 정책을 실제 트래픽/환경에 맞게 튜닝하는 문제패치노트 기반으로 정리하되..

4. RSS를 깎자

RSS를 깎자 - Vercel 타임아웃부터 제미나이 프롬프트 튜닝까지Market Radar의 증시 분석 퀄리티를 높이기 위해, 기존 5개였던 미국 위주의 RSS 피드에 CNBC, BBC, ECB, 야후 파이낸스(JP) 등 글로벌 매체를 더해 총 9개로 확장하는 작업을 진행했다. (NHK world backstory는 이번에 삭제.) 단순한 배열 추가 작업인 줄 알았으나, 데이터 소스의 규모가 2배 가까이 커지면서 기존 아키텍처(파서, 서버리스 타임아웃, AI 프롬프트 전처리) 전반의 스케일업이 필요해짐. 백엔드 데이터 수집부터 프롬프트 주입까지, 확장 과정에서 만난 6가지 병목 현상과 해결 과정을 정리했다. Phase 1. 데이터 수집의 늪 (API & 파싱 이슈)가장 먼저 맞닥뜨린 문제는 새로 추가한 ..

3. 프론트엔드 고도화

0. 리액트로 이사가기화면배치를 바꾸다보니 슬슬 리액트로 넘어가는 게 맞을 거 같아서 작업을 진행중. 1. 대시보드면 정적 페이지여도 충분할텐데?크게 3가지 문제가 있었다. 시인성의 한계: 정보가 위아래로 너무 길게 나열되어 한 눈에 들어오지 않음.정보의 파편화: 뉴스 데이터가 분석 프롬프트용으로만 소비되고 추가 활용이 안되고 있었음.긴 스크롤: 핵심인 AI 분석 결과를 보려면 화면 맨 아래까지 내려가야 하는 불편함. 대시보드는 한 눈에 들어오는 시인성이 중요한데, 지금은 위 아래로 길게 정보를 뿌려주고 있었다. AI 분석도 맨 밑에 있어서, 스크롤을 내려서 봐야하는 사소한 불편함이 있지 않나 싶어졌다. 지금 분석은 뉴스도 수집하고 있는데, 프롬프트 용으로 수집하는 게 아니라 '최근 뉴스'정도로 해서 주..

2. 배포 이후 수행했던 것들

0. 패치노트더보기2026-03-29Added- RSS 뉴스 수신 기능 추가 및 Vercel KV 기반 Rate Limiting 도입 - DOMPurify 기반 HTML sanitize 적용 - index.html에 DOMPurify 스크립트 추가 Changed- 프롬프트 수정/정확도 개선 - AI 답변이 길어질 때 UI/CSS 표시 개선(긴 답변 대응) - Gemini 호출 5분 타임아웃(shutdown) 문제 수정 - `/api/news` CORS allowlist 동작 수정 - CORS 처리 리팩터링 및 에러 응답 개선- 프롬프트 요청 비동기 promise로 수정, 병렬 요청으로 요청응답 속도 개선Security- Gemini 출력 렌더링 시 XSS 위험 완화(DOMPurify sani..

1. 바닐라 JS로 지수 분석 페이지 만들다 생겼던 문제들

1. Yahoo Finance를 브라우저에서 직접 부를 수 없는 이유시장 데이터 대시보드를 만들며 가장 먼저 마주한 벽은 CORS(Cross-Origin Resource Sharing) 정책이었다. Yahoo Finance API를 브라우저에서 직접 호출하자마자 무심한 에러 메시지가 출력됐다.시장 데이터 대시보드를 만들면서 가장 먼저 부딪힌 문제였다.Yahoo Finance API를 브라우저에서 직접 호출하면 이런 에러가 난다.Access to fetch at 'https://query1.finance.yahoo.com/...' from origin 'https://...' has been blocked by CORS policy CORS는 보안을 위해 브라우저가 실행 중인 도메인과 다른 곳의 리소스를 ..

0. I don't have a mouth but...

0. Intro'I don't have a mouth and I must scream' 이라는 단편이 있다.1967년에 나온 SF 단편이고 휴고상을 받았다, 또한, 이를 기반으로 1995년에 출시된 비디오 게임이다. 게임디자인 쪽에서는 I have no words & I must design이라는 그렉 코스티켄(Grag Costikyan)의 페이퍼에 영감을 준 작품이다. 게임기획 일을 하며 열심히 읽었던 아티클이었다. 한국에서는 말 없는 게임디자인으로 번역되었었다.(관심이 있으신 분은 이쪽으로. 영어 주의) 가장 주요한 요지는, '도대체 무엇이 '게임'을 게임답게 만드는가?'였다.당시 게임 산업은 기술적인 화려함에 꽤 치중하고 있었고, 코스티켄은 이 글을 통해 "그래픽이 아무리 좋아도 게임의 '구조(St..

problem_solving 2026.03.09