728x90 ReactNative6 [ReactNative] 리액트 네이티브 로컬 개발 환경 설정 2가지 방법(create-react-native-app, 기본적인 방법)과 실행 리액트 네이티브 개발 환경 설정 방법은 크게 두가지로 나눌 수 있습니다. 첫번 째는 Create React Native App이라는 도구를 사용하는 방법이고 두번 째는 React-Native init 명령어를 이용하여 프로젝트를 생성하는 아주 전형적인 개발 환경 설정입니다. 교육적인 목적이나 프로토타이핑을 생각하는 초심자는 Create React Native App를 추천! 리액트 네이티브 앱을 전문적으로 사용하거나 자바스크립트와 자바, 오브젝티브-C 혹은 스위프트(Swift)코드와 같은 네이티브 코드를 함께 사용하는 하리브리드 앱을 작성하게 된다면 결국 init 명령어를 이용하여 프로젝트를 생성하는 전형적인 개발 설정을 사용하게 될 것 입니다. Create React Native App Create R.. 2021. 9. 2. [ReactNative] 리액트 네이티브 대상 플랫폼 API 리액트 웹과 리액트 네이티브의 가장 큰 차이점은 대상 플랫폼 API를 대하는 방식입니다. 웹 환경에서는 아직도 브라우저마다 표준 기술을 지원하고 있는 정도가 다른데 이런 파편화 특성은 해결해야 하는 문제로 취급됩니다. 이와 달리 리액트 네이티브에서는 해당 플랫폼에서만 지원하는 플랫폼 특유의 API는 멋지고 자연스러운 사용자 경험을 만듦에 있어 중요한 열쇠가 됩니다. 물론 여기에도 고려해야 할 사항이 많은데 모바일 API는 데이터 저장소, 위치 서비스, 카메라와 같은 하드웨어 접근에 대한 모든 것을 포함하고 있습니다. 기본적으로 iOS와 안드로이드를 위한 리액트 네이티브는 일반적으로 많이 사용되는 기능을 대부분 지원하고 있습니다. 그리고 리액트 네이티브는 비동기 네이티브 API도 지원합니다. 그리고 대상 .. 2021. 9. 1. [ReactNative] 리액트 네이티브 컴포넌트 만들기 (뷰 작업, JSX 사용, 네이티브 컴포넌트 스타일링) 모든 리액트의 코드는 리액트 컴포넌트 안에 존재합니다. 리액트 네이티브 컴포넌트는 일반적인 리액트 컴포넌트와 대부분 비슷하지만 렌더링과 스타일 적용 방법에서 큰 차이가 있습니다. 뷰 작업하기 리액트를 이용해서 웹 페이지를 만들 떄는 일반적인 HTML요소 (, , 등)를 사용하여 렌더링 합니다. 리액트 네이티브는 이러한 요소 대신에 플랫폼에 종속적인 리액트 컴포넌트를 사용합니다. 리액트 리액트 네이티브 , , 자식 아이템 가장 기본적인 컴포넌트는 크로스 플랫폼 인데, 단순하고 유연한 UI 요소로 와 유사합니다. 컴포넌트는 iOS에서는 UIView로 렌터링되고 안드로이드에서는 VIEW로 렌더링 됩니다. 다른 컴포넌트들은 특정 플랫폼에서만 동작합니다. 예를 들어 는 iOS의 표준 날짜 선택기를 렌더링합니다. .. 2021. 8. 30. [React Native] 리액트 네이티브 동작 원리(DOM, bridge, 렌더링 라이프 사이클 ) 기술적인 측면에서 리액트 네이티브의 동작 원리를 이해하려면 먼저 리액트의 특징 중 하나인 가상(Virtual) DOM에 대해 알아야 합니다. 리액트에서 가상 DOM은 '화면이 어떤 모습이어야 하는지 개발자가 작성한 내용과 실제 화면에 렌더링되는 것 사이에 존재하는 레이어'에 해당됩니다. 브라우저에서 상호작용하는 사용자 인터페이스를 렌더링하기 위해서 개발자는 반드시 브라우저의 DOM(Document Object Model)을 수정해야합니다. 하지만 과도한 DOM 수정은 심각한 성능 저하를 유발합니다. 리액트는 페이지의 변화를 바로 렌더링하지 않고 먼저 메모리에 존재하는 가상 DOM에서 변화가 필요한 곳을 계산하고 필요한 최소한의 변경사항만 렌더링 합니다. state 변경 -> 차이점 계산 -> 다시 렌더링.. 2021. 8. 24. [React Native] 리액트 네이티브란? 개념과 특징, 장단점 ! 리액트 네이티브란?! 리액트 네이브는 'iOS와 안드로이드에서 동작하는 네이티브 모바일 앱을 만드는 자바스크립트 프레임워크'입니다. 리액트 네이티브는 사용자 인터페이스를 만드는 페이스북의 자바스크립트 라이브러리인 리액트에 기반을 두고 있는데, 브라우저가 아닌 모바일 플랫폼이 타깃입니다. 즉, 웹 개발자가 익숙한 자바스크립트 라이브러리를 이용하면서 겉모습과 실제 동작까지 진짜 네이티브인 모바일 앱을 만들 수 있습니다. 게다가 작성한 코드 대부분을 플랫폼 간에 공유할 수 있어서 리액트 네이티브를 이용하면 iOS와 안드로이드 앱을 동시에 개발할 수 있습니다! 공식 리액트 네이티브 프로젝트는 iOS와 안드로이드에서 모두 동작하는 모바일 앱을 작성할 수 있게 해 주는데, 커뮤니티 프로젝트를 이용하면 리액트 네이티.. 2021. 8. 19. [React Native]맥에서 앱 개발 환경 갖추기 #2 (Xcode, 코코아팟, 왓치맨, 안드로이드 스튜디오) 1편에 이어 mac 개발 환경을 소개합니다. https://ssollacc.tistory.com/entry/mac-reactnative1 [iOS] 맥에서 앱 개발 환경 갖추기 #1 (홈브루, 비주얼스튜디오코드, Node.js, 자바8 JDK ) 맥에서 앱 개발 환경을 갖추는 방법입니다. 홈브루 설치 https://brew.sh/index_ko Homebrew The Missing Package Manager for macOS (or Linux). brew.sh 방문하여 다음 명령을 복사한 후 터미널에서 실행합니다.. ssollacc.tistory.com Xcode 설치 iOS 앱을 개발하려면 Xcode가 필요합니다. 그러려면 먼저 developer.apple.com에서 계정을 만들어야 합니다. http.. 2021. 8. 19. 이전 1 다음 728x90
