이롭게 현명하게

[R-LOG] 서평단 / 안티프래질 프런트엔드 / 비제이퍼블릭 본문

T-LOG/R-LOG

[R-LOG] 서평단 / 안티프래질 프런트엔드 / 비제이퍼블릭

dev_y.h 2025. 11. 6. 18:05
728x90
반응형

본 서평은 출판사의 서평단으로 선정되어 제공받은 도서를 읽고 작성하였습니다.

 


[목차]

들어가며

이 책은 어떤 책인가?

책 후기

추천 대상

마무리



[들어가며]

취업 준비를 하면서 내가 지금 잘하고 있는지, 어떤 것을 알아야 하고 어떤 것을 모르는지 걱정이 되기 시작했다.

나의 불안감을 해결해 주기 위한 가이드가 필요하다고 느껴졌다.

그러던 중 '안티프래질 프런트엔드'라는 책을 알게 되었다.

이 책을 통해 나의 길을 다시 바로잡고자 한다.

 


[이 책은 어떤 책인가?]

안티프래질 프런트엔드

  • 제목 : 안티프래질 프런트엔드
  • 저자 : 김상철
  • 출판사 : 비제이퍼블릭
  • 출판일 : 2025년 9월 26일

 

더보기

 

1 변하는 것과 변하지 않는 것
_1.1 프래질과 안티프래질
__1.1.1 복잡계 이야기
__1.1.2 올리브 압착기 이야기
_1.2 프런트엔드 개발 생태계와 안티프래질
_1.3 안티프래질한 옵션
__1.3.1 오래 살아남은 것들은 안티프래질하다
__1.3.2 내가 학습한 것들은 변화로 인해 이익을 얻는가

2 브라우저
_2.1 브라우저를 구성하는 요소들
__2.1.1 브라우저의 기본적인 아키텍처
__2.1.2 크롬과 크로미엄은 뭐가 다를까?
__2.1.3 브라우저가 지켜야 하는 여러 규칙
__2.1.4 브라우저의 멀티 프로세스 아키텍처
_2.2 브라우저가 화면을 렌더링하는 과정
__2.2.1 도메인 주소에서 웹 서버 주소 알아내기
__2.2.2 보안을 향상하는 시큐어 커넥션 맺기
__2.2.3 HTML 웹 페이지 요청하기
__2.2.4 HTML 파싱 및 DOM 트리 구축
__2.2.5 CSS 파싱 및 CSSOM 트리 구축
__2.2.6 렌더 트리 구성
__2.2.7 레이아웃 계산
__2.2.8 페인트
__2.2.9 픽셀화&컴포지션
_2.3 브라우저가 렌더링을 효율적으로 하려면
__2.3.1 레이어 분리
__2.3.2 자바스크립트 효율적으로 처리하기
__2.3.3 요청 묶어서 처리하기
_여정 돌아보기

3 리액트
_3.1 리액트와 리액트가 아닌 것
__3.1.1 리액트는 번들러가 아니다
__3.1.2 리액트는 스타일링 도구가 아니다
__3.1.3 리액트는 서버가 아니다
__3.1.4 리액트는 검색 엔진 최적화 도구가 아니다
__3.1.5 리액트는 그래픽이나 3D 렌더링에 최적화된 도구가 아니다
__3.1.6 리액트는 UI를 위한 웹과 네이티브 라이브러리이다
_3.2 리액트의 동작 원리
__3.2.1 전체적인 그림
__3.2.2 가상 돔
__3.2.3 리액트라는 거대한 생태계
__3.2.4 리액트 렌더링 작업과 스케줄링
__3.2.5 리액트의 척추, 파이버 아키텍처
_여정 돌아보기

4 Next.js
_4.1 라이브러리와 프레임워크의 차이
__4.1.1 라이브러리
__4.1.2 프레임워크
__4.1.3 프레임워크로서의 Next.js
_4.2 검색 엔진 최적화와 서버 사이드 렌더링
__4.2.1 검색 엔진의 동작 방식
__4.2.2 서버 사이드 렌더링이란
__4.2.3 서버 사이드 렌더링의 동작 방식
_4.3 Next.js가 해결하는 문제
__4.3.1 이미지를 최적화하는 next/image
__4.3.2 폰트를 최적화하는 next/font
_여정 돌아보기

5 인프라 구조
_5.1 서비스가 지구 반대편에서도 잘 동작하려면
__5.1.1 나와 내 지인에게 필요한 서비스 제공하기
__5.1.2 대한민국의 전 국민이 사용하는 서비스 제공하기
__5.1.3 베트남에서도 사용하는 글로벌 서비스 제공하기
_5.2 마이크로서비스 아키텍처
__5.2.1 마이크로서비스 아키텍처란 무엇인가
__5.2.2 클라우드 네이티브 컴퓨팅 파운데이션
__5.2.3 컨테이너 오케스트레이션
__5.2.4 서비스 메시
__5.2.5 서비스 모니터링
__5.2.6 API 게이트웨이
_여정 돌아보기

안티프래질은 '충격을 가하면 더욱 단단해지는'이라는 뜻이 있다.

안티프래질이 어떤 의미인지 프런트엔드와 어떤 연관이 있는지 설명해 두었다.

안티프래질과 프런트엔드

 

프런트엔드가 알아야 할 기초적인 내용이 나와 있다.

브라우저와 렌더링 과정

 

그리고 프런트엔드를 공부하면서 가장 궁금했던 DOM과 CSSOM에 대한 설명이 나와있다.

DOM과 CSSOM에 대한 설명

 

리액트가 무엇인지, 리액트가 어떻게 동작하는지 가상돔에 대한 설명이 나와 있다.

리액트와 가상돔

 

Next.js가 무엇인지에 대한 설명이 나와 있다.

라이브러리와 프레임워크에 대해서도 잘 나와 있다.

Next.js와 라이브러리,프레임워크

 

SEO에 대한 설명이 나와있다.

SEO 최적

 

 

 


[책 후기]

가려웠던 곳을 후련하게 긁어줬던 책이었다.

프런트엔드 공부를 하면서 항상 막연하게 알고 있던 개념들을 이 책을 통해 하나씩 정리할 수 있었다.

특히 브라우저 렌더링 과정, DOM과 CSSOM의 구조를 알 수 있었고 리액트와 Next.js의 내용을 정리할 수 있었다.

각 장마다 브라우저, 리액트,Next.js, 인프라 구조로 이어지는 흐름이 체계적이라 프런트엔드의 전체 그림을 그리기에 적합했다.

 


[추천 대상]

  • 웹과 리액트,Next.js의 흐름을 알고 싶은 분
  • 기본을 다지고 싶은 개발자
  • 성능 관리, 안정성 점검, 장애 대응 등 유지보수 기술까지 논리적으로 파악하고 싶은 분

[마무리]

'안티프래질'이라는 단어처럼 빠르게 변화하는 기술 속에서 단단하게 성장하는 개발자의 자세를 가질 수 있었다.

이 책은 프론트엔드에 대한 본질을 이해하고 개념을 확실하게 잡는 데 큰 도움을 준 소중한 시간이었다.

 


#서평단 #출판사 #협찬 #도서제공


잘못된 정보는 댓글에 남겨주시면 감사하겠습니다!☺️

댓글과 좋아요는 큰 힘이 됩니다!

728x90
반응형
Comments