Up next in 10
Laravel for Beginners: Build Your First Web App in 1 Hour!
129 views
May 26, 2025
🔥 Laravel Crash Course: Build Your First Web App in 1 Hour! Welcome to the ultimate Laravel tutorial for beginners! Whether you're just getting started or switching from plain PHP, this Laravel crash course will teach you how to build a real-world Laravel project — step by step! Source code : https://www.tutussfunny.com/category/laravel-9/ 💻 In This Video, You’ll Learn: ✅ How to install and set up Laravel quickly ✅ Build routes, controllers, and views ✅ Work with databases and migrations ✅ Create a simple and functional Laravel project from scratch ✅ Tips and tricks to speed up your Laravel development This is not just another Laravel course — it’s a hands-on, beginner-friendly guide designed to help you understand the core concepts and build confidence as you code. 📌 Perfect for: Beginners who want a fast and easy way to learn Laravel Developers looking for a practical, project-based approach Anyone curious about how modern PHP frameworks like Laravel work
View Video Transcript
0:00
hi friends welcome to tutors learning channel today I'm going to start the series of series of Laravel and React
0:09
okay so if you are already learned Laravel is a back end
0:16
application back end backend
0:24
application alternative react is a front end
0:34
application okay so we have to know about these things what is React it's a
0:40
back end lav is a uh Lav is a back end react is a front end okay you have to
0:46
you must understand these things okay so when you when you run the
0:53
project first you have to run L first second you have to run
0:59
the react okay this is the server first you have to connect the
1:04
server after that you have to request to the server get the
1:10
response okay so that's the thing here okay so this is the back end and front
1:17
end okay before first uh there are many student who not they are struggling with
1:24
this one first you have to run the laral first after that you have to run the react
1:30
first what you're going to do is today I'm going to teach this project how to install Laravel and React in your
1:37
machine so now what you're going to do is you have to go to the
1:43
Laravel so type Lar so here you have to connect the
1:49
internet type
1:59
click on this so you click click on this uh you
2:05
can click over here now the latest latest version is 12 so here if you want
2:10
to go to the installation simply there is here there is a file called installation link called in installation
2:15
you click on this it is simple okay rather than you have to go to the official site you can simply you can
2:22
install the lar okay so you have to go below okay these are the things they are
2:30
so the lar so Windows PowerShell uh you can Okay so here this one should be
2:36
there if you already have a PHP console first you have to install the uh your uh
2:42
PHP comp composer in your machine before get install the lar okay that is must
2:48
when you install the laral first okay so first what you're going to do is I'm going to go to I already installed
2:53
Laravel so you just copy this one okay so I already installed the composer if you have not installed the
2:59
composer you go to the Google and type
3:05
composer composer
3:11
download okay this is the latest version you just install here this one you can
3:17
click and download the exe file and you have to download uh downloaded and
3:22
install in your machine after install successfully you have to run this command first click on this go open the
3:29
G drive you have to you have to open the folder this folder I'm going to type
3:35
here Laravel 12
3:40
project here I'm going first I'm going to open the cmd command space this command press enter
3:49
key so it will be all the composer files should be all
3:55
the things are here you have to install
4:16
it now here project is installing so here you can see after installed you can
4:22
see here okay this one now what you going to see here I'm going to go to run
4:28
the command L new app this one copy
4:34
this paste on it so we want to give the name of the project uh example my app I
4:40
just give us my app first step is possible now I'm going to here you can
4:46
see that there are uh h default Definely it say select as none if you want to
4:52
select react you can select here react and react I'm created a different folder so that I'm not going to select here
4:58
react so press enter key it ask which testing framework do you prefer p is
5:04
default one press enter key now you can see the laral project
5:13
is install it you have to wait until the installation is complete this is the way you have to install the laral
5:19
uh 12 project in your machine just wait until the installation
5:24
has been completed
6:27
now he asks which database will your application use so I'm going to start
6:34
MySQL you have to type here over here
6:40
MySQL so type MySQL like this MySQL type MySQL
6:48
okay okay default database is updated would you like to run the default database migration uh yes press yes
6:56
that's it
7:06
okay so okay there is a [Music]
7:18
problem it's installing wait until the installation completed
7:25
now he asked there would you like to run npm install and npm run build so I'm
7:31
going to give here is no i'm going to give you is no uh so you
7:39
can type here application uh ready okay you can start your local
7:46
development using you can type this command cd my
7:53
app okay now what you're going to see here I'm going to connect my
8:05
zam running successfully now here what I'm going to do is I'm going to type this command
8:12
mpm install you have to follow the
8:18
instruction to do
8:34
it now here it npm installation successfully now what you're going to do is this project
8:42
uh I'm going to install the uh I'm going to type PHP
8:50
artis type uh we have write
8:56
migrate so the would you like to create uh my app does not working so no problem
9:02
so I just uh hit Ctrl C so first I'm going to open this project in VS code
9:09
space VS code editor okay we open the project on VS code now you can see this is the uh
9:17
Laravel 12 okay so this is the latest version so we have to get the white also
9:24
so here everything is standard we'll be getting here you can see over here okay
9:30
so the connection is here change my everything should be there you have a database name I'm going to give here as
9:36
any database name I'm going to give DB my
9:42
Maya my app so what you're going to this name I'm going to go totr C to copy I'm
9:49
going to go to create in my database after that we can run the command okay so let's
10:04
Now click new okay i'm going to paste this one click create okay this one I have created now
10:11
what you're going to do is I'm going to uh run the project so I'm going to
10:19
using the command you have to run the app you have to use this command not PHP
10:24
this is the command you have to use it
10:30
run it so here before that you have past the
10:36
command you have writing so let's open the terminal over
10:41
here okay so I haven't done the migration php artis
10:47
migrate
10:52
uh why it's a problem why so I'm sorry I'm not save it that's why so I'm going
10:58
to again you got it preparation successfully now you can run the command here or here I'm going to run it here
11:05
phpson sorry composer run
11:12
de because here it is working as This one white the newest version is uh
11:18
working as the same thing PHP artisan composer it was working working as using
11:24
white this is the port where it will be running so yeah this is the code it is
11:30
coming like this laral along with white just
11:36
simple this how it's working okay this how it's working other things are
11:43
same thing the clouds and everything are same this is a new way to rank the
11:48
Laravel app in Laravel to a professional way to solve the Laravel to thank you
11:55
for watching in next day next tutorial I'm going to teach about the react thank you for watching this is Larl yesterday
12:02
we already saw this one how to run the Laravel 12 so here we are using the composer run that's the command which
12:10
we'll be running okay consider consider it so someone asking why you are not running the PHP artisan serve so you
12:18
have to run it that's also so I'm going to stop this one right PHP artisan cell
12:26
because the problem is the thing is they implemented the npm model as well in
12:31
lar so therefore the advanced features they included the lar as well so that's
12:36
why we are running the composer table composer run that's come up okay they
12:42
implemented the new command as well so that is the default command and PHP uh
12:47
PHP server PHP artis so that command also it's possible here it's working here sorry it's
12:54
working it's possible here that also working here it's no problem okay that is no problem okay you
13:02
you not you don't bother about these two things okay so here you just simply type this one and you will be able to get the
13:08
application so now what I'm going to do is the second one I'm going to discuss about
13:14
the things so this is the things we have discussed about the database and
13:19
everything you have discussed about in our last class so so you can see you have to mainly you have
13:25
to study in Laravel most important thing is model
13:31
view controller that is a very important part okay
13:36
model another one is view another is a controller this is the most important
13:42
part we have to study what is model this is one this is called as MVC
13:50
mv okay model which will be communicate with the database view which will be
13:56
returning to the user part so that when the user go to the website you can see
14:02
the view okay so controller which will be managed the entire project okay when the uh when you here you can imagine you
14:10
have a registration form you have fill up the registration form and click submit button it come to the controller
14:17
controller controller passing the record to the model model is the part we communicate with the database and save
14:24
the data inside the database and pass it to the response data successfully okay so that one
14:31
that's why it will be okay so we will be do this one in practical don't worry
14:38
about that okay so let's go ahead okay so let's go ahead so let's what I'm
14:44
going to so here our you can see the you can see here the model is resided on
14:51
inside the app folder there is a model folder the default model is user okay so
14:57
that second one the view this one reside on inside the resources folder views
15:04
here this is the views and and another part which is a controller which is
15:10
resided on the inside app folder http there is a controller controller folder
15:16
okay so so you you have to understand the architecture of larl so laral consist
15:26
of MVC mvc which is nothing
15:31
but model view controller okay okay this stand for
15:38
model view controller okay model view controller mean it is a model this is a
15:45
controller this a view okay so what I'm going to do is now
15:52
I'm going to go to the view
15:57
part i'm going to go to the view part this a view this is the user
16:04
interface you can
16:09
get okay this is the user interface you are getting you can see this this is the user interface okay so you can this is the
16:17
welcome page you will be able to get when you run the application this is the welcome page you are getting so that
16:25
welcome page is reside on where inside the resources folder views disable okay so now what
16:33
I'm going to do is I'm going to just this all things I'm going to this all
16:38
things I'm going to select all so get rid of this instead of that
16:44
I'm going to write it here in in VS code editor you have to press hold on the
16:49
shift key down and press one key on your keyboard you get this mark click on this
16:55
it simply you have to import simply you have to get the HTML standards okay HTML
17:02
post okay inside the body I'm going to type
17:09
k1
17:15
Hello if you start the tag you must close the tag but don't forget to close the tag it not work file saved now you
17:23
have to bring the application okay now let's blank the
17:30
application you have refresh it here okay so now now I'm going to change this
17:36
one something like that then you have to file save all and bring back to the
17:41
application and and refresh it okay you will be able to see it's working fine now now you can have a good
17:49
knowledge how the thing is working okay so when you are uh when you are type on
17:55
the welcome.blade php this is a view page so how the work is you have to type
18:00
here go to the browse there a web.php so when the URL slash
18:06
mean what is uh this is this is the port where your server is running so where
18:12
when the when the thing is coming if you only put slash it's automatically get this IP address okay so it is it is read
18:21
to the view this welcome welcome mean we don't no need to include this extension
18:27
this is the larable extension this is nothing but the laral extension play php
18:32
okay larable which is the extension of blade dot PHP okay so imagine I have
18:38
another one so I'm going to same thing i'm going to go and copy and paste it over here so I'm going to go to type
18:46
this one user / about us what will be the output we'll get so
18:54
here nothing so now what I'm going to do is I'm going to type about us when the URL is /about us
19:04
I want to return you have to uh when the user type
19:11
what about us what is the output we'll be getting okay so you have to type here
19:17
what's the thing is you have type you have type
19:22
uh you type return about
19:30
us return about us okay so let's save
19:40
all refresh it okay about us now we understand that okay so when
19:47
the user So now same thing I just copy and paste it over here third one is a
19:54
contact when the user type contact you display the contact
20:01
us control S to save okay instead of go and save over
20:07
here you have to just uh save as your shortcut key of using the save uh
20:13
control S shortcut key by your shortcut key by your keyboard and save it and
20:19
after that you have to run it and refresh them so it's yeah you have to enter the URL as contact press enter key
20:26
the text has been changed as content if you type as about task the text has been changed as
20:33
about if you leave as it is and press enter key your home page this how the
20:39
formula is working this is where we must you have to consider this this how the route is working okay what the URL you
20:46
are entering here the based on the URL the request is working okay now here we
20:52
are not going to touch with the controller only we have touch with the routes and views only we have now so far
20:59
we are learning routes and we uh view only we are not going to teach I'm not
21:05
going to teach so far what is how to model work and controller work first you have to you must understand how the
21:12
routes works okay routes get me if you type /ab about you get the request
21:19
return to the about us text it's return to the about us contact us text if the
21:26
record is coming like that so not the page only we have discussed about the text I hope you guys you understood the
21:32
things well uh thank you for watching I'll be getting in touch with my next video
21:38
tutorial I'll be clear any other things in my next video tutorial how the we have we have to do the simple website
21:45
and uh we have I I bring the tutorial about how to make the simple website using this uh scenario so we have to
21:51
understand clearcut understand how the lar process works thank you for watching hi friends welcome to tutors
21:58
funny channel uh in our last class in our laral we show the how to work with
22:07
the basics things okay so these all the things we have discussed about our last
22:12
video okay so let's continue this video so this video I'm going to teach about
22:18
the from the scratch so it's simply this is your blade dot
22:25
uh welcome blade php so here I'm going to create this one normally we have to
22:32
create layout folder okay so we have to create the layout folder okay so that's
22:37
that's how we have created folders okay layout inside this layout folder we have
22:44
created a file which is a layout layout dot
22:53
blade.php this is the this is nothing but the extension of lar so the blade.php file what I'm going to do is
23:01
I'm going to implement the HTML architecture so HTML standard so hold on
23:07
the shift key down and press one and open it you can have a HTML post inside
23:14
the body tag what I'm going to I'm going to write it here at heel content what is
23:23
he going to within the brackets I'm going to write here
23:28
content you have to pass the content over here okay so here we have to create
23:34
the title i'm going to make it as my web something like okay what is this the he
23:40
contain mean okay we have created the different pages imagine if you have
23:46
a website you have a about page contact page service page there are plenty of
23:52
pages connected to your website but that time
23:58
your that time the these all things are not changes only the he content could be
24:03
changed Uh the meaning is your header and footer look like same but the middle of the
24:10
content would be changed that's the meaning of this is a template only this
24:15
template this this template only not change when you are writing the letter uh imagine you have you are going to
24:22
work as a company the company the heading heading also there letter head the letter head also the company letter
24:29
the include the company name and address and phone number etc but only the middle
24:36
of the contain of the middle of the containment you the the company uh data
24:42
it is save middle of the container would be changed okay so once once you write the
24:49
order or once you send the order or invoice or uh letter or anything else
24:55
the contain would be changed but letterhead should be same so this is same thing like a letterhead okay so
25:02
letterhead in my in web we are called as a template okay this is a template file
25:08
so we are using as a layout okay now I have and uh so I I hope you have a clear
25:14
idea about this what's a mini out layout the lay layout is very important part of
25:19
okay so after that I'm going to create the two pages that is a one page you
25:25
have to create as here welcome page I have created so here I'm going to create another page which is about
25:31
page about dot plate dotphp
25:39
P so again I'm going to create another page which is uh
25:45
contact blade.php these are the pages I have
25:52
created now what I'm going to do is here this pages what I written we have
25:58
to this head this all things we no need no need only we have to call this only
26:05
inside this page so how to write see this page here write the annotation
26:12
section okay section sorry
26:17
extent extends we have to call the the folder name this sorry the the file name
26:23
which is a layout layout that's that's the thing you have
26:31
layout it automatically take this don't put this this all things are as
26:37
extensions this don't put the extension okay only the keep only the file name as
26:43
well then only it should work okay now after that you have to write the
26:49
section section you have write this one as a
26:55
content okay after that here we have write the section start and section
27:03
stop that's it section start and section stop inside
27:11
this section we have write it here some you have write here this one you have to write new tag open the new tag and close
27:19
the new tag okay anything so you write simple you have write this one as about
27:25
us open and write about us okay
27:32
about us okay understood now we have created the
27:39
pages there's a out the pages now what I'm going to do is here
27:46
I'm going to go to my web.php we have to mention the URL
27:52
when the request is coming instead of display that this text I want to display this about us page so how to link it
28:00
this one instead of the message we have to write it here return view have to
28:06
mention this page name what is the page name about okay what's the name you have
28:13
created the page the same name you have to give here then only it should work if you give the different name uh the the
28:20
route not uh the route uh route cannot understand what is a file okay if you
28:26
have mentioned the file name correctly it should work it's go to the respective path if you have mentioned the wrong
28:31
name uh how can uh route understand to go to that particular path okay so we
28:36
have mentioned the name correctly then not it should work okay now let's while and save save the file and back to my
28:43
application now when the request is coming / about so about plus enter
28:53
key is it correct sorry about
29:01
uh layout not found uh layout
29:08
sorry this one
29:15
layout dot right layout dot layout control S to save now let's back to the
29:24
application now it's okay the problem is what's the problem is
29:29
here now here we have a file you can see here this is the folder we have created
29:35
about us file the about us file where your layout file is inside inside this
29:42
layout pages layout folder your layout folder file is reside on this layout folder so inside this layout folder you
29:49
have a layout file so if you want to access this layout file how to access it
29:55
you go first inside the layout folder so we have to type that particular name of the folder inside the folder we have a
30:04
file which name is layout understand okay inside the folder if you if you if you want to
30:12
access that particular file which is a layout file how would you access you
30:17
access first you have to access that particular folder that's folder which name is layout after access that particular
30:24
folder you will be able to access the layout file this is the process now you
30:30
can access the about us page understood now the same thing that come
30:35
back this also first you have to write with the set uh layout sorry
30:45
extends out extends now you come in your mind first you have to write the code generally you
30:50
can understand layout dot
30:57
layout you have to write
31:02
section so the section you have to write
31:08
content stop section this all called as annotation
31:13
this is the predefined annotation which create by L okay not created me this is
31:19
the larable created okay so that's the same thing so the same thing I just copy this the things put inside this section
31:28
we have called as contctors that's
31:34
it file save all file save now let's
31:40
before run it we have to go to the web dot php save the URL is coming your go at which page
31:47
this page so how to link it now I I'm not when the when the URL is coming look
31:53
like this / contact instead of getting the message of contact us I want to give
31:59
that particular page I need to redirect to that particular page when you type this URL so how to redirect the page you
32:06
have to put that name of the file what's the name content is this the content this
32:12
file we have written view content now Press file save all and bring back to
32:18
the application and again write contact presenter key now here
32:25
connect very simple okay this how we have URL works
32:30
very simple these are the these are the process you must understand before you are driving to the Laravel okay these
32:37
are the process you have must understand okay when you study laral this is a very must if you if you assume know this all
32:44
the things you you you cannot clarate this not this every framework you have to study from the scratch then only you
32:51
will be able to catch the languages otherwise you won't be able to catch the language anyway this is very important
32:56
stuff thanks for watching hi friends welcome to funny
33:02
channel in our last video in Laravel we have stopping here okay so we have a
33:08
different pages we have created about page uh contact page and everything we
33:14
have shown okay now we have to going to implement the bootstrap into our project
33:20
so how to implement the bootstrap you have to go to the respective website bootstrap uh I I not connected the
33:28
internet so that's why you go to the respective website of push
33:36
tab so you have to copy these two things this is uh this is for your CSS this is
33:42
for JavaScript both files are needed some other some some guys are copying only bootstrap only why why this uh JS
33:52
JS is also must because you cannot get the response without JS okay the JSON
33:59
you have click on this put inside the head tag of
34:07
uh this welcome plate okay okay welcome plate this is it
34:14
the same thing I'm going to go to uh sorry I'm going to put this one is a layout file the layout file all the
34:20
things that we are doing layout okay the layout sorry the welcome page we are not doing the welcome page you have to we
34:27
don't need we have a put into this layout this is layout file the layout file we have a this is your content i
34:36
already discussed about this in our last class this is contain each and every pages header and uh footer same as it is
34:44
only the content would be changed every pages so so what I'm going to do is
34:49
header what I'm going to header what I'm going to you can see here I'm going to go to
34:56
uh here I'm going to join I'm going to put it to tag open and tag
35:05
closed now here we are going to do class write a class view class I've got new
35:11
class okay here I'm going to write
35:28
container okay plus contain you put one container so this is a container you
35:34
write a container so you can see Yeah so container so I'm going to go to let's copy this i'm going to go to
35:41
jumbot so jumpon is very famous so how to implement the jump button on your jump
35:50
button uh that
35:56
jumper you can get the jump button uh
36:02
that the documentation guys just look you can that jump
36:08
example so jump on
36:16
jambo
36:21
chambbo jump
36:29
uh bootstrap file so you can click on this but this is the your jump button
36:36
here it's look like this that's the things here I need this kind of things you can see the links
36:43
uh so as a code we have to get the code of that one secondary link here copy this what's
36:49
the code they implemented uh they not this that's a styling they
36:55
implement styling so the code for this code I need let's bring
37:02
this one so jumpon okay so the jumper we have to get
37:07
them from this how the look like the jumper look like so jump one is very
37:12
simple file we have copy this here jumper one example here this look like this jump okay here
37:19
this is jumper i just copy this
37:24
okay paste on it so this how we have do the real world application okay we are
37:31
not typing everything you have just copy paste it but we we having knowledge about HTML and CSS then only we can do
37:38
it okay so here the content is starting here contain is closing here it's a jump you have to write primary text rounded
37:46
jump you have write this one as a you have to give this one as a office uh
37:51
something like student management system
37:58
manage system something library manage
38:13
Save control S to save okay so here we have to something
38:18
you have to like uh type it like that okay now let's save all this one is a
38:23
layout okay the layout now let's bring back to the application and check what the application look
38:32
like something's come okay see it is coming here all if you are write some
38:38
description about this about the library it's coming this is called as a uh which
38:45
one this jump okay if you are not using the container you can see what happen
38:50
without container control save it coming entire page
38:56
without okay but this is not efficient way that normally we are doing like this
39:02
way okay this is a things that is container implement the container you have make it as this also
39:09
we have put it put put inside the container so uh now you have a idea so this one also you have put the do
39:18
class
39:29
right this also you paste it as a content
39:34
Control S to save this one all things you have to save all then back to the application and check it here it's come
39:42
about us okay now you have a good clear idea so how the things working okay very simple
39:50
okay so you can see that we have a contact us page so contact us page i'm
39:55
going to go to here uh you can get both W3 school and we have to get the codes
40:02
for here as well so I'm going to go to here contact uh form your type
40:07
form your here this everything is there okay sometime you have a contact
40:14
form sometimes the contact form is there no only forms are
40:19
there for the form you just copy this form and put
40:27
into your code and you can change the coding okay this is a form you Just copy
40:33
the code click on back to the application and here just go to your contact blade.php your
40:45
P select this
40:54
one okay you have sect this one first name name
41:00
uh you have this email is there so you have to write email uh we note the
41:05
password instead of the password you have type name here uh I hope you have a
41:12
clear understand uh stand of bootstrap and everything so this is if you understand the bootup you can do with
41:18
this one okay these are all the things okay so if you are Lar if you come to the Laravel the uh HTML CSS you having a
41:25
clear understand you can make the coding stuff this email this email we no need
41:31
this one this thing okay uh name address and another field we have a thing is uh
41:39
phone number okay just copy this and we have this one tell type is
41:44
tell okay both of the type is tell uh no need of this things we have this one as
41:50
phone number okay that's it okay that's the
41:57
things okay this ID is a email this is the email yeah this one should be the ID so
42:03
you have to make it this one as a name we don't don't we don't have a
42:10
attribute which is a name this one should be we have id
42:17
email okay here also we attribute you write a name which is a name event this
42:24
is the attribute you write is a phone on this also the name
42:33
as you have a clear idea to write this one how to write this all things you have a clear idea then only you can make
42:39
the program okay so let's save all bring back to the application and check it what happened
42:48
uh what happen so let's first fix contact us here we have a simple
42:58
contact okay this how we have make our program simple way okay this how we have
43:03
make our program so the contact form is will be Here we have did the contact us contact us form the contactctors form
43:10
you can now you can adjust yourself okay this container here we have write another uh put another container here
43:16
put you here write this like this here you have put another container you have to write here this
43:24
call MD medium uh we need only you feel you want
43:31
only five okay so that it it the size should be reduced we don't need this that same
43:38
just this how we for we don't need this one here simply have to reduce the size
43:44
okay everything we can do it okay everything shall we put this form into
43:49
the align as a center screen so it is possible so we have to write it over
43:55
here we have to write this one the flex we have to implement the flags we have
44:01
to implement the flags you have to write calls call and we have to implement this flags as well flags D flags justify
44:08
containers contain center mean it alignment as center screen you can check it this one
44:14
uh here this one uh okay it's alignment as here this one we are final but by
44:20
this one we we have put like this it is we have get rid of uh class we have put this one there
44:29
let's save all and bring back the application check Now okay it's center screen it's coming
44:34
as a center screen okay so here I'm going to make this one as a
44:40
uh this one you have to Okay this is enough this you have to the size is if
44:46
you feel it is too much small here also you can make this one application
44:53
uh you have to call 8
44:59
like this control S to save and let's check so it is align this make it the
45:05
align also here now what I'm going to here simply you have to wait here align
45:10
we have to put it like this if container we have to do second part we have put it
45:16
over here here also we have to write it as
45:21
called empty 7 this we have make the sum
45:32
Okay now here it's working okay so here first you have to understand how to if
45:38
you want to get this one as center screen you have you having a you have to must understand this all things you just
45:43
copy this and paste it over here this also you make it as center screen here
45:50
also okay how to make the center screen of there are many student asking how to make the center screen you have to make
45:57
it as D flags justify content this is how the in boot you have to make it as center D flags okay and content center
46:06
okay that's how we have make it i hope you guys understood the things well thank you for watching hi friends welcome to Tunnic
46:14
channel let me continue our laral along with the react tutorial step by step in
46:20
our last video we have completed the uh part of header section so we have to
46:26
make the links we have to implement the links so how to implement the links
46:32
so we have to go to that layout page this is the layout page we have to link
46:38
is must in our last video we have when you type about us we have to go to the
46:43
respective page you have to type contact go to the respective page so here here
46:49
we have to make the links for each pages so for when you easily click it instead of going like this way this is not a
46:55
good way so how to make it the thing is it's simple so let's go to your layout
47:01
page this is a layout page layout page it is nothing but a template so this template is not changed each and every
47:08
pages this template is resided okay the uh the middle of the container should be
47:13
changed each and every pages as you visit okay so here we have to make it as
47:19
uh we have type
47:24
HRF HRF you have to write a
47:31
URL you write a
47:41
URL you have to in our whatever you have type it forward slash forward
47:47
slash after that close it closes
47:53
flash okay you have to forward slash and close it this we have make the URL in
48:01
lar okay so here we have to type home you have to close with the HR
48:10
tag a tag you have to implement this one as
48:18
a
48:25
class btn btn
48:32
warning the same thing you have just copy and paste it okay this one should be about
48:44
us about about let's go to the copy this and
48:50
contact us uh we have to make this one as the
48:58
button styling this a class this is a bootstrap we had already implemented you can go to the
49:04
bootstrap button you just type bootstrap five button you can have a style here
49:09
whatever style you are getting here only you have to implemented this class primary mean this primary secondary
49:16
success danger everything you have to get like
49:24
this okay you can get it like this okay so that's how we have implemented over
49:29
here class btn warning or the second one is a uh warning second one is we have to
49:35
write as primary so primary you type as primary this contact
49:43
us okay you have to make the style okay when you type the URL/about
49:48
us go to that particular page if a contact goes to the contact us page okay
49:54
it's a contact page that's that's the we have we have driving the URLs so this is
50:01
not we are using that let's check it how the process is working yeah it's coming
50:07
here it's coming it's not we have we have we didn't identify this one we have to make this one see uh you have to
50:14
write this one as a danger different URL we have to write different URL you go through the styles
50:20
whatever style you have to put this one secondary you have put secondary or info you can secondary is good the secondary
50:28
now let's I have to make three different button styles button
50:35
colors here it's three different colors okay there this one color so here if you
50:40
click on this home it's home if you click on about us but it's not got the
50:46
about not working so when you are here you can go to that link particular link
50:52
we are click about us it's also the this URL this URL not it because this one
50:58
match with this route it's coming about us like this okay so you have to make this one here
51:05
as about us if the URL is matching it's go to that particular URL so it's coming about
51:12
us about us about us is okay not about okay you say about us when you click
51:19
this one it goes the about us URL It is about us of the routes which is taking
51:24
about us url we have write it as a return view here return view about okay
51:30
type return view about here contact if URL is coming contact it's your return
51:36
view contact it's called the return view contact you have return view contact
51:42
return view about okay you don't type the blade this is the extension lar
51:48
extension don't type the extension you have keep only the about name only it works it's properly works now let's save
51:55
all and bring back to the application and check it here it's a simple website it's here about context so if you want
52:03
to put something else the dummy text of about dummy
52:09
text I'm going to put some dummy text onto now you have a clear idea so
52:17
how the process work I just copy this copy here go to the about page this is
52:23
section okay so you have to put down paragraph inside the paragraph you have to paragraph inside the paragraph I'm
52:30
going to paste on it to save this one
52:37
let's go here this a context about us here there is a paragraph now we have
52:43
clear idea how the process work so home so home also we have to the home
52:50
So homepage so here home page also we have so home page so home page so home page so home home page also
52:57
we have didn't add anything else over here so home page also we have this one
53:02
also we have to get rid of this homepage instead of that we have to write it over here uh this one
53:08
about so all the things copied welcome page also put it here l layout layout
53:14
here also you write a for at
53:20
home welcome
53:29
to Sikma M tools some other company name i
53:36
just type whatever uh name come into your mind i just put it for the example
53:42
likes post it here now let's say check say type it here it's gone to the
53:48
homepage click on about successfully go to the uh contact us we go to the home
53:54
now the link has been working successfully okay the links are working successfully we expect the simple
54:02
website we have made it the okay very simple website you have to make it the I
54:07
hope you guys you understood so far clear okay we have so far you clear understand about the linking part this
54:14
is this linking part is very important stuff okay you must we are familiar with
54:19
this one before you are driving to the controller section if you if you study this well now then only you will go into
54:26
the controller part okay thank you for watching hi friends welcome to tutors for channel so far we cover about the
54:33
basics part uh from today onwards we are going to
54:39
cover about the control okay control is a standard one
54:46
okay control is a part where manage the entire project which is controlled by
54:51
the entire project it's called as control how the control look like this this way this how the control look like
54:57
okay so you can see the controller is decided on inside the app folder this app
55:03
folder so the app folder There's HTTP inside the HTTP there's a this is the
55:08
Larl folder architecture you already know what is the folder architecture of Lar there's a folder inside that folder
55:15
http there is a controller inside the controller folder there is a file
55:20
controller control file all the controller files are managed inside this folder controller folder this controller
55:26
folder has this simple class this class controller name it's controller okay
55:33
this is a controller controller this class extend the controller class okay this controller class we have a public
55:40
uh public function index okay we have create a function this return to the method okay so in our last class we
55:48
directly we have called the routes routes and we have to redirect redirect to the page now we are not doing like
55:55
that way we have to sending to the controller route is a part which can sending the control controller is the
56:02
part where which will be manage the all the URLs okay now you can see the class welcome
56:09
controller okay so when the request is coming it's it is saying to the index method what is return in the index
56:16
method it return the view okay this is the architecture of simple controller
56:21
control is which is a class this class has one function which means in index
56:26
function index function what you have written is return view okay what is what you have written
56:33
in this inside this function it is react as what you inside that function it is
56:38
react it react what you are written inside a function okay now let's moving
56:44
to the now what you're going to this is
56:49
your folder okay this is a folder we have a app inside the folder the controller this is the controller now
56:55
what you're going to do is I'm going to go to create a new controller so you have to click on this part plus symbol
57:01
this already your project is running on okay so the running instead of stopping
57:06
the project you have to open up another terminal window you open the terminal window here
57:11
this is running a terminal window click on this here you can manage the tabs look like
57:17
this okay now simply how to create the controller you don't think about simply
57:22
you type on Google control this is L project
57:30
now click on this this is the
57:35
controller this everything they explain how to create the this is this how they have create the controller FL this how
57:42
we have create the you have to implement the controller you can see the implement the controller this how we have do the
57:49
managing the path okay so you have create the manage part okay so you have t okay so what I did I'm going to do the
57:56
thing is so first I'm going to go to do the things which I put in the
58:01
documentation so what I do here is first I'm going to go to create a controller
58:06
so how to create the controller you have to copy this this command if you copy and paste it otherwise you can click the
58:12
clipboard go here right click and I'm going to create the control which
58:18
is you have to create the control based on our project the user controls default they are giving the name you have to
58:25
create the control based on our name what is the control we have created we have a uh various pages okay so that we
58:32
have created various pages so we have to create the about contacts etc so I about
58:39
control press enter key again I'm going to get another
58:45
control contact okay you have to get the coding
58:51
okay percentage okay now you can see that controller the two different controllers
58:57
has been created about controller and fine now you have created a
59:03
controller fine click on this is the controller loop
59:09
inside the controller you can see the about controller extend the controller class this control class this control
59:14
class is extended okay so what I going to do is now I'm going to implement that
59:21
how the return is working so we have to make this one how they using this models
59:27
we have called about later on so the controller so we are the name this is already there they implemented the view
59:34
this this is it reside on the eliminate view this one copy I paste on it over
59:40
here okay so that when you return the view this this one we have to call it
59:45
that's how they are implemented in lar okay uh use eliminate view web view okay
59:50
after that what I'm going to do this so that second one separate function this function I just copied and post paste on
59:58
it over here instead of writing so the documentation is there you just copy and
1:00:03
first this one need not blank this the name all the things so then this all things we have to get rid of this here
1:00:09
what is the name we have a index function you just put the index function as you saw keep view this later standard
1:00:16
so return to the view which I have to return these all things we have to get rid of this okay so return the view as the
1:00:24
document sh so the welcome
1:00:30
to welcome in DC so welcome just keep the name on
1:00:37
welcome when the request is coming okay so that we have to understand the flow so here this flow when the request is
1:00:44
coming / what happen is we have to go to the which one this one we have write and
1:00:50
go below we have take the documentation here this documentation here this one this copy paste on it over here when the
1:00:58
radio you can just see when the C dates slash which controller you have to
1:01:03
go you go which controller uh I haven't give the name of that controller so you
1:01:09
have to write again I'm going to create a controller which is a welcome controller welcome
1:01:16
controller yes welcome so this not the welcome controller I just cut this code
1:01:24
paste on it in welcome controller so that After that the second one this one this one also just copy it
1:01:31
and paste on it okay so that welcome so
1:01:36
what to do that routes we are telling that when the when the request come slash it goes to
1:01:43
the welcome instead of driving like this we have to we have to write like this so
1:01:49
we have what I'm going to erase here this one this function all things are we just get rid of this okay we don't need
1:01:55
them at the moment we only do the thing is like this way it goes to when the
1:02:00
request is coming slash inside the back we have to call this controller welcome controller right click and rename Ctrl C
1:02:08
to copy and paste on it over here dot
1:02:15
class so you write the thing is
1:02:21
index okay that's it index index index okay so we have a when the
1:02:30
request is coming slash it's call the welcome controller index action method first we have a tell them when the
1:02:37
request is coming slash it's called the welcome controller index action method so we have tell them where your welcome
1:02:44
controller resided so again you have go to the documentation this is the first one just copy
1:02:50
it past it over here copy this welcome you and paste on it here your welcome
1:02:57
beside inside the app folder http controller your welcome that's
1:03:02
it okay now this one we don't need them now let's check on it whether it's working fine or not save
1:03:10
all bring back to the application and check on it whether it's working fine or not when the test is coming slash it's
1:03:17
working it's okay when the is slash is called the welcome Welcome
1:03:24
controller index action method so we go to the welcome controller it's a welcome
1:03:29
controller index action method what we have written here go to that particular page okay the same thing we have do the
1:03:36
same thing you just copy this past about alo also well here this
1:03:41
one should be the write about controller okay so about
1:03:49
page okay the same thing here contact also a contact
1:03:57
controller the contact controller contact action method is called the contact
1:04:03
page this one match with this this this same name the contact it should be match
1:04:09
with this about should match with the same about that's it now let's go to the
1:04:16
routes and check it back again when the request is coming about
1:04:22
us okay so about us so about us let's go to the about page instead of
1:04:29
that you have to write down what is this you have to this first one you have to give the path ctrl C copy control V to
1:04:34
paste over here this one about
1:04:40
controller this contact control okay after that we are the request about
1:04:47
return to this page let
1:04:56
go that's this one so the about controller again we have to go to
1:05:14
here copy this paste on it over here this one should be the contact controller this is
1:05:21
the about action method this is the contact action i simply I show you the example
1:05:29
very simple to implement the example of this table now it goes to when the slash
1:05:37
is coming it goes to here okay when the slash is
1:05:44
coming contact/ contact it's called the contact controller contact action method contact controller contact action what
1:05:50
you have written here it's a return view contact mean it's got the return view contact it open this one when the return
1:05:57
is coming the about it go to the return that about it return the
1:06:02
about let's save all everything now return back to the application and check
1:06:08
let's refresh it about it's working contact it's working here what's the
1:06:15
problem is any problem it will be showing the problem with this uh contact
1:06:20
controller contact return must be type of what what what the problem
1:06:29
contact let's go back what's the problem the problem what happen is here
1:06:36
the view this one we not call it here the view okay so Let's the view we have
1:06:41
to get rid of this it's working or not let's check sometime it's work without that view that call we are not
1:06:49
calling it's working without that one also this working okay then
1:06:56
lar you tell them to the view part you tell them to implement this one this
1:07:01
view just copy it put it over here about also this put it here this is
1:07:08
the they are mentioned the standard That is the way okay without this we also
1:07:14
that tell them this is standard to do it so that we have put it here okay now
1:07:20
it's working okay every time you go to the
1:07:25
documentation this is official documentation they are released but they telling that official documentation that
1:07:31
is the things we have do the program efficient way okay rather than go to the
1:07:36
tutorials we have to go to the documentation web okay thank you for
1:07:42
watching hi friends welcome to Tony channel in our last task we have
1:07:47
completed this pages if you click about us page it goes to the about us click
1:07:52
contact us it goes to the contact us page so all things we have done using the controller part how the how to
1:07:59
manage the controller okay so we have discussed about in our last class okay
1:08:04
how to make the controller and uh we have to manage the respective URL
1:08:12
okay let's continue today video of database configuration part that is very
1:08:17
important part of that one that uh database configuration part that is very important part so let's do it okay so
1:08:25
first what you going to do is so I'm going to uh do the thing is first I'm going to go
1:08:32
to type larl 12
1:08:39
dB everything is there you Let's pack this one keep calculation click on
1:08:45
this so there here there are there what are the database you have
1:08:53
uh this these are the database we have connected connected into our L so Marina
1:08:59
DB MySQL postgsq SQL light SQL server there are plenty of databases are
1:09:04
available the based on the database how to connect they implement that connection as well here this is called
1:09:12
SQLite okay instead of SQLite you can implement the SQL or MySQL okay so the
1:09:18
connection you are this all the things they implement here you can see here okay you can see this how we have
1:09:24
connected to that things okay this is how here how the how we work with the
1:09:29
how you uh write the queries to get the data everything is there here this is
1:09:36
the row SQL you can write the row SQL mean you can write the
1:09:42
uh SQL quirks inside this you can put DB select and everything okay there are
1:09:49
many uh things they are implemented okay so here you can see refer things here
1:09:55
you go along this doc you can gain many knowledges of this okay you can go along
1:10:01
with this dog you can gain many knowledges okay so that is not a problem so it's it's very simple
1:10:10
now what you're going to do is I'm going to go to the model part uh I'm going to
1:10:15
go to that database configuration here there is a tab which is called as we already have discussed
1:10:21
this one so I again I'm going to tell about this one there is a env file this
1:10:27
env file I already discussed when you start this sub program okay this is the
1:10:33
env file so the env file you can see this is the MySQL the DB connection uh
1:10:38
what is the database you are going to use based on the database you have give it here I'm using MySQL I go
1:10:46
along with MySQL so I'm I set it here as MySQL if you are planning to switch your
1:10:51
database as uh any other one uh it may be a
1:10:57
postglina DB whatever if it is you can give that particular name over here Okay
1:11:03
so this is the port where your MySQL server is running this is the port okay
1:11:08
so this is the database name what's the database you have created on the MySQL that's the database name you have to
1:11:14
mention the database name or the database name you updated so these are the these are things very important
1:11:19
stuff in order to work with our project okay another one is a root usern username and password okay you have to
1:11:26
give the username and password while you installing the ZAM server okay
1:11:32
what is the username and password you are configured okay if you change the
1:11:37
username default username is root password is blank if you have changed the changed username and password you
1:11:44
have to put it over here to configure then only the database is configured okay now this is the one I have come
1:11:50
here like this this already I have discussed about my uh videos okay so the
1:11:56
database I created the DB uh what is the name may my this is my DF
1:12:04
Maya okay so the key tables are created so now what I'm going to do is I'm going to go to create the new table i'm going
1:12:11
to create the new table so the tables already my project is running on i'm going to open up the new power cell
1:12:17
window here click on this the open up the new power here I'm going to create the new migration part so we have to type
1:12:26
simply lar
1:12:34
migration click on this you have to go over here this how
1:12:41
we have migrate the table here so they have to uh this how we have here explain
1:12:46
the step okay this first one okay after that you have to you have to here here we have to configure the your tables
1:12:55
everything okay this how we have migrated table okay so so first we have to run this
1:13:00
command copy this you have to click this clip code copy this php make migration
1:13:06
create this is the this is this is nothing but a table uh creation okay
1:13:13
create here you have to mention your table name over here okay mention the table name it uh it's a defaultly they
1:13:21
they have mentioned flights so the according to our project we have mentioned our table name so in our table
1:13:28
you have create this one simply student okay take example students not student
1:13:33
student so while we creating the table okay you are creating as a plural not
1:13:39
singular you are using the plural that is a must okay plural is must you have
1:13:44
to using the plural okay while you are creating the right so what I'm going to do is here we have
1:13:50
to write just copy and paste it over here migration you have to type here as
1:13:58
students not students students press enter key on your
1:14:06
keyboard you have to wait until the table created okay so that it is created
1:14:12
successfully here they mention where your table is created it created inside
1:14:18
the app folder inside the app folder there is a folder which is uh HTTP this
1:14:23
is app folder http controller sorry uh sorry app it's c sorry it's app it is
1:14:32
a it is created by here not here this is the controlleration go to the database
1:14:39
migration it is created here okay I accidentally I explained wrongly
1:14:47
okay not created over here this is a control control in a migration it's Going to the
1:14:54
database inside the database we have a this is a migration file you can have a
1:14:59
migration file here the same name here create students table the same name here your migration file has been created the
1:15:06
same name your migration has file has been created keep in mind okay while you're creating the uh table you have to
1:15:15
write it as a plural not singular okay that is the rule of Laravel okay that's
1:15:21
the rule of Laravel keep in your mind while you create the table this is
1:15:27
must while you create it okay so now you open that particular file you can see
1:15:33
here this is the standard you can see here this is standard simple file it's a
1:15:38
small file you having a functions but it's a up function it's a down function
1:15:44
okay so drop while you drop the table you have to work with this function while you create the table you have to
1:15:49
work with this function so here you can see this this is a table's name which is students these are the table columns uh
1:15:57
which is ID so rest of the column you go over here don't pick up this columns okay
1:16:03
name copy this this all this name so just copy it paste it on over here table
1:16:09
string name is name table name table string this is the uh this is the this
1:16:16
is the nothing but the data types okay this is the this is the ID
1:16:22
mean ID auto incremented into increment default the larable will be assigned
1:16:27
here you no need you don't worry about it don't worry about that it automatically take care of it okay you
1:16:32
don't have bother about that one that lar this all thing
1:16:39
lar okay the time what is the time you insert the record and at date this all
1:16:45
thing take care of it okay rest of the column what are the columns you have to
1:16:50
put into your project that is the things you have to consider so that consider the column path
1:16:56
name that is must have in your project after that student name right you have
1:17:02
write student name what is another type you have write
1:17:10
string email okay so if you want to put the I I
1:17:17
need a integer how to do it only the string is there so you don't worry about that you have to write it over here uh
1:17:25
here if it is a if you want to if it is not there you just check on it
1:17:31
the okay this all mention it it is all the
1:17:40
strate temporary command here this integer you have to write integer like
1:17:46
everything is there okay integer is there okay you don't worry about that inteious type is there here the boolean
1:17:53
char out everything is there okay text everything if it is a if it is a date
1:17:58
and time how to do it data time there just copy this how that migration everything is there they talk here it's
1:18:05
explain how to how to date and and everything and uh here this everything is there you you don't everything is a
1:18:12
decimal double values how to store the double here is this here it's there so
1:18:18
how to put the double everything double table double amount
1:18:23
everything is Yeah but let's write it over here put it over this one is a sorry
1:18:30
integer so integer I need a
1:18:47
integer this integer copy this paste on it here
1:18:55
four that's it okay if you need any salary you can
1:19:00
uh put it here double so here double also you know now out how you get it you
1:19:06
are getting from over here and paste on you can write a decimal or double okay that is which one
1:19:14
you can both you can you can write it as a double a decim you can write it
1:19:20
okay right that's the thing you have to write it if I done the things what you're doing here is you have now your
1:19:25
table creation is done all things have done it file save all now what happen is
1:19:31
you have to do it here i have to have did uh do it over here what I'm going to
1:19:37
erase here I'm going to put PHP
1:19:44
artis you have to use a command migrate okay before you have to enter
1:19:50
the command you have to make sure file save all you have to save the file okay otherwise if you not save the
1:19:56
file this this this all the columns not updated okay after you are write it you
1:20:02
have to file save or save you have to save it this okay after that press enter
1:20:11
key here you have to get this success message that your table has been successfully done created let's open up
1:20:19
and check whether this all the respective column what you what what are the column name you have created that
1:20:24
column column names uh the stat that's columns exist in your databases or not you have to check it go to the your
1:20:33
database refresh them your table is created
1:20:38
successfully students open on it but at the other
1:20:44
hand we have to create we have to go through that column names column name student name
1:20:51
email okay successfully we have created table names and columns name thank you for watching