React (6) 썸네일형 리스트형 react native - EXPO 설치 방법 1. node.js를 다운받는다. https://nodejs.org/en/ 2. cmd창에 npm install -g expo-cli 을 입력 warning이 떠도 문제없다. 로딩 줄이 조금 길다. 설치 끝! 3. 그 외 프로젝트 생성: expo init (프로젝트명) -> blank로 빈 프로젝트 생성 (엔터) -> name에 app에 보일 이름을 설정해준다. (엔터) -> cd (프로젝트명) -> npm start 결과화면 다음 QR코드를 이용해 폰으로도 접속가능하다! react-expo 개발일지1 1. branch가 발생하는 것에 대비해 source tree를 다운받았다. 더 쉽게 이해할 수 있겠지,, 2. react native는 jsx라는 문법을 사용. js에서 더 컴포넌트적인 접근이 가능하게 해 가독성이 좋다. 3. Atom setting up for react ( Automatic Indentation of JSX ) language-babel이라는 패키지를 설치. 방법1. IDE 안에서 Packages-settingView-manage package를 이용해 다운 방법2. apm install language-babel(패키지명) 을 이용해 다운 4. JSX라는 문법을 사용 5. 팀원들 각자 우리 어플의 메인 화면을 구성해보면서 리액트에 익숙해지기로 했다. 흑 근데 .. react-native : Cli 윈도우 설치방법 react-native-cli 설치방법 React-Native-Cli은 expo와 다르게 초기환경설정이 복잡한 대신, native file들을 직접 다룰 수 있다는 장점이 있다. 크게 다음과 같은 4가지 과정으로 진행된다. 과정 chocolatey 설치 node, python, jdk 설치 안드로이드 스튜디오 설치 및 SDK 설정 react 프로젝트 생성 Requirements Node.js(8.3버전 이상), Python2, JDK(8버전 이상)이 설치되어있다면 넘어가도 된다.chocolatey를 통해 세 가지가 한번에 설치할 것이다. 때문에 하나 빼고 모두 설치 되어 있다면 없는 하나만 설치하는 것이 낫다. 하지만 하나라도 명령어로 간편하게 설치하고 싶다면 chocolatey를 사용하자. choc.. [npm] 모듈 자체를 수정하고 싶을 때! npm 모듈 수정방법 Npm 모듈 수정방법 모듈 수정의 필요성 npm install을 사용하면 node_modules 폴더 안에 모듈이 설치됩니다. 이 때 모듈 속 style이나 기능을 더 보완해서 사용하고 싶을 때가 있어요! 위 사진에서 calendar모듈의 스타일을 바꾼다고 가정할게요. 보통 npm link를 이용해서 해당 모듈을 로컬과 연결해서 사용하는데 (node_modules 속 파일을 수정해요) npm install을 통해 업데이트 하면 다시 본래 모듈파일로 업데이트 됩니다. 예를 들어 위 사진처럼 style.js에 marginBottem을 추가했다고 하면, front에서 새로운 모듈이 필요하면 npm install을 사용하게 되죠. 이렇게 npm install을 통해 업데이트 하는 순간 위처럼 본래 파일로 돌아가.. [React-Native] Error type 3 Error: Activity class {com.myapp/com.myapp.MainActivity} does not exist Error Starting: Intent { cmp=com.planty_app.debug/com.planty_app.MainActivitydd} Error type 3 Error: Activity class {com.planty_app.debug/com.planty_app.MainActivitydd}does not exist. Solution 출처 입력 기기 내해당 어플을 삭제한 뒤react-native run-android로다시 설치한다. 이 때 핸드폰 기기 정보에서 어플네임을 입력해 확실하게 지워졌는지 확인해야 함. [React] 리액트 프로젝트 생성 1. Requirements ● node.js 설치 https://nodejs.org/ko/download/ - 운영체제에 맞는 파일 설치 - 설치 후 터미널 > node 입력 > node 관련 명령어가 나오면 설치 된 것. 2. 프로젝트 생성 (보일러 플레이트 프로젝트) ● 프로젝트 생성 명령어 npx create-react-app {프로젝트명} ● 프로젝트 실행 cd {프로젝트명} npm start > localhost에 react 프로젝트가 띄어진다. 3. 코드 수정 - App.js를 수정한다. - return()부분에 jsx 코드 혹은 자바스크립트(createElement)코드를 작성 - 또는 미리 작성한 컴포넌트를 렌더링 예시) 부록. JS코드가 어떻게 DOM에 들어갈까? 부제: 엘리먼트 렌더링.. 이전 1 다음
