inflearn logo
강의

강의

N
챌린지

챌린지

멘토링

멘토링

N
클립

클립

로드맵

로드맵

지식공유

묻고 답해요

173만명의 커뮤니티!! 함께 토론해봐요.

.

미해결

React Native with Expo: 제로초에게 제대로 배우기

.

  • react
  • react-native
  • 하이브리드-앱
  • typescript
  • expo
이영훈 댓글 2 좋아요 0 조회수 112

[5-13] useLikePost 쿼리 구현 중 Tanstack Query 관련 질문

미해결

아바타 커뮤니티앱 만들기 (React Native Expo)

optimistic-updates#updating-a-single-todo 문서를 보면 useMutation - onError의 모든 parameter err, newPost (variables), onMutationResult, context와 onSettle의 모든 parameter를 사용해서 구현하는데, client를 queryClient를 가져와서 쓰는 강의 중 예제와, 문서 내의 내용으로 구현한 아래의 주석처리된 구현은 어떤 차이가 있을까요? onError: (err, newPost, context) => { queryClient.setQueryData( [queryKeys.POST, queryKeys.GET_POST, context?.newPost?.id], context?.previousPost, ); }, // onError: (err, newPost, onMutationResult, context) => { // context.client.setQueryData( // [ // queryKeys.POST, // queryKeys.GET_POST, // onMutationResult?.previousPost?.id, // ], // onMutationResult?.previousPost, // ); // }, onSettled: (data, error, variables, context) => { queryClient.invalidateQueries({ queryKey: [queryKeys.POST, queryKeys.GET_POST, variables], }); queryClient.invalidateQueries({ queryKey: [queryKeys.POST, queryKeys.GET_POSTS], }); }, // onSettled: (data, error, variables, onMutationResult, context) => { // context.client.invalidateQueries({ // queryKey: [queryKeys.POST, queryKeys.GET_POST, variables], // }); // context.client.invalidateQueries({ // queryKey: [queryKeys.POST, queryKeys.GET_POSTS], // }); // }, a

  • react-native
  • typescript
  • expo
  • react-hook-form
  • react-query
yeong 댓글 1 좋아요 0 조회수 87

Expo-blur unimplement 오류

미해결

React Native with Expo: 제로초에게 제대로 배우기

npx expo install expo-blur 실행 후 <BlurView> 컴포넌트를 사용하려고 하는데 런타임에서는 에러가 안지만 화면에서 위같이 unimplement 에러가 납니다. tsconfig를 수정해야 해결된다고 찾긴 했는데 { "extends": "expo/tsconfig.base", "compilerOptions": { "strict": true, "paths": { "@/*": [ "./*" ] } }, "include": [ "**/*.ts", "**/*.tsx", ".expo/types/**/*.ts", "expo-env.d.ts" ] } 아래는 제 루트 tsconfig.json 파일입니다. 어떻게 수정하면 될까요?

  • react
  • react-native
  • 하이브리드-앱
  • typescript
  • expo
장예은 댓글 3 좋아요 0 조회수 141

.

미해결

React Native with Expo: 제로초에게 제대로 배우기

.

  • react
  • react-native
  • 하이브리드-앱
  • typescript
  • expo
이영훈 댓글 2 좋아요 0 조회수 138

.

미해결

React Native with Expo: 제로초에게 제대로 배우기

.

  • react
  • react-native
  • 하이브리드-앱
  • typescript
  • expo
이영훈 댓글 2 좋아요 0 조회수 99

.

미해결

React Native with Expo: 제로초에게 제대로 배우기

.

  • react
  • react-native
  • 하이브리드-앱
  • typescript
  • expo
이영훈 댓글 2 좋아요 0 조회수 98

.

미해결

React Native with Expo: 제로초에게 제대로 배우기

.

  • react
  • react-native
  • 하이브리드-앱
  • typescript
  • expo
이영훈 댓글 2 좋아요 0 조회수 83

Expo 54 버전 ios에서 headerLeft

미해결

아바타 커뮤니티앱 만들기 (React Native Expo)

ios 26부터 headerLeft 주위에 그림자가 생기고 클릭시 안에 내용이 커지는 효과가 생기는데 없앨 수 있는 방법이 있을까요? 열심히 검색해봐도 쉽지 않네요 ㅎㅎ,,

  • react-native
  • typescript
  • expo
  • react-hook-form
  • react-query
wjsyuwls 댓글 2 좋아요 1 조회수 187

