Luma was doing that
Rebuilding the pages I spent five years overriding has me thinking the plan is the part of this project I'm useful for.
The redesigned product page came back without a wishlist.
Nobody took it out. The designs for this round are HTML mockups out of Gemini. None of them has a heart on it, so the plan didn’t mention one and the components got built without it.
The version from before the redesign is still sitting in folders called _old/. This morning I pointed an agent at it and asked it to put the heart back on the product page, the product cards and the header.
That part took less than an hour. Noticing it was gone took longer. I suspect noticing is most of my job on this project.
Laravel in the front, Magento in the back
The project is called Lightning. It’s a Laravel storefront sitting in front of a Magento store, with the pages written in React through Inertia. Magento keeps what it’s good at: the catalog and the orders and the admin the client’s team already knows. Laravel reads the products out of Magento’s database and its search index and renders the pages people actually shop on.
I’ve been on the storefront since December. For me it’s both halves of the last 10 years in one repo. I learned Magento at work from the front end in, one overridden template at a time. I learned Laravel on a project I built in my spare time, which is where I finally found out what a controller is for.
Inertia is the piece that joins them. It’s smaller than I’d expected. A controller does what a Laravel controller always does and then hands its data to a React component as props instead of to a template.
return Inertia::render('Pdp/Index', [
'product' => $product,
'related' => $related,
]);
No API in between and no second app to keep in step with the first. The first time I opened one of these I could read every line of the PHP, which is not something I’d have said about any Magento controller in my first couple of years.
Leave the rest alone
Most of my Magento years went into overriding Luma, the theme Magento comes with. You copy one of its templates into your own theme, change the part the design needs, and leave everything else where it was. The page already works before you touch it. The job was making it look like the design without breaking anything it did.
And it did a lot. A Luma product page tells you whether the thing is in stock. It has Add to Wish List and Add to Compare under the button, and a quantity box that turns down anything that isn’t a number.
The category page has breadcrumbs, a sort menu and a count of how many products you’re looking at. There’s also a setting in the admin that decides whether anything out of stock shows up in the list at all.
I overrode most of those templates at one point or another. I’m not sure I could have listed everything they did, though. I never had to because Luma was the list.
Implement the following plan
On Lightning nothing exists until somebody writes it down. That’s true of any new build, sure. But it’s a different story when an agent is doing most of the typing.
I write a plan for each page, section by section. Then an agent builds it against the mockup. I wrote in November that the agent takes the plan, and it takes it very literally.
It builds what the plan says and builds it well. It doesn’t build what the plan forgot, because nothing tells it anything was forgotten.
The mockup can’t tell it either. A mockup is a picture of a page. It shows how things look, not what happens when a product sells out or which parts of a card are links. A heart icon is small and very easy not to draw.
So the gaps turn up one at a time, mostly as bugs. Last week the product page threw an error on a product whose stock quantity wasn’t in the search index. It wasn’t in there for about 82000 products, because Luma never needed it there.
Magento’s own product page loads stock from the database. The new one reads the index, so the number had to go in. It took an error to find that out.
Five years of reading the list
I’ve started to think this is where the Magento years are worth the most. It’s not the LESS or the layout XML or the tricks for getting an override to take, since none of that carries over. The reading does.
Every time I opened one of Luma’s templates I was reading a piece of the list of things a store’s pages do. I just didn’t know that at the time. It turns out I spent five years collecting most of what a good plan needs.
I can read the Laravel half, thanks to the side project. The agent writes the React half faster than I could. The plan is where I’m actually useful. A good plan is mostly me remembering what the old page did so the new one does it too.
If you’ve gone from years of overriding a platform’s default theme to building the pages from nothing, I’d be curious what turned up on your list. Mine is about a page long so far, and the heart went on it this morning.