[React] Zustand로 상태관리하기
·
JavaScript/React
Redux보다 가볍고, Context보다 편한 상태관리 솔루션Zustand란 무엇인가?Zustand는 독일어로 “상태(state)”라는 뜻입니다.React에서 상태를 효율적으로 관리할 수 있도록 만든 매우 작고 단순한 상태 관리 라이브러리입니다.만든 사람: Poimandres 팀, react-three-fiber나 valtio 만든 그 팀파일 크기: 1KB 미만 (gzip)의존성: 없음, 외부 라이브러리에 전혀 의존하지 않음훅 기반 API 사용: useStore() 하나로 상태를 가져오고 업데이트까지 함왜 Zustand를 쓰는가?Redux보다보일러플레이트가 거의 없음리듀서, 액션, 디스패치 안 써도 됨상태 선언과 사용이 같은 파일에서 가능Context보다불필요한 리렌더링이 없다Context API는 상태..
[etc] 제내디 코로케비치 (Gennady Korotkevich)
·
etc
제내디 코로케비치는 누구인가?제내디 코로케비치 (Gennady Korotkevich), 또는 경쟁 프로그래밍 세계에서는 잘 알려진 핸들인 "tourist" 로 더 유명합니다.국적: 벨라루스생년월일: 1994년 9월 25일활동 분야: 경쟁 프로그래밍, 알고리즘, 수학사용 플랫폼: Codeforces, TopCoder, AtCoder, Facebook Hacker Cup, Google Code Jam 등그는 단순히 잘하는 수준이 아니라, 경쟁 프로그래밍 역사상 가장 뛰어난 인물이라는 평가를 받고 있습니다. 어린 시절부터 세계 정상까지코로케비치는 6살에 프로그래밍을 시작했고,11살에 국제 대회 수상을 하기 시작했습니다.12살: 국제 정보 올림피아드(IOI) 벨라루스 국가대표14살: IOI 은메달15~17살: ..
[JavaScript] V8 JavaScript 엔진
·
JavaScript
V8 엔진이란?V8은 Google에서 만든 오픈소스 자바스크립트 엔진입니다.원래는 Google Chrome 브라우저의 자바스크립트 실행 엔진으로 개발되었지만, 현재는 Node.js 등 다양한 런타임 환경에서도 사용됩니다. 핵심 특징C++로 작성됨인터프리터 + JIT 컴파일 방식빠른 실행 속도메모리 효율성 개선 왜 V8이 중요한가?과거 자바스크립트는 "브라우저에서만 동작하는 느린 언어"였습니다.하지만 V8이 등장하면서 자바스크립트를 고성능 애플리케이션 개발 언어로 탈바꿈시켰습니다.V8이 없었다면 Node.js도 없었고,React, Vue, Angular도 지금처럼 빠를 수 없었고,브라우저는 느린 UI 처리로 불편했을 것입니다.즉, 현대 웹과 자바스크립트 생태계를 만든 핵심 기술 중 하나가 V8입니다. V..
[etc] 제프 딘(Jeff Dean)
·
etc
제프 딘은 누구인가?제프 딘(Jeff Dean)은 미국의 컴퓨터 과학자이자, 구글의 초기 핵심 엔지니어입니다. 현재는 구글의 수석 연구원(Senior Fellow)이며, 구글 딥마인드(Google DeepMind)의 리더로도 활동하고 있습니다. 주요 타이틀구글 초기 팀 멤버구글 브레인(Google Brain) 공동 창립자TensorFlow의 주도 개발자딥러닝, 머신러닝 분야 세계적 석학제프 딘의 주요 업적제프 딘은 단순히 많은 시스템을 만든 것이 아니라, 웹의 스케일을 바꾸는 기술들을 만들었습니다. MapReduce대규모 데이터를 처리하는 분산 시스템 패러다임하둡(Hadoop)의 모태가 된 기술BigTable구글의 분산형 NoSQL 데이터베이스 시스템이후 HBase, Cassandra 등에 영향을 줌Te..
[etc] 개인화 서비스
·
etc
사용자를 더 잘 이해하고, 더 똑똑하게 대응하는 서비스의 핵심 기술개인화 서비스란 무엇인가요?개인화 서비스란,사용자의 행동, 취향, 관심사 등을 분석해 각 사용자에게 맞춤화된 콘텐츠나 기능을 제공하는 기술/전략을 의미합니다. 예를 들어,넷플릭스가 내 취향에 맞는 영화를 추천해주고쿠팡이 자주 사는 상품을 먼저 보여주고유튜브가 딱 내가 좋아할 만한 영상들을 홈에 띄워주는 것이 모든 것이 개인화 서비스의 결과물입니다. 왜 개인화가 중요한가요?사람들은 자신에게 의미 있는 것에만 반응합니다.핵심 이유들정보 과잉 속의 해답사용자에게 너무 많은 선택지가 있으면 오히려 아무것도 선택하지 않게 됩니다. 개인화는 "결정 피로"를 줄여줘요.사용자 이탈 감소나한테 맞지 않는 정보만 나오면 당연히 앱을 이탈하게 됩니다.전환율 ..
[etc] 폴리글랏 프로그래머란?
·
etc
“하나의 언어로는 세상의 모든 문제를 풀 수 없다.”폴리글랏 프로그래머란 무엇인가요?"폴리글랏(Polyglot)" 는 원래 여러 언어를 말할 수 있는 사람을 의미해요.프로그래밍에선 다수의 프로그래밍 언어에 능숙한 개발자를 의미합니다.예를 들어,웹 프론트엔드는 React(JS)백엔드는 Go나 Node.js데이터 파이프라인은 Python모바일은 Kotlin/Swift인프라는 Terraform이런 식으로 한 언어에 국한되지 않고, 문제에 가장 알맞은 언어와 도구를 선택할 수 있는 개발자가 바로 폴리글랏 프로그래머입니다.왜 폴리글랏이 되어야 하나요?기술 선택의 자유문제의 성격에 따라 가장 적합한 언어를 선택할 수 있어요.예: 머신러닝 → Python / 고성능 서버 → Rust / 간단한 웹 서버 → Node...
[etc] 메모리 릭(Memory Leak)
·
etc
“썼으면 치워야지?”메모리를 붙잡고 안 놔주는 코드들 메모리 릭이란?메모리 릭은 더 이상 필요하지 않은 데이터가 메모리에 계속 남아있는 현상을 말합니다.쉽게 말하면,"쓰고 난 데이터를 해제하지 않아서, 메모리가 줄지 않고 쌓이는 것." 이건 일종의 메모리 낭비이자 성능 저하의 원인입니다. 왜 발생할까?다음 중 하나라도 해당하면 메모리 릭이 생깁니다객체에 대한 참조를 실수로 남겨둠이벤트 리스너를 등록만 하고 해제하지 않음클로저나 전역 변수로 인해 GC 대상에서 제외됨사용이 끝난 리소스를 명시적으로 해제하지 않음 (특히 C, C++)GC(Garbage Collector) 는 똑똑하지만, 모든 상황을 완벽히 처리하지는 못해요. 어떤 문제가 생기나?메모리 점유율 증가시간이 지날수록 앱이 점점 느려짐모바일에선 앱..
[etc] 셀프 힐링 시스템(Self-Healing System)
·
etc
“죽지 않아. 알아서 고쳐.”자동으로 회복하는 인프라의 세계 셀프 힐링 시스템이란?셀프 힐링 시스템(Self-Healing System) 이란,애플리케이션이나 시스템에 장애가 발생했을 때사람의 개입 없이 자동으로 문제를 감지하고 복구하는 시스템입니다.예를 들어, 서버 하나가 다운됐는데도자동으로 새 서버가 뜨고 트래픽이 거기로 흘러간다면?그게 바로 셀프 힐링!왜 필요한가?시스템은 언제든 망가질 수 있다컨테이너가 다운됨메모리 누수 발생DB 커넥션이 끊김CPU 100%로 고정이런 상황들, 실제로 운영 환경에서 자주 발생합니다.하지만, 사람은 24시간 대응할 수 없다모든 에러를 개발자가 수동으로 고치기엔 시간과 비용이 너무 큽니다.특히 야간/주말에는 대응 속도도 느려지죠.→ 셀프 힐링이 필요한 이유어떤 문제를 ..
[인프라] 오토 스케일링(Auto Scaling)
·
CS/인프라
트래픽이 많아지면 자동으로 서버가 늘어나고, 줄어들면 자동으로 줄어든다? 오토 스케일링이란?“트래픽 변화에 따라 서버 인프라가 자동으로 늘어나거나 줄어드는 것” 오토 스케일링(Auto Scaling)은 말 그대로 자동으로 리소스를 조정해주는 기술입니다.트래픽이 몰리면 서버 인스턴스를 늘리고, 한가해지면 줄이는 방식이죠.실제로 클라우드 환경에서는 이런 스케일링이 없으면트래픽 폭증 시: 서버 터짐트래픽 한산 시: 돈 낭비이 두 가지 문제에 모두 취약해집니다.왜 필요한가?1. 유저 수는 예측할 수 없다특히 프로모션, 이벤트, 뉴스, 바이럴 마케팅 등으로 인해순간적인 폭주 트래픽이 생길 수 있습니다.2. 서버가 항상 많을 필요는 없다평소엔 유저가 적은데 서버를 많이 띄워놓는 건 돈 낭비입니다.“가성비 있게 운영..
[etc] 메타 프로그래밍(Metaprogramming)
·
etc
코드가 코드를 이해하고, 바꾸고, 만들고, 실행까지 한다고? 메타 프로그래밍이란?우리 보통 코드를 짜면 그 코드가 어떤 "기능"을 하잖아요?근데 메타 프로그래밍은 좀 다릅니다. “코드를 조작하는 코드를 짜는 것”즉, 코드를 대상으로 삼는 코드예요. 예를 들어,함수를 분석하고새로운 함수를 만들어내고어떤 클래스의 속성을 수정하고또는 아예 새로운 클래스를 만들어내기도 하고요. 말장난 같다고요?사실 이런 거예요// 일반적인 코드const double = (x) => x * 2;// 메타적인 접근const makeMultiplier = (n) => (x) => x * n;const triple = makeMultiplier(3); // 코드가 코드를 만듦 왜 굳이 그렇게 복잡하게?메타 프로그래밍이 필요한 이유는 ..