<aside> ⭐ 학습목표

• web의 역사 (browser 렌더링, AJAX, DOM, Virtual DOM)
• react 기본 기념 (render(), jsx, hooks)
• 이력서 관련 팁 </aside>

<aside> 💬 TIL

이번 강의는 기본적인 내용을 많이 다뤄서 이해하는데 어렵지는 않았지만, 익숙해서 놓칠 수 있었던 개념에 대해 다시 생각해보고 정리할 수 있는 계기가 되었다. 만약 1년전 같은 내용을 들었더라면 당시에는 잘 몰라서 어려웠던 부분이 많이 있었을 것 같다는 생각이 들었다.

복습을 하며 정리를 하다보니 어렵지 않다고 생각했지만, 생각보다 헷갈리고 설명할 수 없던 개념들도 많았던 것 같다. 예를 들어 AJAX나 commonJS와 module이 무엇인지는 지금도 설명하기 어렵다. 다시 공부해봐야겠다.

그리고 최근에는 React 함수형 컴포넌트를 사용하다보니 리액트의 라이프 사이클이나 render 함수에 대해서도 더 공부해봐야겠다는 생각이 들었다.

React 패키지 까보기

• AJAX와 Node.js의 module commonJS 더 학습 필요!
• useMemo, useCallback 또한 자주 사용하지 않아서 활용이 잘 되지 않는 것 같다. 멘토님은 실무에서 useCallback을 비교적 많이 쓰는 것 같다고 하셨다.
• React로 개발을 하고, 모바일 시장에도 관심이 있다면 React Native를 공부해서 포폴만드는 것도 추천해 주셨다.
• 이력서 피드백 시간이 정말 많은 의견을 주셨는데, 그 중 일부는 지금껏 들어왔던 다른 멘토님들의 의견과 다른 부분도 있어서 고개를 갸웃하거나 사실 조금 불편한(?) 부분도 있었다. 사람마다 의견이 다르기 때문에 여러 사람의 의견을 들어볼 수 있다는 것도 프리온보딩의 장점 같다. 정답은 없다고 생각한다. </aside>

📖 table of contents

1. web의 역사 (browser 렌더링, AJAX, DOM, Virtual DOM)

💡 들어가기 전에 잠깐, Why React?

npm trends

React의 npm 점유율은 다른 자바스크립트 프레임워크/라이브러리와 비교해 월등히 높다. 즉, 많은 사람들이 사용해 왔으며, 여전히 사용하고 있다는 것!

React는 프론트엔드에 입문하기 좋은 라이브러리 이며, Next.js로 SSR을, React Native를 통해 모바일 앱 또한 개발할 수 있다는 장점이 있다.

1-1. History of web

https://github.com/ManzDev/frontend-evolution

▪️AJAX(1999)

• 비동기 자바스크립트 및 XML (Asynchronous JavaScript and XML)

  → “웹 애플리케이션에서 서버와 비동기로 통신하여 페이지 일부를 업데이트하는 접근 방식”

• XHR (XMLHttpRequest) 객체를 사용하여 비동기 요청을 만드는 표준 방식

• Javascript를 이용해 서버와 브라우저가 비동기 방식으로 데이터를 교환할 수 있는 통신 기능