거의 알고리즘 일기장

이번 인프콘 2024에서 React Native와 함께 인프런 앱 새로 만들기 라는 주제로 발표를 진행했었는데, 이 글은 그 후기이다.발표를 하게 된 이유사실 인프런에 입사하게 되면서 꼭 해야겠다고 생각한것이 컨퍼런스에서 한번 발표를 해보자 였다.하지만, 원래는 이렇게 까지 빨리 할 생각까지는 없었는데,  우리팀의 cto인 향로가 말했던 이야기중에원래 발표를 싫어했어서 항상 발표를 피했었다. 근데, 어느순간 이게 너무 싫어서 발표를 맡아서 하게 되었고 이제는 더이상 발표를 하는것에 있어서 두려움이 있지는 않다. 팀원들도 이런 경험을 가졌으면 좋겠다.라는 뉘앙스의 이야기를 듣고 오케이 어짜피 할꺼면 빨리하자! 라고 생각을 고쳐먹고 바로 발표를 하겠다고 하게되었다.발표의 주제 선정주제 선정 자체는 간단했다...

기존에 앱 만들때는 성능측정 & crash report 등을 무료인 firebase의 제품들을 많이 사용했다. 1.. firebase crashlytics2. firebase performance  이번 기회에 데이터독을 붙여보게 되었는데, 이건 미쳤다.session을 확인해볼수 있어 문제가 생겼을때, 디버깅에 엄청나게 유리하고.. firebase에도 있기는 하지만, sourcemap 만 등록해두면 어느 코드에서 문제가 생긴지도 알려주는식으로 엄청나게 강력하다 ㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋ  그리고 react native의 경우에는 화면의 랜더링 측정이 조금 애매하고 하려면 서드파티를 쓰거나 직접 maker를 만들어서 찍는 (start marker는 js, end marker는 Native에서 찍어야함) 귀..

서문최근에 회사에서 만든 앱이 강의를 보는 앱이었다. rn으로 하다보니 내가 원하는 모션을 정확하게 구현하기가 힘든 부분이 있었다. 조금 더 설명하자면, 비디오를 보고 있는중 세로모드 -> 가로모드(full screen) -> 세로모드로 갈때 하단의 자료 섹션(유튜브로 치면 비디오 info 부분)이 같이 돌아가는데, 나는 유튜브처럼 세로모드로 남아있어 줬으면 했다. 원하는 모션 찾아본 바로는 해당 모션을 구현하기 위해서는 info에 해당하는 저 섹션이 supportedinterfaceorientations 라는 property를 사용해야 가능한것으로 보였다. 그리고 문제를 해결하기 위해서 이런 의식의 흐름으로 찾아보았다. -> 문제를 해결하기 위해서는 ui view controller를 추가하고 옵션을 ..

오늘 점심에 재미있는 실험에 대한 아티클을 읽었는데, 공유차원에서 올린다. 자세한 내용은 직접 보는것이 좋다.https://blog.theodo.com/2023/10/native-views-rn-performance/ Using RCTView & RCTText in React Native for Performance Gains | TheodoComparing the performance of rendering View and Text elements on React Native, using regular and native views. Assessing the impact of the new architecture on iOS and Android, with insights into rendering t..

오늘은 잠깐 할 시간이 생겨서 실린더와 구 매시를 구현했다. 이미 강의를 통해 directx로 구현해봤던 것들인데, 다시 짜보려니까 머리가 안돌아가서 혼났다 ㅠ 암튼 했으니 굿~

세가지 조명 (directional, point, spot)을 구현하였다. 구현의 어려움보다는 memory layout을 어케 넘겨야 적절하게 넘어가는지 docs를 봐도 당최 뭔소린지 모르겠어서 한참 시간을 날렸다. 이 글을 보는 사람이 있다면, 그냥 webgpu 유틸리티 구현체들이 npm에 있는것 같은데 그거 쓰는게 정신건강에 이로워 보인다. 조명의 구현방식은 홍정모 선생님의 그래픽스 강의 2편에서 실습해본 조명 코드기반으로 그 코드를 이해하고 그 수식대로 옮겨보았다. 눈으로 보이는게 참 재밌긴 하다.

