RN으로 HelpDog App 만들고 나서…

Firebase를 사용하여 간단한 글과 사진을 올리는 React Native앱을 만들었다.

 

로그인처리는 email&passowd로 하였고

사진을 올리고 나서 url을 받아서 url을 포함하여 글을 올린다.

  //사진 업로드할때 갤러리에서 Image Picker로 받아온 사진을 올려준다.
   try {
   await storage().ref(fileName).putFile(responseImage);
  }...
  
  ...
  
  const postData = async downloadUri => {
    const postId = Date.now().toString();
    await firestore()
      .collection('Post')
      .doc(postId)
      .set({
        userName: userInfo.userName,
        userId: userInfo.userId,
        description: description,
        location: location,
        uri: downloadURI,
        postId: postId,
      })
      .then(() => {
        navigation.navigate('Home');
      });
  };

 

 

React native에서 url을 받아서  이미지에 쓸 때는 uri를 이용해서 이런 형식으로 써야한다.

참고: https://reactnative.dev/docs/image

const DisplayAnImage = () => {
  return (
    <View style={styles.container}>
      <Image
        style={styles.tinyLogo}
        source={require('@expo/snack-static/react-native-logo.png')}
      />
      <Image
        style={styles.tinyLogo}
        source={{
          uri: 'https://reactnative.dev/img/tiny_logo.png',  }}
      />

 

 

갤러리에서 사진을 선택 할 때 ImagePicker - launchImageLibrary를 썼다.

response.assets[0].uri로 받으면 된다.

 

 

iOS 시뮬레이터는 잘 작동하는데 안드로이드 애뮬레이터는 오류가 날 때가 있다.

캐시를 초기화 시켜주거나  npm start -- --reset-cache 

아니면 애뮬레이터에 있는 앱을 삭제하고 다시 실행하면 잘 작동한다.

 

 

처음 fastlane을 설치할 때 에러가 발생했는데 버전이 맞지 않는다는 거였다.

uninstall, install, upgrade 이것저것 해봤는데 이게 제일 도움이 되었다.

https://blog.yozi.kr/entry/mac에서-ruby-재설정설치-하기-rbenv

 

---

 

아쉬웠던 점은

TypeScript를 적용하지 못했던 점과 애플 스토어 빌드 과정에서 문제가 발생해서 올리지 못한 점이다.

앱 배포까지 하고 싶어서 만들었던 것인데 결과적으로는 못하게 되었다.

fastlane으로 올리는 과정에서 계속해서 다양한 에러가 발생했는데 왜인지 모르게 중요한 파일을 삭제하게 되었다. 하루종일 오류를 찾고 고치는 과정에서 정신이 나갔었던 것 같다.

앱 배포는 가까운 미래에 다시 도전해 봐야겠다.