React + Laravel Full-stack Application | Build and Deploy

In this video we will learn how to build full stack application with Laravel and react and how to deploy it on custom domain.

Link to the CSS File

⭐ Project Source Code

Timecodes
00:00:00 - Intro & Demo
00:03:54 - About Hosting Provider
00:07:40 - Necessary tools
00:09:54 - Setup Laravel Project
00:13:35 - Setup React Project
00:16:28 - Install and Configure React Router
00:26:12 - Create Multiple Layouts
00:32:50 - Working with Context API
00:41:23 - Create Protected Routes
00:47:50 - Create Default Layout
00:52:44 - Guest Layout + Login, Signup
00:59:20 - Implement Signup in React
01:16:31 - Implement Signup, Login & Logout in API
01:27:31 - Finish Signup
01:36:31 - Implement Login
01:43:32 - Implement Logout
01:48:14 - Users CRUD in API
02:02:43 - Users CRUD in Frontend
02:32:40 - Implement Notification
02:38:06 - Setup Hosting, Domain & SSL
02:42:54 - Deploy React
02:50:53 - Deploy Laravel
03:12:44 - Outro

If you really love my content and want to support the channel:
👉 My Patreon: (For monthly donation)
🍺 Buy me Beer: (For one time donation)

🖱️Follow me on social media:🖱️

Check my Github:

#laravel #react #fullstack

[Sabotazh]

To avoid a warning when creating a user, use User::query()->create() instead of User::create().

[skmuiuf]

Thank you for this tutorial! It was really helpful!

I have a little note about hooks on React though: they should not be conditionally called. At 2:19:52 you add a useEffect inside of an if, this can lead to all sorts of problems.

You have two options there:
1 - move the hook to the top level component and have the condition inside of it
2 - leave the if statement at the top level and move the hook to another component

[michaelheimburger]

FYI, in createBrowserRouter, PHPstorm is showing "routes:" as a kind of helper text that is not really in the code. I'm using VScode which does not do that and was throwing me off for a while. So if you're getting an error related to createBrowserRouter make sure you didn't type "routes:" in before the bracket. Nice video!

[rachmadnurhayat]

i'm not lie, this is the "first ever" video that introduce me how to use "debugger" line on react, watched the whole video though i skip few part, and pretty good explanation, you're just like the other youtuber that i love to watch (i'm trying to keep away these tutorial hell, but you won me on this haha) and now i'm finish mine and make this as my starter project, might add some additional library like SweetAlert and fontawesome later, soo it will be reusable for my future project.

Keep making videos, I hope your hard work and persistence pays off!!

[pkimtmv]

I am very happy when I see a new video in the channel or in the notifications, although I do not have the money to participate in the paid course, but I am very grateful for the effort that you make because you put us on the right path and teach us a lot. When I am able to participate in the paid course, I will participate even if I do not need it to express my thanks to you
With love, your student Mahjoub Mohamed from Sudan 😊😊😊

[inteliconn]

You make this planet a better place. Thanks!

[feketegergo]

Thank you for taking the time to cerate this video. Your explanations were really helpful and easy to follow which made it feel less intimidating for beginners like me. :D Your passion for web development is infectious. Looking forward to watching more of your videos in the future! ;) Keep up the good work!

[kwanele_dev]

I've been waiting for this all my life. So glad it's finally here. Can't wait to learn

[certificationcaci]

You're one of the top teacher and developer in the earth,
Please continue, I wish you all the best.

[pinturicchio]

Thank you, this video is amazing, your explanation is very easy to follow

[iloilomoliere]

seems like a laravel base channel, ill sub

[elizalima]

If somebody had an error to logout, maybe the changes on api.php (1:47:33) were not updated. You just need to run "php artisan route:cache" on the terminal.

[nycosborne]

This is one of the best tutorials I've ever taken, Thank you very much. Would you consider doing a vidoe with a focues on debugging, maybe, please??

[artanme]

I decide to create a separate folder for the frontend, and althought I spent a lot of time trying to config and understand Cors, it was really fun, thank you for this amazing tutorial! Also, i still don't know why, but i had to put "use in the User Model, to fix some errors i was having with the signup part

[soy-luisarrieta]

Video completed from 0 to 100! Everything perfect. Thank you very much!

[GersonAlmonte]

you're a genius of well structured and ordered project, never seen something like that before

[soy-luisarrieta]

This is AMAZING!!! Greetings from colombia

[tbydkcc]

It was awesome course for laravel with react.js and with all that deployment tips ). Will be waiting for more content

[alfredogonzalez]

What an amazing tutorial, thanks a lot brother! really helped closing some gaps with my project.

[AsmaKhan-qfgd]

It was super awesome video which is really good for beginners please make more videos like this we literally love your lectures