본문 바로가기
728x90

fe45

검색 파라미터 🔍 검색 파라미터는 사실상 UI 상태를 직렬화한 표현이다.예를 들어, 사용자가 상품 목록을 보고 있을 때 필터: filter=active 정렬: sort=asc 페이지네이션: page=2 이 값들이 URL에 들어가면 아래와 같은 장점이 생긴다. 브라우저 히스토리 지원: 뒤/앞으로 가기 시 동일한 상태를 복원할 수 있다.딥링크 가능: 특정 상태를 URL로 공유하면 다른 사용자가 동일한 화면을 볼 수 있다.공유 가능: URL을 복사하여 다른 사용자에게 보내면 동일한 필터와 정렬 상태가 유지된다. 왜 대부분의 앱은 문자열 파싱에 의존할까? window.location.search나 URLSearchParams로 접근하는 방식이 대부분이다.이 방식은 단순하지만 한계/문제가 있다. 타입 안전성 부족 모든 값이 문.. 2025. 12. 15.
5가지 노드 버전 관리자 비교 현재 기준, 많이 사용되거나 한 번쯤 들어봤을 노드 버전 관리자 NVM (Node Version Manager) N FNM (Fast Node Manager) PNPM Volta 내가 프로젝트 도중 투입이 되어 GIT에서 코드를 PULL 받고 실행해보려고 하는데 Node 버전 관련해서 오류가 뜨면서 실행하는 데 오래걸렸던 기억이 있다. 이유는 Node 버전이 안맞아서 (내가 낮은 버전을 사용하고 있어서) 그런거였는데 사소한 거지만 개발하는데 귀찮은 요소 중 하나이긴 하다. 검색을 하다 노드 버전 관리자를 알게 되었는데 Node.js의 버전을 쉽게 전환할 수 있도록 도와주는 셸 도구이다.그때에만 해도 NVM만 알고 있었지 이렇게 많은 종류가 있는지는 PNPM으로 프로젝트를 작업하게 된 후 알게 되어 이 .. 2025. 12. 4.
아이콘 현지화 (localization) 각 나라마다 제스처가 다른 의미를 가질 수 있다. 예를 들면, 손을 흔드는 행위 👋🏻 즉, 안녕/잘가의 의미인 이 제스처는 대부분의 나라에서는 인사의 제스처로 통하지만 그리스와 나이지리아, 인도에서는 모욕적인 의미와 경고/주의, 그리고 상대를 내쫓는 의미를 담고 있다. 문화적 차이처럼, 시각적 상징이 지역마다 전혀 다른 의미를 가질 수 있다.즉, 단순한 아이콘조차 국가/문화에 따라 인사 -> 모욕 -> 추방의 의미까지 바뀔 수 있다. 이렇게 되면 사업을 하는 사람이면 수입이 감소할 것이고, 국가적인 행사라면 국가의 체면이 깎이게 될 것이다. 언어나 행동, 텍스트, 번역 등은 그나마 신경쓰고 있지만, 아이콘은 이들보다 훨씬 간과된다.하지만, 아이콘이야 말로 사용자 경험과 브랜드 인식에 매우 큰 영향.. 2025. 12. 2.
논리 할당 연산자 논리 연산자 (||, &&, ?)와 할당 연산자 (=)가 합쳐진 단축 표현이다.왼쪽 피연산자 (operand)가 논리 테스트에 실패한 경우 (false, true, null인 경우에만) 오른쪽 피연산자가 평가된다.이 기능은 ES2021에서 등장한 기능이다. ⚠️ 단, 옵셔널 체이닝(?.)은 논리 왼쪽 피연산자에 사용할 수 없다. 구문 오류 발생user?.settings ||= {} // X Syntax Error 옵셔널 체이닝은 속성 자체에 대한 참조가 아닌 속성 액세스의 결과를 반환 (할당 대상은 참조(즉, 변수 또는 객체 속성)여야 하므로 유효한 자바스크립트 구문이 아니다.) 논리 OR 할당 (||=)user.settings ||= {}If (!user.settings) { user.settings.. 2025. 11. 20.
728x90