소개
안녕하세요. 여러분들께 React Native 지식을 공유해드릴 Wintho 입니다.
저는 Computer Vision을 전공하여, 자동차 업계에서 자율주행 시스템을 개발했고, 현재는 로봇 업계에서 사물인식, 장애물 회피 등의 영상처리 Alg.을 개발하는 개발자입니다.
새로운 영역에서의 개발 Stack을 쌓아보고자 취미로 앱 개발을 시작했습니다. Java와 Swift 언어로 Android/iOS 네이티브 앱 개발도 해봤지만, React Native 만큼 진입장벽이 낮고 개발이 용이한 API도 없다고 생각됩니다. 쉬운 데다가 단 하나의 코드로 iOS/Android 동시 개발이 가능하다는 건 더할 나위 없는 메리트겠죠? :):)
외국에서는 이미 Mega Trend의 흐름에 합류하여 개발자들의 Community도 급증하고 있는 React Native입니다. 국내에서는 React Native의 명성에 비해 그 인지도가 낮은 것이 현실이고요. 많은 분들께 React Native의 훌륭함을 공유해드리고자 본 강의를 제작하게 되었습니다. 수업을 통해 목말라했던 지식을 습득하시는 유익한 시간이 되시길 바라며, 그를 통해 국내에서도 React Native 개발자들의 Community가 활성화 되길 바랍니다.
그럼 강의에서 뵙겠습니다. 감사합니다. ^^;
강의
전체 2수강평
- iOS/Android 앱 개발을 위한 실전 React Native - Intermediate
- iOS/Android 앱 개발을 위한 실전 React Native - Basic
- iOS/Android 앱 개발을 위한 실전 React Native - Basic
- iOS/Android 앱 개발을 위한 실전 React Native - Basic
- iOS/Android 앱 개발을 위한 실전 React Native - Basic
게시글
질문&답변
2021.11.11
ios 시뮬레이터 실행 오류 납니다.An error was encountered processing the command (domain=com.apple.CoreSimulator.SimError, code=405)
조민정님, 안녕하세요. 지식공유자 Wintho입니다.답변이 늦어져 죄송합니다. 문제가 해결되셨길 바랍니다만, 아직 고군분투 중이시라면 양해의 말씀 드립니다. 해당 문제는 Xcode의 캐시로 인해 발생합니다. 피씨 좌상단의 애플 아이콘 누르시면 '이 맥에 관하여' 라는 탭이 있는데 클릭해서 들어가보시면, 상단에 '저장 공간' 이라는 탭이 있을 겁니다. '관리' 버튼이 보이실텐데 클릭해서 들어가셔서 좌측 메뉴에서 '개발자'를 눌러주시고 'Xcode 캐시'와 '프로젝트 빌드 데이터 및 인덱스'를 삭제한 후에 시뮬레이터를 종료(커맨트+Q)하시고 다시 실행해보시기 바랍니다. react-native run-ios --simulator="iPad Pro (12.9-inch)" 감사합니다.
- 0
- 1
- 4.1K
질문&답변
2021.11.11
Could not find "store" in the context of "Connect(AuthForm)"
민정아빠류동수님, 안녕하십니까. 지식공유자 Wintho입니다.답변이 늦어져 죄송합니다. 해당 문제가 해결되지 못해 진도 진행에 이슈가 있었다면 양해의 말씀 드립니다.해당 문제는 App Component를 Provider로 감싸지 않아서 발생하는 오류입니다. Provider는 action을 dispatching하거나 state data를 받기 위해 store에 접근할 수 있도록 도와줍니다. store와 provider가 해당 모듈로부터 제대로 import 되었는지 확인이 필요할 듯 합니다. import React from 'react'; import {AppRegistry} from 'react-native'; import App from './app/index'; import {name as appName} from './app.json'; import { createStore, applyMiddleware, compose } from 'redux'; import { Provider } from 'react-redux'; import promiseMiddleware from 'redux-promise'; import reducers from './app/store/reducers'; import thunkMiddleware from 'redux-thunk'; const composeEnhancers = window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__ || compose; const createStoreWithMiddleware = createStore(reducers, composeEnhancers( applyMiddleware(promiseMiddleware, thunkMiddleware) )) const appRedux = () => ( Provider store={createStoreWithMiddleware}> App/> Provider> ) AppRegistry.registerComponent(appName, () => appRedux); 감사합니다.
- 1
- 1
- 603
질문&답변
2021.09.21
launchImageLibrary 가 작동하지 않습니다ㅠ
HappyJay님, 안녕하세요. 지식공유자 Wintho입니다. react native image picker가 대대적인 업데이트가 이루어지면서,활용법이 많이 바뀌었는데 uri 접근 방법도 바뀌었네요. 민정아빠류동수님께서 코멘트 해주신 것처럼 response.assets 배열에 접근하시면 됩니다.Image를 하나 pick했을 때에는, response.assets[0].uri로 접근 하시면 됩니다. 참고01 : react-native-image-picker githup pagehttps://github.com/react-native-image-picker/react-native-image-picker/commit/c8f8481eb2c08e8f160ae80177e51c693e887969(사진) 참고02: https://github.com/react-native-image-picker/react-native-image-picker#the-response-object (사진) 현재 버전의 react-native-image-picker로도 Multiple Image 선택은 가능합니다만,Typescript와 Hooks의 개념이 필요합니다.react-native-multiple-image-picker를 사용하셔도 되고 (참고: https://github.com/baronha/react-native-multiple-image-picker),react-native-image-picker를 사용하신다면 다음의 예제 코드를 참고하시기 바랍니다.https://github.com/react-native-image-picker/react-native-image-picker/tree/main/example/src(사진) 감사합니다.
- 0
- 2
- 1.1K
질문&답변
2021.09.21
[Stack] Header Bar 커스터마이징은 안드로이드는 안되는 건가요 ? ㅜㅜ
권현서님, 안녕하십니까. 지식공유자 Wintho입니다. 질문 주신 내용에 대한 답변 드리겠습니다. iOS보다 성가시긴 하지만 안드로이드도 header bar configuring이 가능합니다. headerTitle: 이 아니라,headerTitle: props => 로 시도해보시길 바라며, 안드로이드는 ios처럼 headerTitle이 default로 가운데 정렬이 되지 않습니다. 따라서, logo.js 파일에서 Image 태그의 style에 alignSelf: 'center'를 추가해주시기 바랍니다. @logo.js ... render () { return ( style={{width: 40, height: 40, alignSelf: 'center'}} source={Logo} /> ) }... 감사합니다.
- 0
- 3
- 229
질문&답변
2021.09.21
[Stack] Header Bar 커스터마이징은 안드로이드는 안되는 건가요 ? ㅜㅜ
권현서님, 안녕하십니까. 지식공유자 Wintho입니다. 질문 주신 내용에 대한 답변 드리겠습니다. iOS보다 성가시긴 하지만 안드로이드도 header bar configuring이 가능합니다. headerTitle: 이 아니라,headerTitle: props => 로 시도해보시길 바라며, 안드로이드는 ios처럼 headerTitle이 default로 가운데 정렬이 되지 않습니다. 따라서, logo.js 파일에서 Image 태그의 style에 alignSelf: 'center'를 추가해주시기 바랍니다. @logo.js ... render () { return ( style={{width: 40, height: 40, alignSelf: 'center'}} source={Logo} /> ) }... 감사합니다.
- 1
- 2
- 310