개발 환경에 대해서 궁금한게 있습니다!

미해결

React Native with Expo: 제로초에게 제대로 배우기

맥북 환경에서 수업을 따라가다 보니, Java가 설치되어 있지 않아 라이브러리 설치 시 오류가 발생했습니다. 이처럼 개발 환경(운영체제, 설치 여부 등)에 따라 발생하는 오류는 실무에서는 어떻게 사전에 파악하고, 배포 시에는 어떻게 대응하는지 궁금합니다.

  • react
  • react-native
  • 하이브리드-앱
  • typescript
  • expo
조영제 댓글 1 좋아요 0 조회수 88

어플 개발 후 배포 시에 주의할 사항이 있을까요?

미해결

아바타 커뮤니티앱 만들기 (React Native Expo)

안녕하세요! 이제 절반 이상 수강중인 열혈 수강생입니다 !! 다름이 아니고, 올해, 어플 배포가 목표인데요 아바타 이미지는 저작권이 있기에 모두 제거하고 자체 제작으로 이미지 파일을 구성하여 다시 추가하려 합니다. 인강을 다 듣고 나서 제 아이디어를 첨가하고 아바타 이미지만 바꿔 출시해도 되는 부분일까요?

  • react-native
  • typescript
  • expo
  • react-hook-form
  • react-query
Kim Da Bin 댓글 1 좋아요 0 조회수 106

질문아닙니다ㅜㅜ

미해결

React Native with Expo: 제로초에게 제대로 배우기

질문은 아닌데..챌린지 미션에 질문하기가 있어서 쓰니까 신경쓰지 말아주세요... Link Share 공유 url은 components/Post.tsx에 있음 공식문서: share 부분 확인 ios에서는 url을 같이 넣어주면 좋고, 안드로이드에서는 title을 넣어주면 좋음 File Share expo-sharing 라이브러리 설치 후 사용 폰에 있는 파일을 다른 앱에 공유 가능 다른 앱에서 내 expo앱으로 공유하고 싶을 때 expo기본지원x Expo Share Extension이라는 외부 라이브러리를 따로 설치해서 사용해야 함 근데 npm run prebuild를 해야하는데, 이럼 expo-go에서 벗어나 native단을 건듦 한번 설치하면 못돌아옴

  • react
  • react-native
  • 하이브리드-앱
  • typescript
  • expo
이수민 댓글 1 좋아요 0 조회수 60

Expo 강의 질문 (preview build?)

미해결

React Native with Expo: 제로초에게 제대로 배우기

혹시 ios나 android 네이티브 빌드해서 연동하는 방법도 해당 강의에서 진행하나요? 현재 25강을 듣고 있긴 한데... 들으면 들을수록 네이티브쪽도 건들어야하는 것 같아서 질문드립니다! 혹시나 해당 강의가 포함되어있으면 몇 강인지 말씀주실 수 있으신가요? 또... 스위프트, 코틀린 말고 자바나 오브젝티브씨도 같이 알아야하나요?

  • react
  • react-native
  • 하이브리드-앱
  • typescript
  • expo
0S 댓글 2 좋아요 0 조회수 80

사진 촬영 후 갤러리 저장 시 권한 문제

미해결

React Native with Expo: 제로초에게 제대로 배우기

