jeongbaebang_dev

특정 이슈를 해결하였던 과정을 공유하고자 합니다. 해당 글을 보기 전에 꼭 자신의 프로젝트 버전과 해당 블로그의 버전을 확인하고 진행해 주세요. 현재 작성된 시점과 버전은 다음과 같습니다. "expo": "~47.0.12", "react-native-maps": "1.3.2", 이 오류는 Expo prebuild로 만든 앱이 react-native-maps 라이브러리를 사용하고 있으며, 해당 라이브러리가 Google Maps를 지원하기 위해 필요한 네이티브 모듈들이 Xcode 프로젝트에 추가되지 않았을 때 발생할 수 있습니다. 이때 발생하는 오류는 다음과 같습니다. 'react-native-maps: AirGoogleMaps dir must be added to your xCode project to s..

들어가기 앞서 프로젝트를 진행하면서 자주 발생한 참조 오류에 대해 느꼈던 부분, 문제를 어떤 식으로 해결했는지에 대해 작성하고자 합니다. 어떤 문제가 생겼었나 마이페이지의 유저 프로필 이미지와 각종 정보를 불러오는 API 통신 부분을 처리하고 있었습니다. 정상적으로 동작하는 것을 확인한 후 웹 브라우저가 아닌 모바일 브라우저에서도 테스트를 하기 위해 개인 계정으로 로그인을 시도하였으나, 로그인은 정상으로 처리가 되었지만 이후에 흰 화면만 계속해서 렌더링 되는 현상을 발견하였습니다. 에러가 일어나는 문제의 범위를 좁혀보고자 불필요한 로직을 제거하면서 에러 범위를 좁혀 보았습니다. 일단 에러가 발생하는 조건에 대해서 생각을 해보았습니다. 로그인을 시도한다. 이때 로그인은 카카오 로그인으로 시도한다. 이후 메..

들어가기 앞서 이번 프로젝트에서 Auth 관련 작업을 담당하게 되었습니다. 작업을 하면서 느꼈던 점이나 기억이 나는 부분을 작성하고자 합니다. 백엔드분들과의 일정 조율 프로젝트를 두고 로그인 방식에 대해 어떻게 해야 할지에 대한 고민이 있었습니다. 일단 자체적으로 로그인 로직을 구성하여 진행하자는 이야기가 있었고, 간편하게 소셜 로그인으로 대체하자는 의견도 있었습니다. 아무래도 프로젝트를 성공적으로 마무리하려면 핵심기능을 제외한 특정한 부분을(e.g. 로그인/회원가입) 좀 더 간소화하여 그렇게 얻은 시간을 메인 기능의 퀄리티를 높이자는 의견을 팀원들에게 건의를 했습니다. 그렇게 하여 최종 결정된 것이 소셜 로그인으로 사용자의 Auth 부분을 담당하게 되었습니다. 추후에 카카오뿐만 아니라 다른 소셜 로그인..

어디서나 볼 수 있는 카운터 애플리케이션 만들어보기 (feat. RTK) 우선 공식문서에서 추천하는 구조로 애플리케이션을 만들어 보고자 합니다. /src index.ts App.ts /app hooks.ts - 커스텀 타입을 지정합니다. store.ts - 여러 가지 스토어 관련 설정을 할 수 있는 파일입니다. /features /counter Counter.tsx - 상태를 받아 UI를 처리하는 컴포넌트를 작성합니다. counterSlice.ts - Redux 로직을 작성합니다. Redux Store configureStroe 메서드를 통해서 Redux 스토어를 만들게 됩니다. reducer 속성에 전달하고자 하는 리듀서를 넣어주면 됩니다. const stroe = configureStore({ red..

Redux는 도대체 뭐하는 친구일까 저도 처음에 React에 접한 이후 다음으로 학습해야 하는 필수 라이브러리 항상 Redux가 언급되곤 했습니다. 그렇게 Redux를 사용해야 하는 배경 또한 제대로 알지 못한 채 코드에 익숙해지기만을 바라며 학습을 진행하다 보니 결국에는 관련 이슈가 발생해도 배경지식에 깊이가 없어 어려움을 겪곤 했습니다. Redux팀은 어떠한 문제를 해결하고자 라이브러리를 도입했는지 도입 배경에 대해 포스팅해보고자 합니다. 우선 공식문서에는 다음과 같이 리덕스를 정의하고 있습니다. Redux is a pattern and library for managing and updating application state, using events called "actions". 액션이라고 불리..