bekusib's develop story bekusib's develop story

Frontend/react-native

• [react-native] 리엑트 네이티브 버전 업그레이드 방법

  Frontend/react-native 2021. 3. 9. 16:43

  아무것도 모르고 0.59 버전에서 시작하다가... 자꾸 에러가 나서 알고보니 수년전 버전.. 다시 삽질을 시작해야지. react-native-community.github.io/upgrade-helper/?from=0.59.3&to=0.60.4 Upgrade React Native applications react-native-community.github.io

  Read More
• How to start react-native with ignite boilerplate.

  Frontend/react-native 2020. 4. 29. 10:43

  React Native 학습을 시작하기 앞서 관련된 boilerplate를 알아봤다. 현재 깃허브에서 인기순위 1위 ignite를 실행해보고자 한다. https://github.com/infinitered/ignite infinitered/ignite The hottest CLI for React Native, boilerplates, plugins, generators, and more! - infinitered/ignite github.com 설치 및 관련 설명은 깃허브 페이지에도 잘 나와 있지만, 그 과정을 기록하기 위해 글을 써내려 가고자 한다. 먼저 아래와 같이 ignite-cli를 설치하고 바로 기본 프로젝트를 생성해본다. $ yarn global add ignite-cli $ ignite n..

  Read More
• [sqlite] weekly & month statistics query

  Frontend/react-native 2019. 11. 8. 12:15

  운동 기록 records에서 주간별 볼륨합을 구해서 그래프로 변화를 표현하고자 한다. (I'll calculate weekly & monthly volume sums and represent the changes in graph.) [Weekly] mysql: SELECT DATE_FORMAT(DATE_SUB(today, INTERVAL (DAYOFWEEK(today)-1) DAY), '%Y/%m/%d') as start, DATE_FORMAT(DATE_SUB(today, INTERVAL (DAYOFWEEK(today)-7) DAY), '%Y/%m/%d') as end, DATE_FORMAT(`today`, '%Y%U') AS `date`, sum(volume) as volume FROM records ..

  Read More
• [expo] Changing segment content onPress on react-native

  Frontend/react-native 2019. 11. 6. 18:14

  leanmass 프로젝트에 볼륨 탭에 segment를 적용시켜 보려고 한다. (I'll set segment content page in the Volume Tab on My 'Leanmass' application.) 랜더링 부분은 아래와같이 해준다. (First, define rendering view.) 볼륨 기간별 종목별 {this._renderComponent()} 필요한 함수를 정의하고 (and define functions) selectComponent = (activePage) => () => this.setState({activePage}); _renderComponent = () => { if(this.state.activePage === 1) return //... Your Compo..

  Read More
• [expo] react-native android 빌드시 아이콘(icon) 특수문자 깨짐 현상 해결

  Frontend/react-native 2019. 10. 17. 18:06

  expo로 앱을 개발하면서 언제부턴가 안드로이드 apk로 빌드를 하고나면 글이 아닌 것들이 모두 깨지기 시작했다. 알고보니 나의 expo 버전은 34인데 expo-sdk 버전은 33.0.0이었다. 그래서 sdk 버전을 최신 버전으로(현재 35) 업데이트 해주니 해결되었다... 이렇게 간단하게 해결되는 문제인데,, 모르면 그냥 삽질만 하는거니.. 이렇게 기록으로 남긴다. SDK 업데이트 방법

  Read More
• [expo] vector icon

  Frontend/react-native 2019. 10. 15. 15:09

  import { Ionicons } from '@expo/vector-icons'; icon list: https://expo.github.io/vector-icons/ @expo/vector-icons directory expo.github.io

  Read More
• [expo] [react native] make .csv file

  Frontend/react-native 2019. 9. 23. 20:34

  헬스앱을 만들면서 sqlite에 저장된 데이터를 .csv 파일 export 해서 메일로 보낼려고 한다. 작성 코드는 아래와 같다. let rows = [ ["종목명", "세트번호", "무게", "반복횟수", "휴식시간", "볼륨", "날짜"] ]; let csvContent = "\uFEFF";// 한글 깨짐 방지 // sql 결과값을 배열값으로 rows에 푸시 async insertCsvRows(rows, records) { try { await records.forEach(function(record) { const arrayOne = [`${record.종목명}`,`${record.세트번호}`,`${record.무게}`,`${record.반복횟수}`,`${record.휴식시간}`,`${record...

  Read More
• [expo][react native] <NumericInput /> re-render issue 해결

  Frontend/react-native 2019. 9. 20. 17:13

  react native에선 this.setState({}) 호출시 컴포넌트들이 리랜더링된다. 다시말해 state 값의 변경이 발생하면 render()가 호출되어 실행된다. 아래의 코드는 계속 문제없이 작동이 되다가.. 언제부턴가 state 값은 바뀌는데, UI상에선 값이 그대로 유지하게 되었다. (예를들어 set_num의 값이 1인데 setState()로 set_num의 값을 2로 바꾸면, 실제 값은 바뀌는데 UI 상에선 1이 그대로 유지된다.) this.setState({set_num: value })} value={this.state.set_num} /> 이 문제를 해결하는 방법은 매우 간단하다. 아래와 같이 initValue 속성을 추가하면 된다. this.setState({set_num: valu..

  Read More