laravel 8 livewire tutorial #1 installation

hi everyone welcome back to the my blog my name is Viseth and in this live

Bible tutorial we will see how we can install it so these are some points that

we are going to cover in this blog so first of all we will install a new

laravel project why I will install the new Laravel Project because without the laravel we can not use livewire alright so after that we will include the livewire

package inside the laravel project then we have to define the style and the

JavaScript with the laravel like so there is a simple tag for that and I am

NOT going to work with a style and just in this video but still I will show you

that how we can use them and after that we will make a component for the livewire and we will just add that livewire inside the play template and wewill see the out so now let’s open thecommand line and Here I am just going to

jump on a dashboard and let’s make a

folder mkdir livewire cute like this and

just go inside it and here let’s just

make a new project through the laravel

laravel noon and project name so let’s

say my project name is broke and hit

enter so in this video I did not tell

you about composer because if I am just

going to include that composer also that

video will gonna take a long time so if

you just want to watch the composer then

link is given in the description box so

here you can see that of a large project

installed and let’s jump inside the

folder and just run your npm this is not

anything hprt said sir alright and we

can just open this pod on a browser

right just one here

and you can see that we are able to see

a basic output here so now let’s open

this to check inside the browser like

this one all right and here you can see

that we have a complete structure of the

laravel so this is completely determined

there is no doubt and now what is that

I’ll just open this one that’s okay and

now let’s install the plugin for the

libraries right here composer and

required and after that live well / like

nice wire / like wire like and just hit

the enter and this package will take a

little bit time so I am just going to

put this video video on a post so that

we can save the video length yeah

package the package is installed now now

let’s check inside the composer go Jason

package and here you will find that

laravel one version is installed here

perfect so now what I’m going to do I am

just jumping on the resource folder and

welcome and welcome dot blade PHP so I

am just making just make me copy of this

file for a moment and Here I am just

going to clean it so when I am just

going to clean it you will find nothing

here this place is totally blank and

just right here or small HTML template

like

right and we can just change the title

also livewire dog or something

perfect so now let’s see that how we get

include the style and JavaScript with

the live prayer this is not a normal

style this is actually here you can see

that we have just a small piece of HTML

code here all right and yeah I’m talking

about the style and the JavaScript they

are note that jQuery and bootstrap and

all so this is a special style this is

which is work with the live web

framework in the background alright so

we are not going to interact with

JavaScript and styling directly but yes

live where framework will be interacted

in the background and I will show you

how so here I am just going to define

the style pseudoscrew this here

live wire styles all right here let’s

refresh it and you will find that this

type is defined here with a similar way

you can also define script also just

right here script like this and now you

will find that live a script is also

injected here perfect and these style

will help to make this page single-phase

application great so after that now

let’s make a component so for that just

come online and just simply write here

HP artisan make live wire live wire and

in component name so let’s say my

component can be a counter and just hit

the enter and it will ask that you just

want to starting with that repository

for a moment I am just telling it no I

don’t need and it will just created the

two files with a folder you will see

once inside the view which is the

counter blade dot PHP all right there is

nothing for a moment but

okay and now let’s go inside the app

HTTP and you will also find there is of

one more a folder with a live web and

being a counter here right and this

counter is loading the live bear counter

and this is basically the view part here

you can see that right it is just going

to load this page so what I am just

going to write here so let’s add some h1

tag or something like hello from live

wire counter perfect now how can I just

show this screen as an output for that

let’s come in the blade load welcome to

Plato to PHP here and you can just

simply write here it that it live where

decade counter and now let’s check out

the output out you can see that V codes

output here so you can see that just

remove it and you will see we already

have the electorate that JavaScript and

style so if I am just going to refresh

it then you will find there is a lots of

code here and the h1 tag is also

included

alright so this is the way that how we

can start with the working with the live

where in the laravel how we can install

it and how we can make a first component

also alright so in the next video we

will learn more things so thanks for

watching this video don’t forget to

subscribe my channel and again please

please please subscribe my channel and

like this video if I have any kind of

views then please put in the comment box

bye bye it clear