Original subtitles

0 Now which editor will I use then? I will use Visual Studio Code (VS Code)! 1

You can get it from code.visualstudio.com. 2

It's a free IDE which also has an extension that provides awesome Flutter support. 3

You can download it from that page and it will automatically give you the right version for your operating 4

system and you can simply walk through the installer. 5

It's pretty straightforward. 6

Nothing special about it. 7

Simply install the IDE on your machine. 8

Now once it did install it in your favorite location, you can start it and in the IDE, you can then click 9

"Open Folder" or choose the "Open" option from the "File" menu in the top left corner and simply choose that 10

"first_app" folder you created. 11

Now this is your Flutter app. 12

And in order to be able to work with that really well, we should add a so-called extension. 13

So a plugin we can add to that IDE to add extra functionalities. 14

You can install extensions by clicking on this icon on the left or selecting "View" => "Extensions" in the 15

menu at the top and there simply search for "Flutter". Install that extension you find here. 16

It's the official Flutter extension and it will also install the "Dart" extension together with it because 17

that will be a dependency. 18

And once it is installed you just need to restart the IDE to have that installed. 19

Now I will use one extra extension for the course - and that's the "Material Icon" theme. That is not (!) related 20

to Flutter development, 21

I just like the Icon look I get with it, 22

it's totally optional - 23

I just want to show it here so that you don't wonder why my icons look different than the default 24

icons. 25

Once you install that - if you want it - you again can reload the IDE. And, with that, we can finally make a 26

change to our Flutter code after I activate the new theme. 27

You can see your Flutter code in the "lib" folder of the project you opened. 28

And they're in "main.dart" 29

file, you see the code which is responsible for the app which is currently running on the emulator 30

there. 31

Search the "_incrementCounter" method and in setState: Change 32

"_counter++" to "_counter =_counter + 2". 33

This should ensure that we actually increase the counter by two every time we hit the "plus" - not by one anymore. 34

With that change made: Go back to the command prompt and make sure that the "flutter run" process is still 35

running - don't quit it! 36

You could quit it with "CTRL + C" (or by typing "quit"). 37

But as long as you are developing, you should keep it running because then you can hit "r" with that process 38

running to hot reload your app, which means the changes you added are pushed into the app without the 39

need for it to rebuild. 40

Now sometimes, this fails. Then you can press "SHIFT-R" to do a full reload and a full rebuild. And you 41

can quit that process with "CTRL + C" if you are done with development for the day. 42

So I pressed "r" and if I go back to my emulator here, you can see that I can now increment by two instead 43

of one. And this is our first little change. 44

We will do much more of course but this is our Windows setup finished! It was quite a lot of work but now 45

we are prepared to continue and dive much deeper into Flutter of course.