Web (2) 썸네일형 리스트형 [Web] 다국어 웹(i18n Web) 개발하기 1. 개요웹 애플리케이션을 다국어로 제공하는 것은 글로벌 사용자 경험을 고려할 때 필수적인 요소다.이번 프로젝트에서는 i18next 라이브러리를 기반으로 React 앱에서 다국어 전환 기능을 구현하였다. 사용자가 명시적으로 언어를 선택하지 않아도 기본 언어를 자동 인식하고, 사용자가 클릭 한 번으로 언어를 즉시 전환할 수 있도록 useLanguage 라는 사용자 정의 훅(Custom Hook) 을 설계하였다.이 포스팅에서는 지난 포스팅에 이어 해당 사용자 정의 훅의 구조와 구현 방식, 그리고 실제로 어떻게 활용했는지에 대해 정리해보려고 한다.2. 사용자 정의 훅React에는 상태 관리와 생명주기 처리를 보다 선언적으로 구현할 수 있도록 도와주는 훅(Hook) 이라는 개념이 존재한다. useState, u.. [Web] Responsive Web (반응형 웹) 개발하기 1. 개요웹 프론트를 구현함에 있어 반응형 디자인은 다양한 디바이스 환경에서도 일관된 사용자 경험을 제공하기 위해 꼭 필요한 요소라고 할 수 있다. 진행 중인 웹 프로젝트에서 PC, 태블릿, 모바일 사용자 모두에게 최적화된 화면을 제공하고자 반응형 구현에 대해 많은 고민을 하게 되었다.단순히 CSS 미디어 쿼리만으로 해결할 수 있는 영역도 있지만, 때로는 자바스크립트 로직으로 화면 크기를 동적으로 처리해야 하는 상황도 발생한다. 이에 따라 useResponsive 라는 사용자 정의 훅(Custom Hook) 을 직접 만들어 화면 정보를 추적하고, 이를 기반으로 컴포넌트의 동작을 제어할 수 있도록 구성하였다.이 포스팅에서는 해당 사용자 정의 훅의 구조와 구현 방식, 그리고 실제로 어떻게 활용했는지에 대해 .. 이전 1 다음