Daily Star

프로젝트 진행중에 FCM Push Notification 에 이미지가 나올 수 있게 해달라는요구사항을 전달받았다.Android의 경우는 별다른 설정이 필요없지만, IOS의 경우는 별개의 설정이 필요하다고 한다.1. Extension 설치 XCode - TARGETS - '+' 아이콘 클릭Notification Service Extension 선택 언어는 0.78 이상일경우 Swift , 이하일경우 ObjectC를 골라주면 됩니다.이름은 ImageNotification으로 설정해주면 됩니다.공식문서에서 이렇게 지정을 하더군요."@react-native-firebase/app": "21.5.0","@react-native-firebase/messaging": "21.5.0","@react-native-fir..

오늘 아침에 내 맥북에 설치된 XCode가 자기 마음대로 26.4로 업데이트 되어버렸다...별 이슈는 없을거라고 생각했는데, 꽤나 큰 이슈가 발생했다./Users/brettbest/Developer/reproducer-react-native/ReproducerApp/ios/Pods/fmt/include/fmt/format-inl.h:59:24 Call to consteval function 'fmt::basic_format_string &, const char (&)[3]>::basic_format_string' is not a constant expression/Users/brettbest/Developer/reproducer-react-native/ReproducerApp/ios/Pods/fmt/in..

현재까지 확인된 이슈들은 총 4가지로 확인되었습니다.1. 창클릭시 zIndex 최상단값으로 수정2. 브라우저 최대화3. 브라우저 최소화4. 드래그시 텍스트가 선택되는 현상 수정 - 5. 화면 resizeTrouble Shooting 1. 창클릭시 zIndex 최상단값 수정Modal들의 켜지는 순서대로 위로 올리기위해 modalZIndex로 Modal들의 zINdex를 관리했었습니다.const [modalZIndex, setModalZIndex] = useState({}); const openModal = (modalName: string) => { ... setModalZIndex(prev => ({ ...prev, [modalName]: Math.max(...Object.val..

반갑습니다.2025년을 마무리하면서 포트폴리오를 재정비 하려고합니다.이번컨셉은 맥OS 디자인을 밴치마킹 해보려고합니다.완벽히는 아니지만비슷하게라도 앱열고 닫기정도라고 구현해보면 어떨까 싶었습니다.1. DockBar를 구현했습니다. 아주 간단한 UI 디자인 입니다.디자인은 이렇게 구현해보았습니다.무료 아이콘을 사용하다보니... 퀄리티는 낮을수 밖에없나봅니다.이제 독바를 클릭했을때 modal이 켜지도록 할겁니다. const [openModals, setOpenModals] = useState>(new Set()); const [modalZIndex, setModalZIndex] = useState({}); /** * 앱 켜기 (modal) ..

반갑습니다.프론트를 건든지도 3년이 넘어가는데아직도 memo랑 callback을 제대로 사용하기가 어려워서아무래도 정리를 해야할 듯했습니다.​아래 내용부터는 며칠간 공부한 내용이라잘못된게 있다면 말해주면 좋겠습니다.useMemo​특정값의 계산 결과를 메모이제이션을 합니다.디펜던시(이하 deps)가 변경되지 않는한 동일한 값을 계속 반환하게 됩니다.const memoData = useMemo(()=>{ return n;}, [a])여기서 callback 함수는 익명 함수가 선언됩니다.return 된 데이터가 메모이제이션이 됩니다.​메모이제이션이라고 하면 React가 이전 Render에서 계산된 값을 메모리에 저장해두고,동일한 deps일 경우 다시 계산하지않고 저장된 값을 사용하는 개념입니다.​deps ..

기술블로그 이전 글입니다. [React Native] 가로 Scroll Tab구현(선택시 Auto Scrolling)반갑습니다. 또또또 일하다가 괜찮은 로직하나를 구상하게 되서 이렇게 포스팅을 하게 되었습니다. 이번에 ...blog.naver.com반갑습니다.또또또 일하다가 괜찮은 로직하나를 구상하게 되서이렇게 포스팅을 하게 되었습니다.​이번에 회사 앱에 하나의 섹션이 추가되는데여기가 UI가 타 페이지와 좀 많이 다릅니다.​그중에 Tab Menu가 꽤 달랐는데,,,​혹시 약간 이런 UI의 Tab Menu를 아시나요.​혹자는 이렇게 말하겠죠.그냥 터치하면 탭 불들어오게 하면되잖아.​그쵸그쵸의도한 기능만 생각하면 그게 맞죠.​그런데 이 UI에선 UX면으로 생각할게 좀 많죠.​1.탭을 선택했을때 선택한 탭의 ..

반갑습니다.이건 언젠가는 두고두고 계속 사용하지 싶어서 포스팅을 하게 되었습니다.먼저 사건의 발달은 이러했습니다.회사 메일로 다음과 같은 메일이 왔는데분명 8월 31일까지 SDK 버전만 35로 올리면 된다고 하였는데,이건 또 11월까지 메모리 페이지 크기를 늘리라고 경고하네요.​SDK는 진짜 그냥 숫자만 올리면 되서 큰 문제가 안되는데메모리 페이지의 경우는 얘기가 아주 달라지는 문제라...​일단 메모리 페이지란OS가 메모리를 관리하는 최소 단위 블록입니다.​간단히 비유하자면책을 시스템 전체의 Memory라고 놓는다면책의 페이지는 Memory Page라고 볼수 있는거죠​단위별로 페이지를 관리하는겁니다.​Android의 경우는 페이지 하나당 4KB로 사용해왔습니다.RN 배울때도 그냥 지나가는 얘기로만 들었고..

1. 문제발생 답변 2번입니다. 를 자세히보면 위에 그라데이션이 들어간 element가 해당 항목을 덮고있다. 겹치는 요소가 있어서, 저 항목에서만 클릭이벤트가 발생하지 않았다. 2. 문제해결 css 속성중에 'pointerEvents' 라는 항목이 존재한다. 요소에 포인터속성을 관리해주는 속성인데, pointerEvent를 none을 주게되면 포인터 이벤트자체가 사라지게된다. 정상적으로 잘 작동한다.

1. 구현목적 구현을 하게된 계기는 도넛 progress를 만들어야하는데, 라이브러리는 사용하고싶지 않았고, 내가 직접 한번 만들어보고 싶었다. 그것도 컴포넌트로 말이다! 사용한 라이브러리는 style-component밖에 없다. 혹시나 스타일 컴포넌트에서 props를 사용못하는 사람들은 document 한번 읽고오길 권장한다... 2. 구현 코드 import { styled } from "styled-components"; import { CustomFlex } from "../theme/style"; interface DonutBackType { width : number, height : number, frontColor : string, backColor : string, donutper : nu..

Zustand 독일어로 '상태' 라는 뜻을 가진 단어이다. React의 상태 관리를 위한 라이브러리로써, 간단하고 직관적인 API를 제공해준다. 그리고 기존 상태관리라이브러리에서 발생하던 불필요한 리렌더링을 쉽게 방지할 수 있고, provider hell 문제를 해결할 수 있다. React 혹은 React Native에서 Redux, Redux toolkit 만 사용하던 나에게는 정말 혁신적인 상태관리 라이브러리였다. Zustand의 특징 간단하고 직관적인 API 제공 기존 상태 관리 라이브러리에서 발생하던 불필요한 리렌더링을 쉽게 방지 가능 Provider Hell 문제 해결 가능 - 따로 Provider를 선언할 필요가 없다. Zustand는 타 상태 관리 라이브러리에 비해 번들 크기가 약 크게(Re..