항해99 3주차 회고

이번 주차부터 React를 본격적으로 배웠다.

React가 뭐고 설치 방법 그리고 component와 useState훅을 배웠다.

우선 React를 쓰기전에 DOM과 Virtual DOM에 대해 알아야 했다.

DOM(Document Object Model) 문서 객체 모델

말 그대로 HTML이나 XML문서를 나타내는 API라고 한다.

문서 객체 모델 - 위키백과, 우리 모두의 백과사전

위키백과, 우리 모두의 백과사전. 문서 객체 모델(영어: Document Object Model 도큐먼트 오브젝트 모델[*], DOM)은 XML, HTML 문서의 각 항목을 계층으로 표현하여 생성, 변형, 삭제할 수 있도록 돕는 인터

ko.wikipedia.org

내가 작성한 HTML을 브라우저에 렌더링 될때 DOM이라는 API를 거쳐 내가 의도한 UI대로 화면에 렌더링 된다고 이해했다.

그럼 Virtual DOM은 무엇일까?

말 그대로 가상의 돔이다...

리액트에서 쓰이는 기술로 사용자가 이벤트를 발생시켜 렌더링 될때 가상의 돔을 만들어 실제돔과 비교해서 바뀐 부분 만 바꿔서 화면에 나타낸다고 이해했다.

[React] 가상돔 Virtual DOM이란?

가상 돔(Virtual DOM) 이란? Virtual DOM을 사용하면 실제 DOM에 접근하여 조작하는 대신, 이를 추상화한 자바스크립트 객체를 구성하여 사용 ✅ 실제 DOM의 가벼운 사본 DOM의 상태를 메모리에 저장하고

dev-cini.tistory.com

이렇게 리액트가 어떻게 돌아가는 기술인지를 아는데 시간을 많이 소비했다.

그리고 과제를 진행하면서 component와 useState의 숙련도를 올렸다.

과제는 어떻게 제출 할지 궁금했는데 서버리스를 이용해 배포 url을 제출했다.

서버리스란

서버를 업체에서 대행으로 실행 시켜준다

예전엔 서버용 컴터를 사서 아파치톰캣으로 서버를 돌렸는데... 요즘은 서버리스를 많이 이용하는거같다.

하긴 그게 더 안전하겠지...

저번주에는 알고리즘만 풀다보니 지루했는데

새로운 기술을 배우고 과제 프로젝트를 진행해서 재미있었다.

빨리 끝나고 프로젝트 진행하는 시기가 왔으면...

개발정리