All language subtitles for 007 Setting Up A Code Editor_en

Now I did now open this React course folder,

which we created in the last step

with my editor, Visual Studio Code.

Now you can use any code editor you want.

If you have a favorite editor all ready,

you can stick to this.

But you should you as some code editor to have a better time

working with React.

And here I'm using Visual Studio Code,

which is a great free IDE for web development.

It's available for all major platforms.

MacOS, Windows, Linux.

You can simply download it from code.visualstudio.com

and then once you download it and installed it,

simply open your folder that we created

in the last step.

This react course folder.

In my case with Visual Studio Code,

simply with the file open,

or open folder on windows.

Now, once you did that, you should see something like this.

Now you can tweak the settings of Visual Studio Code.

If you want to, if you have a different theme

and you want my theme,

you can go to preferences, color theme.

I'm using the dark plus theme, and it is worth noting that

with Visual Studio Code under, view,

you can tweak the appearance of the editor.

For example, if you have a status bar at the bottom

and things like that, which I disabled here,

and you can go to view extensions,

to install extra third party extensions into

Visual Studio Code, which can add new functionality.

Now I got a bunch of extensions installed,

which you don't need,

but there's one extension which I do recommend.

And that's the Prettier extension.

You can simply search for Prettier here,

and then install that extra extension.

This is an extension that helps with code formatting

and which therefore helps with making

your code more readable with a simple keystroke

For this you then also want to make sure

that under preferences,

keyboard shortcuts, if you search for format document,

you have discharge cut bound

because that format document shortcuts can then

use Prettier to format your code and make it more readable.

For this to ensure that you use Prettier.

You might want to go to your settings

to your user or project specific settings,

and then there's simply searched for format

and under default formatter,

you want to select Prettier vscode,

which should be available since we installed Prettier.

Now that's the set up I'm using here in the end.

And with that, I got an editor configured

for my requirements, which we can now use to dive into

that react project that was created for us

and which we can now use to write some react code.

So let's now as a first step,

clean up this project to get rid of some

of the starting files and then start

from scratch again, to learn, react in depth.