코어 프런트엔드 UI 상세페이지
출간 정보
- 2026.03.31 전자책 출간
- 2026.03.10 종이책 출간
듣기 기능
TTS(듣기) 미지원
파일 정보
- 596 쪽
- 25.6MB
지원 환경
- 앱
- 웹
- PC뷰어
- PAPER
ISBN
9791158396770
UCI
-
코어 프런트엔드 UI
작품 정보
[프런트엔드 UI의 핵심, 순수 자바스크립트부터 리액트 심화 패턴까지!]
프런트엔드 개발은 단순한 라이브러리 활용을 넘어, 브라우저 메커니즘을 이해하고 제어하는 과정입니다. 다만 매일 쓰는 React 훅과 컴포넌트 이면에 있는 순수 자바스크립트(Web API)의 작동 원리와 효율적인 UI 설계 구조를 제대로 이해하기는 쉽지 않습니다.
이 책은 같은 UI를 React와 순수 자바스크립트 두 방식으로 구현하며, 각 접근법의 장단점을 비교해 이해할 수 있도록 돕습니다. 나아가 현대 프레임워크 환경 속에서 자바스크립트 생태계를 다루는 데 필요한 실무 통찰을 제공합니다.
《코어 프런트엔드 UI》는 기능별 작성법이나 사용법을 나열하고 소개하는 데 그치지 않고, UI가 동작하는 원리와 설계 기준을 깊이 있게 다룹니다. Intersection Observer를 활용한 가시성 제어, customValidity를 통한 폼 검증 등 최신 Web API와 리액트 기술을 다루고, HTML과 CSS만으로 해결할 수 있는 영역까지 아우르며, 폭넓고 유연한 시야를 가질 수 있도록 돕습니다.
이 책은 정답을 제시하기보다 해결 과정에서의 고민과 시도, 그리고 문제 해결을 위한 실마리를 공유합니다. 초보 개발자라면 복잡한 UI 개념을 단계적으로 이해하며 자신감을 얻을 수 있고, 숙련된 개발자라면 프레임워크에 기대지 않고 문제를 해결하는 역량을 기를 수 있습니다. 코드를 따라 치는 것을 넘어, 스스로 생각하고 설계하는 힘을 길러 보시기 바랍니다.
★ 이 책에서 다루는 내용 ★
- 리액트와 순수 자바스크립트로 동일한 UI를 구현하며 각 패러다임을 이해하기
- 아코디언, 탭 메뉴, 툴팁 등 필수 UI 컴포넌트의 밑바닥 설계
- Intersection Observer, scrollIntoView 등 순수 자바스크립트 API 실전 활용
- useRef, createPortal을 활용한 DOM 직접 제어 및 레이어 관리 기법
- 무한 스크롤, 캐러셀 등 UX를 좌우하는 핵심 UI 로직 구현
- 컴파운드 컴포넌트와 헤드리스 패턴을 적용한 재사용 가능한 설계 구조
프런트엔드 개발은 단순한 라이브러리 활용을 넘어, 브라우저 메커니즘을 이해하고 제어하는 과정입니다. 다만 매일 쓰는 React 훅과 컴포넌트 이면에 있는 순수 자바스크립트(Web API)의 작동 원리와 효율적인 UI 설계 구조를 제대로 이해하기는 쉽지 않습니다.
이 책은 같은 UI를 React와 순수 자바스크립트 두 방식으로 구현하며, 각 접근법의 장단점을 비교해 이해할 수 있도록 돕습니다. 나아가 현대 프레임워크 환경 속에서 자바스크립트 생태계를 다루는 데 필요한 실무 통찰을 제공합니다.
《코어 프런트엔드 UI》는 기능별 작성법이나 사용법을 나열하고 소개하는 데 그치지 않고, UI가 동작하는 원리와 설계 기준을 깊이 있게 다룹니다. Intersection Observer를 활용한 가시성 제어, customValidity를 통한 폼 검증 등 최신 Web API와 리액트 기술을 다루고, HTML과 CSS만으로 해결할 수 있는 영역까지 아우르며, 폭넓고 유연한 시야를 가질 수 있도록 돕습니다.
이 책은 정답을 제시하기보다 해결 과정에서의 고민과 시도, 그리고 문제 해결을 위한 실마리를 공유합니다. 초보 개발자라면 복잡한 UI 개념을 단계적으로 이해하며 자신감을 얻을 수 있고, 숙련된 개발자라면 프레임워크에 기대지 않고 문제를 해결하는 역량을 기를 수 있습니다. 코드를 따라 치는 것을 넘어, 스스로 생각하고 설계하는 힘을 길러 보시기 바랍니다.
★ 이 책에서 다루는 내용 ★
- 리액트와 순수 자바스크립트로 동일한 UI를 구현하며 각 패러다임을 이해하기
- 아코디언, 탭 메뉴, 툴팁 등 필수 UI 컴포넌트의 밑바닥 설계
- Intersection Observer, scrollIntoView 등 순수 자바스크립트 API 실전 활용
- useRef, createPortal을 활용한 DOM 직접 제어 및 레이어 관리 기법
- 무한 스크롤, 캐러셀 등 UX를 좌우하는 핵심 UI 로직 구현
- 컴파운드 컴포넌트와 헤드리스 패턴을 적용한 재사용 가능한 설계 구조
작가 소개
정재남
늦은 나이에 개발에 입문한, 호기심 많은 예비 아빠입니다. 인프런 지식공유자(inflearn.com/users/46840)이며, 유튜브(youtube.com/@FERoy)도 운영하고 있습니다. 웹 퍼블리셔로 시작해 프런트엔드 개발자로 성장하는 동안, 디자이너, 기획자, 개발자와 협업하고 조율하며 다양한 UI 문제를 해결해 왔습니다. 늘 더 간단하거나 정확한 방법은 없을지 고민하며, 정답이 정해지지 않은 문제는 여러 대안을 놓고 비교하며 풀어가는 과정을 좋아합니다. 그 과정에서 얻은 시행착오와 통찰을 이 책에 담았습니다.
늦은 나이에 개발에 입문한, 호기심 많은 예비 아빠입니다. 인프런 지식공유자(inflearn.com/users/46840)이며, 유튜브(youtube.com/@FERoy)도 운영하고 있습니다. 웹 퍼블리셔로 시작해 프런트엔드 개발자로 성장하는 동안, 디자이너, 기획자, 개발자와 협업하고 조율하며 다양한 UI 문제를 해결해 왔습니다. 늘 더 간단하거나 정확한 방법은 없을지 고민하며, 정답이 정해지지 않은 문제는 여러 대안을 놓고 비교하며 풀어가는 과정을 좋아합니다. 그 과정에서 얻은 시행착오와 통찰을 이 책에 담았습니다.
리뷰
0.0
구매자 별점
0명 평가
이 작품을 평가해 주세요!
건전한 리뷰 정착 및 양질의 리뷰를 위해 아래 해당하는 리뷰는 비공개 조치될 수 있음을 안내드립니다.
- 타인에게 불쾌감을 주는 욕설
- 비속어나 타인을 비방하는 내용
- 특정 종교, 민족, 계층을 비방하는 내용
- 해당 작품의 줄거리나 리디 서비스 이용과 관련이 없는 내용
- 의미를 알 수 없는 내용
- 광고 및 반복적인 글을 게시하여 서비스 품질을 떨어트리는 내용
- 저작권상 문제의 소지가 있는 내용
- 다른 리뷰에 대한 반박이나 논쟁을 유발하는 내용
* 결말을 예상할 수 있는 리뷰는 자제하여 주시기 바랍니다.
이 외에도 건전한 리뷰 문화 형성을 위한 운영 목적과 취지에 맞지 않는 내용은 담당자에 의해 리뷰가 비공개 처리가 될 수 있습니다.아직 등록된 리뷰가 없습니다.
첫 번째 리뷰를 남겨주세요!
첫 번째 리뷰를 남겨주세요!
'구매자' 표시는 유료 작품 결제 후 다운로드하거나 리디셀렉트 작품을 다운로드 한 경우에만 표시됩니다.
- 무료 작품 (프로모션 등으로 무료로 전환된 작품 포함)
- '구매자'로 표시되지 않습니다.
- 시리즈 내 무료 작품
- '구매자'로 표시되지 않습니다. 하지만 같은 시리즈의 유료 작품을 결제한 뒤 리뷰를 수정하거나 재등록하면 '구매자'로 표시됩니다.
- 영구 삭제
- 작품을 영구 삭제해도 '구매자' 표시는 남아있습니다.
- 결제 취소
- '구매자' 표시가 자동으로 사라집니다.
프로그래밍 & 프랙티스 시리즈더보기
성인 인증 안내
성인 재인증 안내
성인 인증 안내
성인 재인증 안내
청소년보호법에 따라 성인 인증은 1년간
유효하며, 기간이 만료되어 재인증이 필요합니다.
성인 인증 후에 이용해 주세요.
해당 작품은 성인 인증 후 보실 수 있습니다.
성인 인증 후에 이용해 주세요.
청소년보호법에 따라 성인 인증은 1년간
유효하며, 기간이 만료되어 재인증이 필요합니다.
성인 인증 후에 이용해 주세요.
해당 작품은 성인 인증 후 선물하실 수 있습니다.
성인 인증 후에 이용해 주세요.
본문 끝 최상단으로 돌아가기
