본문 바로가기

ReactNative4

노마드코더 리액트 네이티브 입문 - 4 Todo 와 여행 기록 앱 만들기 1. theme을 만들어서 컬러를 미리 저장해두기 관리를 위해서 utils 안에 만들어둠 export const theme = { bg : 'black', gray : '#3a3d40', } 그리고 스타일부분에 하드코딩 대신 적용시켜주기 const styles = StyleSheet.create({ container : { flex: 1, backgroundColor: theme.bg, paddingHorizontal: 20, }, header : { flexDirection: 'row', justifyContent: 'space-between', marginTop: 70, }, btnText : { color : theme.gray, fontSize : 38, font.. 2023. 5. 29.
노마드코더 리액트 네이티브 입문 - 3 open weather API 사용하여 날씨 연동시키기 https://openweathermap.org/api Weather API - OpenWeatherMap Please, sign up to use our fast and easy-to-work weather APIs. As a start to use OpenWeather products, we recommend our One Call API 3.0. For more functionality, please consider our products, which are included in professional collections. openweathermap.org 1. 로그인/회원가입 후 API Key 발급 2. https://openweatherm.. 2023. 5. 27.
노마드코더의 리액트 네이티브 입문 - 2 Snack 브라우저에서 리액트 어플리케이션을 만들 수 있게 해주는 온라인 코드에디터 (VSCode를 사용할 수 없는 상황... 아이패드만 있다거나) https://snack.expo.dev/ 접속! React Native 의 규칙 1. 브라우저가 아니므로 HTML 를 사용할 수 없음 즉, div 등의 태그를 사용할 수 없고, 대신 View 를 사용 View 는 container, div와 동일한 의미로 사용해줄 수 있음 import { StyleSheet, Text, View } from 'react-native'; 그래서 위처럼 import 해서 사용하는 것...!! 2. 리액트 네이티브에 있는 모든 text는 text component 에 들어가야 한다 안에 넣지 않고 컴포넌트 안에 텍스트 내용을 넣.. 2023. 5. 25.
노마드코더의 리액트 네이티브 입문 - 1 https://www.youtube.com/watch?v=Z9cCjrbTW50 이 영상을 보게 되었고... 리액트를 할 줄 아는 나는 먼저 리액트 네이티브부터 무료 강좌를 들어보기로 하였다! 리액트 네이티브와 플러터 둘다 사용용도에 따른 방식이 다른거라 뭐가 더 좋다고 말할 순 없다고 한다. 네이티브를 배워보고 여유가 생기면 플러터도 다뤄보고 싶다. 웹 개발을 하다보니 내 기획을 앱으로도 만들면 좋겠다... 라고 느낀 것이 일단 앱을 배워야겠다고 생각하게 되었다. 가보자고~~ https://nomadcoders.co/react-native-for-beginners/enroll Confirm Enrollment – 노마드 코더 Nomad Coders nomadcoders.co state props useE.. 2023. 5. 24.