모든 블로그
토스

토스

도메인toss.tech
주요 카테고리 프론트엔드 · AI

활동 요약

대표 인기 포스트캐시를 적용하기 까지의 험난한 길 (TPS 1만 안정적으로 서비스하기)499 조회
최근 30일
7개
평균 조회
98
누적 조회
24,617
전체 글
252개
마지막 발행
2026. 11. 10.
블로그 방문

토스 기술 블로그 글 (252)

기타

토스 피플 #1: 테크 채용 브랜딩의 새로운 기준

토스의 채용 브랜딩 담당자가 커리어 전환과 직무 정의 과정을 공유했습니다. 새로운 직무는 역할명보다 팀에 필요한 일과 자신의 강점의 교집합을 찾는 것이 중요하다고 말했습니다.

#채용브랜딩#컨퍼런스#테크 블로그
3000

프론트엔드

모닥불 | EP.2 함수형 프로그래밍, 프론트엔드 개발에 진짜 도움 될까?

토스 프론트엔드 개발자들이 함수형과 객체지향의 장단점과 선호도를 두고 토론했습니다. 프론트엔드에서 객체지향을 어떻게 활용할 수 있는지도 함께 살펴봤습니다.

#함수형 프로그래밍#객체지향 프로그래밍
5100

기타

UX리서치 조직에서 리옵매란?

토스의 UX리서치 오퍼레이션 매니저 역할과 업무 범위를 소개했습니다. 리크루팅 조건과 스크리닝 설계를 지속 개선해 리서치 효율을 높이는 과정을 다뤘습니다.

#UI/UX#리서치#리크루팅
4800

프론트엔드

SSR 서버 최적화로 비용 아끼기

SSR 서버 최적화를 위해 측정 환경을 먼저 정비하고, RPS와 Event Loop 지표로 병목을 찾았습니다. serializer 제거, Yarn 업그레이드, Express 제거로 CPU 사용률을 낮춰 서버 수를 줄였습니다.

#SSR#Next.js#node.js
4800

AI

토스뱅크가 AI로 보안과 효율도 챙기는 방법

토스뱅크는 ML 모델로 신분증 사본 품질을 검사해 반려와 경고를 자동화했습니다. 임계값과 A/B 테스트로 고객 불편을 줄이면서 수기 검토 효율도 높였습니다.

#ML#A/B 테스트#이미지 분류
4600

프론트엔드

모닥불 | EP.1 토스에서 말하는 “가독성 좋은 코드” 란 무엇일까?

토스 프론트엔드 개발자들이 가독성 좋은 코드의 의미와 코드 퀄리티의 필요성을 이야기했습니다. 동료를 위한 코드라는 관점에서 가독성의 요소와 챙기는 방법을 공유했습니다.

#UI/UX#가독성#코드 퀄리티
4700

아키텍처

문제의 근원을 해결 하기 위한 다양한 시도

토스 디자인 시스템 테이블의 사용성 문제를 근본 원인부터 다시 정의하고 개선한 과정을 소개했습니다. 실제 사용 조사, AG Grid 활용, 집중된 검증으로 테이블 2.0을 완성했습니다.

#UI/UX#디자인 시스템#테이블
2400

데브옵스

200여개 서비스 모노레포의 파이프라인 최적화

토스 프론트엔드의 대규모 모노레포 CI/CD 최적화 사례를 소개했습니다. 병렬 파이프라인과 사전 복제, SSR 번들링으로 빌드와 배포 시간을 크게 줄였습니다.

#모노레포#CI/CD#Docker
3000

아키텍처

프로젝트 전체에서 사용되는 패키지, 어떻게 마이그레이션 할까?

프로젝트 전반의 패키지 마이그레이션 사례를 다뤘습니다. Next는 대체 구현으로 전환했고, Recoil은 AST 기반 스크립트로 Jotai로 옮겼습니다.

#migration#Next.js#React
2900

프론트엔드

여러 프레임워크에서 사용할 수 있는 라이브러리 만들기

Framework Agnostic 개념을 바탕으로 코어와 어댑터를 분리하는 라이브러리 설계 방식을 소개했습니다. Tanstack Query와 계산기 예시로 프레임워크 독립성과 통합 구조를 설명했습니다.

#JavaScript#TypeScript#React
3900

프론트엔드

드래그 앤 드롭은 사실 편한 UX가 아니다?

드래그 앤 드롭 순서 변경 기능을 접근성 관점에서 재설계한 사례를 소개했습니다. 스크린 리더, 초점 이동, ARIA 적용과 디바이스별 대응 방법도 함께 정리했습니다.

#UI/UX#accessibility#ARIA
4300

프론트엔드

Transpiler, “사용”말고 “활용”하기

토스뱅크는 transpiler를 활용해 클릭 요소에 로깅 속성을 자동 주입하는 방식을 만들었습니다. 이를 통해 개발자는 로깅을 신경 쓰지 않고 비즈니스 로직에 집중할 수 있게 되었습니다.

#transpiler#React#SWC
3300

프론트엔드

패키지 매니저의 과거, 토스의 선택, 그리고 미래

JavaScript 패키지 매니저의 동작 원리와 npm, pnpm, Yarn의 차이를 설명했습니다. 토스가 Yarn PnP를 선택한 이유와 Zero-install, Import Map의 방향성도 함께 다뤘습니다.

#Yarn#pnpm#node_modules
2900

백엔드

서버 증설 없이 처리하는 대규모 트래픽

대규모 트래픽이 몰린 라이브 쇼핑 서비스에서 Redis, DB, Gateway 병목을 줄인 방법을 공유했습니다. 서버 증설보다 모니터링과 캐시, 비동기 처리, 요청 통합을 통한 성능 개선이 핵심이었습니다.

#Redis#Kafka#server
4600

아키텍처

제품이 커지면 디자인 시스템 가이드는 어떻게 개선돼야 할까?

디자인 시스템 가이드를 읽는 순서와 구조를 표준화해 이해와 작성 효율을 높인 사례입니다. 접근성과 상세 스펙을 체계화해 신규 합류자도 빠르게 기여할 수 있게 했습니다.

#UI/UX#접근성#디자인 시스템
15100

프론트엔드

토스가 꿈꾸는 React Native 기술의 미래

토스가 React Native를 선택한 이유와 현재 운영 방식을 소개했습니다. 마이크로 프론트엔드, ESBuild, 번들 분리로 사용자 경험과 개발 생산성을 함께 높이고자 했습니다.

#React Native#WebView#ESBuild
6200

백엔드

더 자유롭고, 빠르고, 정확하게: 토스페이먼츠 API 문서 엔지니어링

토스페이먼츠가 MDX와 OAS, remark를 결합해 API 문서 작성의 자유도와 정확도를 높인 사례를 소개했습니다. 스펙 자동화와 PR 기반 반영으로 반복 작업을 줄이고 문서 품질을 개선했습니다.

#MDX#OAS#remark
17600

기타

토스 UX 리서처는 어떤 방법론을 사용할까?

토스 UX 리서치팀의 방법론 선택과 러닝쉐어 문화를 사례 중심으로 소개했습니다. 리서치 전 과정은 리서처가 이끌지만, 팀의 토론과 공유로 품질을 높인다고 설명했습니다.

#UX 리서치#인터뷰#설문조사
5100