만족

렌더링 타임에 state의 갯수가 달라져서 발생하는 오류다 const Mycomponent= ()=>{ const [foo, setFoo]= useState(''); if(foo!== ''){ const [bar, setBar]= useState(''); } return ( setFoo('foo')}>버튼); } 위 코드에서는 버튼을 클릭하기 전에 state가 한 개(foo) 였다가, 버튼을 클릭하고 나면 const [bar, setBar]= useState(''); 에 의해 state가 하나 더 생긴다. 이런 경우 발생하는 오류이므로, state의 갯수는 조건과 관계없이 동일하도록 변경하고, 그 state에 따른 사이드이펙트를 조건부 처리하는 방식으로 수정한다.

//... const router= useRouter(); useEffect(()=>{ //... }, [router]); //... 이런 코드가 있을 때, bfcache로부터 페이지가 복원된다면 어떻게 될 것 같은가? 내 생각에는 당연히 memory snapshot을 복구했으니 router가 업데이트되지 않을 것이라고 생각했다. 실제로 데스크탑 크롬에서는 그렇게 동작한다. 그런데 모바일/데스크탑 사파리와 모바일 크롬, 삼성 브라우저에서는 router가 업데이트된다. 아래 코드를 기준으로 설명할 것이다. (원본 코드는 https://github.com/NamGungGeon/why-router-is-updated 에서 확인할 수 있다) // page/index.js function Home() { cons..

리액트 프로젝트를 빌드하면 나오는 결과물들을 간단히 다음과 같이 분류할 수 있다. 1. css 2. js 3. html 4. asset (png, svg ...) 이들에 관해 어떻게 캐시 전략을 세울 수 있을까? css, js css와 js는 빌드할때마다 결과물이 변경될 경우 파일네임 중간의 해시값이 바뀌게 된다. 예를 들어 처음 빌드했을 때 다음과 같은 빌드 결과물이 나왔다면, js코드를 일부 수정하고 다시 빌드했을 때 이런 식으로 js가 변경되었으므로 main.[HASH].js 에서 HASH가 업데이트된다. 따라서 같은 이름의 css, js는 다시 로드할 필요가 없고, 영구적으로 캐싱하기로 결정했다. (빌드 결과물에서 직접 코딩하는게 아닌 이상... 어차피 빌드 파일 이름이 변경되므로 영구캐싱이 타당..

이번에 전면 광고의 로딩 시점과 표시 시점을 변경하여, 그렇게 변경한 이유와 장점에 대해 소개한다. 기존 기존에는 스플래시 화면이 초기화될 때(onCreate)에서 로딩을 시작하고, 3초를 기다리거나 그 전에 광고가 로딩된 경우 표시했다. 그러나 admob의 응답 속도는 그다지 빠르지 않으며, 네트워크가 느린 환경에 있는 유저도 꽤나 많았기 때문에 노출률이 그다지 높지 않았다. https://satisfactoryplace.tistory.com/133 [Android] Google Play - 앱, 타사 광고, 기기 기능 방해 정책 위반 갑자기 다음과 같은 메일이 날라오며 앱 업데이트가 거부되었다. 의아한 것은 해당 업데이트 내용은 버그 수정 및 편의성 강화로써 광고 관련 코드는 수정된 바가 전혀 없다는..

현재 시간 기준으로 타겟SDK가 31 미만인 경우 업데이트 제출이 불가능하다. 추후 또 기준이 변경되면 올리고 문제찾고 해야하는데 이것이 귀찮기 때문에.. 이번에 33까지 한번에 올렸다. 아니나다를까 오류가 우수수 쏟아졌는데 하나씩 해결법을 설명하겠다. kaptDefaultsDebugKotlin ... InvocationTargetException Execution failed for task ':app:kaptDefaultsDebugKotlin'. > A failure occurred while executing org.jetbrains.kotlin.gradle.internal.KaptWithoutKotlincTask$KaptExecutionWorkAction > java.lang.reflect.Inv..

시간없어서 일단 참고링크만 걸어두고 나중에 작성할 예정 https://medium.com/@niraj_prajapati/automate-android-app-publishing-on-play-store-using-github-actions-554de7801c36 Automate Android App Publishing on Play Store using GitHub Actions In this post, I’ll show how I managed to automate android app publishing on Play Store. medium.com https://github.com/r0adkll/upload-google-play/issues/127 Error: Invalid value at 'tra..

./node_modules/react-simple-wysiwyg/lib/index.es.mjs Can't import the named export 'createContext' from non EcmaScript module (only default export is available) 원래 잘 됐는데 github action에서 빌드 중 위와 같은 오류가 발생했다. https://github.com/megahertz/react-simple-wysiwyg GitHub - megahertz/react-simple-wysiwyg: Simple and lightweight React WYSIWYG editor Simple and lightweight React WYSIWYG editor. Contribute ..

배경 현재 redux와 swr를 동시에 사용 중이다. redux는 설정 값이나 검색 기록 등의 로컬에서만 다루는 상태들을 관리하는데 사용하고 있고, swr에는 서버로부터 받아온 데이터(상태)를 관리하는데 사용하고 있다. 기존에는 swr를 사용하지 않고 redux만을 사용해 모든 전역 상태를 관리했었지만, 캐시 관리 등의 문제로 서버에서 받아오는 데이터는 swr로 이관한 상태였다. 그러나 redux의 높은 복잡성과 swr의 단순함을 보면서 로컬 값도 swr로 관리하면 안될까 하는 생각을 하게 되었다. redux의 라이프사이클에서 알 수 있듯 보면 redux에서 새로운 상태를 다루고자 할 때 새로운 state를 정의하고 그 상태의 변화를 일으킬 때 필요한 action과 reducer를 만들고 store에 통..