I built a pizza tracker with Laravel, React, and Inertia | Full Stack Tutorial

[@aschmelyun]

Here's the repo for anyone interested in the final code: github.com/aschmelyun/dices-pizza

[@antomac1511]

Great tutorial man, learned a lot. Hard to find react/inertia tutorials of this quality, keep them coming!

[@RTCDigitalS]

Glad you posted this a week ago. It's very difficult to find react inertia tutorials as they are usually made with Vue. I hope I can learn from if. Thanks

[@kennethornieta2375]

true hahaha

[@btx47]

great job, got a quick overview about inertia without being treated like a beginner

[@xThree65x]

This is top notch content! I feel like using Laravel, Inertia and React gives you the best of both worlds to develop with! More tutorials like this would be welcomed!

[@dannydelgado9820]

Awesome Andrew! Thanks for sharing this

[@carlosmontiel7078]

Feeling good watching new videos!! Nice.

[@piercegearhart]

53:05 You could of added overflow-hidden and something like relative to the parent and not worried about manually rounding both ends

[@NathanBudd]

This is a very cool video! Not much Inertia / React content out there. I used it as a refresher before Inertia 2.0 is released soon. One thing I did differently was deicded to eager load the 'user' (chef) on the Pizza model, but returned an ApiRecource with just the `id`, `size`, `toppings`, `status`, `chef` (whenLoaded).

[@SalsaPaulInBaja]

I'd love to learn how to create a demo like you have with such fluidity

[@aschmelyun]

It's a LOT of editing, trust me haha. The original content for this video was close to 5 hours of recording.

[@tmanley1985]

This is possibly the most well earned sub this year. Well done.

[@Icodestuff]

Great video as always! Certainly going to take some inspiration from the "I built this" series as I've been wanting to do something similar

[@aschmelyun]

Thanks a ton! These videos are always fun for me because they scratch an itch to try out new things or make weird projects. Definitely try it out!

[@kwasiezor1630]

Very nice project. Learning good things. Thanks for sharing.

[@i-diet1469]

That was really helpful to understand Laravel with React

[@ronanjwhelan2703]

Thanks Andrew - love your work!

[@oyewalekayode2725]

What a nice job from you andrew. No doubt you're a great tutor. I will be waiting for a real estate property listing site from you andrew one of this days.

[@aschmelyun]

Thanks for the complement! I'll add real estate property listing site as one of my backlog items, that sounds like a fun idea for a full-stack app. What would you like to see it built in? React, Vue, Inertia, something else?

[@moazsaid3417]

​@@aschmelyuninertiajs vue

[@oyewalekayode2725]

laravel and vue

[@pjr]

So clear and easy to understand. Thanks!

[@tazme4914]

Its just wow , you just created a CRUD applicaiton using Laravel+react+inertia in an 1 hour , im exited to try this now

[@thethmuueinsoe]

My first time learning Interia. Thanks for awesome overview. More of Laravel, React, Interia projects please. for conditional in PizzaStatus,jsx, these Tailwind classes "first:rounded-l-full last:border-r-0 last:rounded-r-full" can replace two conditions below: if (index === 0) { baseClasses += " rounded-l-full"; } if (index === statuses.length - 1) { baseClasses = baseClasses.replace("border-r-2", "rounded-r-full"); }

[@rcr786]

Great tutorial and easy to follow!!. Thanks!

[@carlosmontiel7078]

what extension is installed to see all the cool icons and models for react?

[@daveb8795]

This was great. Thank you!

[@Somcoders]

That was smooth and insightful! Thank you Andrew.

[@jkbullitt8986]

Kudos!!! Great tutorial here! Thankyou👍

[@mkyg8871]

Thank you so much for this.

[@aschmelyun]

No problem, I'm glad you liked it!

[@literallyshane4306]

great video, really well explained. thank you

[@devtube734]

just amazing

[@GianGamingMLBB]

I saw little issue, when you make it small screen, the pizza menu will not shown in the ResponsiveNavLink

[@neon-gi5tb]

Great video! The props in the Table component are added by you? I couldn't find it on Flowbite.

[@abhishekgupta5544]

Very nice video sir, can we use different theme in breeze with react.

[@pkiorpes]

great job it would be nice to have a dark/light switch and language/locale selector as well

[@aschmelyun]

Those are great additions! Might add them to an extra video later on

[@xclampazzo]

Awesome tutorial!

[@oluwasegunibidokun3910]

Nice tutorial Andrew. Well done. How do you effect changes in the frontend after deployment to production?

[@ergouwang3849]

Awesome,many thx!

[@ConstAxer]

Great! thank you! It's fast jump into laravel+react.

[@elm-o4w]

great tutoriel u gonna be famous one day ;)

This is amazing

[@aschmelyun]

Thanks man, I'm glad you liked it!

[@gouravjoshi953]

How to remove ' - Laravel' from the title of the page?

[@dApoTB]

Change the app name in config or env file.

[@chandanm3308]

Really Nice👍👌

[@gamertv1261]

Thank you for this video. Can you write something using Native PHP please?

[@aschmelyun]

It's in my backlog! Hopefully I'll have a video out in the next month or two with a Native PHP app.

[@redouanebenbiga9148]

my friend i m a laravel, react, react native developper and i never tought this way its even exist you did well to help us your great and i would like to see more video like a project built with inertia laravel and react , and i have 2 question : how we build the react app with this way , and can inertia work with react native thanks in advance really great video

[@aschmelyun]

You can just build out the React app for production by using `npm run build` and it'll bundle everything up as dist assets. For React Native though, that might be a bit tricky because of how tightly coupled the frontend components and backend is with this setup. For that, you might still have to stick to traditional API access.

[@Robot-x9u]

but what source-code editor you are using in this tutorial ?

