프론트엔드

HTML·CSS부터 JavaScript, React와 상태관리까지, 화면을 만들고 데이터를 다루는 기술을 배웁니다.

총 177개의 글

TypeScript · 고급 설명 7분 2026.09.10

판별 유니온과 튜플 유니온으로 상태별 허용 이벤트를 제한합니다. never로 처리 누락을 찾고 @ts-expect-error 타입 테스트와 런타임 검사를 함께 실행합니다.

JavaScript · 고급 설명 9분 2026.09.10

AbortController와 요청별 식별자로 오래된 성공·실패·finally가 최신 상태를 덮지 못하게 설계합니다. 취소, 화면 정리, 동일 검색어 요청을 결정적인 테스트로 검증합니다.

HTML·CSS HTML·CSS · 초급 설명 6분 2026.09.06

HTML의 details와 summary로 질문 세 개를 접고 펼치고, 분리한 CSS 파일로 여백과 키보드 초점을 정리합니다. open 속성과 직접 확인할 과제, 시작·완성 파일을 함께 제공합니다.

HTML·CSS HTML·CSS · 초급 설명 6분 2026.09.05

Flex 주축과 교차축, 줄바꿈, flex 크기와 미디어 쿼리를 조합해 모바일부터 넓은 화면까지 읽을 수 있는 완전한 카드 페이지를 만듭니다.

HTML·CSS HTML·CSS · 초급 설명 8분 2026.09.05

분리한 HTML과 CSS 파일로 content-box와 border-box를 비교하고 선택자 명시도, 작성 순서, 상속을 개발자 도구에서 확인합니다.

HTML·CSS HTML·CSS · 초급 설명 8분 2026.09.05

HTML 문서 뼈대와 제목 계층을 만들고 label과 input을 연결합니다. 파일 하나로 링크 이동, 라벨 초점, 필수 입력 검사를 확인하는 첫 퍼블리싱 실습입니다.

TanStack Query · 초급 설명 11분 2026.09.05

Provider와 첫 useQuery를 만들고 pending·빈 성공·첫 실패·재시도·백그라운드 갱신 실패 화면을 구분합니다.

Next.js Next.js · 초급 설명 6분 2026.09.05

Next.js App Router 첫 프로젝트를 준비하고 실행합니다. page.tsx·layout.tsx의 역할을 이해하고 Link로 홈과 작업 목록을 연결합니다.

React React · 초급 설명 6분 2026.09.05

지금까지 TaskFlow는 고정된 제목의 샘플 작업만 추가했습니다. 실제 사용자가 원하는 작업을 입력하려면 input의 값을 React state와 연결해야 합니다.

TypeScript · 초급 설명 7분 2026.09.05

TypeScript union과 null을 조건으로 좁히고 unknown 외부 데이터를 런타임에서 필드별로 검증해 안전한 타입으로 바꾸는 strict 실습입니다.