Frontend

22개의 포스트

/ Frontend

Astro vs Next.js: 블로그를 마이그레이션하며 느낀 차이

Next.js에서 Astro로 블로그를 옮기며 체감한 두 프레임워크의 철학 차이. 렌더링, 라우팅, 데이터 페칭까지 코드로 비교합니다.

/ Frontend

AbortController, fetch 취소부터 React cleanup까지

fetch 취소부터 이벤트 리스너 정리, 타임아웃, React cleanup까지. abort() 하나로 비동기 작업의 시작과 정리를 묶는 패턴을 정리합니다.

/ Frontend

useCallback, useMemo, React.memo: 언제 쓰고 언제 버려야 할까

세 가지 메모이제이션 도구의 정확한 역할과 관계, 흔한 실수, 그리고 React Compiler 시대의 새로운 접근법.

/ Frontend

React Element 참조로 이해하는 리렌더링

React.memo를 파고 들어가니 Element 참조라는 개념이 나왔습니다.

/ Frontend

React 상태 관리 라이브러리 Zustand, Jotai, Redux Toolkit 비교

세 라이브러리의 설계 철학, 구독 방식, 확장 전략을 비교하고 선택 기준을 정리합니다.

/ Frontend

asChild 패턴에 대한 생각: Composition이 답인가?

Radix UI의 asChild/Slot 패턴을 실무에 적용하면서 느낀 점과 2026년 컴포넌트 설계 트렌드

/ Frontend

무한 스크롤 성능 최적화: Virtual Windowing 도입기

O(n)을 O(1)로 개선한 Virtual Windowing 실전 적용 경험

/ Frontend

React 제어 컴포넌트 vs 비제어 컴포넌트

입력 필드 하나 때문에 화면이 버벅거린 경험에서 시작된, 제어 컴포넌트와 비제어 컴포넌트에 대한 고민 기록

/ Frontend

FSD 도입기: 같은 아키텍처, 다른 결과

도메인이 얕으면 짐이 되고, 깊으면 빛을 발한다.

/ Frontend

Route Handlers vs tRPC: 타입 안전한 API를 만드는 두 가지 방법

as 타입 단언이 불안했던 경험에서 시작해, Route Handlers와 tRPC를 비교합니다.

/ Frontend

Hook vs HoC vs Props: 선택 기준에 대한 고민

'어떻게'보다 '왜'에 집중하며, 실무에서 마주한 트레이드오프를 공유합니다.

/ Frontend

React useEffect의 오해: 초기화가 아닌 동기화 도구

useEffect를 '초기화 도구'로 오해하면 불필요한 재렌더링이 발생합니다. React가 설계한 진짜 목적, 올바른 사용법, 그리고 실무에서 고려해야 할 트레이드오프를 알아봅니다.

/ Frontend

Next.js App Router 환경에서의 i18n Provider 구현: 깜빡임과 Race Condition 해결

Server Component 패턴으로 UX 개선과 동시성 이슈를 해결하는 방법을 인터랙티브 데모로 설명합니다.

/ Frontend

이벤트 기반 아키텍처 (EDA) 활용해보기

클릭 이벤트부터 컴포넌트 간 느슨한 결합까지, 복잡한 의존성을 해결하는 방법을 장바구니 예시로 알아봅니다.

/ Frontend

React 함수형 생명주기

React 18 공식 문서를 바탕으로 함수형 컴포넌트 생명주기와 훅 타이밍을 정리합니다.

/ Frontend

atomWithHash로 URL 기반 페이지네이션 구현하기

Jotai의 atomWithHash를 이용하여 페이지네이션을 구현해봅시다.

/ Frontend

Giscus 이용하여 내 깃허브 블로그에 댓글 기능 추가하기

Giscus 를 이용하여 깃허브 블로그에 댓글 기능을 추가해봅시다.

/ Frontend

Suspense와 Skeleton UI 제대로 이해하고 적용하기

Suspense의 작동 원리부터 클라이언트 컴포넌트에서의 올바른 스켈레톤 UI 구현까지

/ Frontend

next-themes 를 이용하여 Dark Mode 적용하기

오늘은 TODO List 에 작성한 목록 중 하나인 시스템 모드에 따라 다크모드/라이트모드 전환 을 적용해보려고 합니다.

/ Frontend

Favicon 적용하기

Favicon 을 적용하기전 초라한(?) 나의 홈페이지 아이콘. 아직 미완성인 사이트 인것 같아보이네요. 그래서, 지금 사용중인 깃허브 블로그에 Favicon 을 적용해보았습니다.

/ Frontend

React 가 사랑받는 이유?

React가 사랑받는 이유, 그리고 많이 쓰이는 이유에 대해 개인적인 견해를 가득 담아 정리해보았습니다.

/ Frontend

Pinia 사용해보기

이제는 Pinia 사용해요.