안녕하세요, 제로초님! 강의 잘 듣고 있습니다. 다름이 아니라 ImagePicker 로 카메라 사진 촬영 후 MediaLibrary 를 사용해서 갤러리에 저장할 때, 다음과 같은 에러가 발생합니다. 확인해보니 AUDIO 권한이 선언되지 않았다고 하는데, 아래와 같이 app.json 의 plugin 에 권한을 추가해도 동일한 에러가 발생합니다. { "expo": { // ... "plugins": [ // ... [ "expo-media-library", { "photosPermission": "Allow $(PRODUCT_NAME) to access your photos.", "savePhotosPermission": "Allow $(PRODUCT_NAME) to save photos.", "isAccessMediaLocationEnabled": true, "granularPermissions": ["audio", "photo"] } ] ], // ... } } 제로초님이 올려주신 코드를 그대로 복사 & 붙여넣기 해봐도 같은 문제가 발생하는데, 혹시 제가 놓친 부분이 있을까요...? 강의에서 다룬 부분의 코드와 package.json 첨부하겠습니다. import { FontAwesome, Ionicons } from '@expo/vector-icons'; import * as ImagePicker from 'expo-image-picker'; import * as Location from 'expo-location'; import * as MediaLibrary from 'expo-media-library'; import { useRouter } from 'expo-router'; import React, { useState } from 'react'; import { Alert, FlatList, Image, Linking, Pressable, StyleSheet, Text, TextInput, TouchableOpacity, View, } from 'react-native'; import { useSafeAreaInsets } from 'react-native-safe-area-context'; // ... export default function Modal() { // ... const canAddThread = (threads.at(-1)?.text.trim().length ?? 0) > 0 || (threads.at(-1)?.imageUris.length ?? 0) > 0; const canPost = threads.every( thread => thread.text.trim().length > 0 || thread.imageUris.length > 0, ); const removeThread = (id: string) => { setThreads(prevThreads => prevThreads.filter(thread => thread.id !== id), ); }; const pickImage = async (id: string) => { let { status } = await ImagePicker.requestMediaLibraryPermissionsAsync(); if (status !== 'granted') { Alert.alert( 'Permission not granted', 'Please grant camera roll permission to use this feature', [ { text: 'Open settings', onPress: () => { Linking.openSettings(); }, }, { text: 'Cancel', }, ], ); return; } let result = await ImagePicker.launchImageLibraryAsync({ mediaTypes: ['images', 'livePhotos', 'videos'], allowsMultipleSelection: true, selectionLimit: 5, }); console.log('image result:', result); if (result.canceled) return; setThreads(prevThreads => prevThreads.map(thread => thread.id === id ? { ...thread, imageUris: thread.imageUris.concat( result.assets?.map(asset => asset.uri) ?? [], ), } : thread, ), ); }; const takePhoto = async (id: string) => { let { status } = await ImagePicker.requestCameraPermissionsAsync(); if (status !== 'granted') { Alert.alert( 'Permission not granted', 'Please grant camera permission to use this feature', [ { text: 'Open settings', onPress: () => { Linking.openSettings(); }, }, { text: 'Cancel', }, ], ); return; } let result = await ImagePicker.launchCameraAsync({ mediaTypes: ['images', 'livePhotos', 'videos'], allowsMultipleSelection: true, selectionLimit: 5, }); console.log('camera result:', result); // MediaLibrary 권한 요청 및 사진 저장 status = (await MediaLibrary.requestPermissionsAsync()).status; if (status === 'granted' && result.assets?.[0].uri) { await MediaLibrary.saveToLibraryAsync(result.assets[0].uri); } if (result.canceled) return; setThreads(prevThreads => prevThreads.map(thread => thread.id === id ? { ...thread, imageUris: thread.imageUris.concat( result.assets?.map(asset => asset.uri) ?? [], ), } : thread, ), ); }; const removeImageFromThread = (id: string, uriToRemove: string) => { setThreads(prevThreads => prevThreads.map(thread => thread.id === id ? { ...thread, imageUris: thread.imageUris.filter( uri => uri !== uriToRemove, ), } : thread, ), ); }; // ... } { "name": "expo-threads-clone", "main": "expo-router/entry", "version": "1.0.0", "scripts": { "start": "expo start", "reset-project": "node ./scripts/reset-project.js", "android": "expo start --android", "ios": "expo start --ios", "web": "expo start --web", "lint": "expo lint" }, "dependencies": { "@expo/vector-icons": "^15.0.2", "@react-navigation/bottom-tabs": "^7.4.0", "@react-navigation/elements": "^2.6.3", "@react-navigation/native": "^7.1.8", "expo": "~54.0.12", "expo-blur": "~15.0.7", "expo-constants": "~18.0.9", "expo-dev-client": "~6.0.13", "expo-font": "~14.0.8", "expo-haptics": "~15.0.7", "expo-image": "~3.0.8", "expo-image-picker": "~17.0.8", "expo-linking": "~8.0.8", "expo-location": "~19.0.7", "expo-media-library": "~18.2.0", "expo-router": "~6.0.10", "expo-splash-screen": "~31.0.10", "expo-status-bar": "~3.0.8", "expo-symbols": "~1.0.7", "expo-system-ui": "~6.0.7", "expo-web-browser": "~15.0.8", "react": "19.1.0", "react-dom": "19.1.0", "react-native": "0.81.4", "react-native-gesture-handler": "~2.28.0", "react-native-reanimated": "~4.1.1", "react-native-safe-area-context": "~5.6.0", "react-native-screens": "~4.16.0", "react-native-web": "~0.21.0", "react-native-worklets": "0.5.1" }, "devDependencies": { "@types/react": "~19.1.0", "typescript": "~5.9.2", "eslint": "^9.25.0", "eslint-config-expo": "~10.0.0" }, "private": true }

  • react
  • react-native
  • 하이브리드-앱
  • typescript
  • expo
Sckroll 댓글 1 좋아요 0 조회수 124

혹시 필요한 라이브러리들을 미리 전부 설치해도 되나요?

미해결

React Native with Expo: 제로초에게 제대로 배우기

필요한 라이브러리를 미리 설치해둬도 되나요? expo에서 'eas build --platform android --profile development' 해당 명령어를 사용해서 빌드할 때마다 시간이 너무 오래걸려요ㅜㅜ 하나 설치하면 계속 그런 라이브러리 없다고 해서 계속 다시 빌드해야해서ㅜㅜ 혹시 강의에 사용한 라이브러리 리스트가 있다면 제공해주실 수 있나요?? 무료를 사용하면 1시간도 기다리라고 해서요...ㅜㅜ

  • react
  • react-native
  • 하이브리드-앱
  • typescript
  • expo
이수민 댓글 2 좋아요 1 조회수 88

코드 수정 시 ios 시뮬레이터에서 자동반영이 안 되는데 왜그럴까요?

미해결

아바타 커뮤니티앱 만들기 (React Native Expo)

❗ 질문 작성시 꼭 참고해주세요 에러 메세지에서 단서를 찾을 수 있는 경우가 많습니다. 에러 메세지를 읽고 한번 검색해보시는것을 추천드립니다. 질문글을 작성하실때는, 현재 문제(또는 에러)와 코드나 github 을 첨부해주세요. 개발중인 OS, ReactNative, Node 버전 등의 개발환경 을 알려주셔야합니다. 에러메세지는 일부분이 아닌 전체 상황 을 올려주세요. 일부만 보여주시면 답변이 어렵습니다. 에러 잘라서 올리시면 안됩니다! (에러 일부만 자르거나 일부만 복사하지말아주세요) 코드 수정 시 안드로이드 시뮬레이터는 자동 반영이 되는데, ios 시뮬레이터는 자동으로 반영이 안 됩니다.. 그리고 r 버튼 눌러서 reload app 하려하면 No apps connected. Sending "reload" to all React Native apps failed. Make sure your app is running in the simulator or on a phone connected via USB. 이렇게 나오네요.. 연결은 된 것 같은데 왜 그럴까요?

  • react-native
  • typescript
  • expo
  • react-hook-form
  • react-query
재오 댓글 1 좋아요 0 조회수 130

Axios Network error...

미해결

아바타 커뮤니티앱 만들기 (React Native Expo)

❗ 질문 작성시 꼭 참고해주세요 에러 메세지에서 단서를 찾을 수 있는 경우가 많습니다. 에러 메세지를 읽고 한번 검색해보시는것을 추천드립니다. 질문글을 작성하실때는, 현재 문제(또는 에러)와 코드나 github 을 첨부해주세요. 개발중인 OS, ReactNative, Node 버전 등의 개발환경 을 알려주셔야합니다. 에러메세지는 일부분이 아닌 전체 상황 을 올려주세요. 일부만 보여주시면 답변이 어렵습니다. 에러 잘라서 올리시면 안됩니다! (에러 일부만 자르거나 일부만 복사하지말아주세요) 윈도우 컴에서 코드 실행시키고 아이폰에서 expo app으로 실습하고 있는데 db에도 들어가지 않습니다. 뭐가 문제인지 모르겠어요

  • react-native
  • typescript
  • expo
  • react-hook-form
  • react-query
yeongseo 댓글 2 좋아요 0 조회수 193

.

미해결

React Native with Expo: 제로초에게 제대로 배우기

.

  • react
  • react-native
  • 하이브리드-앱
  • typescript
  • expo
이영훈 댓글 1 좋아요 0 조회수 82

.

미해결

React Native with Expo: 제로초에게 제대로 배우기

.

  • react
  • react-native
  • 하이브리드-앱
  • typescript
  • expo
이영훈 댓글 2 좋아요 0 조회수 114

.

미해결

React Native with Expo: 제로초에게 제대로 배우기

.

  • react
  • react-native
  • 하이브리드-앱
  • typescript
  • expo
이영훈 댓글 2 좋아요 0 조회수 185

인기 태그

인프런 TOP Writers

주간 인기글