Original subtitles

1 1

So let's now write 2

2

our very first line of JavaScript code. 3

3

And for now we will do that in the browser developer tools. 4

4

So just to get started as quick as possible. 5

5

We will then switch to the code editor 6

6

that we just installed before in the next video. 7

7

So make sure to open up Google Chrome, 8

8

and then there are three ways 9

9

in which we can open up the Chrome developer tools. 10

10

First, we can hit command option J on the keyboard. 11

11

And that's on Mac. 12

12

So on Windows, that's gonna be ctrl+alt+J. 13

13

And so this will then open up this console that we see here. 14

14

So all of these tabs here are basically the developer tools. 15

15

but we are just interested in the console, okay? 16

16

Now another way of opening the developer tools 17

17

is by right clicking and then inspect, 18

18

which will bring us here to the elements tab, 19

19

and then from there we can go to the console. 20

20

And the third way, 21

21

and I'm showing you all of them, 22

22

because I know that are different people 23

23

like to do it in different ways. 24

24

So the third way is to come here to the Chrome menu, 25

25

and then in there we go to view, developer 26

26

and then JavaScript console, okay? 27

27

And so we're back to the JavaScript console. 28

28

And I'm increasing to font here a little bit 29

29

by hitting command plus, 30

30

and give it some more space. 31

31

Now this JavaScript developer console 32

32

allows us to write and test JavaScript code. 33

33

So it's very useful during development, 34

34

for example, to fix errors. 35

35

Now we don't write real applications, of course, 36

36

using this console. 37

37

But now just to get started, 38

38

let's use the console because it's a good and easy way 39

39

to just write some JavaScript here. 40

40

So let's write alert, 41

41

which is a so-called JavaScript function, 42

42

then open up parenthesis 43

43

and without a space between alert and the parenthesis, 44

44

and then we write a so-called string. 45

45

So which is basically text, 46

46

and let's write "Hello world." 47

47

So that's the standard way 48

48

of learning programming in any programming language. 49

49

Then, we write the closing parenthesis 50

50

and then let's hit return, or enter. 51

51

And you'll see, 52

52

that JavaScript gave us this popup window here 53

53

which has "Hello world" just as we typed here 54

54

in our string, in our code. 55

55

Great, so that's your very first line 56

56

of JavaScript code right there. 57

57

So any code that we write here and then hit return 58

58

will immediately get evaluated. 59

59

Okay, but of course we can do a lot more. 60

60

So let's write some more JavaScript code, 61

61

which of course you do not need to understand yet. 62

62

I just wanted to show some stuff that we can do. 63

63

We will go into how everything works 64

64

as we progress through this section, okay? 65

65

So just to experiment a little bit, 66

66

let's write a so-called variable. 67

67

So let's say let JS equals, amazing. 68

68

And so once more, we are basically writing a string here, 69

69

so a text, 70

70

and then we will do if 71

71

and open parenthesis, JS, 72

72

is equal to amazing, 73

73

then we want an alert window like we saw before 74

74

saying JavaScript 75

75

is fun. 76

76

And if I hit, now return 77

77

we get this window which says 78

78

JavaScript is fun, okay? 79

79

So again, I will explain all these concepts 80

80

and how all of this works here as we go through the section. 81

81

But for now I hope that you can see the logic 82

82

that we basically defined JS as being amazing. 83

83

And then here in the next line, 84

84

we said that if JS is equal to amazing, 85

85

then JavaScript should show us this alert window 86

86

with this text, okay? 87

87

And now we can also change JS to, boring, 88

88

hit return again. 89

89

And now let's copy this text here again. 90

90

So we want to run it again. 91

91

So I'm just copying it and pasting it here, okay? 92

92

So let's try that again. 93

93

And this time nothing happened. 94

94

And so that's because JS is now no longer amazing. 95

95

It is boring. 96

96

And so, in this case, 97

97

if JavaScript is amazing is not actually true, right? 98

98

Because it's boring now. 99

99

And so in this case, the alert window is not shown. 100

100

Now, there's also another way 101

101

of going to the previous command, 102

102

which is by hitting the up arrow on the keyboard. 103

103

So just like this. 104

104

And so we can see all the previous commands 105

105

that we used before. 106

106

Great. 107

107

Now another thing that we can do 108

108

is to do simple math operations. 109

109

Let's say just 40, plus eight, plus 23, minus 10, let's say. 110

110

Hit return, 111

111

and then here we get the result. 112

112

So basically we can use this as a calculator. 113

113

And I hope that you can see how useful 114

114

this is gonna become later down the road. 115

115

Okay, and that's it for now. 116

116

So I hope that this gave you a nice first taste 117

117

of the language and of everything that is ahead. 118

118

So if you want, 119

119

you can experiment a little bit more with this, 120

120

or you can move on right to the next lecture 121

121

where we will learn what JavaScript actually is. 122

122

So, see you there.