nika-blog

✅ 1. React Native 기본 구조🧱 세 가지 Thread 환경구성 요소설명JS Thread우리가 작성한 React/JSX 코드 실행Native Thread실제 iOS/Android UI가 렌더링되는 곳BridgeJS ↔ Native 간 비동기 통신 채널 (메시지 큐 기반)📦 동작 흐름JS에서 JSX → Virtual DOM 생성Reconciler가 UI 업데이트 계산명령을 JSON으로 변환해 Bridge로 전송Native가 해당 명령 실행 (View 생성 등)🔁 2. 이벤트 전달 구조🖱️ Native → JS 이벤트 흐름단계설명사용자 입력터치, 스크롤 등 Native 이벤트 발생Native 처리TouchRecognizer 등으로 감지JS 전달RCTEventEmitter로 브릿지 전송JS ..

Next.js에서 Server Component는 어떻게 렌더링될까?💡 컴포넌트란?React에서 컴포넌트(Component)란👉 데이터를 인자로 받아 JSX를 반환하는 JavaScript 함수입니다.function Welcome({ name }) { return Hello, {name};}컴포넌트는 다음 두 가지 상태를 가질 수 있습니다:Props: 부모로부터 전달받는 데이터State: 컴포넌트 내부에서 관리되는 데이터⚙️ 컴포넌트 렌더링이란?JSX는 브라우저가 이해할 수 없기 때문에,Babel을 통해 React Element로 변환됩니다.Hello// ↓ Babel 변환React.createElement("h1", null, "Hello")이 React Element는 Fiber 노드로 변환되어 ..

Next.js의 라우팅 시스템 이해하기등장 배경, 동작 방식, 코드 레벨 구현까지라우팅이란?간단히 말하면 "어떤 URL을 요청했을 때 어떤 화면을 보여줄까"를 결정하는 과정.CSR은 하나의 HTML 파일만 있으므로, 자바스크립트 레벨에서 URL Path를 구분해야 함.SSR은 서버에서 여러 URL 경로에 대해 각각 다른 HTML을 반환해야 함.라우팅 방식 비교방식예시특징명시적 라우팅React-Router직접 Route를 명시코드 기반 라우팅Express코드로 라우트 등록데코레이터 기반 라우팅Nest.js데코레이터로 라우트 선언파일 기반 라우팅Next.js파일구조가 곧 라우트Next.js는 파일 기반 라우팅을 채택➔ /pages 디렉터리의 폴더 및 파일 구조가 곧 URL 경로가 됨.파일 기반 라우팅의 장점..

nextjs 로 개발한지 벌써 오래되었는데, 동작원리나 개념보다는 활용에 집중해 온 것 같다. 오랜만에 공부하며 내용을 정리해봤다. Next.js는 왜 등장했을까?CSR과 SSR의 한계와 Next.js의 탄생 배경왜 CSR(Client Side Rendering)인가?과거 웹은 JSP처럼 서버에서 HTML을 생성하고 전송하는 구조였음.Ajax(Asynchronous JavaScript and XML) 기술이 등장하면서, 웹페이지 전체를 새로 고치지 않고 필요한 데이터만 받아오는 방식이 가능해짐.Presentation Layer(화면)와 Data Layer(데이터)가 분리되면서, 사용자 경험(UX)이 크게 향상됨.CSR 덕분에 웹은 빠른 전환과 부드러운 UX를 제공할 수 있게 되었음.그러나 CSR은 초기 ..

최근 Xcode를 16.3으로 업데이트했다가 iOS 앱 빌드가 실패하는 이슈를 겪었습니다. 같은 문제를 겪는 분들께 도움이 될까 해서 정리해봅니다.🧨 발생한 이슈Xcode 16.3부터 std::char_traits 템플릿이 기본 제공되지 않으면서, 일부 앱에서 컴파일 에러가 발생합니다.에러 메시지 예시:use of undeclared identifier 'std::char_traits' 이로 인해 React Native 또는 Expo 기반 프로젝트에서는 정상적으로 iOS 앱을 빌드할 수 없게 되는 문제가 생겼습니다.🔍 원인Apple의 Xcode 16.3 릴리즈 노트에 따르면, std::char_traits 기본 템플릿이 제거되었다고 명시되어 있습니다.이는 Apple이 C++ 표준에 맞게 std::ch..

