초보자를 위한 리액트 200제

초보자를 위한 리액트 200제
이정열 지음 / 정보문화사 / 2021년 2월

완전 초보자도 웹 프로그래밍을 할 수 있을까요.

사실 "초보자를 위한"이란 문구에 꽂혔어요. <초보자를 위한 리액트(React) 200제>는 리액트를 시작하는 사람들을 위한 입문서예요.

우선 리액트(React)란 무엇일까요. 

리액트는 웹 페이지에서 눈에 보이는 영역인 프런트엔드에 특화된 언어라고 해요. 페이스북에서 제공하는 자바스크립트 사용자 인터페이스 라이브러리, 즉 리액트 프론트엔드 라이브러리예요. 웹 페이지를 만들기 위해서 굳이 프론트엔드 라이브러리를 사용하지 않아도 순수 자바스크립트만으로 얼마든지 제작할 수 있다고 해요. 하지만 요즘처럼 복잡하고 동적인 웹 어플리케이션은 사용자 인터페이스를 동적으로 나타나기 위한 관리가 필요하기 때문에 리액트가 효과적이라는 거예요. 리액트의 장점은 코드 이식과 재활용성이 높고 출력 속도가 빠르기 때문에 사용자와 상호작용에 유리하다고 해요. 리액트를 사용하면 브라우저 전체를 새로고침 하지 않고도 컨텐츠를 빠르게 변경할 수 있다고 하네요. 

이 책은 리액트 설치부터 기초 과정뿐 아니라 개발과 배포까지 실무 응용을 학습할 수 있도록 구성되어 있어요.

기능별로 완성된 코드를 200개 예제로 제공하고 있어서 예상치 못한 오류나 구현 방법을 찾느라 소모하는 시간을 최소화할 수 있다는 장점이 있어요.

처음 리액트 설치를 한다면 nodejs 공식 웹 사이트 (https://nodejs.org/en/downdload/releases)에 접속하여 다운로드 받을 수 있어요.

최신 버전을 사용해도 괜찮지만 책에서는 예제 사용을 위해 14.4.0 버전을 권장하고 있어요. 64비트 윈도우 운영체제인 경우에는 node-v14.4.0-x64.msi를 다운로드하면 돼요. 리액트 서버를 실행하기 전에 src 폴더의 index.js 파일을 열어 <React.StrictMode>, </React.StrictMode> 태그를 삭제하는데, 그 이유는 Strict 모드가 애플리케이션 내의 잠재적 문제를 알아내기 위한 도구로 나중에 배울 생명주기 함수를 여러 번 실행하는 원인이 되므로 사용하지 않는 것이라고 해요.

홈 화면에서 리액트에 사용하는 함수와 문법을 공부하고 예제를 통해 페이지를 구성하는 컴포넌트 개념을 배울 수 있어요. 컴포넌트의 생성부터 소멸까지의 과정을 '생명주기'라고 하며, 생명주기에 실행되는 생명주기 함수의 실행 순서를 예제를 통해 확인하면서 하나씩 학습하는 거예요. 왕초보답게 책에 나온 내용을 그대로 적용하면서 실행 순서를 확인하는 것이 학습 과정이에요. 웹 개발 공부를 처음 해보는 사람이 교재 한 권으로 독학한다는 것이 쉬운 일은 아니지만 단순하게 리액트와 친해지는 것을 목표로 하니 부담 없이 시작할 수 있네요. 리액트 개념을 단위별로 200개의 예제로 나누어 하나씩 차근차근 구현해가기 때문에 각 기능에 활용되는 기술과 프로세스를 이해하는 데에 도움이 되는 것 같아요. 처음에는 복잡하고 어려워서 사용되는 용어들이 외계어처럼 느껴지는데, 무엇이든지 반복하면 익숙해지기 때문에 200개 예제를 모두 끝낼 수 있도록 인내심과 끈기를 가지면 좋을 것 같아요. 예제를 모두 실행해보면 리액트 기본 개념은 머릿속에 정리가 될 것 같아요. 리액트는 자바스크립트 기반의 언어라서 리액트를 잘하면 자바스크립트 실력도 자연스럽게 향상된다고 하니 더욱 의욕이 생기네요. 

코딩을 배워본 적 없는 초보자들을 위한 입문서답게 예제 200개를 그대로 따라 하기만 하면 웹 프로젝트를 구현할 수 있어요. 또한 실무 파트에는 웹 프로그래밍의 완성인 서버 배포에 관한 가이드가 추가되어서 많은 도움이 되네요.