React Native (3) 썸네일형 리스트형 [React Native] requirements ReactDom 라이브러리를 가져와 사용할때 - ReactDOM.render() : react element를 가지고 html로 만들어 배치하겠다는 뜻 - 사용자에게 보여준다는 뜻 const root = document.getElementById("here"); const span = React.createElement("span"); ReactDOM>render(span, root): 위 코드는 here 이라는 아이디를 가지는 html속성에 react의 span을 넣겠다는 코드입니다. [React Native] 리액트네이티브 원리 (Rendering lifecycle) 어떻게 동작 할까? 먼저 리액트의 특징 중 하나인 virtual DOM에 대해서 알아야 한다. 이는 화면이 어떤 모습이어야 하는지 개발자가 작성한 내용과 실제 화면에 랜더링 되는것 사이에 존재하는 레이어에 해당한다. 리액트는 페이지의 변화를 바로 렌더링 하지 않고 먼저 메모리에 존재하는 가상 dom에서 변화가 필요한 곳을 계산하고 필요한 최소한의 변경사항만 렌더링 한다. 출처 : https://programmingwithmosh.com/react/react-virtual-dom-explained/ Virtual DOM 대부분의 개발자 분들은 성능 최적화가 주된 역할이라고 생각하지만 추사화라는 측면에서 더 큰 잠재력이 있다. 마약 리액트가 브라우저의 dom이 아닌 다른 타겟으로 렌더링하면 타겟과 상관 없이.. [React Native] 리액트 네이티브란?? 리액트 네이티브는 iOS와 안드로이드에서 동작하는 네이티브 모바일 앱을 만드는 자바스크립트 프레임워크입니다. 사용자 인터페이스를 만드는 페이스북의 자바스크립트 라이브러리인 리액트에 기반을 두고 있습니다. 하지만 웹이아닌 모바일 플랫폼이 타겟입니다.이미 페이스북 airebnb등은 리액트 네이티브로 만든 앱을 제공하고 있습니다. 장점 대상 플랫폼의 표준 렌더링 API를 사용한다. -> 자바스크립트 HTML, CSS를 사용하여 모바일 앱을 만드는 기존의 방법들은 웹뷰를 이용하여 렌더링 한다. 런 기존 방식은 앱을 실행할따 성능이 떨어진다. 대상 플랫폼이 UI요소들을 대개 이용하지 않는다. 이러한 프레임워크들은 네이티브 UI요소들을 흉내 내려 하지만 output은 보통 좋지않다. 하지만 리액트는 메인UI스레드와.. 이전 1 다음
