개발일지

Fabric 모드를 사용하고 iOS 실기기에서만 Metro에 연결되지 않는 문제가 발생했다. 여러가지 시도를 해봤지만, 해결된 방법은 RCTWebSocketExecutor.mm 파일의 localhost 부분을 본인의 ip로 변경하는 방법이었다. - (void)setUp{ if (!_url) { NSInteger port = [[[_bridge bundleURL] port] integerValue] ?: RCT_METRO_PORT; NSString *host = [[_bridge bundleURL] host] ?: @"본인의 IP"; NSString *URLString = [NSString stringWithFormat:@"http://%@:%lld/debugger-proxy..

React Navigation을 사용하게 될 경우, 다양한 의존 라이브러리를 설치해야 하는데, react-native-safe-area-context 라는 라이브러리도 이에 해당한다.  react-native-safe-area-context를 설치한 김에 해당 라이브러리를 확인해 보았을 때, iOS 기기의 safe area 영역을 효율적으로 관리할 수 있다는 내용을 확인하고, 어차피 설치해야 하는 거 사용하게 되었는데, navigation의 헤더를 사용할 때 iOS기기에서만 Header와 화면 사이에 여백이 생기게 된다. 이를 해결하려면 Header를 사용하는 스크린에서는 SafeAreaView를 사용하지 않고 View로 대체해야 한다.

개인 프로젝트를 진행하던 도중 민감한 정보를 실수로 올려 버렸을 때, 깃허브에서 해당 파일의 이력만 지울 수 있다. git filter-branch --force --index-filter 'git rm --cached --ignore-unmatch ' --prune-empty --tag-name-filter cat -- --allgit push --force --all - 해당 명령어는 최상단 폴더에서 실행할것- 경로를 정확하게 설정할 것 물론 가장 중요한 것은 .gitignore파일에 등록하고, 환경변수를 이용해서 최대한 중요 정보를 노출시키지 않도록 주의하는 것.

React Navigation의 native stack을 활용하여 네비게이션을 사용중이었는데, 공식문서에 나와있는 것처럼 뒤로가기 방지 설정을 해주었는데도 방지가 안되고 뒤로가기가 잘 되고 해당 에러를 뱉었다. 아무래도 e.preventDefault() 함수가 작동하지 않아 발생하는 것 같다. The screen ... was removed natively but didn't get removed from JS state.This can happen if the action was prevented in a 'beforeRemove' listener, which is not fully supported in native-stack.Consider using 'gestureEnabled: false' to..

0. 나만 그런가..? 개발자로서 작업을 하다가 보면, 콘솔창에 찍히는 print와 console 등으로 인해 왜 안되는지, 뭐가 문제인지 찾아볼 수 있게 된다. 그러다 보니 정작 앱을 테스트하다 제대로 동작이 안 되는 경우 무덤덤하게 Xcode를 보게 된다. 그러면서 에러를 해결하고, 다시는 그 화면을 안 보게 되는 듯이 작업을 하게 된다. 하지만 에러가 발생하는것이 당연한 경우가 있다. 사용자가 로그인을 할 때 잘못된 비밀번호를 입력했을 경우, 서버단에서 문제가 발생했을 경우, 우리는 에러를 사용자에게 알려야 한다. 나 같은 경우 뭔가 덤덤해져서 catch 문 내에서 print() 처리만 하고 이후에 그냥 넘기게 되고, 다른 레포들을 보아도 그러한 부분들이 몇 개 보이기도 한다. 이러한 점을 조금 잡..

들어가면서 사실, 제가 이전 글의 제목을 잘못 적었습니다. Next.js로 블로그 만들기라는 제목을 가지고 있지만, 블로그를 만드는 내용보다 다크모드를 적용한 내용을 적었기 때문에, 제 블로그를 방문하는 분들이 충분한 정보를 얻어가지 못했을 거라 생각됩니다. 잘못적은 글 그래서 지금, 미처 남기지 못했던 내용들을 적어보려 합니다. MDX 이 블로그는 Next.js와 MDX를 활용해서 만들어져 있습니다. MDX는 마크다운과 JSX를 섞은 끔찍한 혼종 입니다. 사실 이렇게 블로그를 만들고 있는 도중에도 완벽하게 사용하고 있는 기분이 들지 않고, 글을 작성해나가면서 생기는 오류들을 수정하면서 작성하고 있습니다. 그럼에도 불구하고 제가 괜찮다고 생각하는 이점 중 하나는 커스텀이 가능해집니다. 내가 자주 사용하는..

Intro 아무리 좋은 서비스를 만들었다 하여도, 사람들에게 노출이 되지 않으면 서비스 자체를 만날 수 없습니다. SEO를 잘 설정해놓으면, 사람들이 검색한 단어와 연관된 웹 서비스를 노출시킬 수 있고, 이는 결국 서비스에 유입이 될 수 있습니다. 오늘 글의 주제는 SEO와 이를 제 블로그에 설정한 과정입니다. 블로그를 만든 이유는 개발을하며 배운 내용들을 정리하고, 제가 원하는 템플릿을 만들기 위해서도 있지만, 다른 사람들에게 제 블로그 내용들을 다른 사람들과 공유하는 것이 가장 큰 이유입니다. 이를 위해선 기본적으로 SEO를 적용하여 구글 및 타 사이트에서 검색이 되도록 만들어야 합니다. 이를 하기 위해서는, SEO를 위해 몇 가지 과정을 거쳐야 하는데요, 이러한 과정들을 서술하기 앞서, SEO에 대..

MDX 적용이 궁금하신 분은 이 포스트에 정리했습니다. 다른 서비스들 두고 왜..? 저는 티스토리 블로그를 사용하고 있었습니다. 블로그를 사용하면서, 제 마음에 드는 블로그 스킨이 없었고, 프론트엔드 개발자로 시작한 이상 제 블로그를 직접 만들어서 사용하는 것도 의미가 있겠다란 생각을 했습니다. 그리고 제가 사용하면서 제가 필요한 기능들은 개발하면서 추가해나가면서 블로그를 운영하면 실력도 늘고, 좋은 경험이 될 것이라 생각했습니다. 사용한 스택 사용한 스택은 다음과 같습니다. Typescript, Next.js, Styled-Components, MDX, Zustand 입니다. 구현한 (구현하지 못한) 기능들 제가 처음부터 있었으면 하는 기능들은 다음과 같습니다. 마크다운으로 블로그 포스트 작성 다크모드..