[@cyberninja80]

what text editor do you use ? very cool

[@sakmaestro3852]

Great video... sir is it possible symfony and react combination?

[@aigars2225]

Good stuff, thanks

[@celebritydev1]

Great tutorial. Do you have any idea on how to deploy a laravel inertia react ssr project to a shared hosting? Any suggestion would be appreciated.

[@aschmelyun]

Thanks! Deploying that stack to shared hosting is pretty tricky, as with ssr you'll need access to a terminal or supervisor to run the server rendering node app in the background. My suggestion would be to use something like Laravel Forge, or at the very least a cheap VPS like DigitalOcean or EC2.

[@celebritydev1]

@@aschmelyun Thanks for your reply. My first try was to use cron job but that didn't work as intended. The second step I took was to create a node js app and installed pm2 on the server but to no avail. I haven't tried laravel forge before. I would give it a try to see how it goes. Once again, thanks for the suggestion.

[@justazizz]

Im just curious, which IDE is this 🙃

[@fuadagil]

Great videos. Btw i got no SelectInput components since installation. Can you provide link to the components code? Thankyou

[@aem..]

What vscode theme is it?

[@xThree65x]

Here is an odd question at the top for your tab when switching between pages for example it goes from "Dashboard - Laravel" to say "Order # - Laravel" Where is the "- Laravel" coming from...like how do you remove it or change it?

[@ka24det]

Will the getChefAttribute do a query for each pizza? n+1? Or is eloquent smart enough to not do that? I'm mostly back-end and have been avoiding any Inertia stuff but you make it easy to learn.

[@aschmelyun]

That's a great question, I'm like 90% sure that eloquent is smart enough to run a join in the query, but I'll have to make sure

[@GunniBusch1]

How „bad“ is it to not use the props for most of the data, to „reduce“ loading time by using tenstack router and skeleton?

[@neverforget1575]

Great vid, what's your thoughts on React Vs Vue in regards to the Laravel learning eco system? And a beginner getting started, thanks

[@aschmelyun]

If you're just getting started with frontend frameworks, Vue is definitely the way to go. Specifically the Options API (old Vue 2 style of writing components). Coming from an older JavaScript/jQuery background it makes more sense than React's JSX. From there, you can move to Vue 3's Composition API which I like better, and that kind of bridges the gap to current modern JS which can make learning React much, much easier.

[@neverforget1575]

Thanks for the reply, I have read on a few reddit posts that people are struggling to get jobs with Laravel and Vue and there are more openings in React. A lot of them said that they wished they used React from the start. Im just worried that React tutorials with Laravel are few and far between so may get stuck. just not sure what to choose, thanks@@aschmelyun

[@eryas1]

I have form which has many dropdownList for cities and districts, user must select cities to fill the districts list. When I use route.visit(city/{cityId}/districts). Url page is changed after change the city while I render same page of the form. Why? What is the best way to do it?

[@MuhammadAnas-w3o]

Its a brilliant video please create a video for big laraevl inertia and reactr project and also guide use how to use websockets, echo in inertia and react

[@alejandrogarcia..]

What code editor do you use?

[@aschmelyun]

PHPStorm with the MaterialUI Theme plugin

[@ahmadabeer3523]

i installed ziggy with "composer require tightenco/ziggy" but the routes are always redirectionf me to another page

[@aschmelyun]

Huh, that's weird. What page are they redirecting you to?

[@nihongo_]

thank u

[@RazvanTSibiu]

I used NextJS + API made in Laravel and it's pretty slow in development mode. Does Laravel + Inertia + React works much better?

[@kauasacramento2380]

VScode theme?

[@cmp-tata6484]

Name of your editor

[@bye835]

how do i handle error when the access data is not valid. $token = VerificationOTP::where('token', $request->isd)->first(); if (!$token) { return response()->json(['error'=> 'Token not found'], 404); } the error i get All Inertia requests must receive a valid Inertia response, however a plain JSON response was received. {"error":"Token not found"}

[@meaningmean]

Does it works with Svelte?

[@meaningmean]

I forgot to say thanks!

[@robchal7230]

your video is awesome

[@jusiprogramusi8826]

Why do i get unable to locate file in Vite manifest whenever i create a new jsx file, Does anyobody have an idea why this is happening?

[@kullbetdah]

24:31

[@rannieperalta2192]

awesome

[@azad01_]

your solution for real-time is kill the resources of the server, it's much better using socket

[@javascriptforhumans]

Instead of the setinterval here i use the pusher it's works great.

[@BBB888BBB]

a lot of important parts of giving beginners the basic concepts was skipped ... we hope we can make use of your knowledge going forward ..thanks .

[@abdulsiyadnp]

Supeeeeeeerb ❤❤❤

[@iUmerFarooq]

Vue + Laravel

[@aschmelyun]

Vue + Laravel is my favorite stack, I have many more ideas using those two in the works!

[@iUmerFarooq]

@@aschmelyun Sound great

[@iUmerFarooq]

Nuxt + Laravel projects

[@santos_prtv]

i am sooo Lost

[@CoderSineNomine]

if anybody thinks that i am mean well go ahead.. this is waste of time.. if you know laravel you don't need this, if you don't know you will not learn anything from it. because he passes everything without explaining. so why?

[@muhammad_abir]

finally I found what I was looking for

[@9uifranco]

Great! 26:10 $hidden and $appends works great but you could also do something like: Pizza::with(['user, id, name'])->get() This will append the user name to the pizza data. Note: you need to always put 'id' to make this work Note 2: Maybe it's with([user:id, name'']) - I don't remember exactly

[@carlosmontiel7078]

Help PHP 8.3.4 11.1.1 Unable to locate file in Vite manifest: resources/js/Pages/Pizzas/All.jsx.