전체 글9 JavaScript Object 대신 Map을 사용해보자 JavaScript에서 데이터를 키-값 형태로 저장해야 할 때, 대부분의 개발자들은 가장 먼저 Object를 떠올립니다. 중괄호 {}를 이용한 간편한 문법 덕분에 오랜 시간 동안 표준처럼 사용되어 왔죠. 하지만 ES6 이후 등장한 Map 객체는 Object의 대체재로 주목받고 있으며, 다양한 책과 문서에서는 Map의 사용을 권장하고 있습니다. 그렇다면 왜 Object 대신 Map을 사용해야 할까요? 그리고 두 자료구조는 어떤 차이점을 가지고 있을까요?Object와 Map의 기본 구조먼저 기본적인 사용법을 비교해보면 다음과 같습니다.// Objectconst obj = {};obj["key"] = "value";// Mapconst map = new Map();map.set("key", "value");겉.. 2025. 4. 1. Recoilatom부터 selectorFamily까지, 상태 관리를 쉽게 이해해보자 Recoil atom부터 selectorFamily까지, 상태 관리를 쉽게 이해해보자React에서 상태 관리 라이브러리를 고민하고 있다면, Recoil을 들어봤을 거예요. Recoil은 Facebook에서 만든 상태 관리 라이브러리로, atom과 selector를 기반으로 간단하고 명확한 상태 흐름을 만들어줍니다.이 글에서는 Recoil의 핵심 개념인 atom, selector, selectorFamily, atomFamily에 대해 차근차근 설명하고, 어떤 상황에서 어떻게 쓰는 것이 좋은지도 함께 살펴봅니다.🟡 atom: 상태의 최소 단위atom은 Recoil에서 가장 기본적인 상태 단위입니다. React의 useState처럼 쓰되, 전역에서 공유할 수 있다는 차이점이 있어요.import { atom.. 2025. 3. 29. GraphQL 고민된다면, 사용하지 마세요 프론트엔드 기술은 빠르게 변화하고 있습니다. React만 봐도 상태 관리 라이브러리가 계속 등장하며, 이 기술을 썼다가 저 기술로 바꾸는 일이 빈번합니다. 결국 과도기에 이도 저도 아닌 코드들이 남아, 유지보수가 어려워지는 문제가 생깁니다. GraphQL도 마찬가지입니다. 새로운 기술을 도입할 때는 신중해야 합니다.저는 프론트엔드 개발자로서 최근 Next.js + GraphQL 조합을 사용하는 오픈한 지 얼마 안 된 서비스에 투입되었습니다. 문제는 GraphQL을 도입한 명확한 이유나 가이드 없이 사용되고 있다는 점이었습니다. 새로운 기술은 문제를 해결하기 위해 도입해야 하는데, 단순히 신기술이라는 이유로 도입하면 예상치 못한 기술적 부채를 떠안게 됩니다.GraphQL, 정말 필요할까?이 프로젝트의 백엔.. 2025. 3. 18. Caching in Next.js (App Router) 들어가며Next.js의 App Router는 다양한 캐싱 전략을 제공하여 성능을 최적화합니다. 이 글에서는 Nextjs 공식 문서의 caching 문서 내용을 바탕으로 Request Memoization(요청 메모이제이션), Data Cache(데이터 캐시), Full Route Cache(전체 경로 캐시), 그리고 Client-side Router Cache(클라이언트 측 라우터 캐시)의 동작 원리와 활용 방법을 상세히 설명합니다.14버전 기준의 공식 문서를 기반으로 작성했으며 15버전과 다를수 있으니 자세한 내용은 공식 문서를 참고해보시면 좋을 것 같습니다. Overview매커니즘설명위치목적지속시간Request Memoization함수의 반환 값서버React 컴포넌트 트리에서 데이터를 재사용요청당.. 2025. 3. 10. [MHW Overlay] 몬헌와일즈 딜미터기(보스HP) 모드 들어가며※ 주의MHW Overlay는 보스의 HP, 누적 데미지, 플레이어의 DPS 정보 등 게임에서 정식으로 제공하고 있지 않은 정보를 알려주는 Mod 입니다.Mod는 나 또는 다른 멀티 플레이어의 흥미를 깨드릴 수 있으며, Capcom은 Overaly Mod에 대해 공식적인 입장을 내놓은 바는 없는 것으로 알고 있지만, 사용할지 말지에 대한 판단과 그에 대한 책임은 본인이 지셔야 합니다.설치 방법1. 파일 다운로드MH Wilds Overlay 를 설치하기 위해서는 의존성 모드를 먼저 설치해야합니다.Nexus 회원 가입이 필요합니다. 회원가입 후 아래 파일을 모두 다운받습니다.https://www.nexusmods.com/monsterhunterwilds/mods/93 REFrameworkModding.. 2025. 3. 9. Git 워킹 브랜치 전략: Long Running Strategy 1. 워킹 브랜치 전략이란?Git에서 워킹 브랜치(Working Branch) 전략은 특정 작업을 분리하여 장기간 유지하면서 개발하는 브랜치 전략을 의미합니다. 이는 특히 다음과 같은 상황에서 유용합니다:업무가 여러 개일 때: 배포 일정이 확정되지 않았거나 프로토타입을 진행해야 할 경우, 실서비스 코드에서 격리하여 안정적으로 개발할 수 있습니다.업무가 클 때: 대규모 기능을 개발할 때 작업 단위를 나누어 코드 리뷰와 협업을 용이하게 할 수 있습니다.이 전략을 활용하면 장기간 유지해야 하는 개발 작업을 효과적으로 관리하고, 배포 시의 리스크를 줄이는 데 도움이 됩니다.2. 기존 브랜치 전략과 문제점일반적으로 Git 브랜치는 정적 구조로 운영됩니다. 간단한 예시로 다음과 같은 브랜치 전략을 생각해볼 수 있습.. 2025. 3. 8. 이전 1 2 다음