React

JSX : 자바스크립트의 확장 문법이며 브라우저에서 실행전 번들링에서 바벨을 통해 일반 JS형태로 바꿈 JSX를 사용하면 React.creatElement함수를 사용할 필요가 없기에 편하게 UI렌더링 가능 JSX는 JS문법이 아니다 (바벨로 사용할 수 있게 설정한 것이다) 더보기 ReactDOM.render 컴포넌트 페이지에 렌더링 하는 역활 첫번째 파라미터에서 페이지에 렌더링할 내용을 JSX로 작성 두번째 파라미터에서 해당 JSX를 렌더링할 도큐먼트 내부요소 작성 React.StrictMode 리액트 프로젝트에서 리액트의 래거시 기능들을 사용하지 못하게 하는 기능 나중에 사라질 문자열 ref, componentWillMount 등을 사용했을 때 경고를 출력 JSX의 장점 1️⃣보기쉽고 익숙하다 2️⃣더..

리액트의 주요 특징 중 하나는 Virtual DOM을 사용하는 것이다. 먼저 DOM에 대해 알아보자 DOM(Document Object Model) : 객체로 문서 구조를 표현하는 방법이며 XML이나 HTML로 작성된다. 트리형태로 구성되며 특정 노드를 찾거나 수정, 제거가 가능하고 원하는 곳에 추가 가능하다. 웹브라우저는 DOM을 활용하여 객체에 JavaScript와 CSS를 적용한다. 💢규모가 큰 웹 어플리케이션에서 DOM이 느린이유 - DOM 자체는 JavaScript와 비교했을 때 느리지 않다. 하지만 웹브라우저 단에서 DOM에 변화를 감지하여 브라우저가 CSS를 재연산, 레이아웃 재구성, 페이지 리페인팅 하는 과정으로 느려지는 것이다. 🔰해결법🔰 - DOM조작시 웹을 업데이트하면 성능저하가 발생..

먼저 기본적으로 알고 들어가야할 정보들을 정리해 보자 프래임워크들은 주로 MVC(Model-View-Controller), MVVM(Model-View-View-Model) 아키택처를 사용한다. 예외적으로, Angular는 MVW(Model-View-Whatever) 아키택처로 어플리케이션 구조화 한다. ※Whatever는 View와 Model을 중개하는 역활을 수행하며 Controller, View, Model 등 다양한 방식의 페턴으로적용됨 MVC 아키텍처 - 개발할때, 3가지 형태로 역활을 나누어 개발하는 방법. - 반영 과정에서 보통 뷰를 변경함 장점 - 비즈니스 처리로직과 사용자 인터페이스 요소들을 분리시켜 서로 영향없이 개발하기 수월한 장점. - 단순하고 직관적임 단점 - View와 Model..