본문 바로가기

전체 글94

Android TargetSDK 34 배포 이슈 (AD_ID 권한) > 이슈사내 앱을 24년 08월 31일까지 Android 14 (API 수준 34) 이상을 타겟팅하기 위해targetSDK를 34로 올려서 배포를 해보았는데 AD_ID 관련 이슈가 발생하여 이를 기록하고자 한다.최근에 생긴 정책이라 하는데, 앱에 따로 광고관련 기능이 없더라도 AD_ID 관련 설문은 반드시 응해야 했다.Android 13(API 33)에 광고 ID 변경사항 도입광고 ID를 사용하고 Android 13 이상을 타겟팅하는 앱은 앱 매니페스트에서 com.google.android.gms.permission.AD_ID 권한을 선언해야 합니다. 이 권한을 포함하지 않으면 광고 ID가 0으로 처리되고 ID에 액세스하려고 시도하면 ID 대신 0으로 된 문자열이 반환됩니다. > 분석공식 문서를 확인해보.. 2024. 8. 15.
[Flutter] 구글스토어 배포시 디버그 기호 업로드 > 이슈app-release.aab를 추출하여 구글 플레이 콘솔에 프로덕션 버전을 만드는 도중 오류, 경고 메시지가 떴다. (디버그 기호 파일 업로드)이 App Bundle 아티팩트 유형은 네이티브 코드를 포함하며 아직 디버그 기호가 업로드되지 않았습니다.비정상 종료 및 ANR 을 더 쉽게 분석하고 디버그할 수 있도록 기호 파일을 업로드하는 것이 좋습니다> 해결아래 경로로 이동하여 x86_64, arm64-v8a, armeabi-v7a 해당 폴더들을 함께 압축한다.[플러터 프로젝트]/build/app/intermediates/merged_native_libs/release/out/lib 이름은 크게 중요하지 않고압축한 merged_native_libs.zip 파일을 구글 콘솔에 업로드해 주면 된다.구글 .. 2024. 8. 15.
구조 분해 할당 예시 (object destructuring) 구조 분해 할당이란?"배열"이나 "객체"의 속성을 해체하여 그 값을 개별 변수에 담을 수 있게 하는 JavaScript 표현식 기본적인 것 말고, 내가 기록해두고 싶은 재할당 예시만 메모해두고자 한다. 1. 배열에서 변수 재할당- 실무에서 정말 많이 사용하는 예시const menu = ['americano', 'latte'];const [myPick, yourPick] = menu; console.log(myPick); // 'americano' console.log(yourPick); // 'latte' console.log(menu); // ['americano', 'latte'] 2. 로그인 로직에서의 배열 구조 분해 할당const authorization = "Wooyoung hbTfisdhf4X.. 2024. 6. 21.
AWS Lambda에 TypeScript 코드로 배포하기 이전 글에서 AWS Lambda와 API Gateway를 활용하여 Serverless API 환경을 구성하는 법을 알아보았다면 이번엔 실전편이다! 이전 글에서 구현한 Lambda 함수의 핸들러(이벤트를 처리하는 함수 코드의 메서드)는 기본적으로 .js 접미사가 있는 파일을 CommonJS 모듈로 취급한다. 즉, node.js 코드로 구현해야 한다는 뜻이다. 물론 선택적으로 파일명을 .mjs 확장자로 사용하여 ES 모듈로 지정할 수는 있다. [공식문서 참고] 그러나 이번 글에서는 Typescript를 이용해 Lambda 함수를 생성하고 배포하는 과정을 기록해보려 한다. > Lambda에 Typescript 코드 배포하는 방법들 - npx tsc 명령어로 트랜스파일하여 직접 zip 업로드 - AWS SAM .. 2024. 3. 1.
AWS Lambda + API Gateway로 Serverless API 환경 구성하기 > AWS Lambda란? 서버리스(serverless) 아키텍쳐. Lambda는 주로 서버리스(serverless)라는 용어와 함께 사용된다. 서버리스란 '서버가 없음'을 의미하지만 사실 서버가 아예 없는것은 아니고 서버의 관리 주체가 aws로 넘어감을 의미한다. 람다는 백엔드를 작은 함수 단위로 쪼개어 aws 내부의 서버에 업로드 하는 방식이다. 그러면 aws는 해당 함수를 내부 서버에 업로드 하고 요청 발생시 요청에 맞는 람다함수를 실행시켜준다. 따라서 람다를 이용하면 별도의 서버 구성 없이 클라이언트의 요청에 따라 원하는 함수를 실행시킬 수 있다. 그리고 람다는 요청 수 기반으로 비용이 측정되기 때문에 24시간 켜놓아야 하는 EC2같은 서비스 대비 저렴하게 이용할 수 있다. > API Gatewa.. 2024. 3. 1.
dependencies, devDependencies 차이점 (@types/) Javascript 내에서 라이브러리의 의존성 관리를 위한 종류는 3가지로 나뉜다. > dependencies 현재 프로젝트를 실행하는데(런타임시) 필수적인 라이브러리들을 포함. 이는 컴파일을 수행하고 런타임 단계에서 수행되는 라이브러리들이 이에 해당된다. 프로젝트를 npm에 공개하여 다른 사용자가 해당 프로젝트를 설치하면 dependencies에 들어 있는 라이브러리도 함께 설치된다. (전이 의존성) yarn add react > devDependencies 현재 프로젝트를 개발하고 테스트를 하는데 사용되지만, 런타임에는 필요 없는 라이브러리들을 포함. 이는 런타임 단계에서는 수행되지 않고 이전 컴파일 단계에서까지만 수행되는 라이브러리가 해당 됩니다. ex) 컴파일 단계에서 사용하는 타입스크립트와 관련.. 2023. 11. 28.
객체끼리 값 비교하기 object(객체)는 참조형이기 때문에 key, value 값 및 순서가 같은 object를 일치 연산자(===)로 비교할 수 없다. 즉, 참조형을 원시형으로 바꾸어서 비교해주어야 한다! 1. key 순서가 정해진 객체 비교 const one = { name: "wooyoung", age: 34, } const two = { name: "wooyoung", age: 34, } // 1. Using JSON JSON.stringify(one) === JSON.stringify(two); // true console.log(JSON.stringify(one)); // '{"name":"wooyoung","age":34}' // 2. Using Object.entries Object.entries(one).t.. 2023. 11. 13.
react PDF 다운로드 > @react-pdf/renderer React 진영에서 PDF를 편하게 만들어주는 라이브러리라는 점이 장점이다. 최근 업데이트도 활발히 진행되고 있는 라이브러리이지만, 미리보기 구현이 아쉬웠다. 다운로드 이전에 미리보기 화면이 해당 내용을 순수하게 보여주는게 아니라, 라이브러리에서 특정 view를 고정시켜 두었기 때문에 production으로 사용하기에 고민되었다. 순수 다운로드 기능으로만 사용하기에는 아주 적합한 라이브러리 🤔 > html2canvas+ jspdf 현재 보이는 화면에 대한 스크린샷을 찍어서 이를 pdf로 변환해주는 방식이다. How to generate PDF from HTML in React / Node.js app How to generate PDF from HTML in Rea.. 2023. 10. 11.
React 모달 밖 영역 클릭시 닫기 (2가지 방법) > useState 사용 모달 바깥 부분(OutModal)에 투명한 배경을 뷰포트 크기로 깔고 이곳을 클릭했을때 모달을 닫아준다. 여기서 중요한점은 모달(DetailModal)과 모달 바깥 부분(OutModal)은 "형제"여야 하고, 모달의 z-index가 모달 바깥 부분보다 더 높아야한다. 즉 모달과 모달 바깥 부분은 다른 층에 존재하는 것이다. (이벤트 버블링을 막기 위해서!) // 모달을 사용하는 컴포넌트 function Container() { const [modal, setModal] = useState(false); const openModalPopup = () => { setModal(true); document.body.style.overflow = "hidden"; }; const clo.. 2023. 10. 10.