본문 바로가기
반응형

개발자 일기/React3

리엑트 네이티브 attribute = props = {} REAT(Virtual DOM) -> HTML(VIEW) JSX를 HTML로 렌더링 리엑트 네이트브 : JSX -> REACT NATIVE(Vitual DOM) -> ANDROID or iOS view JSX를 네이티브 뷰 형태로 렌더링 즉, JSX를 통해 어떤 뷰로 렌더링 하는 것! 이 핵심 데이터 처리는 자바스크립트가 수행하고 뷰와 자바스크립트 엔진을 연결하는 브릿지(Bridge)가 존재 Javascript Engine(DATA) Bridge Native View 리엑트 네이티브는 Bridge를 다루는 것에 중점을 두고 있다. https://reactnative.dev/docs/environment-setup React Native · A framework f.. 2020. 7. 4.
JSX Javascript + XML, ECMA Script 6 표준 사용, JSX내에 스타일시트를 포함함, 웹의 CSS와 많은 개념을 공유하지만 독자적인 포맷, CSS파일로 작성 불가 JSX 사용 시 주의 점 1. 컴포넌트에서 여러 Element를 렌더링 할때 꼭 Container element안에 포함시켜야 한다. " Container element : , , , , , , and more. " 예를들어 reder 함수안에 를 사용하지 않고 코드 사용시 에러가 발생한다. 이유는, Virtual DOM에서 컴포넌트 변화를 감지해 낼 때 효율적으로 비교할 ㅅ ㅜ있도록 컴포넌트 내부는 하나의 DOM 트리 구조로 이뤄져야 한다는 규칙 때문 2. jsx안에서 javaSript를 표현 할때, {} 로 wrapping .. 2020. 6. 30.
Virtual DOM 리엑트가 왜 필요한가에 대해 가장 명확하게 설명해주는 기능이지 않을까? 내가 관리하는 페이지중 2015년개발 된 페이지가 있는데, HTML5 + Jquery + CSS3 정도의 구성으로 개발 됐다. 크게 동적인 기능이나 복잡한 구현이 필요 없었고 DOM형식으로 충분히 커버가 가능했던 것 같다. 하지만 최근들어 요구사항이 많아지 리뉴얼 해야 하는 이슈에 도달했다. 이유는 다양하겠지만, 가장 큰 것은 '가독성' 문제 일 것이다. 과거, 온라인에서 특정 서비스를 이용한 다는 것은 목적과 결과를 얻기 위한 과정으로 보여지는 것에 대한 복잡도는 어느정도 인내해야 했다. 그리고 대부분의 서비스들은 그렇게 만들어졌다. 가독성보다 업무의 효율과 빠른 결과를 나타내기 위한 과정으로 말이다. 때문에 화면에 덕지덕지 붙어서.. 2020. 6. 30.
반응형