IT/react native
[react native] react-native-camera 로 바코드 인식하기
[react native] react-native-camera 로 바코드 인식하기
2021.03.091. react-native-permission 라이브러리 설치 $ npm install --save react-native-permissions $ yarn add react-native-permissions 2. [ios] xcode 에 권한 관련 설정 2-1. podfile 에 아래와 같이 입력 permissions_path = '../node_modules/react-native-permissions/ios' pod 'Permission-Camera', :path => "#{permissions_path}/Camera" 2-2. info.plist 에 아래와 같이 입력 NSCameraUsageDescription 바코드 스캔을 위해 카메라 사용을 허용해주세요. 3. [android] 메니페스트에 ..
[xcode] fatal error: module map file ~ modulemap' not found
[xcode] fatal error: module map file ~ modulemap' not found
2021.03.09xcode 로 빌드 하니까 갑자기 이런에러가 ...? module map file '/Users/maani/Library/Developer/Xcode/DerivedData/myAppqaaefzrwsczxzeepmvcmgjftwak/Build/Products/Debug-iphoneos/react-native-geolocation-service/react_native_geolocation_service.modulemap' not found xcdoeproj 가 아닌 xcworkspace 파일을 통해서 xcode를 열어야한다. ....
[react native] android standalone apk 만들어 dropbox 로 배포하기 (스토어 X)
[react native] android standalone apk 만들어 dropbox 로 배포하기 (스토어 X)
2021.02.081. bundle 생성 react-native bundle --platform android --dev false --entry-file index.js --bundle-output android/app/src/main/assets/index.android.bundle --assets-dest android/app/src/main/res/ 프로젝트에서 위의 명령어를 실행한다 2. APK 생성 안드로이드 스튜디오에서 Build 메뉴에서 APK 빌드 클릭 3. 생성 위치 /android/app/build/outputs/apk/debug/app-debug.apk 스토어에 올릴게 아니라 sign 없이 기기에서 설치할 수 있는 apk 를 추출했다 똑같이 dropbox 링크를 걸어 쉽게 다운받을 수 있게 해보자 4..
[react native] <TextInput> value 와 onChangeText 함께 사용하기
[react native] <TextInput> value 와 onChangeText 함께 사용하기
2021.02.05게시판의 글을 쓸 수 있는 제목과 내용인데, 글자를 쓸 수 있게끔 을 배치했다. 내가 쓴 글을 수정하려면 기존에 썼던 내용을 불러와서 셋팅 해놔야겠지? useEffect() 를 통해 셋팅해볼까? useEffect 는 컴포넌트가 랜더링 될 때마다 실행하는 hook 이다. const [title, setTitle] = React.useState(''); const [content, setContent] = React.useState(''); useEffect(() => { const fetchArticles = async () => { const postData = await getPostBasicInfo(); setTitle(postData[0].TITLE); setContent(postData[0].CO..
[react native] {"_U": 0, "_V": 0, "_W": null, "_X": null}
[react native] {"_U": 0, "_V": 0, "_W": null, "_X": null}
2021.01.27디바이스의 wifi mac 정보를 가져오려고 react-native-device-info 를 사용했다. github.com/react-native-device-info/react-native-device-info#react-native-dom react-native-device-info/react-native-device-info Device Information for React Native iOS and Android - react-native-device-info/react-native-device-info github.com 이렇게 사용하세요 ~ 라고 친절하게 사용법도 설명해줬건만 console.log(DeviceInfo.getMacAddress()); 으로 찍어보니까 {"_U": 0, "_V":..
[ios] apple 개발자 계정으로 dropbox 로 ad-hoc(OTA) 배포하기 (2)
[ios] apple 개발자 계정으로 dropbox 로 ad-hoc(OTA) 배포하기 (2)
2021.01.271. 프로젝트 최종본으로 빌드(Archive) 하기 빌드 되면 마지막에 비번 치라고 나오는데 mac 비밀번호 치면 된다. Distribute App 클릭 Ad Hoc 선택 1. App Store -> 앱스토어 / TestFlight 배포용 2. Ad Hoc -> 내부 테스터용 (UUID 로 Device 등록한 대상) 3. Enterprise -> 내부 배포용 (이건 UUID Device 등록 안해도 됨 편함) 4. Development -> 팀에 등록된 개발자들 OTA installation 가능하게 선택 앱 Name 입력 후 App URL, Display Image URL, Full Size Image URL 이 세 개는 아무거나 입력한다. 나중에 수정할거니까 Certificate 가 배포용인지 확인 ..
[ios] apple 개발자 계정으로 dropbox 로 ad-hoc(OTA) 배포하기 (1)
[ios] apple 개발자 계정으로 dropbox 로 ad-hoc(OTA) 배포하기 (1)
2021.01.261. 애플 개발자계정 ($99) 준비완료! 2. Dropbox 계정 만들기 Dropbox 에 ios 설치 파일(IPA) 을 업로드 한 후 URL 을 통해 배포할 예정이니 가입해두록 한다. 기본 2GB 무료! 3. 테스트할 기기의 UUID 등록해놓기 엔터프라이즈 계정($299) 이면 뭐.. 패스해도 된다. 하지만 가난한 개발자계정이니 UUID 를 알아내서 등록하자 2021/01/26 - [IT/react native] - [ios] iPhone UUID windows / mac 에서 간단 확인 방법! [ios] iPhone UUID windows / mac 에서 간단 확인 방법! 1. windows 1-1. USB 와 iPhone을 연결한다 1-2. 제어판 -> 장치관리자에 들어간다. 1-3. 휴대용장치 ..
[ios] iPhone UDID windows / mac 에서 간단 확인 방법!
[ios] iPhone UDID windows / mac 에서 간단 확인 방법!
2021.01.261. windows 1-1. USB 와 iPhone을 연결한다 1-2. 제어판 -> 장치관리자에 들어간다. 1-3. 휴대용장치 -> Apple iPhone 우클릭 -> 속성 1-4. 자세히 -> 속성 -> 장치 인스턴스 경로 -> 값에 빨간색 밑줄친 곳이 UDID 2. mac 1-1. USB 와 iPhone을 연결한다 1-2. Finder 에서 iPhone 메뉴 클릭 후 빨간색 체크 부분 클릭 1-3. 내용이 바뀌는데 UDID 가 뜬다. 이거임!
[react native] textinput 입력 시 글자 유실 textinput lose focus react native
[react native] textinput 입력 시 글자 유실 textinput lose focus react native
2021.01.14export default () => { const [content, setContent] = React.useState(''); const InsertData = () => { return ( setContent(text)} ) } return ( ) } 이렇게 InsertData 라는 component 를 만들고 그 안에서 TextInput 에 텍스트를 입력할 때 마다 계속 쳐지는게 아니라 한글자 치면 focus 가 사라지고;; 또 클릭해서 한글자 치고... 계속 저 InsertData() 가 rendering 되는 것이였다 (한글자 칠때마다) 해결방법은 InsertData 를 따로 컴포넌트로 만들어서 import 해서 사용하자 InsertData.js export default () => { con..
[react native] Invariant Violation: View config getter callback for component `firstView` must be a function (received `undefined`). Make sure to start component names with a capital letter.
[react native] Invariant Violation: View config getter callback for component `firstView` must be a function (received `undefined`). Make sure to start component names with a capital letter.
2021.01.08Invariant Violation: View config getter callback for component `firstView` must be a function (received `undefined`). Make sure to start component names with a capital letter. export default () => { const firstView = () => { return ( hello ); }; return ( FirstView 로 변경 Make sure to start component names with a capital letter. 구성 요소 이름은 대문자로 시작해야합니다.
[react native] react-native-calendars 캘린더에 마킹하기
[react native] react-native-calendars 캘린더에 마킹하기
2021.01.07import { Calendar } from 'react-native-calendars'; export default () => { const [markedDates, setMarkedDates] = React.useState(null); const [dates, setDates] = React.useState(['2021-01-05', '2021-01-20']); function addDates() { let obj = dates.reduce( (c, v) => Object.assign(c, { [v]: { marked: true, dotColor: 'red' }, }), {}, ); console.log(obj); setMarkedDates(obj); } return ( { addDates(); }}..
[react native] Warning: Cannot update a component from inside the function body of a different component.
[react native] Warning: Cannot update a component from inside the function body of a different component.
2021.01.07Warning: Cannot update a component from inside the function body of a different component. App.js const [visible, setVisible] = useState(false); Component.js export default (props) => { return ( /> ) } 부모에서 Modal 을 View 한 후에 (Component.js) Button 을 클릭하면 props 으로 넘어온 부모의 state 를 setvisible(false) 로 modal 을 닫으려 했다 Warning: Cannot update a component from inside the function body of a different comp..