본문 바로가기

React Native18

[React Native] Chat GPT로 개발하기 - 10일차 구글 플레이스토어 내부 테스트할 때는 애드몹 광고 배너가 안나와? 오늘은 기분 전환 삼아서 구글 플레이스토어에 테스트 배포 후 문제가 없는지 확인하는 작업을 진행했는데, 테스트 APK를 다운받았는데 구글 애드몹 광고가 나오지 않았다. 그래서 확인해봤는데 특별하게 정보를 알 수 없었다. 잠시 후 다시 어플을 실행시키니 잠깐 광고가 안나온 문제였고 제대로 나오기 시작했다..... 내부 테스트중에 import Tts from "react-native-tts"; 이걸로 소리가 안나는데 뭐가 문제야? 안드로이드 스튜디오에서는 제대로 소리가 나던 TTS가 휴대폰에서는 제대로 소리가 나지 않는 문제가 있었다. 하지만 답변은 일반적인 tts에 대한 정보만 전달받았다. 그래서 다시 질문을 구체화해서 물어봤다. 안드로이드.. 2023. 9. 10.
[React Native] Chat GPT로 개발하기 - 9일차 react native에서 화면이 변경될 때마다 useEffect가 실행되길 원해 React Native에서 화면이 변경되면 useEffect가 실행되는 코드를 원했다. 하지만 알려준 것은 state가 변경되면 실행되는 코드를 알려줬다... 슬슬 어느정도 개념을 잡아서 GPT에게 질문할 일이 없어서 스트레스를 적게 받았는데 오랜만에 고통을 받는중이다... router의 경로가 변경될 떄마다 실행되길 원해 useEffect 의 의존성 배열에 natigation을 넣어주면 해당 기능이 가능하다고 한다. 하지만 나는 context API를 사용하는 곳에서 해당 기능이 필요했다. 그래서 전체 코드를 알려주고 한번 더 질문했다. 전체 코드를 포함해서 질문을 해서 질문 라인이 너무 길어서 답변만 캡쳐했다. useN.. 2023. 9. 9.
[React Native] 폰트 적용하기 react나 react native나 폰트를 적용하는 것은 생각보다 귀찮다. react의 경우 google fonts를 사용한다면 public에 있는 index.html에 링크를 추가해주면 되지만 생각보다 react native는 귀찮았다. 그러다가 이번에 간단하게 처리하는 방법을 알아서 정리한다. 폰트 저장 먼저 원하는 폰트를 /assets/fonts 폴더에 저장한다. 기본적으로 assets 폴더도 없을 것이고 fonts 폴더는 더더욱 없을 것이다. 그러니 해당 폴더를 만들고 내부에 사용할 폰트 파일을 추가해주면 된다. 라이브러리 사용 npm i react-native-asset 원래는 android 폴더 등에 설정을 해야하는데 그런 작업을 간단하게 해주는 라이브러리가 바로 react-native-as.. 2023. 9. 4.
[React Native] Chat GPT로 개발하기 - 8일차 react-native-shadow-2 말고 다른 방법으로 그림자를 만드는 방법이 뭐가있어? react-native-shadow-2는 그림자를 만들어주는 라이브러리이다. 그런데 해당 방법을 사용하면 생각보다 그림자를 넣는 기능이 자유롭지 않았다. ScrollView에서 그림자를 만드는 작업을 진행할 때 특히 심했다. 좌우 그림자가 짤린다던지 하는 문제 말이다. 물론 이건 내가 React Native를 잘 하지 못해서 그런 문제일 수 있지만 React에 비해서 React Native로 개발하는 것은 많은 불편함을 느끼고 있다. 자바스크립트만으로 개발을 할 수 있다는거에 만족할 수 있겠지만 몇몇개는 정말 이것으로 어플을 만들 수 있는지 의심이 들었다. 어쨋든 해결 방법으로 react-native-svg 같은.. 2023. 9. 3.
[React Native] Chat GPT로 개발하기 - 7일차 import Sound from 'react-native-sound'; 이걸 사용해서 버튼을 누르면 해당 소리가 나오게 하려고 하는데 어떤 방법을 사용해야할까? 지난번에 진행한 react native tts가 휴대폰 시스템 tts로 실행이 되어서 내가 원하는 국적의 언어를 읽어주긴 하지만 실제로 실행할 때 한국인이 해당 국적을 읽어주는 문제가 있었다. 그래서 결국 mp3로 대체하는 방식을 사용하고 추후 tts로 해결이 가능한 방법이 있다면 그 방법을 사용할 생각이다. 그래서 Chat GPT에게 물어본 결과 react native sound 라는 라이브러리를 추천받아서 사용하기 시작했다. 질문이 너무 급진적으로 라이브러리를 바로 물어본 것 같지만 앞에 많은 내용이 있었다.... GPT를 사용하면서 느낀게 .. 2023. 9. 2.
[React Native] 빌드하기 Expo가 아닌 React Native에서 빌드하는 방법을 작성하려고 한다. Window 환경에서 진행하며 iOS는 유감이지만 진행하지 않고 Android 만 진행할 계획이다. 서명 키 생성 빌드를 하기 위해서는 서명키가 필요하다고 한다. 현재 개발 환경에서 android / app 폴더로 이동해서 명령어를 통해 서명키를 발급받는다. keytool -genkey -v -keystore my-upload-key.keystore -alias my-key-alias -keyalg RSA -keysize 2048 -validity 10000 Enter keystore password: Re-enter new password: What is your first and last name? [Unknown]: Wha.. 2023. 8. 28.
[React Native] Chat GPT로 개발하기 - 6일차 expo에서 글자를 읽어주는 기능을 만들고 싶어 쓰는 부분은 해결했으니 이제 읽어주는 기능이 필요해서 질문을 했다. 지난번 스트레스로 이번엔 미리 Expo라는 것을 알려주고 글자를 읽어주는 기능에 대해서 질문했다. 그래도 이번엔 한번에 필요한 기능을 말해줬다. 일본어를 읽을건데 일본인도 가능해? 읽는 것은 문제가 없는데 나는 다국어 지원이 필요했다. 따로 설정 없이 일본어를 읽게하니 어색하게 글자를 읽었다. 그래서 일본어 설정이 가능한지 물어보고 답변을 받아서 읽어보게 했다. 다른 읽어주는 라이브러리는 없을까? 후.... 일본어 설정을 해도 이상한 기계음이 섞여 있어서 사용에 불편함이 많았다. 그래서 다른 라이브러리가 있는지 물어보고 해당 라이브러리를 사용할 계획을 했다. 바로 알려준 react-nati.. 2023. 8. 27.
[React Native] Chat GPT로 개발하기 - 5일차 expo에서 터치로 쓰기를 하려면 어떻게 해야해? 간단한 어플을 만들기 위해서 지난번 Native 환경이 아닌 Expo 환경에서 다시 개발을 진행하다가 터치로 그림을 그리는 작업이 필요했다. 어떤게 있는지 궁금해서 간략하게 질문을 했었다. 해당 패키지를 설치하니 ViewPropTypes will be removed from React Native, along with all other PropTypes. We recommend that you migrate away from PropTypes and switch to a type system like TypeScript. If you need to continue using ViewPropTypes, migrate to the 'deprecated-rea.. 2023. 8. 26.
[React Native] Chat GPT로 개발하기 - 4일차 React Native에서 View 아래 버튼의 높이가 꽉차는데 내가 원하는 높이로 설정하려면 어떤 방법을 사용해야해? 당연하지만 height을 설정하면 문제가 없다고 한다. 하지만 당연히 height은 50으로 값을 넣어줬는데 내 화면의 버튼은 전체 화면을 가득 채웠다. flex 속성을 주면 꽉차게 설정되는데 방법이 없을까? 왜 그럴까 고민을 하다가 flex라는 속성에 의심을 하기 시작했다. flex는 부모 컴포넌트 기준으로 화면을 채운다고 했는데 이녀석을 내가 Button에게 1을 줬다 역시나 답변으로 flex 속성을 넣어서 그렇다고 한다. 내가 flex에 1을 준 이유는 flexDirection과 align-item을 주기 위해서였는데 flex 값을 주지 않아도 기본 display가 flex이기 때.. 2023. 8. 20.
반응형