This episode is for members only

Sign up to access "Build an E-Commerce Platform" right now.

Get started
Already a member? Sign in to continue
Playing
31. Indexing products in Meilisearch

Episodes

0%
Your progress
  • Total: 8h 42m
  • Played: 0m
  • Remaining: 8h 42m
Join or sign in to track your progress
01. Introduction and demo
9m 42s
0%
02. Installing Laravel, Breeze and Livewire
4m 47s
0%
03. Creating categories
9m 4s
0%
04. Recursively displaying categories
8m 21s
0%
05. Product model and migration
2m 50s
0%
06. Showing a product
7m 50s
0%
07. Product variation setup
10m 26s
0%
08. Creating the product selector
10m 34s
0%
09. Loading child variation dropdowns
4m 28s
0%
10. Faking adding the final variation
9m 33s
0%
11. Setting up product stock
4m 34s
0%
12. Calculating variation stock levels
9m 1s
0%
13. Adding product images with MediaLibrary
8m 50s
0%
14. Creating the product gallery
7m 28s
0%
15. Providing a fallback image
2m 56s
0%
16. Adding media to product variations
3m 37s
0%
17. Creating the cart model
3m 37s
0%
18. Registering the cart service
6m 34s
0%
19. Creating a cart session
11m 4s
0%
20. Showing the cart in the navigation
9m 19s
0%
21. Caching the cart instance
3m 2s
0%
22. Adding items to the cart
14m 1s
0%
23. Creating the notification component
8m 5s
0%
24. Showing the user's cart
6m 50s
0%
25. Outputting cart items
4m 50s
0%
26. Showing variation specifics
8m 8s
0%
27. Updating item quantity
8m 2s
0%
28. Removing an item from the cart
6m 1s
0%
29. Calculating the cart summary
8m 7s
0%
30. Showing the category products page
5m 1s
0%
31. Indexing products in Meilisearch
8m 32s
0%
32. Hooking up products to categories
4m 15s
0%
33. Building the product browser
13m 32s
0%
34. Showing child categories
1m 51s
0%
35. Indexing product variations for filtering
8m
0%
36. Outputting variations for filtering
12m 52s
0%
37. Hooking up product filters with Livewire
7m 48s
0%
38. Filtering products
12m 24s
0%
39. Filtering by price
9m 50s
0%
40. Adding global navigation search
7m 50s
0%
41. Handling products that are not live
3m 22s
0%
42. Price range category fix
1m 18s
0%
43. Scaffolding the checkout page
8m 6s
0%
44. Listing shipping options
9m 3s
0%
45. Calculating the cart totals
2m 52s
0%
46. Validating the account form
9m 10s
0%
47. Validating the shipping form
5m 47s
0%
48. Saving the shipping address
8m 4s
0%
49. Selecting a saved shipping address
6m 39s
0%
50. Fix shipping address error for non authenticated users
1m 7s
0%
51. Redirecting if the cart is empty
2m 42s
0%
52. Checking for quantity changes
7m 11s
0%
53. Syncing if quantities have changed
11m 59s
0%
54. Flashing a message when quantities have changed
5m 48s
0%
55. Setting up for orders
5m 17s
0%
56. Creating an order
13m 24s
0%
57. Attaching variations to order
6m 13s
0%
58. Reducing stock after ordering
2m 56s
0%
59. Meilisearch filter query fix
1m 33s
0%
60. Showing the order confirmation page
7m 39s
0%
61. Attaching orders for registering guest users
5m 17s
0%
62. Scaffolding the orders page
5m 30s
0%
63. Filling in order variation details
5m 24s
0%
64. Returning the order status
4m 39s
0%
65. Detecting order status changes
10m 49s
0%
66. Sending the order status change email
5m 12s
0%
67. Sending an order confirmation email
2m 47s
0%
68. Handling deleted cart records
4m 44s
0%
69. Transferring the guest cart
2m 44s
0%
70. Creating a presenter for the order status
4m 31s
0%
71. Setting up Stripe
3m 43s
0%
72. Creating and updating a PaymentIntent
16m 21s
0%
73. The Stripe card form
3m 35s
0%
74. Validating before payment
5m 34s
0%
75. Submitting a payment
6m 40s
0%
76. Checking for a successful payment
5m 47s
0%
77. Handling Stripe client errors
3m 11s
0%
78. Entangling Stripe customer data
2m 18s
0%