🎯 도메인 모델과 코드의 관계📌 DDD의 핵심 원칙:"도메인 모델과 코드는 같은 의미를 가져야 한다."즉, 코드 자체가 도메인 모델을 반영해야 하며, 별도로 문서를 유지보수할 필요가 없어야 함.✅ 해결해야 할 두 가지 문제1️⃣ 요구사항에 적합한 모습으로 도메인을 어떻게 모델링할 것인가?2️⃣ 도메인을 반영한 코드를 어떻게 개발할 것인가?💡 코드가 문서 역할을 한다면?✔ 변경되는 문서를 따로 유지보수할 필요 없이,✔ 코드를 보면 도메인 모델을 이해할 수 있도록 설계하는 것이 핵심.🔨 모델 주도 설계의 빌딩 블록빌딩 블록은 DDD를 코드로 구현할 때 복잡도를 낮추기 위한 가이드라인입니다.📌 필수적인 개념은 아니지만, 직관적인 가이드 역할을 수행✅ 도메인을 표현하는 빌딩 블록Association (..

📌 과거의 DDD vs 현재의 DDD과거의 **도메인 주도 설계(DDD)**는 추상적인 개념과 철학적인 접근이 많았지만, 현재의 DDD는 보다 구체적이고 실용적인 형태로 발전했습니다.특히, 도메인의 범위를 구체화하고 솔루션까지 포함하는 형태로 변화했습니다.📌 현재의 DDD는 크게 두 가지 패턴으로 나뉩니다.1️⃣ 전략적 패턴 (Strategic Patterns) → 비즈니스 문제 공간(Problem Space)에서 도메인을 분리하는 과정2️⃣ 전술적 패턴 (Tactical Patterns) → 솔루션 공간(Solution Space)에서 도메인을 코드로 구체화하는 방법💡 즉, 문제를 이상적으로 나누고(디스틸레이션), 실제 구현에서 바운디드 컨텍스트를 어떻게 적용할 것인지 고민하는 과정이 포함됨.🔹..

🎯 개발과 정치가 만나는 곳: 전략적 설계소프트웨어 개발은 단순한 코드 작성이 아니라 조직의 구조, 협업 방식, 그리고 비즈니스 목표와도 맞물려 있는 전략적인 작업입니다.특히, 대규모 시스템에서는 여러 개의 도메인 모델을 다루는 것이 핵심이 됩니다.💡 전사(기업 전체)에 하나의 도메인 모델만 존재해야 할 필요는 없다!팀마다 도메인 모델이 다를 수 있음모든 도메인 모델이 중요한 것은 아니며, 중요한 곳에 집중해야 함❌ 실무에서 마주하는 문제들소프트웨어가 성장하면서 자연스럽게 복잡성이 증가하게 됩니다.🔹 응집도가 낮은 코드여러 팀이 함께 수정하다 보면 한 기능이 여러 도메인에 걸쳐 중복유지보수가 어려워짐🔹 기능 추가 & 코드 수정 시 충돌단일 도메인 모델을 사용할 경우, 수정 시 예상치 못한 사이드 ..

MSA(Microservices Architecture)는 애플리케이션을 작은 독립적인 서비스 단위로 나누어 개발하고 운영하는 아키텍처 스타일입니다. 기존의 **모놀리식 아키텍처(Monolithic Architecture)**와 대비되며, 특히 대규모 서비스에서 유지보수성과 확장성을 높이기 위해 많이 사용됩니다.🚀 왜 MSA가 필요할까? (MSA 등장 배경)과거에는 모놀리식 아키텍처가 일반적이었지만, 다음과 같은 문제점이 있었습니다.❌ 모놀리식 아키텍처(Monolithic Architecture)의 문제점1️⃣ 배포 및 유지보수 어려움애플리케이션이 하나의 거대한 코드베이스로 구성 → 작은 변경도 전체 애플리케이션을 다시 배포해야 함일부 서비스가 문제를 일으키면 전체 시스템에 영향을 미칠 수 있음2️⃣ ..

🔄 애자일과 도메인 주도 설계 (DDD)🎯 애자일(Agile)이란?초반에 정확한 일정 산정이 불가능목표를 달성하기 위해 계획을 계속 수정하는 방식현재 우리가 알고 있는 애자일과는 다소 다른 개념일 수도 있음💡 애자일이 등장한 이유?기존 소프트웨어 개발 방식은 건축이나 제조업에서 가져온 설계 방식을 따름하지만 소프트웨어는 하드웨어와 다르게 개발 중에도 지속적으로 변경됨변경을 수용하는 방식이 필요했음 → 애자일 등장✅ 애자일은 속도가 아니라 변경에 기민한 것!🤔 문제: 흐릿한 요구사항소프트웨어 개발에서는 처음부터 요구사항을 100% 명확하게 정의하는 것이 불가능함.🔹 개발 중 배워가는 과정프로젝트를 진행하면서 레거시 코드, 도메인, 사용자 니즈 등을 학습하게 됨초반에 예상했던 요구사항과 다르게 변할..