TypeScript 제네릭 쉽게 이해하기: props와 API 응답 타입으로 감 잡기
TypeScript 제네릭을 React props와 API 응답 타입 예시로 쉽게 이해할 수 있도록 정리합니다. any와 제네릭의 차이, GenericList와 ApiResponse 활용 흐름을 함께 살펴봅니다.
프론트엔드
프론트엔드 카테고리에서는 사용자 화면을 구현하는 데 필요한 핵심 기술과 실무 지식을 정리합니다. HTML, CSS, JavaScript를 비롯해 React, Next.js, UI 컴포넌트 설계, 상태 관리, API 연동, 성능 최적화, 반응형 웹까지 프론트엔드 개발 전반을 다룹니다.
총 106개의 글
TypeScript optional props와 default value 처리법
React 컴포넌트에서 TypeScript optional props를 사용할 때 기본값을 어디서 처리해야 하는지 정리합니다. `?`, `undefined`, `null`, 구조 분해 기본값, optional callback…
React TypeScript 기본 구조: tsx 파일과 props 타입 기준
React에서 TypeScript를 처음 사용할 때 헷갈리기 쉬운 .ts와 .tsx 차이, 컴포넌트 파일 구조, props 타입 작성 위치를 정리합니다. 처음부터 복잡한 타입 설계로 들어가기 전 기본 구조를 잡는 데 초점을 맞…
TypeScript children 타입: ReactNode와 PropsWithChildren 차이
React TypeScript에서 children 타입을 지정할 때 ReactNode, PropsWithChildren, ReactElement, JSX.Element를 어떻게 구분해야 하는지 정리합니다. children을 필…
React 컴포넌트 props 타입 지정하기: 부모와 자식 사이의 값 구조 잡기
React에서 TypeScript로 컴포넌트 props 타입을 지정하는 기본 방법을 정리합니다. 부모 컴포넌트가 자식 컴포넌트에 넘기는 값의 구조를 타입으로 고정하고, 필수 props와 함수 props를 실제 UI 컴포넌트 기…
TypeScript 실무 로드맵
TypeScript 기초 문법을 배운 뒤 React 프로젝트에서 props, state, API, 상태 관리, 폼, Next.js까지 어떤 순서로 타입을 적용하면 좋은지 정리합니다.
TypeScript란 무엇인가: JavaScript와 차이 정리
TypeScript가 JavaScript를 대체하는 언어가 아니라 JavaScript 위에 타입 검사를 더하는 도구라는 점을 입문자 기준으로 정리합니다. 정적 타입 검사, JavaScript 변환, 런타임과의 차이를 함께 설명…
2026 프론트엔드 개발자 로드맵: React, Next.js, TypeScript
2026년 기준 프론트엔드 개발자를 목표로 공부할 때 HTML, CSS, JavaScript, React, Next.js, TypeScript, AI 도구를 어떤 순서로 연결해야 하는지 정리합니다.
React Cannot update 오류 해결: 렌더링 중 setState 원인
React에서 Cannot update a component while rendering a different component 경고가 발생하는 원인을 렌더링 중 setState 호출 위치를 기준으로 정리합니다.
Tailwind CSS Unknown at rule 경고 해결: VS Code와 PostCSS 설정 확인
Tailwind CSS 설치 후 VS Code에서 Unknown at rule 경고가 보일 때, 에디터 경고와 PostCSS 설정 문제를 구분해 해결하는 방법을 정리합니다.