본문 바로가기

React14

React + Typescript 프로젝트 수동 세팅 및 템플릿화 이번 포스팅은 React + Typescript 프로젝트를 직접 빌드업하면서 뜯어보고, Github에 템플릿화 시켜놓기. 1. package.json $npm init $npm i react react-dom $npm i typescript @types/react @types/react-dom package.json package-lock.json: 내가 의존하고 있는 패키지가 사용하는 혹은 또 의존하는 패키지의 정확한 버전링을 확인할 수 있음. 2. ESLint 코드 검사 도구. $npm i -D eslint $vi .eslintrc // .eslintrc { "extends": ["plugin:prettier/recommended", "react-app"] } 3. Prettier 코드 자동 정렬. .. 2021. 10. 6.
[React Native] react-native-adbrix-remaster v2로 업그레이드하기 이번에 애드브릭스에서 V2로 업그레이드 해야된다는 공지를 전달받았다. 따라서 업데이트 해볼 예정...! 이미 애드브릭스 SDK V1이 설치되어 있다면 upgrade를 아니라면 install해주면 된다.: $ npm upgrade react-native-adbrix-remaster // or $ npm install react-native-adbrix-remaster --save 설치 혹은 업그레이드 후 package.json: "react-native-adbrix-remaster": "^2.1.0", ios 경로로 접근해서 설치한 애드브릭스 종속성을 설치해준다. $ pod install 그러면 기존에 AdbrixRemastered 가 삭제되고, Adbrixremastered\_XC가 자동으로 설치되는데 .. 2021. 9. 23.
[React] 함수의 재생성 방지해주는 useCallback로 퍼포먼스 향상하기 useCallback(callback, deps) useCallback은 함수를 의미없이 호출하는 것을 방지하기위해 캐싱해두는데, deps의 값들 중 하나라도 변경되었다면 그것을 감지해서 함수를 새로만든다. 바뀐게 없으면 이전에 만든 함수를 사용함. const onSubmit = useCallback((e)=>{ e.preventDefault(); console.log(email, nickname) }, [email, nickname]) 내부 변수(=e)는 선언할 필요가 거의 없고, 외부변수인 경우만 deps 추가해주도록한다. 2021. 9. 3.
[React Native] :app:installDebug Failed 이슈 해결 > Task :app:installDebug FAILED 설치하려는 apk말고 동일한 이름을 가진 앱이 이미 설치되어 있는 경우 나타나는 에러 해당 앱을 삭제한 후 다시 yarn android 명령어를 실행하면 해결 된다. 2021. 5. 24.