NPM

npm 세상에는 무수히 많은 자바스크립트 프로그래머가 있다. 그런 사람들이 미리 작성해놓은 코드들도 있다. 그리고 이를 공개해 놓은 코드도 많다. 우리는 이런 코드들을 잘 사용할 줄 알아야 한다. 이런 코드들이 공개되어 있는 서버인 npm을 알아보자. npm은 Node Package Manager의 약어로, 이름 그대로 노드 패키지 매니저이다. 대부분의 자바스크립트 프로그램은 패키지라는 이름으로 npm에 등록되어있고 특정 기능을 하는 패키지가 필요하면 npm에서 찾아 설치하면 된다. npm에 업로드된 노드 모듈을 패키지라고 부르며 패키지가 다른 패키지를 사용할 수도 있다. 이런 관계를 의존 관계라고 부른다. package.json 서비스에 필요한 패키지를 하나씩 추가하다 보면 어느새 패키지 수가 100개..

React facebook에서 개발한 라이브러리이다. Component를 기반으로 만들어져 module과 비슷하게 재사용성이 매우 좋다. 또한 Virtual DOM을 사용한다. Virtual DOM과 Real DOM의 차이는 다음과 같다. Virtual DOM Real DOM 로컬에서 Virtual DOM을 생성한 뒤 렌더를 요청하기 전 단계에서 변경 사항을 적용하여 요청하는 방식으로 동작한다. 따라서 어떠한 Component가 변경이 된다면 해당 Component만을 업데이트하면 된다. html 문서를 읽어와 DOM Tree를 생성한 뒤 Rander Tree를 생성한다. 그 후 렌더링을 하는 구조이다. 따라서 어떠한 Component가 변경이 된다면 전체 페이지에 대한 Tree들을 다시 작성하여 렌더링..

Requirements 우선적으로, node.js를 설치해야 한다. nodejs.org/ko/ Node.js Node.js® is a JavaScript runtime built on Chrome's V8 JavaScript engine. nodejs.org ver10.0 이상이면 된다. npm은 ver6 이상이면 된다. 코드 편집기는 VS Code로 진행할 예정이다. window개발 환경에서 iphone어플을 개발하기는 쉽지 않다. 테스트 또한 그렇다. 하지만 expo를 이용하면 window환경에서도 iphone으로 테스트하며 개발을 할 수 있다. 만약 안드로이드 app 개발을 원하는 경우에는 안드로이드 스튜디오 AVD를 이용할 수 있지만 실제 핸드폰에 어떻게 보이는지 확인하면 더욱 쉽게 개발할 수 있..

Library react native에 원하는 기능을 지원하는 Component나 기능들이 없는 경우도 있다. 하지만, 개발자들이 이미 구현해 놓은 Component나 기능들이 있다. 따라서 우리는 프로젝트에 원하는 library(package라고도 함)를 설치하여 사용하면 된다. 설치를 원하는 프로젝트에 Terminal를 키거나 Terminal를 해당 프로젝트 디렉터리로 이동한다. npm install library이름 이 코드를 이용하여 library를 설치할 수 있다. (node.js가 깔려 있다면 문제없이 작동할 것이다.) npx react-native run-android 라이브러리를 알아보다 보면 npm과 npx를 모두 볼 수 있을 것이다. 처음에는 npx는 ios에서 사용하거나 오타인 줄 알..