Learn Courses My Dashboard

Storingand retrieving image and its accompanying data in Firestore

Hi Chris,thank you for your continued tutorials…I have followed the one for storing and retrieving images it and it worked well however my photo I want it have some accompanying info like name of the photo and description then on display how do I make sure each photo is retrieved with its corresponding name and description?Am also considering subscribing to cwt the offer that ended yesterday I couldn’t pay yet because I thought you use ideal for payments when the offer is up again I will grab it

@muenimaria

Welcome to the community.

In Firestore you would define a collection that has a number of properties related to the image. For example the collection you have might be a named “photos” and might have the following properties:

imageurl - the url where the image data is stored in Firebase Storage.
name - name of the image.
description - description of the image.
date - date the image was taken.

So you would store a series of images in that collection which is effectively an array.

Does that make sense?

Hi Chris,yea makes sense but I don’t get how to exactly do this could you give me this as an example?currently am storing images separately and their data separately.

Kind give me an example on how to write this

Kind regards,
Mary

Hi Mary,

In Firebase the image is saved to Storage as image data and a reference to that image is saved into the collection in the Firestore Database.

Screenshot of sample collection entry.

In storage, I saved that image into a folder named images.

Note that the filename is a UUID which is unique.

Example code to achieve that in Firebase:

        // Create storage reference
        let storageRef = Storage.storage().reference()

        // Using an image from the Assets folder for the purposes of the exercise
        let image = UIImage(named: "TajMahal1")

        // Turn our image into data
        let imageData = image!.jpegData(compressionQuality: 0.8)

        // Check that we were able to convert it to data
        guard imageData != nil else { return }

        // Specify the file path and name
        let path = "images/\(UUID().uuidString).jpg"
        let fileRef = storageRef.child(path)

        fileRef.putData(imageData!, metadata: nil) { metadata, error in

            //  Check for errors
            if error == nil && metadata != nil {
                //  Get the url for the image in storage
                fileRef.downloadURL { url, error in
                    //  Check for errors
                    if url != nil && error == nil {
                        // Get reference to the database
                        let db = Firestore.firestore()

                        //  Add photos collection document
                        let photos = db.collection("photos")
                        photos.addDocument(data: ["imageurl": url!.absoluteString,
                                                  "name": "Taj Mahal 1",
                                                  "description": "Photograph of Taj Mahal Number 1",
                                                  "date": Date()])
                    }
                }
            }
        }

Thank you so much codewithchris team, now am going to enrol to your program!