거의 알고리즘 일기장

어그로가 아니다. 정말 서버의 첫 커밋부터 앱 배포까지 날짜를 세보니 10일이 걸렸다. (평일때는 한 1~2시간정도밖에 못한걸 생각하면, 놀라운 속도.. cross platfom 최고이)뭘만들었는가?앱 스크린샷 일정은 얼마나?이번에 정말 ai의 생산성을 극한으로 뽑아냈고 이것저것 할줄 안다는게 ai 시대에서 얼마나 유리한지 알게 되었다. 아이템 선정?예전에 쿠키런 킹덤 맨 처음에 나왔을때, 사회초년생이라 돈도 없는데, 돈도 지르고 겁나 열심히 했었다. (인앱결제의 무서움을 알게 되었다 원터치로 결제되버리니까.. 그냥 계속 사게됨)(예전에는 나쁘지 않았던거 같은데, 오랜만에 켜보니 비루해보이네..) 아무튼 다시 해보려고 했는데, 생각해보니까 뭔가 쿠폰시스템이 존재했던걸로 기억해서 이거 웹사이트에서 하기 귀..

정말 오랜만의 글이다!.. 일도 정신없었고 바쁘기도 했어서 정말 간단하게 뭐했는지 정도로 써보겠다.!..그냥 skia를 이용해서 이런것도 할수있다~ 정도로 이해해주면 좋겠다. 이번에 가져온 주제는 조금 재미있는 주제이다!바로바로 react native skia의 runtime shader를 이용한 불 이펙트를 만들어 보는것이다! 이게 완료되면 여러가지에 적용해볼수 있다 (outline effect) (예시들은 다음과 같다.) 불 이펙트 오늘의 그림일기에 들어간 Outline 불 이펙트자 그럼 ㄱㄱㄱ~사전지식아무래도 이런 구현은 shader를 다루기 때문에 sksl을 알고 있거나 혹은 glsl 같은 쉐이더 언어를 알고 있다면, 꽤나 쉬운내용이다. 만약에 모르겠다면, 아래의 문서를 조금 읽으면 이해가 될것이..

서문최근에 회사에서 만든 앱이 강의를 보는 앱이었다. 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..

이번에 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 미만의 시뮬레이터에서는 제대로 ..

그림일기 프로젝트의 캔버스의 퍼포먼스 향상작업을 하던 도중에 react native skia에 대해서 접하게 되었다. 이 모듈은 rn의 퍼포먼스의 한계상 못했던 다양한 앱을 만들수 있을거 같아 이 모듈을 적극적으로 사용한 앱을 하나 기획하고 만들게 되었다. (앱의 1차버전은 이미 만들기는 다 만들었고 play store는 통과, app store는 아직 미제출 상태이다!) 심사 통과 완료~ https://play.google.com/store/apps/details?id=com.kwonkunkun.whiteboard&pli=1 모션드로우 - Google Play 앱 그림을 그려 재미있는 애니메이션을 만들어보세요! play.google.com https://apps.apple.com/us/app/%EB%A..

이 글은 최근 expo만을 이용해서 앱을 만들고 배포까지 해보고 만든 후기이다. 약 1년전에 이런글을 적은적이 있다. https://kunkunwoo.tistory.com/279 react native 약 1년간 사용해본 얕은 후기 react native를 작년 12월쯤 expo로 이용해본것을 시작으로 사용한지 약 1년쯤 지났다. 최근들어 rn에 대한 회의감이 들기 시작했다. 그래서 한번 rn 약 1년 사용기를 정말 얇게 남겨보고자 한다. 주의!: kunkunwoo.tistory.com 이 당시에는 꽤나 rn에 대한 불신이 가득한 상태로 적어서 조금 부정적으로 적었던거 같다. 현재는 rn 자체에 꽤나 익숙해져서 그런지 디버깅이나 이런게 수월해져 다시 긍정적으로 생각하고 있지만, 초심자들 입장에서는 벽이 ..

왜 개선하는가?? 오늘의 그림일기 앱의 무한스크롤은 1. useEffect의 dependencyArray에 따라 fetch 함수 실행 -> 2. fetch 함수 success시, state를 기존의 state에 추가 하는 방식으로 짜여져 있었다. 이러다보니 꽤나 많은 부분을 신경써줘야 했고 많은 부분이 불편했는데, 내가 느낀 단점은 이랬다. 1. useEffect 자체가 api를 fetching하는데 적합하지 않다. 단적인 예로 1. strictMode에서 2번씩 실행되도록 되어있음. 2. dependencyArray를 이용하는 방식이라 이걸 컨트롤하기가 쉽지가 않다. 2. 짜야할 로직이 많다. loading, refresh, error에 대한 컨트롤 로직이 꽤나 많다. 그래서 개선해야할 필요성이 있다고..