[TIL/React] 2023/01/02

1. React란, 무엇일까?

라이브러리는 익히 도서관이라는 의미를 지니고 있다. 도서관이 정보집합의 공간이라고 해석한다면, 프로그래밍에 있어서 라이브러리란 무엇일까? 바로 프로그래밍에 필요한 정보집합의 공간일 것이다.

React는 기본적으로 Javascrip 라이브러리이다. Javascript에 필요한 정보집합의 공간이 바로 React인 것이다. "컴포넌트"라 불리는 정보의 파편을 이용하여 복잡한 UI를 구성하도록 돕는 역할은 한다.

이러한 React는 SPA를 전제로 하며, Virtual DOM을 활용한다는 특징을 갖고 있다.

2. React 초기설정

자바스크립트 코드는 Node라는 플랫폼에 의해서 실행된다. 따라서 16.x.x LTS 버전을 설치해주었다. 노드가 잘 설치되었는지 확인하기 위해 터미널(Mac)에서 node -v 라는 코드를 입력해서, 잘 설치되었음을 알 수 있었다.

추가적으로 NPM(Node Package Manager)를 설치해야 했는데, NPM과 역할은 동일하지만 성능적으로 개선된 YARN을 설치해주었다. 터미널에 "npm install -g yarn"을 입력하면 설치되지만, 나의 경우 반복적으로 에러가 발생했다.

구글에 "맥 npm install -g yarn 에러"를 검색해서 'HOMEBREW"의 설치가 선행되어야 함을 스스로 파악하고 다시 설치해보니 정상적으로 작동했다. ~~부끄럽지만 뭔가 구글링으로 문제를 해결해봤다는 뿌듯함 ㅋㅋ~~

3. Create React App

CRA(Create-React-App)이란 리액트 프로젝트를 하기 위해 필요한 여러 프로그램을 자동으로 설치해주는 도구이다. 터미널(Mac) 상에 "yarn create react-app week-1"이라는 코드를 입력하여 새로운 프로젝트를 생성했다.

(VScode-> 터미널-> 새 터미널)에서 'yarn start'를 입력하니 브라우저가 자동으로 열리면서 첫 리액트 앱이 실행되었다.

회고

모든 공부가 처음은 쉬울 것이라는 편견을 보란듯 깨버린, 꽤나 쓰라린 시간이었다. 하지만 별 수 있나... 모르면 또 보고, 또 생각하는 지난한 과정의 반복만이 유일한 지름길이라는 것을 너무도 잘 알고 있기에...

내일부터는 내가 예상했던 필요 공부시간을, 다른 활동들을 조금 제한하고서라도 더욱 확보해야겠다는 생각을 했다.