솜이의 데브로그

Reference : 처음배우는 리액트 네이티브 리액트 네이티브에서의 스타일링은 CSS와 약간의 차이가 있다. CSS와는 달리 카멜 표기법으로 작성해야한다. 스타일링 인라인 스타일링 인라인 스타일링은 어떤 스타일이 적용되는지 잘 보인다는 장점이 있다. 그러나 비슷한 역할의 컴포넌트에 동일한 코드가 반복된다는 점과, 어떤 이유로 스타일이 적용되었는지 코드만으로 이해하기 어렵다는 단점이 있다. 클래스 스타일링 컴포넌트의 태그에 직접 입력하는 방식이 아니라 스타일 시트에 정의된 스타일을 사용하는 방법이다. 스타일 시트에 스타일을 정의, 컴포넌트에서는 정의된 스타일의 이름으로 적용. (CSS 클래스 이용법과 유사) 프로젝트를 생성하면 함께 생성되는 App.js 파일에서 클래스 스타일링이 적용된다. 스타일의 의도..

Reference : 처음 배우는 리액트 네이티브 (김범준) 컴포넌트 재사용이 가능한 조립 블록으로 화면에 나타나는 UI 요소이다. 부모로부터 받은 속성이나 자신의 상태에 따라 표현이 달라지고 다양한 기능을 수행한다. 내장 컴포넌트 https://reactnative.dev/docs/button Button · React Native A basic button component that should render nicely on any platform. Supports a minimal level of customization. reactnative.dev 리액트 네이티브에는 위와 같은 다양한 내장 컴포넌트들이 제공된다. src/App.js import React from 'react'; import {..

리액트 네이티브 프로젝트를 생성하는 방법은 Expo를 이용하는 방법과 리액트 네이티브 CLI를 이용하는 방법이 있다. 두 가지 방법 모두 시도해 볼 것이다. 1. Expo https://expo.io Expo Expo is an open-source platform for making universal native apps for Android, iOS, and the web with JavaScript and React. expo.dev 먼저 위의 Expo 웹사이트에서 회원가입 후 Expo 프로젝트를 진행한다. expo는 최종적으로 완성된 프로젝트를 쉽게 배포 및 관리할 수 있도록 다양한 기능을 제공 아이폰과 안드로이드 폰이 있으면 해당 플랫폼의 테스트를 진행하며 개발 가능 Expo에서 제공하는 API..