프로젝트: 나비야 밥먹자! 길고양이들을 돌봐주는 사람들끼리 소통하며 고양이들의 소식을 팔로우할 수 있습니다. 기능: 기본적으로 지도 API 를 이용하여 구현합니다. 고양이를 목격한 위치 혹은 돌봐주는 장소에 지도에 새로운 마커를 찍어 등록합니다. 마커를 클릭하면 상태창이 나타납니다. 상태창에는 사진(추가 가능), 목격 위치의 주소가 나타납니다. 또한 ...
이전에 올렸던 가 운좋게 채택이 되어서 팀원분들과 함께 서비스를 구현해보기로 했다. 내 아이디어라 프로젝트 팀장으로 자연스럽게(?) 임명이 되었지만 이런 역할을 맡아본 적이 많지 않아서 아직은 부담스러운 마음이 크다. 시간이 지나면서 차차 나아지길 바란다. 이번 프로젝트를 간단히 설명하자면 '길고양이들을 돌보는 사람들의 네트워크 서비스' 라고 할 수 있...
이번 포스트에서는 어제 얘기했었던 디렉토리와 컴포넌트 아키텍쳐를 관한 내용이다. 저번 포스트에 추가한 목업 페이지와 컴포넌트구조 링크를 바탕으로 만든 디렉토리이다. 이 중 목업 페이지와 를 바탕으로 구조를 짰다. 먼저 전체적인 코드로는 이런 구조를 띄고 있다. 구조가 아래서부터 위로 추가를 해서 나무 뿌리에서 가지가 뻗어나가는(?) 것과 같은데 아래서부...
이번 포스트는 현재까지 프로젝트를 진행하며 가장 많은 시간을 들이게 한 를 활용하여 만든 페이지에 관한 내용이다.
어제 지도맵을 관련해서 글을 작성했는데, 몇가지 버그가 있었다.일단 현재 mobX를 이용해 현재 position, region, boundBox 와 이와 관련된 함수들을 저장하고 있는 상태이다.componentDidMount에서 위치 권한을 허용하면서 navigator
어제 포스트에선 위치를 받아와 state에 저장하고 렌더하는 과정에서 발생하는 버그에 대해 적었었다. 오늘은 함수들을 목적에 따라 좀 더 정리하고 리팩토링을 하였다.먼저 현재 화면의 범위를 나타내는 좌표들의 집합인 currentBoundingBox 를 할당해주는 act
FlatList 는 어플에서 뉴스피드 기능을 만들 때 유용한데, Infinite Scroll(무한 스크롤 로딩) 과 Pull Down Refresh(끌어서 새로고침) 기능을 구현할 수 있기 때문이다. 먼저 이 기능들의 구현은 해당 블로그 에서 참고하여 작성하였다.또한
앱개발을 하면서 상대적으로 작업이 더 많은 프론트를 백엔드 분들이 지원을 해주시기 시작했다. 그리고 상태관리 라이브러리를 써보신 분의 조언에 의하면 현재 우리가 사용하고 있는 UserStore 와 CatStore 가 너무 포괄적이어서 Store 를 좀 더 나눌 필요가
스토어를 리팩토링하는 과정이 예상한 것처럼 대작업이 되었다. 스토어로 들어갈 observable 과 action들을 구분하는 것부터 하나하나 새로 바뀐 루트로 변수를 재지정하는 일, 그리고 컴포넌트에 새로 inject 하는 것까지 상당히 수고스러운 작업이다. 그래도 내
어제 발생했던 mariadb 문제를 여러 번의 삭제와 재설치 끝에 겨우 해결할 수 있었다. 중간에 디렉토리를 잘못 삭제해 ERROR 1006 (HY000): Can't create database 'cats' (errno: 2 "No such file or direct
몇일 전, 포스트에서 mobx store 리팩토링 작업에 관한 포스트를 작성했었다. 2개의 스토어에서 총 6개의 스토어로 확장하였고 기능에 맞게 각 스토어로 이동시켰다.이 중 스토어 분할을 통해 리팩토링을 할 수 있었던 몇 가지 helper function 에 대해 적
이번 프로젝트에서 react-native-snap-carousel 을 이용해서 지도의 마커들의 정보를 렌더하고 있었다. 링크를 확인해보면 아이템들의 정보를 하나의 카드안에 렌더하고 그 카드를 옆으로 스와이프하면 다음 인덱스의 아이템을 렌더하는 방식이다. 기본적으로 re
오늘은 앱의 포스트 기능에서 자주 볼 수 있는 Infinite Scroll 과 Pull down Refresh 기능을 구현했다. 백엔드 팀원분들에게 이 기능을 위해 pagination 기능을 추가하고 싶다고 전달하였고, 다행히 어렵지 않은 부분이라 계속 진행할 수 있었
프로젝트 개발 초기에는 빌드한 앱을 구글 플레이스토어와 앱스토어 둘 다 배포할 계획이었지만, 검색해보니 앱스토어의 검수과정과 기간이 1달 동안의 결과물로는 맞추기 어렵다는 쪽으로 의견이 모아져 플레이스토어 출시에 목표를 집중하기로 했다. 안드로이드에 맞추려면 어떤 부분
DediCatBack-end Develop, 팀장길고양이를 돌보는 유저를 위한 지도 기반 커뮤니티 앱 Stack: React Native(Expo), React Navigation, MobX, Google Maps API목업 디자인 기획 및 컴포넌트 구조 설계React
팀원 분의 지인께서 DediCats를 사용해시고 피드백을 주셨다. 마이페이지에서 내가 팔로우하는 고양이들을 확인하거나 언팔로우 할 수 있는데, 여기에 클릭하면 지도의 위치로 이동할 수 있는 버튼이 있으면 좋겠다고 말씀해주셔서 추가해보기로 했다.먼저 마이페이지에서 내가