필터 1
GraphQL 커스텀 디렉티브로 만드는 선언적 지연 로딩
크리에이트립
프론트엔드

GraphQL 커스텀 디렉티브로 만드는 선언적 지연 로딩

SSR에서 개인화 필드 동기화와 중복 요청 문제를 GraphQL 커스텀 디렉티브로 해결한 사례를 소개했습니다.\n`@lazy`로 필요한 필드만 재조회해 네트워크 비용을 줄이고 개발자 경험을 개선했습니다.

#GraphQL#Apollo Client
68005분
카카오 AI 앰배서더를 공개 모집합니다.
카카오
기타

카카오 AI 앰배서더를 공개 모집합니다.

X

#Kakao#SSR
116005분
Next.js ISR 전환과 Redis 외부 캐싱 (SSR 지옥 탈출기 시리즈 1)
카카오
기타

Next.js ISR 전환과 Redis 외부 캐싱 (SSR 지옥 탈출기 시리즈 1)

X

#Next.js#ISR
152005분
Next.js SSR 서버를 위한 모니터링 시스템 구축 (SSR 지옥 탈출기 시리즈 2)
카카오
기타

Next.js SSR 서버를 위한 모니터링 시스템 구축 (SSR 지옥 탈출기 시리즈 2)

X

#Next.js#SSR
56005분
Next.js 개발 중 마주한 Hydration Error와 원인
여기어때
프론트엔드

Next.js 개발 중 마주한 Hydration Error와 원인

Next.js SSR 환경에서 Hydration Error가 발생한 원인과 점검 방법을 정리했습니다. dayjs locale 불일치로 서버와 클라이언트 렌더 결과가 달라진 사례를 설명했습니다.

#Next.js#React
137005분
React Server Component와 Streaming으로 웹 성능 극대화하기: Next.js 실전 가이드
뤼이드
프론트엔드

React Server Component와 Streaming으로 웹 성능 극대화하기: Next.js 실전 가이드

Next.js App Router에서 React Server Components와 Streaming을 활용해 데이터 패칭 패턴을 비교했습니다. loading.tsx와 Suspense, use 훅으로 체감 속도와 로딩 시간을 함께 개선하는 방법을 설명했습니다.

#React#Next.js
215005분
Next.js 트러블슈팅: CORS와 Version Skew 에러 원인부터 해결까지
카카오페이
프론트엔드

Next.js 트러블슈팅: CORS와 Version Skew 에러 원인부터 해결까지

Next.js SSR 서비스에서 발생한 CORS와 Version Skew 장애의 원인과 해결 과정을 정리했습니다. SessionStorage 저장, dynamic import, 배포 전략 개선으로 문제를 완화했습니다.

#Next.js#CORS
133005분
신세계백화점 PC 메인 React 전환기
SSG.COM
프론트엔드

신세계백화점 PC 메인 React 전환기

신세계백화점 PC 메인 페이지를 Spring에서 React와 Next.js 기반으로 전환했습니다.\n초기 로딩, 인피니트 스크롤, SEO까지 함께 고려해 사용자 경험과 유지보수성을 개선했습니다.

#React#Next.js
243005분
마이리얼트립 SSR 최적화
마이리얼트립
프론트엔드

마이리얼트립 SSR 최적화

SSR 도입 후 발생한 중복 API 호출과 성능 저하의 원인을 분석하고 구조를 개선한 사례를 다뤘습니다. queryKey 통일, 캐시 설정, 메서드 선택으로 FCP와 LCP를 크게 개선했습니다.

#Next.js#React
71005분
왜 왓챠 웹은 Remix로 마이그레이션했을까?
watcha
프론트엔드

왜 왓챠 웹은 Remix로 마이그레이션했을까?

왓챠 웹이 기존 react + express 구조에서 Remix로 마이그레이션한 이유와 과정을 정리했습니다. 점진적 전환, 라우팅 분기, 컴포넌트 분리와 같은 운영 전략도 함께 공유했습니다.

#Remix#React
330005분
Next.js Server Action과 프론트엔드 보안
QueryPie
프론트엔드

Next.js Server Action과 프론트엔드 보안

Next.js Server Action의 내부 동작과 보안 주의점을 설명했습니다. 편의성 뒤에 있는 인증·인가, 입력 검증, 인젝션 방지 책임을 강조했습니다.

#Next.js#React
12005분
Next.js Server Action과 프론트엔드 보안
QueryPie
프론트엔드

Next.js Server Action과 프론트엔드 보안

Next.js Server Action의 동작 방식과 기본 보안 메커니즘을 설명했습니다. 편의성 뒤에 숨은 인증·인가, 입력 검증, SSRF 등 보안 책임을 강조했습니다.

#Next.js#React
18005분