Build Laravel 12 React Project from SCRATCH in 2025! | Part 3
979 views
Apr 14, 2025
Build Laravel 12 React Project from SCRATCH in 2025! | Part 3 Learn how to build a full-stack web application using Laravel 12 and React from scratch in 2025! In this tutorial, we'll take you through a step-by-step process of setting up a new Laravel 12 project and integrating it with a React frontend. We'll cover everything from installing the required dependencies to creating a functional CRUD application. Whether you're a beginner or an experienced developer, this video is perfect for anyone looking to learn how to build a modern web application using the latest technologies. So, let's get started and build a Laravel 12 React project from scratch in 2025! #react#reacttutorial#laravel12#laraveltutorial
View Video Transcript
0:00
hi friends welcome to T's funny channel
0:03
uh in our last class in our Laravel we
0:07
show the how to work with the basics
0:12
things okay so these all the things we
0:14
have discussed about our last tutorial
0:16
okay so let's continue this video so
0:20
this video I'm going to teach about the
0:22
from the scratch so it's simply this is
0:25
your blade dot
0:28
uh welcome blade dot php so over here
0:32
I'm going to create this one normally we
0:35
have to create layout folder okay so you
0:38
have to create the layout folder okay so
0:40
that's that's how we have create the
0:41
folders okay
0:44
layout inside this layout folder we have
0:47
created the file which is a layout
0:51
layout dot
0:56
blade.php this is the this is nothing
0:59
but the extension of lar so the
1:01
blade.php file what I'm going to do is
1:05
I'm going to implement the HTML
1:07
architecture so HTML standard so hold on
1:10
the shift key down and press one and
1:13
open it you can have a HTML post inside
1:17
the body tag what I'm going to read i'm
1:20
going to write it here add heel content
1:23
what is
1:26
he going to within the brackets i'm
1:30
going to write here
1:31
content you have to pass the content
1:34
over here okay so here we have to create
1:37
the title i'm going to make it as my web
1:39
something like okay what is this the
1:43
heal content mean okay we have created
1:46
the different pages imagine if you have
1:49
a website you have a about us page
1:52
contact us page service page there are
1:54
plenty of pages connected to your
1:57
website but that time
2:01
your that time the these all things are
2:04
not changes only the heel content could
2:06
be changed
2:08
uh the meaning is your header and footer
2:11
look like same but the middle of the
2:13
content would be changed that's the
2:16
meaning of it this is a template only
2:18
this template this this template only
2:20
not change when you are writing the
2:22
letter uh imagine you have you are going
2:25
to work as a company the company the
2:28
heading heading also there letter head
2:30
the letter head also the company letter
2:32
head include the company name and
2:35
address and phone number etc but only
2:38
the middle of the contain of the middle
2:41
of the contain mean you the the company
2:44
uh letter it is
2:46
same middle of the container would be
2:49
changed okay so once once you write the
2:53
order or once you send the order or
2:55
invoice or uh letter or anything else
2:58
the contain would be changed but
3:00
letterhead should be same so this is
3:03
same thing like the letterhead okay so
3:05
lethead in my in web we are called as a
3:09
template okay this is a template file so
3:11
we have to using as a layout okay now I
3:14
have and uh so I hope you have a clear
3:17
idea about this what's the meaning of
3:19
layout the lay layout is very important
3:22
part of learn okay so after that I'm
3:24
going to create the two pages that
3:27
is one page you have to create as
3:30
welcome page I have created so here I'm
3:32
going to create another page which is
3:33
about page
3:36
about
3:37
dot
3:39
plate
3:42
dotphp so again I'm going to create
3:44
another page which is uh contact tech
3:49
dot
3:52
blade page these are the pages I have
3:55
created now what I'm going to do is
3:58
here this pages what I written we have
4:02
to this head this all things we no need
4:06
no need only we have to call this only
4:08
inside this page so write see this
4:12
page you have to write the annotation
4:15
section okay section sorry
4:21
extent extends we call the lay the
4:24
folder name this one the sorry the the
4:26
file name it is a
4:28
layout
4:30
layout that's that's the thing you have
4:32
to write
4:34
layout it automatically take this don't
4:37
put this this all things are as
4:40
extensions this don't put the extension
4:43
okay only the keep only the file name as
4:46
well then it should work okay now after
4:49
that we have to write the
4:52
section section you have write this one
4:55
as a
4:58
content okay after that here we have
5:01
write a section start and section
5:06
stop that's
5:11
it section start and section stop inside
5:14
this section you have write it here some
5:16
you have write here this one you have
5:18
write tag open the new tag and close the
5:22
new tag okay anything so you write
5:25
simple you have write this one as about
5:28
us open
5:30
and write about
5:33
us okay
5:35
about
5:38
us
5:39
okay understood now we have created the
5:42
pages there's a layout out the
5:46
page now what I'm going to do is here
5:49
I'm going to go to
5:52
my web.php we have to mention the URL
5:55
when the request is coming instead of
5:58
display that this text I want to display
6:00
this about us page so how to link it
6:03
this one instead of the message we have
6:06
to write it here return view let mention
6:09
this page name what is the page name
6:13
about okay what's the name you have
6:16
created the page the same name you have
6:18
to give here then only it should if you
6:20
give the different name uh the the route
6:25
not uh the route uh route cannot
6:27
understand what is a file okay if you
6:29
have mentioned the file name correctly
6:31
it should work it's go to the respective
6:33
path if you have mentioned the wrong
6:34
name uh how can uh route understand to
6:38
go to that particular path okay so we
6:40
have mentioned the name correctly then
6:41
it should work okay now let's while and
6:44
save save the file and back to my
6:46
application now when the request is
6:48
coming /
6:51
about so about plus enter
6:57
key is it correct
7:00
sorry sorry say about a
7:03
second uh layout not found uh layout
7:11
sorry this one
7:18
layout dot right layout dot layout
7:22
control S to save now let's back to the
7:28
application now it's working the problem
7:30
is what's the problem is here now here
7:34
we have a file you can see here this is
7:36
the folder we have created about us file
7:40
the about us file where your layout file
7:43
is inside inside this layout pages
7:46
layout folder the layout folder file is
7:49
reside on this layout folder so inside
7:51
this layout folder you have a layout
7:53
file so if you want to access this
7:56
layout file how to access it you go
7:59
First inside the layout folder so we
8:02
have to type that particular name of the
8:03
folder inside the folder we have a file
8:07
which name is layout understand okay
8:11
inside the folder if you if you if you
8:15
want to access that particular file
8:16
which is a layout file how would you
8:19
access you access first you have to
8:21
access that particular folder this
8:24
folder which name is layout after access
8:27
that particular folder you will be able
8:28
to access the layout file this is the
8:31
process now you can access the about us
8:34
page
8:36
understood now the same thing that
8:38
compact us this also first you have to
8:40
write with the set uh layout sorry
8:48
extends out extents
8:51
now is your convenient mind first you
8:53
have to write the code generally you can
8:54
understand
8:55
layout dot
9:00
layout you have to write
9:05
section so section you have to write
9:11
content stop
9:14
section this all called as annotation
9:16
this is the predefined annotation which
9:19
create by L okay not created me this is
9:22
the larable created okay so that's the
9:25
same thing so the same thing I just copy
9:27
this the things put inside this section
9:31
we have called as contact
9:35
us that's
9:38
it file save all file save now let's
9:43
before run
9:44
it we have to go to the web dot php you
9:46
have save when the URL is coming you go
9:49
at which page this page so how to link
9:52
it now I I'm not when the when the URL
9:56
is coming look like this / contact
9:59
instead of getting the message of
10:01
contact us I want to give that
10:03
particular page I need to redirect to
10:05
that particular page when you type this
10:07
URL so how to redirect the page you have
10:10
to put that name of the file but the
10:13
name contact is the
10:15
contact return content now let's So I'll
10:19
save all and bring back to the
10:21
application and again write
10:25
contact presenter enter key now here
10:28
connect very
10:30
simple okay this how we have URL works
10:33
very simple these are the these are the
10:36
process you must understand before you
10:38
have driving to the lar okay these are
10:41
the process you have must understand
10:43
okay when you study Lar this is a very
10:46
must if you if you don't know this all
10:47
the things you you
10:50
cannot this every framework you have to
10:53
study from the scratch then only you
10:55
will be able to catch the languages
10:56
otherwise you won't be able to catch the
10:58
language this is very important stuff
11:00
thanks for watching