This episode is for members only
Sign up to access "Build a Livewire CSV Importer/Exporter" right now.
Get started
Already a member? Sign in to continue
Playing
12. Showing all exports
Episodes
01. Introduction and demo
2m 43s
0%
02. Fresh project with Breeze
2m 1s
0%
03. Creating and seeding transactions
5m 4s
0%
04. Building a basic datatable
20m 2s
0%
05. Casting money
2m 2s
0%
06. Launching the export modal
9m 10s
0%
07. Creating an export record
7m 33s
0%
08. Exporting with Laravel Excel
12m 55s
0%
09. Queuing the export
7m 32s
0%
10. Marking the export as complete
2m 24s
0%
11. Notifying the user
5m 18s
0%
12. Showing all exports
6m 44s
0%
13. Securely downloading exports
6m 11s
0%
14. Launching the import modal
2m 44s
0%
15. Handling CSV file upload
8m 59s
0%
16. Creating an import record
2m 44s
0%
17. Handling the import
11m 56s
0%
18. Showing all imports
3m 46s
0%
19. Marking an import as complete
3m 30s
0%
20. Storing exports per user
3m 16s
0%
21. Adding drag and drop uploading
8m 10s
0%
22. Expiring downloads
3m 19s
0%
Transcript
00:00
The export process is working really nicely but obviously at the moment we don't have any way to monitor our exports particularly if they are really large. So let's head over and create out an exports table that we can use to monitor these. So we'll create this as a live wire component you don't necessarily need to but we might need to update it later to make it a
00:20
little bit more dynamic. So let's make out a component called export and let's call this export table. It's kind of makes sense export table and let's add this to the exports page that we created in the last episode. So export table and let's open up the template for this and again I've created out some pre-made table code here that you can go ahead and grab directly
00:49
from the github repository. But if we head over to exports it will look like that. So we've got requested app, file, record count and status which will change based on whether it's finished or not and when it is finished it will show a link to download the export. Okay let's go ahead and get this filled in. So over in the export table component let's actually open up that main
01:15
export table here. We just want to pass down all of the exports. So exports are going to be from the current user. We already have that exports relationship. We'll go ahead and scope this and say latest and we will paginate these by 10. Let's go over to our export table. I'll just fill in the pagination here before I forget. So exports and links and let's go ahead and start to iterate
01:45
through these. So for each exports as export and let's go ahead and wrap that and for each pull that in. What do we want to do? We'll just output as much of the data as we can. We've only got two at the moment. The first one is the requested app. So requested that is just going to be the created at date. So let's say export created at and we can cast that to a
02:16
date time integer if you wanted a date time output whatever you want to do. I'll just keep it as created at for now. In terms of the file this is going to be just the file name. So that's just what we have stored. So this is a pretty straightforward one again. We're just going to say export file and that will just allow us to visually map up what we're downloading so we can so we can sort of
02:40
find it more easily when we download it. Record count again really straightforward but what we want to do is make sure we format this and we'll use the number helper that we used earlier. So we'll say number format export record underscore count and that will show us 10 but then of course if it's 100 000 we'll see something like that. Okay great so the last one is going to be whether
03:06
it's ready or the second to last is going to be whether it's ready or not. So for this I think a helpful method just so we can add a little bit of readability. So we might say if it's ready let's say complete otherwise let's say pending. Just really basic status for this it's it's very binary it's either done or not so we'll implement this is ready method. So let's go over to our export
03:34
and how do we determine whether it is ready or not. So let's create this is ready method out which we know return to boolean. We know it's ready if we have a file available and if it's completed. Now actually we generate the file when we first create the record so it's probably just a good idea to to return not is null for this completed out.
04:02
And that should be enough to work that out. So let's just give that a refresh and you can see both of these are complete. Let's just fiddle around with one of these in the database manually so I'll just get rid of that and there we go so we get pending. So yeah I think that's a good status update for now. Now the last one is going to be the download link. We will work on this
04:23
specifically in the next episode but we only want to show this if the export is ready. So let's just say export is ready and that if you can do pretty much anything you want here and we're going to have a link to download this. So let's go ahead and just style this up so it looks a little bit different. So let's say text in to go 500 and there we go so obviously it doesn't show if this is pending.
04:51
Okay so we've got a bunch of exports let's just tidy up the process here though and the first thing I'm going to do is head over to the navigation and I'm going to go ahead and add this in. So let's look for dashboard here. Let's dump out our exports link here as well and yeah let's just fix that up. Exports
05:22
and there we go so we can now switch directly to our exports and after we have exported something so let's just export 10 of these we want to redirect, close this modal but by redirecting we will automatically close it over to our export so we can sort of monitor this straight away. So that's very easy because we're just working with a live wire component here so over in the
05:47
export modal after we've queued this we can just do what we want. The user doesn't need to hang around here so we can just redirect over to that export route. Let's do that and we're done. Okay let's just go through the whole process of this again. I'm just going to get rid of everything in the database here and I'm also going to clear out some of these files that we have
06:06
hanging around. Okay great so let's go back over to the browser. Let's go to our dashboard and let's export. I'm just going to do one just to test this out so it's start export pending and of course eventually that is going to be complete with the ability to eventually download it. We know that's not the case because we don't have the ability to download it yet. We have the record
06:26
exported here and of course in the database it's completed. Okay let's go over now and look at the secure process of downloading files. We need to be really careful here because obviously these could contain some sensitive information. We don't just want to let anyone download these.
22 episodes•2 hrs 18 mins•1 month ago
Overview
Let's build a powerful CSV importer and exporter with Livewire, completely from scratch.
This can handle millions of rows, be reused for multiple models, and by using queues, doesn't require the browser to be open.
This course is for you if:
- You need a robust drop-in importer and exporter component for your models that you have full control over
- You want to brush up on some advanced Livewire concepts
- You want to learn about queues in Laravel
Alex Garrett-Smith
Hey, I'm the founder of Codecourse!
Episode discussion
No comments, yet. Be the first!