react native를 사용하여 앱을 개발하는 방법은 크게 두 가지가 있다. 1. expo-cli 사용 2. react-native-cli 사용 expo-cli는 - 개발 시작과 배포가 매우 편리하다. - RN을 위한 설정이 미리 구성되어있어서 초기 설정이 간단하다. - 각 플랫폼의 IDE(android -> android studio, iOS-> Xcode)를 설치하지 않고도 시뮬레이터를 사용할 수 있다. 하지만, - 네이티브 파일을 제어할 수 없고, 모든 라이브러리를 사용할 수도 없다. - expo에서 제공하는 api만 사용 가능하고, 필요한 기능이 없어도 모듈을 만들어서 사용할 수 없다. ==> 개발하기 편리하지만, 기능이 제한될 수 있다. 따라서, 앱 기능 개발에 제한되지 않는다면 굿 react..

가상 DOM에 대해 알아보기 전에 DOM이 무엇인지 알아보자! 별코딩님의 React의 가상돔 (Virtual DOM)이 뭔가요? (짱 쉬움) 영상을 보고 정리해보았다! : https://www.youtube.com/watch?v=gc-kXt0tjTM DOM이 무엇일까? 웹 사이트의 글, 버튼,, 하나하나를 요소라고 한다. 그리고, 이 모든 것을 담고 있는 것을 Document 문서라고 한다. DOM이란 웹 페이지의 요소를 트리 형태로 표현한 것이다. 우리는 DOM이 제공하는 api를 통해 DOM구조에 접근할 수 있고, 원하는 요소를 입맛대로 변경할 수 있다. 이 것을 DOM조작이라고 한다. ex) JS: getElementById( ), querySelector( ) 가상DOM이 무엇일까? 가상DOM을 ..

앱을 구성하는 컴포넌트에 대해 알아볼 것이다. View 과 화면분할 return 값에는 무조건 하나의 View만 와야된다 !!!! 여러개의 View를 쓰는 방법은 View를 View로 감싸기. 위 사진처럼 감싼 View의 갯수만큼 한 화면이 분할된다. 이런식으로 분할 가능! flex를 통해 각 화면 크기비율을 다르게 할 수 있음 이건 flex를 각각 2, 1 ,1 로 준 상황 Text 말그대로 글!! 텍스트!! Image 일단 Image 컴포넌트를 import 해주어야 함 3번째 줄에 Image를 추가해준다. import { StyleSheet, Text, View, Image } from 'react-native'; //App.js import React from 'react'; import { Sty..

https://bit.ly/39t2lO9 개발하는 펭군이님을 따라하면서 배워볼 예정이다! [#2 Component와 메인화면 분할] 환경 구축부터 스토어 출시까지 디데이 앱 따라 만들며 배우는 React 리액트 네이티브 튜토리얼 [#1 리액트 네이티브 맛보기] [#2 Component와 메인화면 분할] [#3 레이아웃 구성하기] [#4 레이아웃 구현 마무리하기] [#5 state] [#6 설정 Modal 만들기] [#7 설정 Modal 기능 추가하 dev-pengun.tistory.com 앞서 생성했던 프로젝트인 SampleApp 폴더를 vscode나 pycharm 등 에디터에서 오픈한다. SampleApp은 cmd를 관리자 권한으로 실행하지 않고 생성한 프로젝트다! 관리자 권한으로 생성했으면 C드라이브..

react-native로 앱을 개발할 계획이다. react-native로 웹을 개발하고 안드로이드 앱이면 android studio를 이용해 apk파일로 감싸고, ios앱이면 맥북을 이용해 감싸면 된다. 아마도 chocolatey 설치 Nodejs 설치 python 설치 React Native CLI 설치 JDK설치 안드로이드 스튜디오 설치 안드로이드 스튜디오 SDK 설정 안드로이드 스튜디오 환경 변수 설정 react-native 프로젝트 생성 및 확인 완성! react-native 환경 설정 시작하자! chocolatey 설치 chocolatey: 윈도우즈용 패키지 설치삭제 관리 프로그램이다. cmd를 관리자 권한으로 실행한 뒤 아래 명령어를 실행하고 @"%SystemRoot%\System32\Wind..