React에서 서버 데이터를 최신으로 관리하기(React Query, SWR)
SWR과 React Query로 서버 상태를 Redux의 전역 상태와 분리하는 방식을 설명했습니다. 조건부 요청, 캐시 갱신, 재검증 옵션과 두 라이브러리의 사용 차이를 비교했습니다.
#React#SWR
000
국내 IT 기업 기술 블로그 최신 글
새로운 기술 블로그가 추가되었어요
필터 1
React에서 서버 데이터를 최신으로 관리하기(React Query, SWR)
React에서 서버 데이터를 최신으로 관리하기(React Query, SWR)
SWR과 React Query로 서버 상태를 선언적으로 관리하는 방식을 비교했습니다. 조건부 요청, 캐시 갱신, 재검증 옵션의 차이를 정리했습니다.
#React#SWR
3900
프론트엔드 테스트 팁
유닛·통합·E2E 테스트의 역할과 비즈레버 프론트엔드 적용 사례를 설명했습니다. Cypress의 실행 성능 문제와 React Testing Library·Jest 활용 팁을 공유합니다.
#React#Cypress
3000
E2E Test를 Cypress로 해보자.
React 카운터를 대상으로 Cypress 설치부터 data-cy 기반 요소 선택과 클릭 검증까지 소개했습니다.\n브라우저 E2E 테스트와 Jest 단위 테스트를 분리하는 전략을 검토했습니다.
#Cypress#React
2600
StoryBook을
React 컴포넌트의 다양한 초기 상태를 Storybook 스토리로 분리해 한 번에 확인하는 방식을 소개했습니다.\nUI 협업과 QA에 유용하지만 엣지 케이스 작성·유지 비용과 디자인 협업이 필요합니다.
#Storybook#React
2000
리액트로 만든 게임에 사운드 추가하기
Safari에서 반복 재생되지 않고 지연되던 React 게임 효과음 문제를 다뤘습니다. Web Audio API로 사전 디코딩·재생해 호환성과 반응성을 개선했습니다.
#React#Web Audio API
000
리액트로 만든 게임에 사운드 추가하기
리액트로 만든 게임에 사운드 추가하기
Safari의 `<audio>` 중복 재생 문제와 효과음 지연을 Web Audio API로 해결했습니다. 사전 디코딩한 오디오 버퍼로 빠르고 안정적인 게임 사운드를 구현했습니다.
#React#Web Audio API
3600
React 18 에서 추가된 기능
React 18의 동시 렌더링, automatic batching, startTransition 등 주요 추가 기능을 소개했습니다. Suspense로 데이터 로딩 상태와 UI 표시 순서를 분리하는 방식을 설명합니다.
#React#Suspense
1900
쿠팡 파트너스
개발자를 위한 서적을 확인해 보세요
이 게시물은 쿠팡 파트너스 활동의 일환으로, 이에 따른 일정액의 수수료를 제공받습니다.
#개발서적#프로그래밍
카카오웹툰은 GitHub Actions를 어떻게 사용하고 있을까?
카카오웹툰은 GitHub Actions를 어떻게 사용하고 있을까?
GitHub Actions로 React 프로젝트의 검사와 빌드를 자동화하고 의존성 캐시를 적용했습니다. Composite Action과 Secrets로 Slack 알림 및 배포 브랜치 규칙을 구성했습니다.
#GitHub Actions#CI/CD
3900
우리는 왜 공통 라이브러리를 만들기 시작했나
반복 구현을 줄이고 기술 표준을 만들기 위해 공통 라이브러리 도입 배경과 기준을 정리했습니다. Lerna 모노레포와 npm으로 add-separator를 배포하고 문서화·리뷰·테스트 원칙을 세웠습니다.
#React#Lerna
000
우리는 왜 공통 라이브러리를 만들기 시작했나
반복 개발을 줄이기 위해 외부 라이브러리와 내부 공통 라이브러리의 선택 기준을 정리했습니다. Lerna 모노레포와 TDD로 숫자 구분자 패키지를 구현하고 신뢰 원칙을 세웠습니다.
#React#Lerna
2700
React Query와 함께하는 API 에러 처리 설계하기
React Query의 onError와 useApiError Hook으로 API 에러 처리 흐름을 중앙화했습니다. HTTP 상태·서비스 코드별 우선순위로 전역 규칙과 컴포넌트 예외를 함께 관리합니다.
#React#React Query
000
React 리팩토링, 10년 넘은 리디북스 웹도 OK
리디북스 웹의 이기종 기술 스택을 React와 Next.js 중심으로 점진 리팩토링했습니다.\nSSR·캐싱·자동화 배포와 컴포넌트 일반화로 성능 및 유지보수성을 높였습니다.
#React#Next.js
4000
Suspense와 선언적으로 Data fetching처리
사이트 개편에서 react-query를 도입한 경험을 다룹니다. Suspense 기반의 선언적 데이터 페칭 처리를 소개합니다.
#React#react-query
000