프론트엔드
React·CSS·브라우저 등 프론트 핵심 개념과 실전
Next.js App Router: 서버 컴포넌트와 클라이언트 컴포넌트 제대로 나누기
App Router에서 가장 헷갈리는 'use client' 경계. 서버/클라이언트 컴포넌트의 차이와 데이터 패칭 위치, 흔한 실수를 실전 기준으로 정리합니다.
CSS Flexbox vs Grid: 언제 무엇을 써야 할까
Flexbox와 Grid는 경쟁이 아니라 역할이 다릅니다. 1차원이면 Flex, 2차원이면 Grid라는 원칙과 실제 레이아웃 예제로 선택 기준을 명확히 정리합니다.
TypeScript 제네릭 완전 정복: 실무에서 바로 쓰는 패턴
제네릭이 어렵게 느껴지는 건 '왜 쓰는지'를 모르기 때문입니다. 타입 안전성을 지키면서 재사용성을 높이는 제네릭의 핵심 문법과 extends·keyof·유틸리티 타입까지 실전 예제로 정리합니다.
TypeScript 입문: 타입 기초부터 인터페이스, 제네릭까지
자바스크립트 개발자를 위한 TypeScript 입문 가이드입니다. 기본 타입, 인터페이스, 유니온, 제네릭까지 꼭 필요한 핵심 개념을 실전 코드로 빠르게 익혀보세요.
CSS Flexbox vs Grid 차이와 선택 기준: 1차원 vs 2차원 레이아웃
Flexbox와 Grid는 언제 무엇을 써야 할까요? 1차원과 2차원이라는 핵심 차이부터 실전 코드, 선택 기준까지 한 번에 정리합니다. 더 이상 헷갈리지 마세요.
자바스크립트 비동기 완벽 가이드: Promise와 async/await 제대로 쓰기
콜백 지옥부터 async/await까지 자바스크립트 비동기 처리의 핵심을 정리합니다. Promise 체이닝, 에러 처리, 병렬 실행(Promise.all)까지 실무 예제로 익혀보세요.
React useEffect, useState 완벽 정리: 의존성 배열부터 클린업까지
React 함수형 컴포넌트의 핵심인 useState와 useEffect를 실무 관점에서 정리합니다. 의존성 배열, 무한 루프 방지, 클린업 함수까지 흔한 실수와 해결법을 코드로 짚어드립니다.
React key는 왜 index를 쓰면 안 될까: 리스트 렌더링의 함정
key의 역할(재조정), index를 key로 쓸 때 생기는 상태 꼬임·성능 저하, 안정적인 고유 id를 써야 하는 이유를 예제로 설명합니다.
CSS 가운데 정렬 완전 정복: flex·grid·margin auto
수평·수직 가운데 정렬을 상황별로 정리합니다. flex의 center 조합, grid의 place-items, margin auto, 텍스트 정렬까지 복붙 가능한 패턴 모음.
== vs ===, 그리고 NaN: 자바스크립트 동등 비교의 함정
느슨한 비교(==)의 암묵적 형변환이 만드는 버그, ===를 기본으로 써야 하는 이유, NaN·null·undefined 비교의 특이점을 예제로 정리합니다.