읽은 책 소감 - React.js, 스프링 부트, AWS로 배우는 웹 개발 101

 

  읽은 목적은 React를 배우기 위해서였다. 기존 스프링 부트와 함께 jsp를 사용해 js 위주로 짜는 프론트는 사실 좀.. 안멋있다. 개인 취향이다ㅋㅋ. 별로 상세하게 파고들어서 알고싶은 마음이 들지 않았다. 그래서 유명한 리액트는 내 입맛에 좀 맞을까 싶어서 한번 배워보고 싶었다.

 

  한글로 된 리액트 책 중에 괜찮아 보이는게 별로 없었다. 그렇다고 원서를 읽자니 초반에야 열심히 읽겠지만, 이후 열정과 집중력이 좀 떨어졌을 때 끝까지 읽을 자신이 없었다. 그래서 어쨌든 한글로 된걸 선택하기로 했다.

 

  추가로 내 입장에서 백엔드는 node.js로 하는 것 보다는 스프링 위주가 내겐 여러모로 더 유리하다고(사실 취향임ㅋ) 판단했다. 따라서 리액트도 배워보면서, 스프링 + 리액트로 Decoupled Architecture로 구성된 프로젝트를 제작해보는 이 책을 선택했다.

 

  결론적으로 말하면, 내겐 좋은 책이었지만 책만 보고 따라하면서 리액트를 처음 배우려는 사람에게는 추천하지 않는다. 이 책은 클래스형 리액트 코드로 되어있다. 하지만 이미 리액트에서도 함수형을 사용하라고 추천한 이상, 클래스형 리액트 코드는 모던하지 않고, Deprecated 된 상태나 마찬가지이다. 따라서 내 경우엔 ES6~ES12까지의 변화점을 찾아보고(여기에 정리해두었다.), 리액트 함수형(Arrow function 스타일로)을 따로 인터넷 강의를 통해 익힌 후 이 책의 로직은 모두 따라하되, 아예 코드는 함수형으로 새로 짜고 ES6~ES12의 코드를 적극적으로 도입하면서 진행했다.

 

  예를들어 아래와 같은 차이이다. 위에서부터 함수형 코드, 클래스형 코드, 함수형(Arrow function) 코드이다. 별 차이가 아니기도 하지만, 어쨌든 책을 그대로 따라하는 것과 새로 짜는것은 차이가 크다. 또 state 사용법(이하 코드에선 클래스에서만 state를 사용했다), mount 등에서 차이가 꽤 있다.

import React from 'react';

function Test({name}) {
    return (
        <div>
            name (function) :  {name}
        </div>
    )
}

class TestWithClass extends React.Component {
    constructor(props) {
        super(props);
        this.name = props.name;
    }

    render() {
        return (
            <div>
                name (class) : {this.name}
            </div>
        );
    }
}

const TestWithArrow = ({name}) => {
    return (
        <div>
            name (arrow) : {name}
        </div>
    )
}

export default Test;

 

---

  내겐 정말 좋은 책이었다. 왜냐면 최대한 모던한 형태로 배우고 싶었기에 어쩔수없이 책 이외에 많은 자료들을 찾아보게 되었고, 내가 좋아하는 형태로 설명된 부분이 많이 있기 때문이다(행복회로인가?). 그리고 이 저자분.. TMI가 상당히 자주 있다. 갑자기 빠져서 설명을 쫙 해주는데, 내가 매우 좋아하는 형식이다 ㅋㅋ. 난 이론 뿐 아니라 기본 배경부터 이게 왜 생겼는지 부터 알고 이론을 익히는걸 선호한다. 그러니 코드만 주르륵 나열된 책보다는 이렇게 누군가에겐 TMI 일수도 있는 배경 정보를 많이 담은 책이 좋다. 

 

  사실 책을 다 읽은건 꽤 됬다. 1차적으로 이걸 보면서 몇몇 코드들은 변경하고 추가할 부분 추가하면서 개인 프로젝트를 진행했고, 그걸 기반으로 실제 프로젝트도 성공적으로 마친 상태이다(실제 프로젝트는 private으로 공개할 수 없고, 개인 프로젝트는 백엔드(깃헙), 프론트(깃헙)에서 볼 수 있다. 특히 프론트는 함수형으로 컨버팅해서 작업했으므로 혹시 이 책을 함수형으로 짜고싶다면 참고할 수 있다.). 물론 실제 프로젝트 진행에 쓰기에는 이 책 외에 추가로 많은 자료를 찾아보긴 했지만, 어쨌든 이 책도 많은 도움이 되었다.

 

 

* 추천 : node.js 보다는 스프링쪽에 리액트를 붙여보고 싶은 사람. 리액트를 기본적으로 어느정도 알고 있거나, 책만 보지 않고 추가로 자료들 찾아보며 함수형으로 컨버팅해서 작성할 수 있는 사람.

 

* 비추천 : 아직 개발자로써 경험이 적어 응용력이 부족해 책에 있는 내용만 따라하면서 익혀보고 싶은 사람(클래스형으로 배워도 문제는 없을 것이다. 하지만 이미 리액트에서 공식적으로 함수형을 추천했으므로 클래스형 코드는 deprecated 된 상태나 마찬가지다.)