📚 조건부 타입이란 무엇인가요? TypeScript의 조건부 타입(Conditional Types)은 타입 시스템 내에서 조건문을 사용할 수 있게 해주는 기능이에요. 이를 통해 입력된 타입에 따라 다른 타입을 반환할 수 있으며, 이는 TypeScript의 타입 시스템을 더욱 유연하고 동적으로 만들어 줘요. 조건부 타입은 TypeScript에서 T extends U ? X : Y와 같은 형태로 표현돼요. 여기서 T가 U 타입에 할당 가능한지 여부에 따라 X 타입을 반환하거나, 그렇지 않으면 Y 타입을 반환해요. 이는 프로그래밍에서의 일반적인 조건문(if-else)과 유사한 개념이에요. 조건부 타입은 '도로의 분기점'에 비유할 수 있어요. 여러분이 운전을 하다가 도로가 두 갈래로 나뉘는 지점에 도달했다고 상..

📚 CSS 방법론이란 무엇인가요? CSS 방법론은 CSS 코드를 구조화하고 조직화하는 일련의 규칙이나 가이드라인이에요. 이는 스타일 시트가 커지고 복잡해짐에 따라 발생할 수 있는 문제들, 예를 들어 선택자의 충돌, 코드의 중복, 유지보수의 어려움 등을 해결하는 데 목적이 있어요. 주요 CSS 방법론에는 BEM(Block Element Modifier), OOCSS(Object-Oriented CSS), SMACSS(Scalable and Modular Architecture for CSS) 등이 있어요. 🖥️ 주요 CSS 방법론 1. BEM (Block Element Modifier) 개념: BEM은 '블록(Block)', '요소(Element)', '수정자(Modifier)'의 약자로, CSS 클래스 ..

📚 useRef란 무엇인가요? useRef는 리액트 훅 중 하나로, 변경 가능한 ref 객체를 반환해요. 이 ref 객체는 .current 속성을 가지고 있어요. 가장 흔한 사용 예는 DOM 요소에 직접 접근하는 것이지만, 값이 변경되어도 컴포넌트가 재렌더링되지 않는 변수를 저장하는 데에도 사용할 수 있어요. 여러분이 큰 도서관에 있다고 상상해 보세요. 이 도서관에는 수많은 책들이 있고, 각각의 책은 특정한 위치에 있어요. 여기서 '책'은 DOM 요소나 컴포넌트를 대표하고, '책의 위치'는 그 요소나 컴포넌트에 대한 참조(Reference)를 상징해요. useRef는 마치 책갈피처럼 특정한 책(요소/컴포넌트)을 쉽게 찾아갈 수 있는 방법을 제공해요. 여러분이 그 책갈피를 가지고 있다면, 도서관 어디서든 ..

📚 ES6란 무엇인가요? ES6, 공식적으로는 ECMAScript 2015라고 불리는 이 업데이트는 2015년에 발표되었어요. 자바스크립트를 표준화하는 ECMAScript 사양의 여섯 번째 주요 버전이죠. ES6는 자바스크립트 언어에 많은 새로운 기능과 개선사항을 도입했어요. 이러한 변화는 개발자들이 더 효율적이고 간결한 코드를 작성할 수 있게 도와줘요. ES6는 마치 스마트폰이 이전의 피처폰에 비해 가진 혁신적인 기능들처럼, JavaScript의 코딩 경험을 획기적으로 개선한 것으로 볼 수 있어요. 🖥️ ES6의 새로운 기능들 1. let과 const var 대신 let과 const를 사용하여 변수를 선언할 수 있어요. 이는 블록 스코프 변수를 가능하게 하며, 코드를 더 안전하고 이해하기 쉽게 만들어줘..

📚 State란 무엇인가요? 리액트에서 state는 컴포넌트의 상태를 나타내는 데이터예요. 이는 사용자의 상호작용이나 시간의 경과에 따라 변경될 수 있는 정보를 말해요. state의 변화는 리액트가 컴포넌트를 다시 렌더링 하게 만들어, 사용자 인터페이스가 최신 상태를 반영하도록 해요. 식당에서 주문서는 손님이 현재 주문한 음식을 나타내죠. 손님이 주문을 변경하면, 주문서의 내용도 그에 맞게 바뀌어요. 주문서가 변경되면, 주방은 변경된 주문에 맞춰 새로운 음식을 준비하고 손님에게 제공해요. 리액트의 state도 이와 비슷해요. state는 컴포넌트의 현재 상태(예: 사용자가 입력한 텍스트, 선택한 옵션 등)를 나타내요. 사용자가 상호작용(예: 버튼 클릭, 폼 입력)을 통해 state를 변경하면, 리액트는 ..

📝 문제 설명 한 개 이상의 항의 합으로 이루어진 식을 다항식이라고 합니다. 다항식을 계산할 때는 동류항끼리 계산해 정리합니다. 덧셈으로 이루어진 다항식 polynomial이 매개변수로 주어질 때, 동류항끼리 더한 결괏값을 문자열로 return 하도록 solution 함수를 완성해보세요. 같은 식이라면 가장 짧은 수식을 return 합니다. 🔍 제한사항 0 < polynomial에 있는 수 < 100 polynomial에 변수는 'x'만 존재합니다. polynomial은 양의 정수, 공백, ‘x’, ‘+'로 이루어져 있습니다. 항과 연산기호 사이에는 항상 공백이 존재합니다. 공백은 연속되지 않으며 시작이나 끝에는 공백이 없습니다. 하나의 항에서 변수가 숫자 앞에 오는 경우는 없습니다. " + 3xx + ..

📝 문제 설명 2차원 좌표 평면에 변이 축과 평행한 직사각형이 있습니다. 직사각형 네 꼭짓점의 좌표 [[x1, y1], [x2, y2], [x3, y3], [x4, y4]]가 담겨있는 배열 dots가 매개변수로 주어질 때, 직사각형의 넓이를 return 하도록 solution 함수를 완성해보세요. 🔍 제한사항 dots의 길이 = 4 dots의 원소의 길이 = 2 256 < dots[i]의 원소 < 256 잘못된 입력은 주어지지 않습니다. 📥 입출력 예 dots result [[1, 1], [2, 1], [2, 2], [1, 2]] 1 [[-1, -1], [1, 1], [1, -1], [-1, 1]] 4 💻 나의 풀이 가로 길이 구하기: x 좌표들 중 최대값과 최소값의 차이를 구합니다. 세로 길이 구하기:..

📚 Interface와 Type은 무엇인가요? 이 두 구문은 타입을 정의하는 방법으로, TypeScript 코드의 가독성과 유지보수성을 크게 향상해요. 이 둘은 데이터의 형태와 계약을 정의하는 데 사용되지만, 그 사용 목적과 방법에서 약간의 차이가 있어요. Interface: interface는 객체의 형태를 정의하고, 클래스와의 계약을 설정하는 데 주로 사용돼요. 이는 객체 지향 프로그래밍의 개념과 밀접하게 연관되어 있으며, 확장 가능한 구조를 제공해요. Type: type은 interface보다 더 다양한 타입 표현을 가능하게 해요. 이는 기본적인 객체 형태뿐만 아니라, 유니온, 인터섹션, 기본 타입 등 복잡한 타입 조합을 정의하는 데 사용돼요. interface는 건물의 청사진과 같아서, 객체의 구..