최근 그래픽스에 관심이 생겼다. (찾다보니 c++ 강의로 좀 유명하셨던 홍정모님의 그래픽스 강의를 1, 2편을 보게 되었다.) 수학이 조금 껴있기도 하고 퇴근후 듣다보니 많이 졸았지만 보이는것들을 코딩하는게 재밌어서 1, 2편까지는 가까스로 다보았다! 하지만, 그냥 넘어간 부분이 너무 많아 개념적으로 헷갈리는 부분이 많아서 처음부터 혼자의 힘으로 간단한 랜더러를 만들어보기로 했다. directx로 해볼까도 했지만, webgpu라는 feature가 브라우저 스펙으로 들어왔다길래 이걸로 해봤다. (아직 사용은 시기상조이긴 하다) webgpu를 이용해본 간단한 후기는 당연한 이야기지만 directx보다 훨씬 불편하고 자료도 적고 지원범위도 적고 그렇다. 예를 들면 fill mode가 따로 없는것으로 보여서 w..

이번에 1. fastlane을 이용해서 react native 앱의 빌드와 배포를 자동화하고 2. github action workflow를 이용해서 특정 trigger시 1번의 내용을 진행하도록 하는 업무를 맡아서 진행했다. fastlane을 이용해서 ci/cd pipeline 구축 자체는 자료와 예제가 많으니 어떻게 진행하는지는 생략하고 대략적으로 fastlane이 하는것이 무엇이고 주의해야 할점 몇가지만 남겨놓으려고 한다. 나를 위해?..ㅋㅋ fastlane이란? 위의 그림처럼 ios, android app 배포시에는 단계가 있다. 별거 아닌 것들이지만 배포시마다 저 과정들을 해주는건 지겨우므로 일련의 과정들의 자동화를 도와주는 도구라고 생각하면 된다. 그리고 fastlane을 구축하고 나면 ci/..

필자는 개인적으로 프로젝트에 기능을 추가할때, 미니 프로젝트를 만들어서 테스트를 충분히 해본 이후 적용하는것을 선호한다. 하지만, 미니 프로젝트를 너무 여러개 만들다보니 예전에 만들었던것을 잊고 새로 세팅하고 새로 세팅하는 금붕어 같은 짓으로 시간을 쓰곤했다. 그래서 떠올린게 최근에 만든 turborepo가 no configuration 수준으로 설정이 간편해서 이걸 이용해 모노레포 환경을 만들면 관리하기 편하지 않을까? 생각해서 시간이 남을때 조금씩 해보게 되었다. 솔직히 Next, react, expo 까지는 문서에 적혀있기도하고 example 보고 세팅하기 편했다. 근데, react native cli는 세팅하면서 자료도 없고 몇가지 짜증난 부분이 있었어서 정리해둔다. 변경해야 할 사항은 크게 세가..

상황 평화롭게 집에서 코딩하던 권모씨 어느날 이런 메일을 보게 되는데... "이제 정책적으로 android target sdk를 33이상으로 올려야 하나보다! 뭐 올려봤자 뭐가 문제가 있겠어 그냥 올리지 뭐~" 자 그렇다 내 이야기다 ㅠ target sdk를 올리면 당연히 breaking change가 있을수도 있었을텐데 왜 그걸 몰랐을까 ㅠㅠ 이제 이게 어떤 부분이 문제였고 어떻게 해결했는지 설명해보겠다! 문제 찾기 문제가 무엇인지 처음부터 유추해보자 로직이 문제일까?? 문제가 되는 부분의 로직은 일기를 이미지로 다운로드할 경우의 로직이었다. 권한 요청을 정상적으로 하고 권한을 제대로 받은 경우에는 돌아가는데 문제 없는 코드이다! 로직적인 문제도 없어 보이고 sdk 33 미만의 시뮬레이터에서는 제대로 ..