Front-end 74

[Xcode] signing for requires a development team... / Failed to register bundle identifier

React Native로 만든 앱을 실제 핸드폰에 빌드하고싶어 xcode에서 빌드를 하였는데 에러가 났습니다. "signing for requires a development team. Select a development team in the Signing & Capabilities editor." 개발자의 서명이 필요해서 나는 오류입니다. 해결 1. Xcode -> Preferences 접근 2. Accounts - Apple ID 등록 3. Signing & Capabilities 에서 Team 선택 이러면 해결됩니다! 하지만 저는 오류가 하나 더 있었습니다... Failed to register bunle identifier General에 있는 Bundle Identifier를 고유한 문자열로 ..

React Native Navigation 스크린 이동

스크린 간 이동하는 방법과 데이터를 넘기는 방법을 다루겠습니다. 제 내비게이터 구조는 아래와 같습니다. Stack navigator Intro Tab navigator Home List Chat MyPage Intro -> Tab 같은 depths에 있는 intro에서 tab으로 이동하는 방법입니다. // intro.js import { useNavigation } from '@react-navigation/native'; ... const navigation = useNavigation(); // 함수 호출 시 탭으로 이동 const onPressMoveTab = () => { navigation.navigate( "Tab", {userName:"sjh"}, ); } navigate안에 스크린 이름과 ..

React Native Navigation 구조 잡기 (Nesting navigators)

안녕하세요! React Native Navigation 사용법을 알아보겠습니다. 보통 React에서는 페이지 이동 시 href 혹은 router로 제어하지만 RN에서는 navigation으로 제어합니다. 설치 npm install @react-navigation/stack @react-navigation/bottom-tabs 설치 후 오류가 난다면 아래 주소를 참고해주세요. https://talkwithcode.tistory.com/category/React%20Native%20Error 'React Native Error' 카테고리의 글 목록 talkwithcode.tistory.com 구조 잡기 저는 주로 Stack Navigator와 Bottom Tab Navigator를 혼합하여 사용하고 있습니다..

[React Native Error] Tried to register two views with the same name RNSScreenContainer

"Tried to register two views with the same name RNSScreenContainer" React Native에서 navigation 세팅하다가 위와 같은 오류가 있었는데요 서로 다른 버전의 패키지가 node_module에 설치되어 나는 오류라고 합니다. 저는 버전을 맞춰주기 위하여 "npm update"를 사용하였습니다. 참고 : https://github.com/software-mansion/react-native-screens/issues/15 Tried to register two views with the same name RNSScreen · Issue #15 · software-mansion/react-native-screens Getting the foll..

[React Native Error] requireNativeComponent: “RNSScreen” was not found in the UIManager

react-native run-ios 했을 때 제목과 같은 오류가 낫습니다. React Navigation은 몇 가지 핵심 유틸리티로 구성되는데 설치가 안되어있어서 나는 오류입니다. 터미널에서 아래 명령어를 치면 해결됩니다. npm install @react-navigation/native npm install react-native-reanimated react-native-gesture-handler react-native-screens react-native-safe-area-context @react-native-community/masked-view npx pod-install ios react-native run-ios 참고 : https://stackoverflow.com/questions/..

[React Native Error] Error: spawnSync adb ENOENT

warn Failed to connect to development server using "adb reverse": spawnSync adb ENOENT info Starting the app... error Failed to start the app. Error: spawnSync adb ENOENT android-platform-tools 가 없어서 나는 오류로 설치해주면 됩니다. Home Brew로 설치 brew install --cask android-platform-tools 위 코드로 설치 후 터미널에서 adb version을 입력하면 확인 가능합니다. Home Brew란 macOX 용 패키지 관리자로 커맨드 라인 도구, 시스템 패키지, GUI 애플리케이션 설치에 사용합니다. 맥 OS를 사용..

React-Reudx 정리

오늘은 React-Redux를 알아보겠습니다. 최대한 redux를 모르는 사람한테 설명한다는 가정하에 글을 작성하였습니다. 리덕스는 상태 관리 툴로 프로젝트 전역에서 사용할 수 있는 변수를 생성한다고 생각하시면 됩니다. redux를 사용해야 하는 이유는 아래와 같습니다. 1. 값을 넘길 때 props로 연속해서 타고 들어갈 일이 없어집니다. 2. 프로젝트 규모가 커질수록 필요성이 커집니다. 3. 리덕스 값이 바뀔 때 사용하고 있는 컴포넌트가 자동적으로 리렌더링이 일어납니다. 이외에도 비동기, 미들웨어에 관한 것이 있습니다. 저희의 목표를 1번에서 말한 props로 타고 들어갈 일 없이 전역적으로 변수를 관리가 가능하게끔 만드는 것으로 잡겠습니다. 이번 글에서 다루는 코드는 아래 깃에 모아두었습니다. ht..

javascript 카카오 공유하기

예시 코드 https://github.com/hellojaehyeok/kakao-share GitHub - hellojaehyeok/kakao-share: 카카오톡 공유하기 기능입니다 카카오톡 공유하기 기능입니다. Contribute to hellojaehyeok/kakao-share development by creating an account on GitHub. github.com 사용법 1. https://developers.kakao.com/ 에 접속하고 내 어플리케이션을 클릭합니다 2. 플랫폼 -> Web에서 공유할 URL을 넣습니다. 예를 들어로컬 환경에서 네이버 링크를 공유하고 싶을 경우 네이버 링크를 넣어야 합니다. 3. html에 아래 코드를 넣습니다. 4. 예시코드를 참고하여 코드를 ..

Front-end/JS tip 2022.01.22