Reactjs file uploader to Back4App

Question

I am working on an react app. I need to add a file upload feature from the app to my database in Back4App. This part has eluded me for some time now. Full disclosure, This app is for a class that I am auditing (so no grade given). I wanted to try coding and this class had a spot open. I've only had one coding class prior to this, so I've bit off more than I can chew. My professor told me to use the code below. If anyone can help, I can provide more code and here is my GitHub link. The app has a galleryPage, a components.js file, authentication files and an upload.js page. I cannot get the code to upload anything to Back4App. I've looked online for solutions, but just get confused on how to integrate them into my app.

Thank you all in advance!

const fileUploadControl = $("#profilePhotoFileUpload")[0];

if (fileUploadControl.files.length > 0) {

const file = fileUploadControl.files[0];

const name = "photo.jpg";

const parseFile = new Parse.File(name, file);

}

Besides the code my professor provided, I've tried the below code. I'm missing something, a connection or link to a function or hook, but just get confused.

const App = () => {
  const [photos, setPhotos] = React.useState([]);

  const fetchPhotos = async () => {
    const response = await fetch("https://api.example.com/photos");
    const data = await response.json();
    setPhotos(data);
  };

  useEffect(() => {
    fetchPhotos();
  }, []);

  return (
    <div>
      <ImageGallery photos={photos} />
    </div>
  );
};

export default App;

Reactjs file uploader to Back4App

0 Answers0