본문 바로가기

React Native67

[React Native] 스타일(색상)을 중앙에서 관리하는 방법 바로보카와 엣세이 앱에는 8개의 파랑 계열 그레이 컬러가 사용됩니다. 임의대로 Gray50 ~ Gray900 라고 정했습니다. 이렇게 정해놓으면 gray50은 배경에, 100은 구분선, 200은 버튼의 테두리 등 농도(?)에 따라서 통일성있게 사용하기에 편합니다. 그런데 개발을 하다보면 컬러 헥사값(#000000등)이나 RGB값을 외우가기 어렵죠. 처음에는 아래처럼 모든 스타일에 직접 정의를 해줬는데요. 이것도 반복되면 손이 은근 많이 탑니다. 그래서 중앙에 색상코드를 정의하고 import하는 방법으로 이용해보기로 했습니다. 이렇게 바꾼지 1주일이 넘었는데, 훨씬 편합니다 ㅎㅎ 색상코드를 외우지 않아도 되고, 외웠더라도 따옴표누르고 직접 안쳐도 되니 좋아요! 중앙에서 쓰는 법은 아주 간단해요.. lib디.. 2022. 1. 6.
기획부터 배포까지 일주일만에 영단어 퀴즈 앱 만들기 (앱스토어 첫 출시 심사 4시간만에 승인!) 앱을 만들기로 결정하고 기획부터 배포까지 일주일에 걸쳐 영단어 퀴즈앱 '바로보카'가 완성되었습니다. 아이폰 다운로드> 안드로이드 다운로드> 많은 사람들이 영단어를 꾸준히 외우고 싶어하지만, 꾸준히 습관을 만들기가 참 어려운 것 같아요. 저도 '하루에 20개씩 외우겠어!' 라고 다짐하지만 며칠 못가고는 했습니다. (중학교때부터 지금까지...) 동기부여가 되도록 영단어 암기에 보상을 추가한 보상형 영단어 퀴즈앱을 만들고 싶어졌습니다. 캐시워크가 100보에 1캐시씩 바꿔주듯이, 영단어 1문제를 풀때마다 1캐시씩 적립시켜주는 앱을 말이죠. 용돈을 벌 수 있다면 더 성취감도 있고, 커피도 사먹고..영단어를 더 자주 보지 않을까요? 이런 아이디어를 시작으로 앱 기획을 시작했습니다. 작업 전에 개발 과정을 크게 2가.. 2022. 1. 5.
[구글 애드몹] app-ads.txt 설정하는 쉬운 방법 앱에 구글 애드몹으로 광고를 달려고했더니 이것저것 해야할 게 많습니다. 다 끝난 줄 알았는데 app-ads.txt 라는 걸 웹사이트에 추가하라고 하네요. (내 앱은 웹사이트가 없는데..?) 이게 뭐야.. 하고 골치아팠는데 간단하게 해결할 수 있었습니다. 1. app-ads.txt 가 뭔데? 쉽게 말하면 "이 앱이 제대로 된 앱인지 아닌지 판별해주는 텍스트" 라고 할 수 있습니다. 구글애드몹에 광고를 맡길 광고주에게 효율이 높은 광고매체를 제공하기 위해서 제대로 된 앱이라는 걸 판별해주는 것 같습니다. 설정을 안해도 되지만, 이걸 설정하지 않으면 광고 수익이 급감한다고 협박성 문구를 보여줍니다. 2. 설정 방법 구글에서 언제나 그랬듯이 자세하지만 이해하기 어렵게 잘 설명해주었습니다. (구글 문서) 1) 앱.. 2022. 1. 5.
맥북 프로 13인치(m1) / 16인치(intel) 고급형 모두 사용해본 비교 후기 직접 만든 영단어 앱테크 어플 (하루 10분 100캐시 적립 가능!) 아이폰> ‎캐시보카 - 돈버는 영단어 앱테크 ‎단어를 맞추면 1캐시가 적립돼요. 적립된 캐시는 네이버 포인트로 전환할 수 있어요. apps.apple.com 안녕하세요. 저는 2021년 1월부터 4월까지 인텔칩 기반의 맥북 프로 16인치를 사용하다가 5월부터 12월까지 맥북프로 m1 13인치로 넘어왔습니다. 그리고 다시 인텔칩으로 넘어갑니다. 인텔 -> m1 -> 인텔 처음 m1 칩을 접했을 때의 기분을 이루 말할수가 없습니다. 지금은 시스템 용량때문에 다시 이전에 쓰던 16인치 맥북으로 넘어오긴 했지만, 만약 16인치를 구매했을 때 16인치에도 m1이 달려있었다면 당연히 그것을 구매했을 것 같습니다. 8개월간 사용하며 맥북프로 16인.. 2022. 1. 5.
[IOS 에러 해결] Xcode 아카이브(Archive) main.jsbundle does not exist 에러 출시버전의 앱을 다 만들고 ios에 배포하려고 들뜬 마음으로 아카이브를 하는데 자꾸 build failed가 뜬다.. build failed 만큼 기운빠지는 단어도 없는듯 ㅠ 1. 에러 상황 에러코드를 보니까 내 디렉토리 주소가 쭉 적혀있고 제일 뒤에 main.jsbundle does not exist 라고 적혀있다. 에러는 역시 구글링이지 2. 해결 방법 1) package.json의 script 부분에 아래 코드를 추가한다. "build:ios": "react-native bundle --entry-file='index.js' --bundle-output='./ios/main.jsbundle' --dev=false --platform='ios'" 2) 루트폴더 디렉토리에서 아래 코드를 실행하면 ios.. 2022. 1. 4.
[React Native 에러 해결] IOS, No bundle URL present 1. 에러 상황 이유는 모르겠으나 No bundle URL present 에러가 발생했다. 아마 이것저것 만지다보니 나도 모르게 잘못 건드린거같다 ㅠ 2. 해결방법 해결방법이 간단하다. 다행.. 첫번째 방법) ios/build 폴더를 삭제한다. 또는 두번째 방법) Xcode에서 빌드 폴더를 클린해준다. 그랬더니! 굿쟙 RN으로 만든 영단어 앱테크 어플 (출시 후 매일 100명 가입중!) 아이폰> ‎캐시보카 - 돈버는 영단어 앱테크 ‎단어를 맞추면 1캐시가 적립돼요. 적립된 캐시는 네이버 포인트로 전환할 수 있어요. apps.apple.com 2022. 1. 4.

티스토리툴바