
FE News 24년 12월 마지막 소식을 전해드립니다!
FE News 24년 12월 프런트엔드 소식을 정리한 큐레이션 글입니다. 설문 보고서, Web AI, Next.js self-hosting, 밋업 공개 소식을 담았습니다.

FE News 24년 12월 프런트엔드 소식을 정리한 큐레이션 글입니다. 설문 보고서, Web AI, Next.js self-hosting, 밋업 공개 소식을 담았습니다.

토스 면접관이 채용에서 보는 기준과 실질적인 팁을 공유했습니다. 기술 사용 경험보다 왜 그 기술을 선택했는지 설명하는 점을 강조했습니다.

프론트엔드 토큰 인증에서 localStorage 대신 쿠키 기반 관리와 보안 속성 설정을 권장했습니다. XSS·CSRF 위험을 줄이기 위해 토큰 로테이션과 Refresh Token도 함께 제안했습니다.

프론트엔드 토큰 인증에서 Web Storage와 직접 토큰 주입 방식의 위험성을 짚었습니다. 쿠키 기반 관리와 토큰 로테이션으로 보안을 높이는 방법을 소개했습니다.

부서 내 효율적 협업을 위해 Next.js 기반 Playground를 개발한 경험을 공유했습니다. 동료들과의 소통과 협업을 돕는 도구 구축 사례를 다뤘습니다.

FE News 24년 11월 소식으로 ViteConf, Next.js Conf, 번들러 영상, Node.js와 Bun 벤치마크를 소개했습니다. 네이버 FE 엔지니어들이 매월 엄선한 기술 소식 공유 프로젝트도 함께 안내했습니다.


Next.js 기획전 개편에서 HTML 모듈 사이에 기존 상품 카드를 삽입하는 방법을 다뤘습니다. createRoot와 provider 중복 사용의 성능 영향을 측정해 설계 타당성을 검증했습니다.

프론트엔드에서 프레임워크와 라이브러리의 차이, 그리고 실제 업무에서의 활용 기준을 다뤘습니다. Next.js를 포함한 여러 프레임워크를 언제 써야 할지에 대한 관점을 소개했습니다.
쿠팡 파트너스
이 게시물은 쿠팡 파트너스 활동의 일환으로, 이에 따른 일정액의 수수료를 제공받습니다.

24년 10월 FE 뉴스에서 프론트엔드 관련 기술 소식을 큐레이션해 소개했습니다. 프레임워크 비교, JavaScript Generator, 코드 탐색 도구 등 다양한 주제를 다뤘습니다.


웹 기반 게임 Admin의 gRPC 통신에서 FE와 BE용 API 중복 구현 문제를 Proxy로 해결한 사례를 소개했습니다. 코드 생성 결과를 JSON 메타데이터로 바꿔 부팅 부담도 줄였습니다.


어학당 홈의 SEO 개선을 위해 성능 최적화 작업을 진행했습니다. 부분 CSR, 코드 스플리팅, 레이지 로드, 서드파티 스크립트 최적화로 지표를 개선했습니다.


SSR이 SEO에 유리한 이유를 크롤링·인덱싱·랭킹 관점에서 설명했습니다. 다만 서비스 성격과 검색 엔진 특성에 따라 CSR도 충분할 수 있으며, SEO는 렌더링 방식 외 요소까지 함께 봐야 합니다.

웹 서비스 규모가 커지며 Redux 전역 관리의 한계를 줄이기 위해 상태를 유형별로 분리한 사례를 소개했습니다. 추적이 불필요한 값은 파일 변수로 관리하고, SSG와 하드 네비게이션 제약도 함께 설명했습니다.


무한 스크롤 피드에서 DOM 증가로 인한 성능 저하를 해결하기 위해 가상화를 도입했습니다.\n동적 높이와 스크롤 복원을 고려해 react-virtuoso를 선택하고 직접 복원 로직도 구현했습니다.