Transcript

00:00
So we're going to use Laravel Scout to index all of our products into MeliSearch.
00:05
You don't necessarily have to use MeliSearch, you could use something else if you wanted to, but it makes a little bit more sense because it's free, it's open source, we can go ahead and just start to work with it very easily. So Laravel Scout will assist, it will be the kind of middle of our search engine and our app, so we can get everything indexed exactly as we need it,
00:25
and we can pull it out as well. So if you haven't worked with Laravel Scout before, let's go through over to the introduction and the installation section and let's pull it in and just start to play around with it. So I'm going to go ahead and install that and let's go down and publish our config file in case we need to tweak that. And then the only other thing
00:45
we really need to do is just add the searchable trait to any of the models that we want to be indexed. In our case that's just our product, so let's come up to the top of our product and go ahead and use the searchable trait in here and make sure we pull that in. Again, we might need to just re-index our workspace, so let's do that. Okay, so that's pulled in.
01:04
Now, technically, we can go ahead and just start to index stuff. Of course, we need to think about the driver prerequisites, so we need to actually make sure that we have the MeliSearchPHP library pulled in. So let's go ahead and do that and then just before we start to index, we'll talk about running MeliSearch and what we need to do. So we've gone ahead and pulled in the MeliSearchPHP
01:24
library. Now, what we need to do is just switch over the Scout driver, set the MeliSearch host, and the MeliSearch key. Now, these are going to be exactly what we need, so let's go ahead and just copy them over to our EMV file just for now, and let's just check if we don't have anything to do with Scout in here at the moment, which we don't, so we can just pop them at the bottom.
01:43
Okay, so let's talk about MeliSearch. I already have this installed on my system, and if you don't, it really depends on which operating system you're working with. If you are working with Mac, then you can just do brew install and MeliSearch, and that will go ahead and install that for you, and what we're going to do is directly within the root of our project,
02:03
not that it really matters, we're just going to go ahead and once we have this installed, run MeliSearch. Now, what that's going to do is it's going to set up a local MeliSearch installation for you, which doesn't technically have any kind of security because as you can see here, we've got no master key found. The server will accept unidentified requests. We're going to
02:22
have to leave this running. That's our MeliSearch server listening, and you can see it's listening on local 7700, which if we head over to here is exactly the MeliSearch host that we're working with, and the MeliSearch master key just doesn't really matter at the moment. So that's MeliSearch running. Now, a really good thing about MeliSearch is we can actually open this up locally, so you
02:45
can see here that we're now technically inside of our MeliSearch server, and we can select an index here and start to look through. We can start to search for results. At the moment though, obviously nothing has been indexed, so our goal is to go ahead and index our products and see them in MeliSearch. So let's look at the very basics of this first of all. So I'm going to go ahead and
03:06
pull up my console, and I'm going to run php artisan scout import. That's going to be a new artisan command that is registered, and we're going to go ahead and choose the model that we want to import, which as we know is app models and product. So let's run this and just see what happens. Okay, so we've got imported models up to id of one. That is of course because over in our
03:27
database we only have one product. We'll check some more out in a second, but if we just head over to MeliSearch now, you can see that sure enough all of them details have now been indexed into MeliSearch, and we can start to query on these. We can start to add facets, any of the more advanced stuff that we're going to be doing in this course. So that's all of the details for
03:48
our product indexed into MeliSearch, but we really want to start to control the type of data that we are indexing. We might for example want to include a formatted price. We're not actually going to do that because we're going to be plucking out the details slightly differently, but let's look at how we can actually start to customize what data gets sent into MeliSearch. So under our product
04:11
model, let's go up to, well we can just put this at the bottom, it doesn't really matter too much. We're going to go ahead and start to customize this now. So to do this we're going to go ahead and create out a method called toSearchableArray, which Laravel Scout is going to call in order to get the data that you want to send through to either MeliSearch or any other service that
04:34
it supports. And really all you need to do here is just return, as the method name suggests, an array with the data that you want to see. And because we're directly within the model, we can just say something like this ID for example. So let's say that we just wanted to index the ID of our product. Obviously we're not going to do that, but we can just about get away
04:52
with that. Now if you want to go ahead and flush all of the records for a particular model out of Scout, you can run flush. It's a good idea to do that before you go ahead and re-import this if you've made any changes. So let's go ahead and say Scout import, and just pull app models and product back in there. And let's just redo that again, come over and give that a refresh, and
05:13
there we go. We've got a record in here, but we just have an ID of one. So not the most useful. So what we're going to do is control this data, think about the kind of data that we want to import. We're going to make this a lot more advanced later because we're going to need to get all of the variation types that we can create faceting on which will allow us to implement
05:32
our filters. But for now let's just fill out some really simple information here just so we don't overload this. So let's say the title, that's pretty important, the slug. So let's go ahead and pull that slug in, and that's pretty much it because when we are grabbing these records out, we're actually going to be redoing a database lookup by the ID. So let's say that if someone
05:53
searches for Nike and they get product ID 11015 back, we're going to take this array and we're going to do something like product find and then we're going to pass that array in to re-get out a collection of products which we can then iterate through. And that means that we'll have all of our relationships in there already, slightly slower because we're going to be performing an additional
06:14
database query, but to be honest the convenience is worth the extra query. If none of that makes sense at the moment, don't worry, we'll get to that a little bit later. The reason that we're including the title and potentially the slug is because we need some sort of data in here so a user can search for something. For example, if they search Nike and we only have the ID index,
06:35
they're not going to get any results back because nothing inside of this store is going to have the word Nike in it. Okay, so let's go ahead and include the price as well because eventually we're going to implement our price filter which is really important. So we really need the price in here and we'll also go ahead and index the category IDs as well so we can filter on those
06:59
as well. So if we look inside of here we don't actually have a categories method, so let's go ahead and add that in really quickly now. I'm just going to sort of pop these anywhere, so let's say categories and we're going to say this belongs to many because we have a belongs to many relationship and category class. There we go. So now we're going to say this categories and what we want
07:25
to do is grab the collection back but only pluck out the ID of this. So this will give us back like one two three and then we can use that to filter based on the category that we've chosen. Okay, so now that we've got that in there let's just go ahead and rerun flush and import and it looks like we've got an error. So let's go ahead and check out what we've got here. Okay, so category
07:46
product does not exist. Let's just head over to our category model really quickly and yeah it doesn't look like we've got that hooked up. Well, we should have and yeah we didn't actually hook this up. So let's go ahead and leave that for the next episode then because that's probably going to be a little bit longer. Let's get rid of the category IDs for now and let's just re-import
08:09
those. Come over and there we go. So we've got the basic information about this product. We've got a searchable title and slug which is really important. We've got a price for filtering and as we've discovered in this episode we don't have a category product hooked up. So let's go over to the next episode create that out and then we can come back to this a little bit later.
78 episodes8 hrs 42 mins

Overview

Build a robust e-commerce platform with a Laravel and Livewire. Features products with unlimited and flexible variations, a product browser with filters and price range slider, global product search, guest checkout, shipping and payment implementation, order status tracking and more.

Alex Garrett-Smith
Alex Garrett-Smith
Hey, I'm the founder of Codecourse!

Comments

No comments, yet. Be the first to leave a comment.