AI Briefing#nextjs
#nextjs와 관련된 AI·개발 뉴스를 최신순으로 모았습니다. 원문 출처와 한국어 요약을 함께 확인할 수 있습니다.
#nextjs와 관련된 AI·개발 뉴스를 최신순으로 모았습니다. 원문 출처와 한국어 요약을 함께 확인할 수 있습니다.
Monorepo와 GitOps를 결합해 FE 개발부터 배포까지 컨테이너 기반으로 통합했다.
인프런은 @vercel/og와 CDN을 활용해 콘텐츠별 맞춤형 OG 이미지를 동적으로 생성하고 캐싱하는 시스템을 구축했다.
올리브영 프론트엔드 팀이 Next.js 마이그레이션 중 겪은 Mocking 이슈와 MSW 도입 배경을 설명한다.
React Query의 useInfiniteQuery와 Intersection Observer를 사용하여 효율적인 무한 스크롤을 구현하는 방법을 소개한다.
올리브영의 직무 전환 프로그램인 '잡 챌린지'를 통해 프론트엔드 개발자로 성장한 신입 개발자의 여정을 공유한다.
Next.js의 standalone 옵션을 적용하여 랠릿의 Docker 이미지 크기를 줄이고 배포 시간을 단축했다.
비개발자의 Git 진입장벽을 낮추기 위해 S3와 Git을 결합한 사운드 리소스 전달 WebApp 'Sonic'을 개발했다.
카카오 FE 플랫폼 팀이 이미지 지연 로드와 Windowing 기법을 적용해 주문하기 서비스의 성능 점수를 20점에서 90점으로 개선했다.
Next/image 컴포넌트의 동작 원리와 캐싱 메커니즘, 그리고 Sharp 라이브러리 권장 이유를 분석한다.
Replit Bounties를 활용해 단 1주일 만에 $600의 비용으로 웹 앱 프로토타입을 구축한 사례를 소개한다.
크롬과 사파리의 캐시 정책으로 인해 GET Fetch 요청 시 CORS 헤더 누락으로 에러가 발생하며, 전역 임포트나 crossorigin 속성 추가로 해결할 수 있다.
구글 서치 콘솔 등록부터 사이트맵, robots.txt, 메타데이터, 중복 URL 해결, 성능 최적화까지 7단계 절차 제시
컬리가 Next.js 기반 'NX' 프로젝트를 통해 레거시 시스템을 탈피하고 상품상세 LCP를 3.4초에서 1.5초로 개선했다.
홈 이미지 총용량이 25MB에서 589KB로 줄고, 페이지 로드 시간이 1.11초에서 386ms로 단축됨
AssemblyAI API와 Next.js, Replit을 활용해 파일 업로드 기반의 Speech-to-Text 앱을 구축하는 방법을 다룬다.
실제 테스트 결과 프로젝트 규모와 환경에 따라 빌드 속도가 20~74%까지 향상됨을 확인했다.
뱅크샐러드 EM이 마이데이터 프로젝트에서 겪은 우선순위 설정, 기술 도입, 협업 방식의 경험과 회고를 공유했다.
카카오웹툰이 SSR 캐싱 적용으로 TPS와 응답 시간을 수십 배 개선하고, 로딩 시머와 패시브 이벤트 리스너 등을 통해 사용자 경험을 향상한 프론트엔드 최적화 사례를 공개했다.
카카오엔터테인먼트 FE 개발팀이 Next.js 서비스에 12-Factor App 원칙을 적용하여 배포 시간을 15분에서 1분으로 단축하고, async_hooks를 활용해 요청 단위 로그 추적을 구현했다.
Replit이 React 프레임워크 개발 환경의 속도를 높이기 위해 컨테이너를 미리 실행해 두는 Preboot 기술을 도입했다.