반응형

리액트 네이티브 21

홈화면에서 숙소정보 데이터 연동 트라이중 에러사항많음

쌍방향 통신 구현 힘들어서 찜목록 기능 없애버림, 모두 같은 디자인 적용일수밖에 없게 배열에게 같은 스타일의 태그를 씌우는데 3번째 화면 스타일링 달라짐, props를 통해 여러사진 보내는건 가능하지만 reqiure문에서 직접적으로 import해주지않으면 배열로 여러 사진을 자식에게 전달하지 못하는데 이렇게 하니까 첫자신은 place들에따라 달라지지만 2번째부터 사진은 모두 같은 사진으로 뜸 이 모든게 props로 부모가 자식에게만 일방적으로 데이터를 전달하면서 생기는 것 같은데 로직을 바꾸거나 백엔드한테 각화면마다 데이터를 받는 구조로 가야할 것 같음 -> 가능하면 프론트끼리 최대한 데이터연동시키고 백에서 데이터 가져오는걸 최소화 하고싶어서 props를 활용해서 이것저것 해봤지만 에러많음   (프로젝트..

React Native 컴포넌트 정리

● 이번 글에서는 React Native의 기본 컴포넌트들과 간단히 style지정방법에 대해 정리해보고자 한다. View 컴포넌트는 Javascript에서 태그와 비슷한 개념으로 다른 요소들을 감싸주는 컨테이너 역할을 하는 컴포넌트이다. 또한, 이름 그대로 화면에 View 컴포넌트는 안에 있는 요소들 보여주며, 주로 레이아웃을 구성하는데 많이 이용된다 View 컴포넌트의 특징컨테이너 역할 : View 컴포넌트는 다른 컴포넌트들을 감싸는 컨테이너 역할을 해줌 중첩 가능 : View 컴포넌트는 여러 개 중복되어 사용할 수 있음 레이아웃 구성의 편의성 : View 컴포넌트는 Flexbox 레이아웃 시스템을 사용하여 내부 컴포넌트들의 정렬과 배치를 관리하므로 비교적 쉽게 레이아웃 디자인을 할 수 있음 모바일 렌..

RN 프로젝트 파일 구조에 대해

이번 글에서는 React Native에서 처음 프로젝트를 생성할 때 초기 파일 구조에 대해 정리해보고자 한다. 프로젝트 생성하기 VScode에 npx react-native init --version [버전] [파일멸] 을 입력하여 프로젝트 생성하기 -> 버전에 따라 어떤 버전은 Android SDK버전과 호환이 안될 수도 있고 자동으로 app.js가 포함된 파일들이 생성되지 않을 수도 있음 가장 좋은건 공식사이트에 들어가서 프로젝트 생성 코드를 그대로 치는 것--> npx @react-native-community/cli@latest init [파일명]      프로젝트를 정상적으로 만들었다면 위의 사진처럼 app.tsx나 app.js파일이 섞인 프로젝트가 생성되어 있어야 함(app.js와 app.ts..

React Native CLI 개발환경 구축 (window버전)

앞서 말했듯이 React Native CLI를 사용하기 위해선 초기에 개발환경을 구축해야한다고 하였는데, 이번 글에서는 React Native CLI의 개발환경을 구축하는 방법에 대해서 정리 해보고자 한다.   1. Node.js 설치하기 React Native는 Javascript를 기반으로 하기에 Javascript 언어를 브라우저 외부화경에서 사용할 수 있게 런타임 환경을 세팅해주는 Node.js를 설치해줘야 한다. 또한, React Native를 통해 앱 개발 도중 필요한 패키지들이 있을 때 이를 쉽게 다운로드하거나 관리해주는 기능을 제공하는 npm (Node Package Manager)을 다운로드 해줘야하는데 다행히 npm은 node.js안에 내장되어 있기 때문에 node.js만 설치해주면 n..

2가지 React Native 개발 환경의 차이점

React Native의 개발환경 프레임워크에는 React Native Comand Line Interface 와 React Native Expo Comand Line Interface 2가지가 있는데, 2가지 개발 프레임워크의 차이점은 무엇이 있는지 그 차이점에 대해 정리해보고자 한다. React Native CLI ● React Native의 공식 개발 프레임워크로 개발자가 네이티브 코드에 직접적으로 접근할 수 있음, 하지만 따로 초기 환경설정을 해줘야함 React Native CLI의 특징● 앱 개발을 위해선 초기 개발환경 세팅이 필수적임 ● Native code에 직접적으로 접근할 수 있음 ● 원하는 언어로 추가작성이 가능함 ( Java, Kotlen, swift, obj-C 등 ) ● 필요한 기..

반응형