# react native

1344개의 포스트

React-Native #3 | 레이아웃 시스템 (Layout System)

Flexbox 를 사용합니다.웹에서와 거의 같은 방식입니다.99.8% 의 경우 높이와 너비에 기반해서 레이아웃을 만들지 않습니다. 당연하게도 모바일 환경에서는 반응형으로 디자인 해야합니다.display:flex 지정해줄 필요 없습니다.flexDirection 기본값은

약 9시간 전
·
0개의 댓글
·

React Native) android app icon과 splash screen 적용하기

지난번 ios에 이어, 이번에는 android에 app icon과 splash screen 적용하기를 기록해볼 예정이다. xcode만으로 모든 설정을 끝냈던 ios와는 달리 android는 직접 파일과 폴더를 수정해야 했던 만큼 개인적인 난이도는 더욱 높았다. 일단

약 11시간 전
·
0개의 댓글
·

React-Native #2 | RN 패키지, 커뮤니티 패키지

들어가기에 앞서 컴포넌트와 API 의 차이 컴포넌트 화면에 렌더링할 항목, 함수의 return 키워드 안에 있습니다. `, , ` API 단지 자바스크립트 코드 Vabration React-Native 패키지 개요 Core, Android, IOS 카테고리로 각각 컴

약 11시간 전
·
0개의 댓글
·

React-Native #1 | 규칙

HTML 이 아니기 때문에 <div>, <span> 는 쓸 수가 없습니다.대신에 <View>, <Text> 가 있습니다.<View>컨테이너 === <div>앞으로 모든 것은 View 로 만들게 됩니다.<Text>모든 text 는 &

약 16시간 전
·
0개의 댓글
·

React-Native #0 | React-Native 개요, Expo

모든 구조(인프라 시설) 와 JavaScript 코드의 조합 + 마크업/스타일링아름다운 번역가인터페이스, 개발자와 운영 체제(IOS, 안드로이드) 사이에 있습니다.개발자가 RN 코드를 만들면 브릿지를 통해 각각 IOS, JAVA 안드로이드 코드로 번역됩니다.RN 에서는

어제
·
0개의 댓글
·

[React-Native] 폰트 설정 방법

React-Native로 앱을 개발하다보면 폰트를 변경해야할 때가 있습니다.ios 와 android 에서 동시에 폰트적용을 하기 위해서는 아래와 같이 해야합니다.1\. 'react-native.config.js' 생성 및 작성먼저 project 의 root direct

어제
·
0개의 댓글
·
post-thumbnail

[React-Native] 언어, OS마다 렌더링 순서 변경

누군가에게 도움이 될 로직이길..

2일 전
·
2개의 댓글
·
post-thumbnail

[React-Native] FlatList란?

xcode도 jetBrain에서 영감을 받았더라면...

2일 전
·
0개의 댓글
·

React Native) TouchableOpacity에 position absolute적용했을 때 먹통되는 현상 해결하기

화면을 그리다보면 간혹 오브젝트의 position을 absolute로 주어 표현해야 할 때가 있다. 나또한 이번에 프로젝트를 진행하는 도중 해당 소요가 생겨 TouchableOpacity에 absoult position을 적용하자 터치 이벤트가 동작하지 않는 문제가 발

2일 전
·
0개의 댓글
·
post-thumbnail

[Android] Installation did not succeed.

빌드 시간 단축 === 고성능 맥북

2일 전
·
0개의 댓글
·
post-thumbnail

우당탕탕 리액트 네이티브 설정하기

웹을 공부하다보면 앱이 끌릴 때가 있다. 그래서 리액트 네이티브를 해보기 위해 환경을 설정하는데 허허 안되는 일이 뭐이리 많은지 너무 화나서 글로 남겨본다.mac을 사용하는 사람들은 모두 공감한다고 생각한다. xcode 업데이트를 하기 싫어도, 쓰지 않아도 업데이트를

3일 전
·
0개의 댓글
·

react native ios debuger

react native ios 에뮬레이터에서 디버거를 실행하려니 열리지 않았다검색해보니 0.70.0열린 이슈가 아직 열려있었다(내 버전 : 0.70.1)https://github.com/facebook/react-native/issues/34615ios/Pod

4일 전
·
0개의 댓글
·

RNSScreenStackHeaderConfig - react native ios

react native 개발 공부 중ios 에뮬레이터를 돌리려고 했는데Gemfile에서 요구하는 ruby 버전이 2.7.5인데 내 버전은 2.6.8로 낮아서 실행이 되지 않았다그래서 ruby를 업데이트를 해도 버전이 변경되지 않아서 찾아보니맥에서 기본으로 제공하는 ru

4일 전
·
0개의 댓글
·

react-native-safearea-height npm 배포

react-native로 개발하면서 iPhone X 이상 버전에서 노치가 생기면서 간격을 수정하기 위해 사용하는 https://www.npmjs.com/package/react-native-status-bar-height 라이브러리를 사용하고 있었다. 이번 새

4일 전
·
0개의 댓글
·
post-thumbnail

File 'expo-module-scripts/tsconfig.base' not found.

아직 왜 이 에러가 발생했는지 모르겠다...우선적으로 다른 폴더에서 만든 파일때문인지...위와 같은 에러가 떠서 난감 그자체...구글링을 해보는데 vscode를 다시 켜보면 된다는 방법도 있었지만 실패...그대로다...npx tsc -p tsconfig.json 근데

6일 전
·
0개의 댓글
·
post-thumbnail

[React-Native] Navigation

좀만 더 나중에 만났으면 좋았을텐데 너,, 두고봐,,

6일 전
·
0개의 댓글
·

ToDo App 개발하며 알게 된 내용

⭐️ SafeAreaView 컴포넌트: M자 탈모가 있는 아이폰은 맨 위에 Title을 적게 되면 컴포넌트의 일부가 가려지는 것을 볼 수 있다. 그때 리액트 네이티브에서 자동으로 padding 값이 적용되어 노치 디자인 문제를 해결해 줄 수 있는 SafeAreaView

2022년 9월 27일
·
0개의 댓글
·
post-thumbnail

[JavaScript] Call Stack & Execution Context

오늘은 JS에서 Call Stack과 Execution Context에 대한 개념을 알아보려고 한다. 먼저 간단한 예시로 운을 띄워 보자 React-Native 빌드를 하면 실행 중에 다음과 에러를 마주할 때가 있다. 꼭 RN 개발이 아니더라도, 모바일이나 웹 개

2022년 9월 27일
·
0개의 댓글
·
post-thumbnail

ReactNative + Firebase 적용 오류

리액트네이티브를 다루는 기술(김민준) 책을 따라하는 와중에 ios에 Firebase를 적용하는 부분에서 에러가 발생했다저자가 책을 기술할 때의 버전과 현재 버전이 달라서 발생하는 문제이다개발 환경 버전 정보책을 그대로 따라했을 때는 \[!] The following S

2022년 9월 25일
·
0개의 댓글
·