Daehyunii's Dev-blog

[리액트를 다루는 기술] TIL-126 본문

✏️ 2022. TIL/December (데브코스)

[리액트를 다루는 기술] TIL-126

Daehyunii 2022. 12. 20. 00:55
리다기를 읽기 시작했다.

  오늘부터 리액트를 다루는 기술을 읽기 시작했다. 기존에 리액트를 접한 경험이 없었기 때문에, 데브코스에서 리액트를 본격적으로 다루기 전에 기본적인 내용을 학습하는것이 좋다는 판단이 들어 인프런에서 '제로초' 리액트 강의를 들었고 지금은 데브코스를 통해서 리액트 강의를 들으며 공부하고 개별적으로 '리액트를 다루는 기술'을 같이 읽기 시작했다. 오늘은 리액트의 특징과 JSX 기본적인 문법들에 대해서 공부했다. 

 

2022.12.20 - [📚 Language & CS knowledge/React] - JSX란?

 

JSX란?

JSX란? 자바스크립트의 확장 문법이며 XML과 매우 유사하다. 우선 JSX는 브라우저에서 실행되기 전 번들링되는 과정에서 바벨을 통해 일반 자바스크립트 형태의 코드로 변환된다. 다음 예제를 살

pinetree93.tistory.com

 

  나는 개인적으로 책을 읽는것을 굉장히 선호하는 편이다. 강의를 통해서 공부를 할 때는 대부분 실습을 중심으로 강의를 이어가는 경우들이 대부분인데, 책을 통해서 공부를 하다보면 전반적인 원리들에 대해서 이해할 수 있는 경우가 많기 때문이다.(공식 문서도 그래서 좋아한다.) 그래서 리액트를 다루는 기술 책을 같이 읽기 시작한것이고 오늘은 리액트의 특징들에 대해서 알 수 있었던 것 같다.

 

  특히 리액트의 장점을 개념적으로 정리할 수 있었다. 우선 Vanilla JavaScript를 통해 개인 프로젝트를 진행했던 경험과 그 동안의 코드 작성을 통해 느낀것은 state를 관리하는 것이 생각보다 매우 어렵다는 점이다. 그리고 state의 변화가 있으면 이를 다시 리렌더링 해주어야 하는데 구현하는게 쉽지가 않았던것 같아 커스텀 이벤트를 남발한 경험이 있다. 이런 점에서 리액트의 가장 큰 장점은 state가 변화하면 다시 그려준다는 점이다. 

 

  이를 위해 React는 Virtual DOM을 사용한다. Virtual DOM을 사용하면서 실제 DOM에 접근하여 조작하는 대신, 이를 추상화한 자바스크립트 객체를 구성해서 사용한다. 마치 사본을 만드는 것과 비슷하다. 그리고 데이터를 업데이트하면 전체 UI를 Virtual DOM에 리렌더링하고 이전의 Virtaul DOM과 비교해서 바뀐 부분만 실제 DOM에 적용한다. 이를 통해 DOM 처리 횟수를 최소화하고 효율적으로 진행한다. 여기까지가 책에 나오는 장점인데 '사실상 개발자에게 있어서 가장 좋은 점은 업데이트 처리 간결성이 아닐까 하고 생각한다!'

 

  그리고 다른 장점으로 리액트는 다른 프레임워크나 라이브러리와 혼용해서 사용할 수 있다는 점이다. 단점은 그 만큼 공부할 내용이 많아진다(?)는 점일 수 있겠다...ㅎ... 그런데 사실 아직은 리액트의 기본기를 익히는 중이고 다른 프레임워크들에 대한 지식이 부족하다 보니 리액트의 장/단점을 명확하게 할 수는 없다. 하지만 앞으로 꾸준히 깊이 있게 공부하여 리액트에 대한 전반적인 이해도를 높여 갈 생각이다.!  

 

 

오늘을 마무리 하며

 

  내가 현재 리액트를 선택해서 공부하는 이유는 아직은 개발 시장에서 리액트를 많이 선호하기 때문이다. 그래서 리액트를 잘 다룰 수 있는 개발자로 성장하고 싶다. 하지만 리액트만 잘 다룰 수 있는 개발자가 되고 싶은것은 아니다. 자바스크립트의 깊이 있는 이해도와 함께 리액트도 잘 다룰 수 있게 된다면 다른 라이브러리 그리고 나아가 다른 프레임워크들을 익히고 학습하는데 큰 도움이 될 것이라고 생각한다. 때문에 리액트와 자바스크립트의 문법들을 공부하고 복습하면서 열심히 해 볼 생각이다!!!☺️ 아직은 처음 사용해보는 라이브러리, 번들러, 바벨, 기타 패키지들 때문에 머리속에 정리가 쉽게 되고 있지는 않지만 처음 개발 공부를 했을때도 비슷했던 것 같고 점차 익숙해져 갔던 것 같다. 너무 복잡하게 생각하지 말고 천천히 하나 하나 리액트도 공부해 나갈 생각이다! 🌤