The course is part of this learning path
In this course, we're going to create a Snapchat clone using structs and various advanced techniques of Firestore.
Learning Objectives
- Learn how to make a Snapchat clone
- Understand all the features of Snapchat and how to set them up
Intended Audience
This course is intended for anyone who wants to learn how to develop apps on iOS.
Prerequisites
To get the most out of this course, some basic knowledge of iOS development would be beneficial. We recommend that you take this course as part of the Developing Mobile Apps for iOS learning path.
Hi, within this lecture, we're going to retrieve our information and save them into a model so that we can display them in the TableView. So, in order to do that, I'm going to come over here to our models folder, and I'm going to create a new file, and this will be a swift file because we're going to only have one struct. So, for our model name, I'm just going to call the Snap. And inside of this Snap we're going to have a struct called Snap as well. So, in this model I'm only going to have three variables for right now. So, what I'm going to have is the Snap owner, the username of the Snap owner. So, I'm going to call this username, not useremail actually I'm going to go for username. So, and again, we're going to have an imageUrlArray, not an imageUrlstring. And we're going to have a date and this will have the type of date as well. So, as you can see we have three variables but three different types. So, that's good for practice. We're going to use this model to save our information. So, each time we get a new document, we're going to create a snap object out of that document. So, let's see how this works. I'm going to check to see if I can get the username first. So, I'm going to say document.get, and the value the field, actually that I'm looking for is the Snap owner, remember? So, maybe you can use some more consistent names like if you're calling this Snap owner, you can call the Snap owner in the model as well. So, let me come over here and check for imageUrlArray. And this will be document.document.get. And the value that we're looking for is the imageUrlArray. So, it has to be spelled exactly like this imageUrlArray. And I'm going to optionally cast this to be an array of strings and finally I'm going to get this date and this will be document.get and the value that I'm looking for is date. I'm going to cast this as Timestamp, we cannot cast this as date. I'm going to show you how to do that later on. Now we have all the values that we need. We can use our Snap model to create our first Snap. So, that's what we're going to do. I'm going to call this Snap, and this will be a Snap object. So, write Snap over here and it will give you the initializer. So, it will ask you for a username and imageUrlArray and a date. So, username is the username, imageUrlArray is the imageUrlArray. And date, we have to convert this to be a date and it's very easy, you can just say date.dateValue. So, this converts Timestamp to be a date and here we are. Here we have our first Snap. Now, we have to make sure that we have a SnapArray over here so that we can display our snaps in our TableView. So, I'm going to call the SnapArray and this will have the object of Snaps. So, that's it, so let me delete this dot. So, come over here and add this to our SnapArray. So, self.snapArray.append, and we're going to append the snap. And remember in situations like this in order to prevent duplication of values, we have to come over here and clear all the values from snapArray. So, you can just say removeAll, keepingCapacity false and here you go. Now let's come over here and connect this to our TableView. Say return snapArray.count, and over here in the feed username labelled, I'm going to take snapArray indexPath row. So, this will give me the Snap object itself. But I just want to get the name of that Snap object, so you can just say .username. And of course we're going to have to do that for image view as well. But right now we don't have necessary tools to go with that. later on I'm going to take care of this. For right now we have another problem because we have to check to see if 24 hours is passed or not. So, I'm going to do it like this if 24 hours is passed, I'm just going to delete the data from fireStore. Since now I have the data over here, I can easily check that. And there is a method to do that in swift, so I'm going to show you how this works. So, I'm going to create a difference and this will be the difference between my date and current date. So, I'm going to use calendar in order to do that. As you can see this is a relationship manager between calendar units. So, you can use this to understand the difference between your date and the current date. In order to do that, you have to say calendar.current. So, this is the user's current calendar and over here you have to go for date components, this one. So, this will ask you for the component of the date like, if you want to get an hour or if you want to compare the months or years and it will ask you two parameters which dates you want to compare. So, I believe that's not the one we want because it only has one parameter. So, let me write dateComponent one more time and, we want this one component, from and to. So, we have to have two date variables over here. So, make sure you choose this one. So, we're going to specify the dates under this from and to values. And in the components, we're going to go for hour. Because we want to see if we can get 24 hours out of that one. So, you have to give date in here from, in the from parameter, and of course you have to say date.dateValue in order to get the date. And you can just say date over here to get the current date. Once you do that you have to say .hour to get hours out of that function. So, this will give you an integer indicating the difference between two dates as an hour. Again we're comparing the date value with current date to get our values out of that one. And we're going to check to see if this difference is actually more than 24 hours. So, if difference is more than 24 hours actually greater than or equal to 24 hours, then we're going to just delete this document. So, I'm going to delete and if that's not the case I'm not going to do anything actually but I'm just going to pass this information to another view controller. So, let me delete this. So, I'm going to say self.fireStoreDatabase.collection. So, this will be the Snaps collection and we will need the document ID over here. So, let me create this document ID. I'm going to say document ID is document.documentID. And we're going to say .document to reach the specific document ID. And after that you can just say .delete and this will give you a completion block. You can see if there is any error messages as well. So, you can just go for error and you can just do something like printing out there if you want. And if that's not the case if difference is not greater than 24 hours, then I'm not going to do anything. So, I'm just going to pass this information to our Snap view controller because remember that's where we display the time left. So, in Snap view controller users will see the time left to deletion. So, we're going to pass this information to Snap view controller. I'm just taking a note so that we won't forget about this. And the other thing not to forget is to display the image inside of our TableView as well. So, in order to do that we're going to work with SD web image like we did before. Let's do that in the next lecture.
Atil is an instructor at Bogazici University, where he graduated back in 2010. He is also co-founder of Academy Club, which provides training, and Pera Games, which operates in the mobile gaming industry.