리액트의 Strict Mode에 대해서 설명해주세요 ! StrictMode는 리액트에서 개발 중에 발생할 수 있는 잠재적인 문제를 사전에 감지하고 예방하기 위한 도구입니다. 1. 오래된 코드와 비권장 API 감지 리액트에서는 이제 사용하지 않는 메서드들이 있습니다. componentWillMount() componentWillReceive...

인터넷 창에 www.google.com를 입력하면 무슨 일이 일어나는지 설명해주세요 ! 1. DNS 조회 (도메인 이름 → IP 주소) 사람이 기억하기 좋은 주소 : www.google.com 컴퓨터가 이해하는 주소 : 142.250.206.36 (IP 주소) 사용자가 www.google.com을 입력하면, 브라우저는 먼저 이 도메인 ...

브라우저 렌더링 파이프라인에 대해서 설명해주세요 ! 웹 페이지가 화면에 보이기까지는 여러 단계를 거칩니다. 이 과정을 브라우저 렌더링 파이프라인이라고 부르며, 크게 6단계로 나눌 수 있습니다. 1. DOM 생성 (문서 구조 만들기) HTML 파싱 : 브라우저는 HTML파일을 파싱하여 DOM을 생성 DOM(Document O...

리액트의 props와 state에 대해서 설명해주세요 ! props props는 부모 컴포넌트가 자식 컴포넌트에 전달하는 데이터입니다. 읽기 전용으로, 자식 컴포넌트는 props를 수정할 수 없습니다. function ChildComponent(props) { props.name = "LeeYeeun"; // 오류 발생 가능 re...

✅ 오늘의 목표 GPT-4.1-mini Function Calling으로 가족결합 할인 계산 기능 구현 프론트 React + 백엔드 Express 기반 챗봇 서비스 구축 결합 할인 금액 계산 로직 모듈화 및 Function Schema 설계 🧩 문제 상황 / 배경 LG U+ 요금제에 대한 상담/추천 기능을 챗봇 형태로 제공...

✅ 3단계: computed, watch — 반응형 계산과 상태 변화 감지 ✅ 1. computed: 자동으로 계산되는 값 💡 개념 정리 computed는 기존 상태를 바탕으로 파생된 값을 자동으로 계산해줘. 종속된 상태(ref, reactive)가 바뀌면 자동으로 재계산됨. 성능상 이점도 있어: 변경되지 않으면 캐싱됨. ✅ ...

✅ 3단계: 컴포넌트 분리 + Props + Emits ① 컴포넌트 기본 구조 Vue 3에서는 .vue 파일 하나가 하나의 컴포넌트 기본 구조: <template> ... </template> <script setup lang="ts"> ... </script> <style scoped> ....

✅ 1단계: 프로젝트 생성 + 템플릿 문법 기초 ① Vite로 Vue 3 + TypeScript 프로젝트 생성하기 npm create vite 프롬프트가 나오면 아래처럼 선택 ✔ Project name: vue3-ts-tutorial ✔ Framework: Vue ✔ Variant: Vue + TypeScript cd ...

✅ 오늘의 목표 커밋 메시지 컨벤션 자동 검사 기능 도입 GitHub PR 리뷰를 위한 diff 기반 인터페이스 구현 PR 상세 페이지 이동 시 state 기반 데이터 전달 구조 개선 🧩 문제 상황 / 배경 협업 중 커밋 메시지 컨벤션(feat/fix 등)을 도입했지만, 팀원마다 일관되지 않아 리뷰 품질과 이력 추적에 어려...

✅ 오늘의 목표 허수 커밋 탐지를 위한 로직 구현 커밋 API 호출 시 기간 필터 적용 PR 리스트 UI 개선 및 기능 추가 🧩 문제 상황 / 배경 팀 프로젝트에서 Git 커밋 히스토리를 깔끔하게 관리하는 것은 협업 효율성과 코드 품질 향상에 매우 중요합니다. 하지만 종종 console.log 추가, 불필요한 주석 수정 등...