All language subtitles for 3. Folder Structure

Hi there, welcome back in the annual lecture in the previous while we have initialized our development

and environment in a desirable to continue with the initialization of our first page and installation

of cable packages.

All right.

Let's start in your coding ED and let's take a look at it.

So that's the files and the folder us that has been generated for us.

The page you see on your screens when you open localhost eight thousand eighty is located in the SRT

folder in the upload view is the main part.

As you can see here, that's how the View file looks like.

View file consists of two three parts.

One part is a template where you can write a HTML and also you can provide your components you will

be creating.

Components are likely usable parts, but we'll be talking about this later.

OK, so a template rewriting your HTML and you can also include your components, then have a script

part.

Is a JavaScript part of your overview?

File the script file.

You can interact with a template.

OK, you can do that in exchange.

Yes, you can access data and you can also provide data into your template.

The style part's self-explanatory.

You are providing the styling.

So can any types of the styles.

Congratulations, says SAS S6's and so on.

OK and a comprehensive listing, your companies, for example, as a hello world, as I told, you can

break down your template into multiple parts and parts of a template can be can be located in the different

files in a different view, files such as Hello World, which content is locked and played here in a

couple of stylings and you can also see here on your screen.

That's your That's a hell.

Hello, hello, world dot view.

OK, they'll be removing the guys, actually.

You'll be creating are older of our space age, so what we're going to do the best way will just simply

remove the components folder will create our own later.

We will have a components folder deleted.

All right, and also our auditorium of upload view and a hell of art from here and from a conference

Hello world here.

Bill to go step by step and also this important hello world here.

Many will go now to ablative, you should see only this image of your local beaches located in the Assets

Folder and assets folder you can find here, and that's the logo that will be displayed.

It's now go here and look and see if we can see only local.

And if you are also going to delete this.

OK, so let's read also the logo.

And now you have just an empty template and it cannot.

You can't you cannot provide empty templates or just provide you some tax, for example, empty.

And now you will have completely empty page.

When you go back here, it's completely empty.

OK, now let's take a look on the folders and the files we have available here also raised me and the

other listing all of the useful comments how to run your project, what you need to do to set up the

project.

Becky Dodgson, police think all the dependencies that your project, depending on.

So these dependencies and also developmental dependencies also there's always such excellent configuration

as little as controlling the syntax of your JavaScript or of your view to your writing and will notify

you if something is not according to some conventions.

Although I conventions are defined here, so we are following that view three essential conventions

and the recommended link conventions.

OK, I'll be also changing it later because there are some rules they would like to override.

OK, so it's a package or Jason.

Most important here is that is listing dependencies that they need to install.

These dependencies are installed, then you are adding npm, install a command.

OK, so if somebody's able to get out a project with the empty node modules because the node modules

is if it's a folder that all the dependencies are located.

So if somebody's able to get an empty project and it would at least npm install a command like this,

this would install all of these dependencies.

Here, and it would place them into not modules.

Also, as you can see here, there is a script so we can run the Iran first one and PM Iran Syria,

which is running this script here, but you fill out a local server.

OK, then we have here a package should that look to chase on a DVD as a more detailed file of our dependencies.

So also dependencies that are that are listed on a package of JSON dependencies.

But this dependence is also dependent on their own dependencies and therefore three other dependencies

is here.

So you can see here the full three of dependencies that is that are installed in your note modules and

also they are veterans from each repository they are downloaded and so on.

OK, so that was located in a package that looked like Jason.

Then we have here, Babe Bella, that gothic dodgers, that's basically this allows you to write Voges

file of view files and you can read the U.S. tax, which is basically the thing that's working as a

code that's compiling your view code into the JavaScript that can be around in your browser, right?

Because.

Sorry, this is not a part of this lecture, but.

The right thing is the view view called.

OK.

It's a view.

OK.

That's the files you can see here, upload for you, but your browser by naval ship files a like this

into your browser.

This will simply not recognize it.

So what's happening in the background to the viewer is going into the parts into the HTML.

OK, so that's what enter into HTML, into the JavaScript and see us and so on.

And this is served into your browser.

OK.

And the Bible provides all the settings required to get this file into parts of the small JavaScript

and CSS.

All right.

And that's this we don't know much about it, we are just using this one UCLA plug in Babel preset.

Of course, you need to apply to all also different settings, depending how you want to break the record,

but we are going to default ones.

Get ignored.

Just ignoring what files and folders will be not included in the repository, if you will decide to

push your code into GitHub.

OK, and that that's it, basically, we have only public folder listing the static files of the favicon

and index the index HTML, which serves as the initial template in which the code I mentioned here the

HTML JavaScript and see if this is mounted to the initial HTML image here into this if your application

is mounted to.

OK, if you only questions you can ask them right now, I think I will finish it up here and we'll continue

in the next lecture.

So just keep in mind important parts here to take it.

Take from it is just the recreating creating the view files.

View files consists of three parts, which is a template, something like a view script, but realistically

original script.

That's the dynamic part and the interactions between the template and the data through transformations

and the style is that just as stylings of your view, you writing in a template that's going to in needed

lecture in the next paper are first page.

So I hope to see you there, guys use.