Zettelkasten과 서비스 문서화 그리고 가슴 설레는 OKR – Hwahae network graph
파편화된 서비스 문서를 Zettelkasten 기반 그래프로 연결하는 HNG MVP를 구현했습니다. Strapi·Next.js·G6 선택 과정과 문서화 운영 과제를 공유합니다.
#Zettelkasten#문서화
000
국내 IT 기업 기술 블로그 최신 글
새로운 기술 블로그가 추가되었어요
필터 1
three.js in Next.js
WebGL을 추상화한 three.js의 핵심 구성과 애니메이션 루프를 설명했습니다. Next.js에서 useRef·useEffect로 바닐라 three.js 도넛을 렌더링하는 패턴을 제시했습니다.
#three.js#Next.js
2600
카카오페이지는 BFF(Backend For Frontend)를 어떻게 적용했을까?
카카오페이지는 BFF(Backend For Frontend)를 어떻게 적용했을까?
카카오페이지 Web은 GraphQL 기반 BFF로 다중 API 응답을 화면 모델에 맞게 통합했습니다. Apollo 캐시 문제를 피해 Urql과 Redux로 데이터 조회·상태 관리를 분리했습니다.
#BFF#MSA
3800
초보 웹 개발자를 위한 자바스크립트 빌드 툴과 SWC
Babel·Terser의 트랜스파일링과 코드 경량화 역할, Rust 기반 SWC의 동작 원리를 설명했습니다. Next.js 실험으로 SWC의 빌드 시간 단축 효과와 플러그인 호환성 제약을 확인했습니다.
#JavaScript#Next.js
000
초보 웹 개발자를 위한 자바스크립트 빌드 툴과 SWC
초보 웹 개발자를 위한 자바스크립트 빌드 툴과 SWC
Babel과 Terser의 트랜스파일링·코드 경량화 역할을 초보자 관점에서 설명했습니다. Next.js의 SWC가 반복 빌드 시간을 줄일 수 있는 배경을 소개했습니다.
#JavaScript#Next.js
2400
카카오웹툰은 CSS를 어떻게 작성하고 있을까?
카카오웹툰은 CSS-in-JS와 CSS Module의 특성을 비교하고 라우팅 성능을 측정했습니다. CSS Module을 기반으로 Tailwind를 병행하되 동적 영역은 CSS Module로 보완했습니다.
#CSS#CSS-in-JS
000
카카오웹툰은 CSS를 어떻게 작성하고 있을까?
카카오웹툰은 CSS를 어떻게 작성하고 있을까?
카카오웹툰 같은 복잡한 서비스에서 CSS-in-JS와 CSS Module의 특성을 비교했습니다. 개발 협업 방식과 런타임 파싱 비용을 고려한 성능 측정 방법을 소개합니다.
#CSS#CSS-in-JS
4100
사용자 경험과 성능 개선 방법 in 카카오웹툰
카카오웹툰의 SSR 캐싱, CDN, 지연 로딩 기반 성능 개선 사례를 소개했습니다.\n로딩 쉬머와 이벤트·애니메이션 최적화, 라이트 모드로 UX를 보완했습니다.
#Next.js#SSR
000
쿠팡 파트너스
개발자를 위한 서적을 확인해 보세요
이 게시물은 쿠팡 파트너스 활동의 일환으로, 이에 따른 일정액의 수수료를 제공받습니다.
#개발서적#프로그래밍
사용자 경험과 성능 개선 방법 in 카카오웹툰
사용자 경험과 성능 개선 방법 in 카카오웹툰
카카오웹툰의 SSR 캐싱, 리소스 최적화, 지연 로딩 기반 성능 개선 사례를 소개했습니다. 로딩 체감, 인터랙션, 저사양 환경까지 고려한 UX 트레이드오프를 설명합니다.
#Next.js#SSR
3000
React 리팩토링, 10년 넘은 리디북스 웹도 OK
리디북스 웹의 이기종 기술 스택을 React와 Next.js 중심으로 점진 리팩토링했습니다.\nSSR·캐싱·자동화 배포와 컴포넌트 일반화로 성능 및 유지보수성을 높였습니다.
#React#Next.js
4000
프론트엔드와 THE TWELVE-FACTOR APP
프론트엔드와 THE TWELVE-FACTOR APP
Next.js 서비스 운영에 12Factor 원칙을 적용하는 방법을 코드베이스부터 배포까지 설명했습니다. 런타임 설정과 Docker Artifact로 환경 독립성과 배포 효율을 높였습니다.
#Next.js#12Factor
1900
cypress를 이용하여 components test 작성하기
Cypress로 Next.js 컴포넌트 테스트 환경을 구성하고 Todo List 렌더링을 검증했습니다.\n관심사 분리, fixtures, stub을 활용한 컴포넌트 리팩터링 과정을 소개합니다.
#Cypress#Next.js
2600
Yarn Workspace를 이용한 Monorepo 구성
Next.js 기반 학생·강사 서비스의 공통 컴포넌트 공유를 위해 Yarn Workspace Monorepo를 구성했습니다. 외부 트랜스파일과 React 중복 문제를 해결하고 의존성과 실행 명령을 루트에서 관리했습니다.
#Yarn Workspace#monorepo
2100