반응형 개발이야기/React11 React 웹뷰에서 AppsFlyer URL 받기, 브릿지 구현기 정리! 최근 프로젝트에서 웹뷰 안의 React 페이지에서 AppsFlyer URL을 앱으로부터 전달받아야 하는 요구사항이 있었습니다.이걸 해결하기 위해 사용한 기술이 바로 '브릿지(Bridge)'였는데요. 처음 접했을 땐 막막했지만, 원리를 이해하고 나니 생각보다 단순했습니다.오늘은 그 과정을 정리하며 브릿지가 무엇이고, 왜 필요한지, 어떻게 사용하는지 공유해보려 합니다. 브릿지란 무엇일까요?브릿지(Bridge)는 말 그대로 두 환경을 연결해주는 다리 역할을 합니다.앱(Native)과 웹(Web)은 기본적으로 서로 다른 세계에서 작동하기 때문에 직접적으로 통신하기 어렵습니다.하지만 브릿지를 활용하면 웹에서 앱의 기능을 호출하거나, 반대로 앱에서 웹으로 데이터를 넘겨주는 게 가능해집니다. 왜 브릿지가 필요했을.. 2025. 4. 7. react-query로 SSR 구현하기(with Next.js) react-query는 React 애플리케이션에서 데이터를 가져오고 관리하기 위한 패키지이고 Next.js는 React 기반의 서버 사이드 렌더링 프레임워크로 클라이언트와 서버에서 모두 실행되는 React 애플리케이션을 구축하는데 사용된다 React Query와 Next.js를 같이 사용하면 서버 사이드에서 데이터를 가져와 초기 렌더링 시점에 미리 데이터를 로드하여 초기 로딩 속도를 향상시킬 수 있다 react-query와 Next.js를 같이 사용하는 방법 1. react-query 패키지 설치 npm install react-query 2. Next.js 프로젝트 설정 Next.js 프로젝트의 \_app.js 파일을 열고 QueryClientProvider를 impor한다 QueryClientProv.. 2023. 5. 18. [React] Error: Element type is invalid: expected a string (for built-in components) or a class/function (for composite components) but got: undefined. Server Error Error: Element type is invalid: expected a string (for built-in components) or a class/function (for composite components) but got: undefined. You likely forgot to export your component from the file it's defined in, or you might have mixed up default and named imports. \*.tsx 파일은 \*.ts 로 변경하면서 생긴 에러... 또는 import 할 때 { \*\*\* } 때문일 수도 있으니 import 할 때도 주의깊게 확인할 것! [정리] 해당 에러는 componen.. 2022. 9. 30. react-admin error: Warning: A component is changing an uncontrolled input of type undefined to be controlled. Input elements should not switch from uncontrolled to controlled (or vice versa). Decide between using a controlled or uncontrolled input eleme.. Warning: A component is changing an uncontrolled input of type undefined to be controlled. Input elements should not switch from uncontrolled to controlled (or vice versa). Decide between using a controlled or uncontrolled input element for the lifetime of the component. Select의 value에 undefined가 들어가서 처리할 수 없다는 에러가 떴다 왜 이런 에러가 떴나 하고 보니.. Select에 value를 지정해주지 않았음... ... Select에 value를 넣어주고 useSta.. 2022. 5. 6. react-admin error: React does not recognize the 'basePath' prop on a DOM element. If you intentionally want it to appear in the DOM as a custom attribute, spell it as lowercase 'basepath' instead. If you accidentally passed it from a parent component, r.. Warning: React does not recognize the 'basePath' prop on a DOM element. If you intentionally want it to appear in the DOM as a custom attribute, spell it as lowercase 'basepath' instead. If you accidentally passed it from a parent component, remove it from the DOM element. 위와 같은 에러가 났다... 왜 이런 에러가 났는가 상황을 본다면 Table을 만들고 나서 에러가 생김 제목 내용 밤편지 이 밤 그날의 반딧불을 당신의 창 가까이 보낼게요 사랑한다는 말이에요 저 에러가 무슨 에러인지 찾아보.. 2022. 4. 28. [React] TypeScript - type과 interface TypeScript에서는 props 타입을 선언할 때 type과 interface를 사용한다 둘 다 타입을 선언한다는 공통점이 있지만 이 둘은 다르다 type 객체 타입 뿐 아니라 모든 타입에 대해 새로운 이름을 붙일 수 있다 // 예문 type TUser = { id: number; name: string; }; const typeUser: TUser = { id: 0, name: '김하나', }; interface 객체 타입을 만드는 또 다른 방법이다 // 예문 interface IUser = { id: number; name: string; }; const interfaceUser: IUser = { id: 0, name: '김하나', }; 확장하기 // interface 확장하기 interface.. 2022. 4. 6. 이전 1 2 다음 반응형
