본문 바로가기

분류 전체보기18

리액트 네이티브 카카오톡 공유하기(feat. 윈도우 10, 구글 플레이 앱 서명) 카카오톡 공유하기를 구현하는 건 어렵지 않다. (물론 직접 만들진 않는다..) https://github.com/shpongle2634/react-native-kakao-links shpongle2634/react-native-kakao-links React-Native Kakao Link Module. Contribute to shpongle2634/react-native-kakao-links development by creating an account on GitHub. github.com 이 라이브러리를 사용하면 되기 때문이다. 하지만 개발 시에는 잘 되던 공유하기 기능하기 기능이 릴리즈 모드에서는 제대로 동작을 하지 않았다. 물론 짐작대로 사이닝 키 관련 문제였는데 카카오 개발자 콘솔에 키 해시.. 2020. 1. 23.
리액트 네이티브 인 앱 결제 지금 만들고 있는 앱에 인 앱 결제를 넣어보고 싶어서 구현을 해 보았는데 하면서 알게 된 부분을 정리해봤다. 일단 라이브러리는 이걸 사용했다. https://github.com/dooboolab/react-native-iap dooboolab/react-native-iap react-native native module for In App Purchase. Contribute to dooboolab/react-native-iap development by creating an account on GitHub. github.com 일단 직접 안드로이드 코딩하는 건 못하고..ㅠ 찾아보니 그래도 꽤 많이 쓰여서 사용하기로 했다. 주간 다운로드도 일반적인 리액트 네이티브 라이브러리에 비하면 적은 편이지만 인 앱.. 2020. 1. 21.
리액트 네이티브 안드로이드 release용 파일 만들기(feat. 파이어베이스 구글 로그인) 드디어 앱 개발을 마쳤다. 이제 google play store에 앱 파일을 업로드 해야 배포를 할 수 있다. 이 때는 react-native run-android를 하는 것과는 달리 릴리즈 형태로 빌드를 해야 한다. 여기서 내가 사용한 방법은 먼저 release-key를 만들고, 번들을 만드는 것이다. 이 때 내가 만든 번들 파일은 .aab의 확장자를 갖는데 다른 블로그에서는 apk파일을 직접 만들기도 한다. 그래서 차이에 대해 알아봤다. 역시나 stackoverflow에 설명이 잘 되어 있다. (출처: https://stackoverflow.com/questions/52059339/difference-between-apk-apk-and-app-bundle-aab) 일단 .aab 파일은 다음과 같이 만.. 2020. 1. 21.
css로 사이드 overlay 네비게이션 만들기 구현하려는 기능 기능 설명 메뉴 아이콘을 클릭하면 사이드에 네비게이션이 오버레이로 열린다. 준비물 html, css, javascript(함수 2개) 구현 설명 /* The side navigation menu */ .sidenav { height: 100%; /* 100% Full-height */ width: 0; /* 0 width - change this with JavaScript */ position: fixed; /* Stay in place */ z-index: 1; /* Stay on top */ top: 0; /* Stay at the top */ left: 0; background-color: #111; /* Black*/ overflow-x: hidden; /* Disable hor.. 2020. 1. 20.
일곱 번째 프로젝트. Tinder UI Clone 설명: https://reactnativeexample.com/a-tinder-clone-app-with-react-native/ 위의 프로젝트를 참고해서 만들었다. 사실 위의 프로젝트를 리팩토링한 게 전부다. 내부를 들여다보면 Swiper 라이브러리를 사용한 걸 제외하고는 FlatList, ScrollView, View, Text, Image 등을 사용한 게 전부다. 그럼에도 그럴듯한 앱 UI를 만들었다는 점이 신기하다. 스크린은 Explore, Match, Chat, Profile 이렇게 네 개로 나누어져 있고 그래서 당연히 Tab Navigation을 사용한다. Explore 화면에서는 카드를 넘길 수 있게 되어 있고, Match 화면에서는 매칭된 유저를 보여준다. Chat 스크린에서는 유저와의 채.. 2019. 12. 3.
여섯 번째 프로젝트. Awesome Project Timeline App 설명: 예전부터 내가 작업한 프로젝트를 관리할 수 있는 앱을 만들고 싶었다. 그러던 중 timeline 라이브러리를 알게 됐고 이걸 사용해서 내가 작업해온 프로젝트를 한 눈에 볼 수 있는 앱을 만들기로 했다. https://reactnativeexample.com/timeline-component-for-react-native-app-work-for-android-and-ios/ 이 라이브러리인데.. 사실 선 그려주고, 시간 혹은 날짜 그려주고, 동그라미 그려주는 게 전부인 리액트 라이브러리. 옵션을 전부 떼니까 정말 단순한 라이브러리가 되었고, 나는 타임라인 자체를 수정할 일은 없기 때문에 옵션을 전부 뗀 상태로 파일 하나를 프로젝트 안에 넣었다. 또한, 로그인 과정을 참고해서 만들었다. 이번 프로젝트.. 2019. 11. 26.
반응형