분류 전체보기
-
OAuth 2.0과 SSO 구현 가이드React.js & Next.js 2025. 8. 29. 20:31
내용ProBit Global 서비스의 세 가지 주요 구성 요소에서 OAuth 2.0 프로토콜을 기반으로 한 단일 로그인(SSO) 플로우 구현을 설명합니다:로그인 서버 (probit-global-accounts): 인증 UI 및 SSO 연동을 처리하는 권한 서버BFF (프론트엔드용 백엔드) (probit-global-web/server): 인증 라우팅 및 토큰 관리를 위한 Express.js 미들웨어클라이언트 (probit-global-web/src): 인증 서비스를 제공하는 Angular 프론트엔드 애플리케이션OAuth 2.0 개요OAuth 2.0은 웹 및 애플리케이션 인증 및 권한 부여를 위한 개방형 표준 프로토콜입니다. ProBit Global 시스템은 OAuth 2.0의 인증 코드 부여(Author..
-
캔버스를 통해 직접 만드는 심도 차트React.js & Next.js 2025. 8. 27. 21:19
목표심도 차트를 적용하여 spot 사용자의 사용성을 개선한다시장의 유동성을 파악할 수 있음지지선과 저항선을 식별할 수 있음거래 전략을 수립할 수 있음실시간 시장 심리를 파악할 수 있음레퍼런스https://www.kucoin.com/trade/BTC-USDT BTC/USDT Trading and ChartsBuy, sell, and trade BTC/USDT easily and safely. Make smarter investment choices using our live BTC price charts and technical indicators.www.kucoin.comhttps://www.binance.com/en/trade/BTC_USDC?type=spot https://www.binance.com..
-
로컬 스토리지 캐싱 시스템 구현하기JS & TS 2025. 8. 19. 23:37
목차목적주요 해결 과제핵심 아키텍처주요 기능실제 사용 시나리오핵심 메커니즘성능 이점데이터 흐름 다이어그램전체 코드 보기깃허브 바로가기예제 사이트 바로가기목적브라우저의 localStorage를 활용하여 API 응답 데이터를 효율적으로 캐싱하는 엔터프라이즈급 캐시 관리 시스템을 구현한다.성능 최적화: 네트워크 대기시간 0ms로 단축비용 절감: API 호출 횟수 최대 90% 감소확장성: 멀티 인스턴스 환경에서 안전한 운영자동화: 수동 관리 없는 지능형 캐시 운영주요 해결 과제1. 네트워크 비용 절감반복적인 API 호출 최소화대역폭 사용량 감소서버 부하 분산2. 성능 향상캐시 히트 시 즉시 응답 (0ms)사용자 경험 개선페이지 로딩 속도 향상3. 용량 관리localStorage 5MB 제한 내에서 효율적 운영자..
-
tanstack-query, stale time이 gcTime보다 클 때 생길 수 있는 문제React.js & Next.js 2025. 8. 18. 20:51
React Query: staleTime vs gcTime 제대로 이해하기React Query를 사용하다 보면 staleTime과 gcTime설정에 대해 혼란을 겪는 경우가 많습니다. 특히 이 두 옵션의 관계를 잘못 이해하여 설정하면 예상치 못한 성능 문제가 발생할 수 있습니다. 제가 겪은 사례를 공유하면서 실수하기 쉬운 설정 패턴과 올바른 사용법을 알아보겠습니다.겪은 내용신규 페이지를 오픈했는데, 기존 서비스(academy) 리팩터링 내용과 달리 tanstack-query와 fetch(SSG, ISR)의 조합으로 사용되었습니다. 릴리즈 이후 그라파나를 통해 메모리 및 CPU 사용량을 관측하고 있었는데, 메모리 누수로 인해 heap out of memory 메시지와 함께 죽은 뒤 다시 살아나는 흐름이 지..
-
구글 애널리틱스 보고서 자동화 하기 (Google Apps Script)끄적끄적 2025. 8. 13. 20:49
목차목적흐름레퍼런스작업 순서결과목적발생하는 Google Analytics 4의 이벤트를 정기적으로 관측하고, 지표화한다.흐름Google Anayltics(이하 GA)에서 관측하고 싶은 데이터를 추출한다Claude, Chat GPT등을 활용하여 구글의 Apps Script에 보고서를 생성할 수 있는 스크립트를 만든다트리거를 통해 어떠한 주기로 보고서를 생성할지 정한다레퍼런스https://developers.google.com/apps-script/advanced/analyticsdata?authuser=0&hl=ko작업 순서https://script.google.com/home 접속새 프로젝트 생성서비스 추가스크립트에 들어갈 propertyId 확인접근 승인로그 확인스크립트를 자유롭게 수정트리거 설정트리거..
-
육각형 개발자Book Study 2025. 8. 12. 20:45
1장 - 들어가며실패마무리했다는 믿음은 착각이었다. 실제로 서비스를 출시하지 못했기 때문이다. 서비스를 출시하지 못했으니 사용자도 만나지 못했다. 그때 왜 서비스를 출시하지 못했는지 알 수 없었다. (p.17)개발이란경험이 쌓이면서 개발에 포함되는 영역이 코딩 이상이라는 사실을 알게 되었다. 코딩뿐만 아니라 많은 활동이 개발 범주에 속한다는 것을 깨달은 것이다. (p.20) 이곳에서는 제대로 된 결과물을 만드는 데 실패할 때가 많았고, 결국 이런 잦은 실패는 회사의 지속 가능성을 떨어뜨렸다. (p.21) 회사 업무를 하면서 성장한다는 느낌을 받지 못한 이유 중 하나는 개발과 성장을 동일시했기 때문이다. 프로젝트 일정, 요구 사항, 위험 관리 등 여러 내용을 접하면서 내가 생각한 개발은 전체에서 아주 일부..
-
알고리즘, Dynamic ProgrammingData Structure & Algorithm 2024. 7. 8. 15:30
동적 프로그래밍(Dynamic Programming, DP)은 복잡한 문제를 더 작은 하위 문제로 나누어 해결하는 알고리즘 설계 기법입니다. 이 기법은 하위 문제의 해를 재사용하여 전체 문제의 해를 구하는 데 사용됩니다. 동적 프로그래밍은 주로 최적화 문제를 해결하는 데 사용되며, 두 가지 중요한 속성을 가집니다: 최적 부분 구조(Optimal Substructure)와 중복 부분 문제(Overlapping Subproblems).동적 프로그래밍의 개념최적 부분 구조(Optimal Substructure):큰 문제의 최적 해가 그 부분 문제의 최적 해로부터 유도될 수 있는 속성을 의미합니다.예를 들어, 최단 경로 문제에서 전체 경로의 최적 해는 그 경로를 구성하는 부분 경로들의 최적 해로 구성될 수 있습..
-
알고리즘, graph, DijkstraData Structure & Algorithm 2024. 7. 3. 18:18
다익스트라 알고리즘(Dijkstra's Algorithm)은 그래프에서 한 정점에서 다른 모든 정점으로의 최단 경로를 찾는 데 사용되는 알고리즘입니다. 이 알고리즘은 가중치가 있는 그래프에서 사용되며, 가중치가 음수가 아닌 경우에만 적용할 수 있습니다.다익스트라 알고리즘의 개념시작 정점 선택: 알고리즘은 시작 정점에서 시작합니다.최단 경로 집합: 최단 경로를 확정한 정점들의 집합을 유지합니다.미확정 집합: 아직 최단 경로가 확정되지 않은 정점들의 집합을 유지합니다.거리 배열: 시작 정점에서 각 정점까지의 현재까지 발견된 최단 거리를 저장합니다. 초기에는 시작 정점의 거리를 0으로 설정하고 나머지 정점의 거리를 무한대로 설정합니다.이웃 정점 업데이트: 현재 정점에서 인접한 정점들로의 거리를 계산하고, 더 ..