1
00:00:00,000 --> 00:00:01,291
>> DAVID J. MALAN: So we are back.

2
00:00:01,291 --> 00:00:03,050
So the high-level
topic at the moment now

3
00:00:03,050 --> 00:00:06,440
is technology stacks, which isn't
a particularly technical term,

4
00:00:06,440 --> 00:00:09,960
it's more of a catch all for any
number of combinations of technologies

5
00:00:09,960 --> 00:00:11,840
that you might use to solve problems.

6
00:00:11,840 --> 00:00:14,850
And perhaps the most
fitting way to start

7
00:00:14,850 --> 00:00:18,110
would be to look at languages since
I keep rattling off a whole bunch

8
00:00:18,110 --> 00:00:21,000
and most everyone in the room has
probably heard of at least one.

9
00:00:21,000 --> 00:00:25,730
>> And so why don't we try to distinguish
what-- distinguish these languages

10
00:00:25,730 --> 00:00:28,932
and talk briefly about when you would
choose one over the other, how they're

11
00:00:28,932 --> 00:00:30,890
sort of fundamentally
different, and especially

12
00:00:30,890 --> 00:00:34,830
when you're chatting with engineers,
or trying to decide whom to hire,

13
00:00:34,830 --> 00:00:37,652
or what implementation
proposal to greenlight,

14
00:00:37,652 --> 00:00:39,860
how you would actually make
those kinds of decisions.

15
00:00:39,860 --> 00:00:41,890
>> So let's just rattle some things off.

16
00:00:41,890 --> 00:00:45,300
Of the languages people have
heard about, what comes to mind?

17
00:00:45,300 --> 00:00:48,030
C. OK.

18
00:00:48,030 --> 00:00:48,757
OK, C++.

19
00:00:48,757 --> 00:00:51,400

20
00:00:51,400 --> 00:00:51,990
What's that?

21
00:00:51,990 --> 00:00:52,390
>> AUDIENCE: Python.

22
00:00:52,390 --> 00:00:53,348
>> DAVID J. MALAN: Python.

23
00:00:53,348 --> 00:00:55,330
Excellent.

24
00:00:55,330 --> 00:00:57,000
What else?

25
00:00:57,000 --> 00:00:58,810
Visual Basic.

26
00:00:58,810 --> 00:01:01,100
I heard Java.

27
00:01:01,100 --> 00:01:02,610
Visual Basic-- a.k.a.

28
00:01:02,610 --> 00:01:03,150
VB.

29
00:01:03,150 --> 00:01:03,650
Java.

30
00:01:03,650 --> 00:01:07,294

31
00:01:07,294 --> 00:01:12,810
.NET, which is more of a catch all
for what's usually C# as the language

32
00:01:12,810 --> 00:01:13,770
in question.

33
00:01:13,770 --> 00:01:14,770
And let me mention that.

34
00:01:14,770 --> 00:01:15,900
So we'll come back to that.

35
00:01:15,900 --> 00:01:17,560
I'm sorry?

36
00:01:17,560 --> 00:01:18,170
Sorry?

37
00:01:18,170 --> 00:01:19,877
>> AUDIENCE: SQL.

38
00:01:19,877 --> 00:01:20,876
DAVID J. MALAN: Scratch?

39
00:01:20,876 --> 00:01:21,610
AUDIENCE: SQL.

40
00:01:21,610 --> 00:01:22,610
DAVID J. MALAN: Oh, SQL.

41
00:01:22,610 --> 00:01:23,110
OK.

42
00:01:23,110 --> 00:01:23,750
SQL.

43
00:01:23,750 --> 00:01:29,510
So we'll come back to that-- actually,
it's good-- after the break as well.

44
00:01:29,510 --> 00:01:30,572
What else?

45
00:01:30,572 --> 00:01:32,530
>> AUDIENCE: Oracle.

46
00:01:32,530 --> 00:01:34,670
>> DAVID J. MALAN: So
Oracle, not a language.

47
00:01:34,670 --> 00:01:36,560
Actually they would use SQL as well.

48
00:01:36,560 --> 00:01:38,360
So let's put that after
the break as well.

49
00:01:38,360 --> 00:01:39,744
And sorry, something over here?

50
00:01:39,744 --> 00:01:40,660
AUDIENCE: Mathematica.

51
00:01:40,660 --> 00:01:41,390
DAVID J. MALAN: Mathematica?

52
00:01:41,390 --> 00:01:42,303
OK, sure.

53
00:01:42,303 --> 00:01:46,150

54
00:01:46,150 --> 00:01:49,180
And MATLAB is kind of
on there sometimes.

55
00:01:49,180 --> 00:01:50,060
>> AUDIENCE: R.

56
00:01:50,060 --> 00:01:51,755
>> DAVID J. MALAN: R. Let's go over here.

57
00:01:51,755 --> 00:01:54,710

58
00:01:54,710 --> 00:01:55,210
Fortran.

59
00:01:55,210 --> 00:01:55,880
Sure.

60
00:01:55,880 --> 00:01:57,910
Older school.

61
00:01:57,910 --> 00:01:59,390
Fortran.

62
00:01:59,390 --> 00:02:01,550
COBOL.

63
00:02:01,550 --> 00:02:02,410
I'll toss out BASIC.

64
00:02:02,410 --> 00:02:05,990

65
00:02:05,990 --> 00:02:08,539
BASIC.

66
00:02:08,539 --> 00:02:09,390
Any--

67
00:02:09,390 --> 00:02:10,352
>> AUDIENCE: MATLAB?

68
00:02:10,352 --> 00:02:11,310
DAVID J. MALAN: MATLAB.

69
00:02:11,310 --> 00:02:12,248
Oh, beat you to it.

70
00:02:12,248 --> 00:02:15,370

71
00:02:15,370 --> 00:02:15,870
Anything?

72
00:02:15,870 --> 00:02:18,700
I can think of a couple of others.

73
00:02:18,700 --> 00:02:21,876
I can think of a few others.

74
00:02:21,876 --> 00:02:22,792
And what was the last?

75
00:02:22,792 --> 00:02:23,970
>> AUDIENCE: ASP.

76
00:02:23,970 --> 00:02:25,030
>> DAVID J. MALAN: ASP?

77
00:02:25,030 --> 00:02:26,100
Yeah.

78
00:02:26,100 --> 00:02:27,100
Active server pages.

79
00:02:27,100 --> 00:02:30,270
That generally would fall under
other languages, sometimes C#,

80
00:02:30,270 --> 00:02:32,040
so let's leave that off.

81
00:02:32,040 --> 00:02:35,510
But we'll come back to that
for frameworks and such.

82
00:02:35,510 --> 00:02:36,290
Anything else?

83
00:02:36,290 --> 00:02:39,020
PHP is popular.

84
00:02:39,020 --> 00:02:41,710
Ruby is another.

85
00:02:41,710 --> 00:02:48,230
JavaScript, not to be confused
with Java, is another.

86
00:02:48,230 --> 00:02:49,570
That's kind of a lot.

87
00:02:49,570 --> 00:02:53,590
>> So it can be certainly overwhelming,
as if the list isn't already,

88
00:02:53,590 --> 00:02:55,650
just to begin to know where you begin.

89
00:02:55,650 --> 00:02:58,130
And so fortunately, let's
approach this from a few angles.

90
00:02:58,130 --> 00:03:03,520
First, let's try to categorize
at least some of these languages

91
00:03:03,520 --> 00:03:06,790
into two broad buckets, reminiscent of
the conversation we had before break,

92
00:03:06,790 --> 00:03:09,630
where we talked about compiling,
and source code, and machine code,

93
00:03:09,630 --> 00:03:11,440
because that's not how
all languages work.

94
00:03:11,440 --> 00:03:15,640
So we'll pluck out a few examples of--
or counter-examples-- to that model.

95
00:03:15,640 --> 00:03:18,490
>> And then, why don't we
talk about the applications

96
00:03:18,490 --> 00:03:20,390
that these languages
are generally used for.

97
00:03:20,390 --> 00:03:22,840
And frankly, even though
this is a pretty long list,

98
00:03:22,840 --> 00:03:26,320
it's only a subset of this list that
you would typically draw from these days

99
00:03:26,320 --> 00:03:27,220
to solve problems.

100
00:03:27,220 --> 00:03:29,150
Certain languages are newer than others.

101
00:03:29,150 --> 00:03:31,170
Certain languages are
more popular than others.

102
00:03:31,170 --> 00:03:34,370
So it's not like you have such
an overwhelming task before you

103
00:03:34,370 --> 00:03:36,970
when deciding among
these various languages.

104
00:03:36,970 --> 00:03:40,110
>> So let's do this.

105
00:03:40,110 --> 00:03:45,870
We had earlier, source code,
and then we had machine code.

106
00:03:45,870 --> 00:03:48,590

107
00:03:48,590 --> 00:03:49,400
Whoops.

108
00:03:49,400 --> 00:03:50,910
Writing the wrong word.

109
00:03:50,910 --> 00:03:52,740
Machine code.

110
00:03:52,740 --> 00:03:57,549
And we had some process in the
middle called-- yeah, the compiler.

111
00:03:57,549 --> 00:03:58,215
So the compiler.

112
00:03:58,215 --> 00:04:00,760

113
00:04:00,760 --> 00:04:03,910
>> And what the machine code
actually runs on in the end

114
00:04:03,910 --> 00:04:05,680
is going to be your actual CPU.

115
00:04:05,680 --> 00:04:09,660
In other words, by machine code, I
mean the lowest level instructions

116
00:04:09,660 --> 00:04:11,330
that a CPU actually understands.

117
00:04:11,330 --> 00:04:15,100
Addition, subtraction, move,
save, and operations like that.

118
00:04:15,100 --> 00:04:19,700
And so this is the model for what's
generally known as compiled languages.

119
00:04:19,700 --> 00:04:21,000
Perhaps not surprisingly.

120
00:04:21,000 --> 00:04:23,550
>> So this is the model
for compiled languages.

121
00:04:23,550 --> 00:04:25,970
But it turns out there's
another class of languages

122
00:04:25,970 --> 00:04:32,650
called interpreted languages--
interpreted languages--

123
00:04:32,650 --> 00:04:34,030
that are slightly different.

124
00:04:34,030 --> 00:04:41,660
You write in source code, run
them through an interpreter,

125
00:04:41,660 --> 00:04:45,440
and that interpreter is
what runs on the CPU.

126
00:04:45,440 --> 00:04:50,120
In other words, what you don't
emit is what, apparently?

127
00:04:50,120 --> 00:04:50,980
Machine code.

128
00:04:50,980 --> 00:04:54,290
The zeros and ones that the CPU
itself ultimately understands.

129
00:04:54,290 --> 00:04:59,780
>> So in this first version and
languages like C, like we saw,

130
00:04:59,780 --> 00:05:02,040
you write in source code
that's a little arcane,

131
00:05:02,040 --> 00:05:05,300
but at least it's kind of English-like
and it's at least readable

132
00:05:05,300 --> 00:05:06,780
once you get used to it.

133
00:05:06,780 --> 00:05:10,100
You run it through a compiler and out
you get, ultimately, zeros and ones.

134
00:05:10,100 --> 00:05:11,340
>> That an oversimplification.

135
00:05:11,340 --> 00:05:12,839
There are some other steps in there.

136
00:05:12,839 --> 00:05:15,530
In fact, if you've ever heard
the term "assembly language,"

137
00:05:15,530 --> 00:05:17,990
that's one step before
the zeros and ones.

138
00:05:17,990 --> 00:05:20,949
That a little more readable,
but still pretty arcane.

139
00:05:20,949 --> 00:05:23,740
And so there's intermediate steps
that are, in fact, going on here.

140
00:05:23,740 --> 00:05:26,360
But the output, ultimately,
is these zeros and ones.

141
00:05:26,360 --> 00:05:28,990
>> But in the interpreted
world, where you have

142
00:05:28,990 --> 00:05:32,680
languages that are interpreted
languages, you actually skip that step.

143
00:05:32,680 --> 00:05:36,010
In other words, when you write a
program, you just immediately run it.

144
00:05:36,010 --> 00:05:38,960
You don't compile it and
then run it, as I did before.

145
00:05:38,960 --> 00:05:41,132
You just write it and run it.

146
00:05:41,132 --> 00:05:44,340
And if you want to make a quick change,
you make a quick change and rerun it.

147
00:05:44,340 --> 00:05:46,640
So there is no middle step here.

148
00:05:46,640 --> 00:05:50,840
>> Now, for the program I wrote earlier,
which was this "Hello World" program,

149
00:05:50,840 --> 00:05:53,660
you might reasonably
wonder-- or might reasonably

150
00:05:53,660 --> 00:05:58,570
state-- that was not that time
consuming to compile my program.

151
00:05:58,570 --> 00:06:00,337
It seems to have done it just like that.

152
00:06:00,337 --> 00:06:02,170
And there's graphical
versions of compilers.

153
00:06:02,170 --> 00:06:05,270
I'm using a very arcane version,
but you could hit a play button

154
00:06:05,270 --> 00:06:07,887
and that would actually do
the compilation for you.

155
00:06:07,887 --> 00:06:10,720
I've compiled the program and then
again, to run it, I just do this.

156
00:06:10,720 --> 00:06:13,820
And it outputs at left there, "Hello!"

157
00:06:13,820 --> 00:06:15,530
That doesn't seem all that onerous.

158
00:06:15,530 --> 00:06:19,920
But when your programs are
more than just one, two, three,

159
00:06:19,920 --> 00:06:25,470
four, five lines long, it can
take far more seconds to compile.

160
00:06:25,470 --> 00:06:28,310
Sometimes even minutes or
quite a bit of time to compile.

161
00:06:28,310 --> 00:06:30,480
After all, some of the
world's biggest products

162
00:06:30,480 --> 00:06:35,040
are things like operating systems,
Microsoft Word, Microsoft Excel,

163
00:06:35,040 --> 00:06:39,070
which might be hundreds of thousands
or even millions of lines of code long,

164
00:06:39,070 --> 00:06:41,300
and those don't just
immediately execute.

165
00:06:41,300 --> 00:06:44,560
>> Moreover, on the web, it's
become fashionable to use

166
00:06:44,560 --> 00:06:47,600
simply interpreted languages,
in part because you

167
00:06:47,600 --> 00:06:50,570
can make a change as the developer
and then just immediately reload

168
00:06:50,570 --> 00:06:52,570
the browser page and
immediately see the result.

169
00:06:52,570 --> 00:06:56,160
And so HTML, while not
a programming language,

170
00:06:56,160 --> 00:06:58,860
is a language that's interpreted.

171
00:06:58,860 --> 00:07:00,770
And we saw that same effect yesterday.

172
00:07:00,770 --> 00:07:04,070
You just reload the page after making
a change in Cloud9 and-- voila--

173
00:07:04,070 --> 00:07:05,560
you see a new result.

174
00:07:05,560 --> 00:07:07,090
>> So what's the difference here?

175
00:07:07,090 --> 00:07:13,190
In HTML, recall, we had open HTML,
open head, open title, close title,

176
00:07:13,190 --> 00:07:15,250
close head, open body, and so forth.

177
00:07:15,250 --> 00:07:19,149
We had all of these tags that we pretty
much said, tell the browser what to do.

178
00:07:19,149 --> 00:07:20,690
Hey browser, here comes an HTML page.

179
00:07:20,690 --> 00:07:22,170
Hey browser, here comes the title.

180
00:07:22,170 --> 00:07:24,429
Hey browser, here comes some
text that should be bold.

181
00:07:24,429 --> 00:07:25,720
And then you tell the opposite.

182
00:07:25,720 --> 00:07:27,330
Hey browser, that's it
for the bold face text.

183
00:07:27,330 --> 00:07:28,830
Hey browser, that's it for the body.

184
00:07:28,830 --> 00:07:29,740
And so forth.

185
00:07:29,740 --> 00:07:31,130
>> And so what is a browser?

186
00:07:31,130 --> 00:07:33,170
A browser is just an interpreter.

187
00:07:33,170 --> 00:07:36,090
It is a program that someone like
Microsoft or Google has written,

188
00:07:36,090 --> 00:07:39,160
whose purpose in life is to
read a language, known as HTML,

189
00:07:39,160 --> 00:07:39,890
and interpret it.

190
00:07:39,890 --> 00:07:41,290
Top to bottom, left to right.

191
00:07:41,290 --> 00:07:46,880
And any time the browser sees open
bracket, title, close bracket,

192
00:07:46,880 --> 00:07:48,960
it should interpret that
as meaning, oh, that

193
00:07:48,960 --> 00:07:52,490
means I should put these words way
up here at the top of the browser.

194
00:07:52,490 --> 00:07:55,700
>> So it just does what the HTML code says.

195
00:07:55,700 --> 00:07:57,240
But there's no zeros and ones.

196
00:07:57,240 --> 00:07:58,250
There's no compilation.

197
00:07:58,250 --> 00:07:58,890
You didn't do it.

198
00:07:58,890 --> 00:07:59,931
The browser didn't do it.

199
00:07:59,931 --> 00:08:01,710
It's just not involved.

200
00:08:01,710 --> 00:08:05,890
>> So in the spirit of these ongoing
topics, today and yesterday,

201
00:08:05,890 --> 00:08:08,400
that seems to be a wonderful feature.

202
00:08:08,400 --> 00:08:11,410
You save your code and then
just run it or interpret it.

203
00:08:11,410 --> 00:08:13,790
There's no intermediate steps.

204
00:08:13,790 --> 00:08:15,690
Surely there's a cost?

205
00:08:15,690 --> 00:08:16,810
Can't all be upsides.

206
00:08:16,810 --> 00:08:19,964
So what might that cost be?

207
00:08:19,964 --> 00:08:20,940
>> AUDIENCE: Space.

208
00:08:20,940 --> 00:08:22,370
>> DAVID J. MALAN: Space.

209
00:08:22,370 --> 00:08:23,370
So, sure.

210
00:08:23,370 --> 00:08:26,920
In the compiled world, you have
not only the original source code,

211
00:08:26,920 --> 00:08:29,657
you are also creating and
then presumably saving

212
00:08:29,657 --> 00:08:31,740
the machine code-- the
zeros and ones-- and that's

213
00:08:31,740 --> 00:08:33,870
got to take up some amount of space.

214
00:08:33,870 --> 00:08:34,429
Absolutely.

215
00:08:34,429 --> 00:08:35,765
So it's costing you more space.

216
00:08:35,765 --> 00:08:39,289

217
00:08:39,289 --> 00:08:39,789
Yeah?

218
00:08:39,789 --> 00:08:43,280
>> AUDIENCE: Browsers might
interpret differently.

219
00:08:43,280 --> 00:08:46,770
>> DAVID J. MALAN: Browsers might
interpret it differently.

220
00:08:46,770 --> 00:08:48,622
That is true.

221
00:08:48,622 --> 00:08:50,330
But I'm not sure I'm
comfortable claiming

222
00:08:50,330 --> 00:08:51,840
that's because it's interpreted.

223
00:08:51,840 --> 00:08:56,340
That's more just because it's
an implementation of a language

224
00:08:56,340 --> 00:08:58,050
that itself has ambiguities.

225
00:08:58,050 --> 00:09:01,570
So let's not quite confirm
that one, but good hunch.

226
00:09:01,570 --> 00:09:03,103
What else might be the price paid?

227
00:09:03,103 --> 00:09:03,602
Andrew?

228
00:09:03,602 --> 00:09:05,912
>> AUDIENCE: You're combining
two steps, so you therefore

229
00:09:05,912 --> 00:09:08,300
have increasing complexity as well.

230
00:09:08,300 --> 00:09:11,040
>> DAVID J. MALAN: The complex--
the increase in complexity where?

231
00:09:11,040 --> 00:09:12,270
For whom?

232
00:09:12,270 --> 00:09:16,748
>> AUDIENCE: So, in the interpreter
step, you're combining the interpreter

233
00:09:16,748 --> 00:09:19,120
and compiler for just leading up to--

234
00:09:19,120 --> 00:09:21,100
>> DAVID J. MALAN: Ah, OK.

235
00:09:21,100 --> 00:09:25,240
Ironically, it's probably a little
simpler to implement the interpreter,

236
00:09:25,240 --> 00:09:29,530
even though it would seem to
yield upsides of this convenience.

237
00:09:29,530 --> 00:09:30,550
So possibly true.

238
00:09:30,550 --> 00:09:32,716
But it kind of depends, I
would say, on the language

239
00:09:32,716 --> 00:09:35,720
and on how they went
about implementing it.

240
00:09:35,720 --> 00:09:38,535
There can be a lot more complexity,
actually, in the compiler,

241
00:09:38,535 --> 00:09:41,410
just because you have to go from
something so high-level to something

242
00:09:41,410 --> 00:09:42,560
so low-level.

243
00:09:42,560 --> 00:09:45,340
But a good thought.

244
00:09:45,340 --> 00:09:50,770
>> So put another way, a compiled program,
when turned into these zeros and ones,

245
00:09:50,770 --> 00:09:54,470
ends up in the language
that the CPU speaks,

246
00:09:54,470 --> 00:09:57,850
whereas in this side of the
world, the program you've written,

247
00:09:57,850 --> 00:10:02,527
the code you've written, never actually
gets converted into the actual language

248
00:10:02,527 --> 00:10:03,360
the computer speaks.

249
00:10:03,360 --> 00:10:04,190
The zeros and ones.

250
00:10:04,190 --> 00:10:08,480
It stays in the original, more human
friendly, more readable language.

251
00:10:08,480 --> 00:10:11,720
So what might be the implication
there, if you don't actually

252
00:10:11,720 --> 00:10:15,020
bother converting your
program to the very language

253
00:10:15,020 --> 00:10:18,013
that the underlying computer speaks?

254
00:10:18,013 --> 00:10:19,780
>> AUDIENCE: Might not
understand something?

255
00:10:19,780 --> 00:10:21,170
>> DAVID J. MALAN: Might
not understand something.

256
00:10:21,170 --> 00:10:23,297
And that may claim--
if it didn't understand

257
00:10:23,297 --> 00:10:25,880
something, that's a bug or lack
of feature in the interpreter.

258
00:10:25,880 --> 00:10:28,544
So that would be more of
a mistake than a cost.

259
00:10:28,544 --> 00:10:30,419
>> AUDIENCE: You have access
to the source code?

260
00:10:30,419 --> 00:10:31,877
DAVID J. MALAN: There's a good one.

261
00:10:31,877 --> 00:10:34,140
So a downside here is you
would seem to have access.

262
00:10:34,140 --> 00:10:37,006
You, the end user, might seem to
have access to the source code.

263
00:10:37,006 --> 00:10:38,130
And that's not always true.

264
00:10:38,130 --> 00:10:39,660
But it is true in the
case of JavaScript,

265
00:10:39,660 --> 00:10:41,660
which we'll look at after
the break today, which

266
00:10:41,660 --> 00:10:45,720
is an interpreted programming language
that you write in source code.

267
00:10:45,720 --> 00:10:48,890
>> But that source code gets transferred
from your server to the browser

268
00:10:48,890 --> 00:10:51,392
and runs in the human's browser.

269
00:10:51,392 --> 00:10:54,350
So here she could just open the
window, like I've been doing in Chrome,

270
00:10:54,350 --> 00:10:57,740
and look at it, as we ourselves
glanced at yesterday with Google.

271
00:10:57,740 --> 00:11:00,420
It might look a little
incomprehensible but it is there.

272
00:11:00,420 --> 00:11:03,482
So that's absolutely one price paid.

273
00:11:03,482 --> 00:11:04,565
AUDIENCE: Performance hit?

274
00:11:04,565 --> 00:11:05,020
DAVID J. MALAN: Yeah.

275
00:11:05,020 --> 00:11:06,260
And that's the other biggie.

276
00:11:06,260 --> 00:11:07,380
There's a performance hit.

277
00:11:07,380 --> 00:11:10,100
Because you have this
middle man, which itself

278
00:11:10,100 --> 00:11:13,740
is a program, between you
and the CPU, as opposed

279
00:11:13,740 --> 00:11:17,880
to just feeding these raw
zeros and ones into the CPU,

280
00:11:17,880 --> 00:11:21,060
there's a performance hit that you
take with an interpreted language.

281
00:11:21,060 --> 00:11:24,240
Such that, arbitrarily, a program
that might take one second

282
00:11:24,240 --> 00:11:27,840
to run on a computer or one
minute to run on a computer here,

283
00:11:27,840 --> 00:11:32,059
might take 10 seconds or 10
minutes to run on a computer here.

284
00:11:32,059 --> 00:11:35,100
It's generally not going to be that
much of a difference-- factor of 10--

285
00:11:35,100 --> 00:11:36,808
because there's
optimizations you can do.

286
00:11:36,808 --> 00:11:38,680
But it's almost always slower.

287
00:11:38,680 --> 00:11:43,070
Now, the flip side to that concern
is that, well computers, every 12

288
00:11:43,070 --> 00:11:45,970
to 18 months-- according to
Moore's law, so to speak--

289
00:11:45,970 --> 00:11:47,600
are just getting faster and faster.

290
00:11:47,600 --> 00:11:48,750
I have more and more disk space.

291
00:11:48,750 --> 00:11:49,791
I have more and more RAM.

292
00:11:49,791 --> 00:11:50,620
Who really cares?

293
00:11:50,620 --> 00:11:52,328
>> And that's kind of a
reasonable argument.

294
00:11:52,328 --> 00:11:55,740
Indeed, one of the reasons
why we can tolerate slower

295
00:11:55,740 --> 00:11:58,480
interpreted languages is because
we humans don't really notice.

296
00:11:58,480 --> 00:12:00,690
The computers have
gotten just so darn fast.

297
00:12:00,690 --> 00:12:04,520
Whereas back in the day, especially
when hardware was much more constrained,

298
00:12:04,520 --> 00:12:06,860
you had less of everything,
it was much more expensive

299
00:12:06,860 --> 00:12:10,570
so everything cost more, well then
you really wanted to squeeze out

300
00:12:10,570 --> 00:12:12,590
as much performance as you could.

301
00:12:12,590 --> 00:12:16,400
But that required writing at
a lower-level, if you will,

302
00:12:16,400 --> 00:12:18,090
with a compiled language.

303
00:12:18,090 --> 00:12:20,830
>> So you do take this performance hit.

304
00:12:20,830 --> 00:12:24,780
But generally, the upsides
seem to be worth it these days.

305
00:12:24,780 --> 00:12:26,850
Well, except for the
intellectual property issue.

306
00:12:26,850 --> 00:12:28,641
That sort of readability
of the code, we'll

307
00:12:28,641 --> 00:12:30,640
come back to when we look at JavaScript.

308
00:12:30,640 --> 00:12:33,140
>> So let's try to categorize
at least a few of these.

309
00:12:33,140 --> 00:12:41,650
So among the compiled languages, we
would have C, C++, kinda, sorta, Java,

310
00:12:41,650 --> 00:12:48,120
although it's a bit of an exception, for
reasons I'll show you in just a moment.

311
00:12:48,120 --> 00:12:51,540
C# would be on this list.

312
00:12:51,540 --> 00:12:54,930
We'll look at more at just
the more modern languages.

313
00:12:54,930 --> 00:12:55,430
All right.

314
00:12:55,430 --> 00:12:56,804
And that seems like plenty there.

315
00:12:56,804 --> 00:13:03,500
Whereas on this side of the fence,
we might have JavaScript, and Python,

316
00:13:03,500 --> 00:13:08,040
and PHP, and Ruby.

317
00:13:08,040 --> 00:13:13,640
And is that enough for
the more recent ones?

318
00:13:13,640 --> 00:13:15,410
That feels like plenty for now.

319
00:13:15,410 --> 00:13:16,330
OK.

320
00:13:16,330 --> 00:13:18,760
And then dot dot dot,
since the list is endless.

321
00:13:18,760 --> 00:13:22,300
>> And in fact, if we want to just
get a sense of this-- Wikipedia,

322
00:13:22,300 --> 00:13:24,130
compiled languages.

323
00:13:24,130 --> 00:13:27,150
I'm guessing we can get a
far more exhaustive list.

324
00:13:27,150 --> 00:13:27,910
So here we go.

325
00:13:27,910 --> 00:13:30,620
So here is a much more exhaustive list.

326
00:13:30,620 --> 00:13:34,150
And I was hoping someone would guess D
as a language because that too exists,

327
00:13:34,150 --> 00:13:37,747
but they stopped at D it would seem.

328
00:13:37,747 --> 00:13:39,330
Although there might actually be an E.

329
00:13:39,330 --> 00:13:41,496
>> Oh, actually, this should
be on the list these days.

330
00:13:41,496 --> 00:13:47,460
Swift is actually a
language that Apple invented

331
00:13:47,460 --> 00:13:50,302
that is now used, increasingly
so, in iPhone development.

332
00:13:50,302 --> 00:13:52,260
But we'll come back to
that with our discussion

333
00:13:52,260 --> 00:13:54,090
of mobile in just a little bit as well.

334
00:13:54,090 --> 00:13:55,260
So Swift as well.

335
00:13:55,260 --> 00:13:57,540
>> And then if we go to
interpreted language--

336
00:13:57,540 --> 00:14:05,010
interpreted language-- then here's
an even longer list as well.

337
00:14:05,010 --> 00:14:07,260
So if you just google and
look on Wikipedia for these,

338
00:14:07,260 --> 00:14:09,231
you'll see all sorts of languages.

339
00:14:09,231 --> 00:14:10,980
But the purpose is,
for today really, just

340
00:14:10,980 --> 00:14:13,680
boils down to maybe this
issue of intellectual property

341
00:14:13,680 --> 00:14:18,200
and readability by the end user and to
performance, is another biggie as well.

342
00:14:18,200 --> 00:14:21,080
>> So among these languages,
let me see if we can give you

343
00:14:21,080 --> 00:14:24,487
just some sample of languages.

344
00:14:24,487 --> 00:14:26,820
We don't want to go through
all the languages endlessly.

345
00:14:26,820 --> 00:14:29,720
Have you ever wondered what a
certain language looks like?

346
00:14:29,720 --> 00:14:31,562
We did see a moment ago.

347
00:14:31,562 --> 00:14:33,520
Why don't we take a couple
of feature requests.

348
00:14:33,520 --> 00:14:35,380
Who would like to see what
other language looks like?

349
00:14:35,380 --> 00:14:35,620
Yeah.

350
00:14:35,620 --> 00:14:36,150
>> AUDIENCE: Java.

351
00:14:36,150 --> 00:14:36,540
>> DAVID J. MALAN: Java.

352
00:14:36,540 --> 00:14:37,040
All right.

353
00:14:37,040 --> 00:14:38,504
So let's go to Java.

354
00:14:38,504 --> 00:14:42,300

355
00:14:42,300 --> 00:14:44,900
And just to give you a sample--
we could write all these out,

356
00:14:44,900 --> 00:14:47,670
but it would be faster just to
look at someone else's sample code.

357
00:14:47,670 --> 00:14:48,170
All right.

358
00:14:48,170 --> 00:14:50,330
So is this a good example?

359
00:14:50,330 --> 00:14:52,040
Whoops.

360
00:14:52,040 --> 00:14:52,540
OK.

361
00:14:52,540 --> 00:14:58,810
So here is the Java version of the
program I wrote earlier, "Hello World."

362
00:14:58,810 --> 00:15:01,900
>> So Java, you'll often
see the keyword "class."

363
00:15:01,900 --> 00:15:03,779
Then you'll see some name after that.

364
00:15:03,779 --> 00:15:05,570
You'll see curly braces
like we saw before,

365
00:15:05,570 --> 00:15:08,153
and sometimes they go on the
same line, sometimes other lines,

366
00:15:08,153 --> 00:15:09,734
it's kind of a personal decision.

367
00:15:09,734 --> 00:15:11,900
You'll see keywords like
"public," "static," "void."

368
00:15:11,900 --> 00:15:13,790
But we did see "main."
"Main" is generally

369
00:15:13,790 --> 00:15:17,220
the name of the default function
or the default chunk of code that

370
00:15:17,220 --> 00:15:18,760
gets run in a program.

371
00:15:18,760 --> 00:15:19,330
>> "String."

372
00:15:19,330 --> 00:15:20,850
What did we mean by string earlier?

373
00:15:20,850 --> 00:15:23,480
I used it kind of casually.

374
00:15:23,480 --> 00:15:25,100
A string is what?

375
00:15:25,100 --> 00:15:25,601
A word.

376
00:15:25,601 --> 00:15:27,058
It's like a sequence of characters.

377
00:15:27,058 --> 00:15:29,810
Individual characters, back to
back to back, usually in an array,

378
00:15:29,810 --> 00:15:30,690
as we've discussed.

379
00:15:30,690 --> 00:15:34,700
And in fact, see this syntax
here, the two square brackets?

380
00:15:34,700 --> 00:15:39,210
That means, hey computer, here
comes an array of strings.

381
00:15:39,210 --> 00:15:42,636
The square bracket notation is
commonly used to denote that.

382
00:15:42,636 --> 00:15:44,510
And then you can probably
take a guess-- what

383
00:15:44,510 --> 00:15:46,580
does this highlighted
chunk of code probably do?

384
00:15:46,580 --> 00:15:49,737

385
00:15:49,737 --> 00:15:50,639
>> AUDIENCE: The output?

386
00:15:50,639 --> 00:15:51,090
>> DAVID J. MALAN: Yeah.

387
00:15:51,090 --> 00:15:52,506
It prints something to the screen.

388
00:15:52,506 --> 00:15:57,070
So "system" is a sort of a
reference to your computer.

389
00:15:57,070 --> 00:15:59,620
"Out" means your computer's
output or the screen.

390
00:15:59,620 --> 00:16:04,450
So "system.out.print ln" probably means?

391
00:16:04,450 --> 00:16:05,570
"ln."

392
00:16:05,570 --> 00:16:09,570
Print line which programmers like
to apparently spell some words out

393
00:16:09,570 --> 00:16:11,820
in their entirety and take
shortcuts with other words.

394
00:16:11,820 --> 00:16:13,260
But "ln" is line, so print line.

395
00:16:13,260 --> 00:16:17,370
So it prints out "Hello
World!" followed by a new line.

396
00:16:17,370 --> 00:16:18,300
>> So that's it.

397
00:16:18,300 --> 00:16:21,150
But Java is what they'll
call object-oriented.

398
00:16:21,150 --> 00:16:23,440
And indeed, just to give a
couple of other definitions

399
00:16:23,440 --> 00:16:26,420
there that you might
see, in general, there

400
00:16:26,420 --> 00:16:30,600
are many different types of
languages, but the most common

401
00:16:30,600 --> 00:16:37,830
are procedural or imperative languages.

402
00:16:37,830 --> 00:16:41,600
There are functional
languages, which doesn't

403
00:16:41,600 --> 00:16:43,790
mean that others are nonfunctional.

404
00:16:43,790 --> 00:16:47,740
And then there's
object-oriented languages.

405
00:16:47,740 --> 00:16:51,170
And this is perhaps the best
categorization of most languages

406
00:16:51,170 --> 00:16:56,445
that you would ever choose for sort
of a typical commercial project.

407
00:16:56,445 --> 00:16:58,910
>> This would be too much of,
I think, of a rat's hole

408
00:16:58,910 --> 00:17:01,620
to go down, to try to explain
the various differences.

409
00:17:01,620 --> 00:17:04,599
But the languages
we've seen thus far-- C

410
00:17:04,599 --> 00:17:07,680
is a procedural or an
imperative language.

411
00:17:07,680 --> 00:17:11,200
More recently invented
languages tend to be, sorry,

412
00:17:11,200 --> 00:17:14,430
object-oriented, which means
they have other features to them.

413
00:17:14,430 --> 00:17:18,130

414
00:17:18,130 --> 00:17:19,430
Can I explain it in this way?

415
00:17:19,430 --> 00:17:20,950
Let's not even go down there.

416
00:17:20,950 --> 00:17:25,200
>> Object-oriented means
you can implement--

417
00:17:25,200 --> 00:17:27,930
you can model the real world
a little more effectively.

418
00:17:27,930 --> 00:17:29,722
Humanity, over time,
has figured out, wow,

419
00:17:29,722 --> 00:17:32,430
it would be nice if my language
had this feature or that feature.

420
00:17:32,430 --> 00:17:34,830
And that's why we have so
many languages in the world.

421
00:17:34,830 --> 00:17:37,670
Reasonable people, smart
people, agree or disagree

422
00:17:37,670 --> 00:17:41,000
and invariably sort of come together on
developing new languages all together.

423
00:17:41,000 --> 00:17:41,660
>> Case in point.

424
00:17:41,660 --> 00:17:45,260
Apple invented Swift in
hopes of presumably lowering

425
00:17:45,260 --> 00:17:47,950
the bar to iPhone development,
because the previous language--

426
00:17:47,950 --> 00:17:51,080
called Objective-C, which could
also be on our list here--

427
00:17:51,080 --> 00:17:54,190
was much more arcane and much
harder to wrap one's mind around.

428
00:17:54,190 --> 00:17:57,690
And as programming is becoming arguably
more accessible and more broadly

429
00:17:57,690 --> 00:18:00,580
adopted by people even
less technical, the goal--

430
00:18:00,580 --> 00:18:04,160
it's a very valiant goal to try to
lower the barrier to entry by making

431
00:18:04,160 --> 00:18:07,400
the languages themselves
easier to get started with,

432
00:18:07,400 --> 00:18:09,430
but no less powerful necessarily.

433
00:18:09,430 --> 00:18:10,560
>> And one other language.

434
00:18:10,560 --> 00:18:14,110
Why don't we take a look
at something like Python,

435
00:18:14,110 --> 00:18:18,090
which is very much in vogue these days.

436
00:18:18,090 --> 00:18:19,570
Python.

437
00:18:19,570 --> 00:18:20,464
Sample program.

438
00:18:20,464 --> 00:18:24,600

439
00:18:24,600 --> 00:18:26,700
Let's see.

440
00:18:26,700 --> 00:18:28,790
"Hello World" languages.

441
00:18:28,790 --> 00:18:30,180
Let's do this.

442
00:18:30,180 --> 00:18:33,625
"Hello World."

443
00:18:33,625 --> 00:18:35,375
Let's see if this gives
us a nice example.

444
00:18:35,375 --> 00:18:39,450

445
00:18:39,450 --> 00:18:39,950
OK.

446
00:18:39,950 --> 00:18:41,283
So this is actually kind of fun.

447
00:18:41,283 --> 00:18:43,330
So if you ever google
"Hello World," which

448
00:18:43,330 --> 00:18:47,000
happens to be one of the first programs
ever written in a modern language,

449
00:18:47,000 --> 00:18:51,830
just as a proof of concept, you can see
all sorts of implementations of this.

450
00:18:51,830 --> 00:18:54,240
>> Some of these languages
I've not even heard of.

451
00:18:54,240 --> 00:18:59,770
But you can see-- let's go to Basic,
the one I learned years ago, in part.

452
00:18:59,770 --> 00:19:02,720
This was a fun language because you
had to, as the programmer, number

453
00:19:02,720 --> 00:19:03,710
all of your lines.

454
00:19:03,710 --> 00:19:05,626
Not unlike what I was
doing when I was writing

455
00:19:05,626 --> 00:19:08,380
pseudocode on the yellow document
earlier for binary search,

456
00:19:08,380 --> 00:19:09,580
for searching a phone book.

457
00:19:09,580 --> 00:19:11,810
>> And so, if you wanted
to go to another line,

458
00:19:11,810 --> 00:19:15,780
you would literally type,
go to 10, or go to 20.

459
00:19:15,780 --> 00:19:19,110
And if you're writing lines, the
convention was to do, this is line 10,

460
00:19:19,110 --> 00:19:22,545
this is line 20, this is line
30, 40, with nothing in between,

461
00:19:22,545 --> 00:19:25,170
thereby giving yourself some room
if you decide, wait a minute,

462
00:19:25,170 --> 00:19:27,230
I should have added some
more code somewhere.

463
00:19:27,230 --> 00:19:30,960
You still had sort of nine chances to
squeeze that in between your program

464
00:19:30,960 --> 00:19:33,020
before you had to manually
renumber everything.

465
00:19:33,020 --> 00:19:35,470
>> So this is kind of what I mean
when I say the world has come up

466
00:19:35,470 --> 00:19:36,303
with a new features.

467
00:19:36,303 --> 00:19:39,364
Somewhere along the way someone
realized, boy this is stupid.

468
00:19:39,364 --> 00:19:41,280
This is just creating
work for the programmer.

469
00:19:41,280 --> 00:19:44,200
So he or she just kind of built
a new layer on top of that

470
00:19:44,200 --> 00:19:46,910
so that you don't have to worry
about what line numbers your code

471
00:19:46,910 --> 00:19:48,570
is actually on.

472
00:19:48,570 --> 00:19:54,940
>> So when might you choose
one language or another?

473
00:19:54,940 --> 00:19:56,690
Well, which of these
languages do you tend

474
00:19:56,690 --> 00:20:00,960
to hear about the most in
your own world these days?

475
00:20:00,960 --> 00:20:02,680
Let's drop down Objective-C too.

476
00:20:02,680 --> 00:20:06,416

477
00:20:06,416 --> 00:20:07,739
>> AUDIENCE: C#.

478
00:20:07,739 --> 00:20:08,530
DAVID J. MALAN: C#.

479
00:20:08,530 --> 00:20:10,310
So let me color.

480
00:20:10,310 --> 00:20:13,190
Do we have our other color somewhere?

481
00:20:13,190 --> 00:20:14,550
So C#.

482
00:20:14,550 --> 00:20:16,390
And what do you know about C#?

483
00:20:16,390 --> 00:20:18,940
Anything spring to mind?

484
00:20:18,940 --> 00:20:20,707
>> AUDIENCE: It's a programming language.

485
00:20:20,707 --> 00:20:22,540
DAVID J. MALAN: It's a
programming language.

486
00:20:22,540 --> 00:20:23,200
OK.

487
00:20:23,200 --> 00:20:24,690
That is true.

488
00:20:24,690 --> 00:20:26,440
So we're talking about C#.

489
00:20:26,440 --> 00:20:29,230
C# tends to be used in
Windows environments,

490
00:20:29,230 --> 00:20:33,550
so if you're writing Microsoft software
for Windows, C# is very commonly used,

491
00:20:33,550 --> 00:20:38,560
whether it's for desktop software, or
even phone software on Windows phones,

492
00:20:38,560 --> 00:20:41,820
if you've had those,
or on the web even too.

493
00:20:41,820 --> 00:20:44,642
And in fact, maybe Kareem
mentioned ASP earlier?

494
00:20:44,642 --> 00:20:46,600
So there's also these
things called frameworks,

495
00:20:46,600 --> 00:20:51,040
which we can introduce by extension.

496
00:20:51,040 --> 00:20:53,280
Frameworks, like ASP.

497
00:20:53,280 --> 00:20:55,740
Stands for active server pages.

498
00:20:55,740 --> 00:20:59,880
And this is code and
a way of programming

499
00:20:59,880 --> 00:21:03,490
that generally makes it easier
to write web based applications.

500
00:21:03,490 --> 00:21:07,530
In other words, it would be super,
super annoying to write a website

501
00:21:07,530 --> 00:21:09,469
in the language C that
we've seen before,

502
00:21:09,469 --> 00:21:12,510
because you would have to use print+F,
you would have to use that keyword

503
00:21:12,510 --> 00:21:13,940
"main" and the curly braces.

504
00:21:13,940 --> 00:21:16,720
A lot of arcane syntax
and approach to implement

505
00:21:16,720 --> 00:21:19,195
something that is fairly complex.

506
00:21:19,195 --> 00:21:20,240
A web page.

507
00:21:20,240 --> 00:21:23,800
>> And so other languages have evolved
to make that kind of thing easier.

508
00:21:23,800 --> 00:21:26,890
And in turn, people have come up
with frameworks, sort of tools

509
00:21:26,890 --> 00:21:30,520
that you can use that make it
even easier to write web pages.

510
00:21:30,520 --> 00:21:33,070
So for instance, to make
this much more concrete,

511
00:21:33,070 --> 00:21:36,390
let me open up just a
text file for a moment.

512
00:21:36,390 --> 00:21:39,380
>> And you might recall yesterday
that we said something

513
00:21:39,380 --> 00:21:41,210
like, this is a web page.

514
00:21:41,210 --> 00:21:42,300
HTML.

515
00:21:42,300 --> 00:21:45,340
Close HTML.

516
00:21:45,340 --> 00:21:48,500
Let me skip the head and
just do the body here.

517
00:21:48,500 --> 00:21:52,810
Suppose that I wanted to
write not "Hello World,"

518
00:21:52,810 --> 00:21:57,020
but "Hello David," where David is the
name of the currently logged in user.

519
00:21:57,020 --> 00:22:00,270
What something like
ASP will do, or JSP--

520
00:22:00,270 --> 00:22:04,060
which is Java server pages-- or
any number of other frameworks

521
00:22:04,060 --> 00:22:05,435
is they're not languages, per se.

522
00:22:05,435 --> 00:22:07,351
They're just like
additional software that you

523
00:22:07,351 --> 00:22:10,490
would install into your environment
that just make it easier to program.

524
00:22:10,490 --> 00:22:15,670
>> So for instance, rather than have to do
something like "hello, printf("David")"

525
00:22:15,670 --> 00:22:17,510
or something that's
kind of co-mingling--

526
00:22:17,510 --> 00:22:20,840
the kind of code we've seen before--
you would do something much simpler,

527
00:22:20,840 --> 00:22:26,190
like "name %."

528
00:22:26,190 --> 00:22:28,660
And so these frameworks,
like ASP-- and I

529
00:22:28,660 --> 00:22:31,212
don't remember if I'm getting
the syntax just right for ASP.

530
00:22:31,212 --> 00:22:33,100
JSP is a little-- is this right?

531
00:22:33,100 --> 00:22:36,500
>> So with ASP, this is
sort of a special syntax

532
00:22:36,500 --> 00:22:39,830
that some developers have decided
this might help people out.

533
00:22:39,830 --> 00:22:43,000
And I can express more succinctly
placeholders, for instance.

534
00:22:43,000 --> 00:22:47,187
Like put a value here, where
this value name is not N-A-M-E,

535
00:22:47,187 --> 00:22:48,520
it's some value stored in there.

536
00:22:48,520 --> 00:22:50,728
So "name," in this context,
we would call a variable.

537
00:22:50,728 --> 00:22:52,760
Algebra has variables
like x, and y, and z.

538
00:22:52,760 --> 00:22:56,021
Programmers use variables that are
more descriptive than x, y, and z,

539
00:22:56,021 --> 00:22:56,520
typically.

540
00:22:56,520 --> 00:23:01,020
So "name" would literally be some kind
of memory container for something like

541
00:23:01,020 --> 00:23:05,440
D-A-V-I-D, for my name, or whoever
else is logged into the website.

542
00:23:05,440 --> 00:23:09,300
>> And so this is the kind of convenience
you get with certain environments.

543
00:23:09,300 --> 00:23:14,220
So C# and something like ASP would very
commonly be used in a Windows world,

544
00:23:14,220 --> 00:23:16,460
whether for its desktop
software or web server,

545
00:23:16,460 --> 00:23:21,490
especially if your servers are in turn
running Microsoft Windows and Microsoft

546
00:23:21,490 --> 00:23:25,810
IIS-- or Internet Information
Server, if I get the acronym right--

547
00:23:25,810 --> 00:23:27,800
which is Microsoft's web server.

548
00:23:27,800 --> 00:23:30,820
>> So what other languages
are folks familiar with,

549
00:23:30,820 --> 00:23:35,228
or have you heard of
more often than not?

550
00:23:35,228 --> 00:23:38,262
>> AUDIENCE: I know that Python's
kind of a popular [INAUDIBLE].

551
00:23:38,262 --> 00:23:39,470
DAVID J. MALAN: Very popular.

552
00:23:39,470 --> 00:23:45,490
So Python here is used very often
in scientific applications or data

553
00:23:45,490 --> 00:23:48,330
science, where you have a lot
of data that you want to analyze

554
00:23:48,330 --> 00:23:50,413
and you want to use a
programming language for it.

555
00:23:50,413 --> 00:23:53,640
R might commonly be used for that
as well, in a statistical context.

556
00:23:53,640 --> 00:23:56,400
But Python has so many
features built in.

557
00:23:56,400 --> 00:23:58,850
So many additional
libraries, as people say.

558
00:23:58,850 --> 00:24:01,260
>> Libraries are just collections
of code that other people

559
00:24:01,260 --> 00:24:04,218
wrote that you can use so that you
don't have to reinvent those wheels.

560
00:24:04,218 --> 00:24:07,430
And so Python is very commonly
used in data science applications.

561
00:24:07,430 --> 00:24:09,930
But it's also very commonly
used in web applications.

562
00:24:09,930 --> 00:24:12,780
You can implement a dynamic
website using Python.

563
00:24:12,780 --> 00:24:15,210
>> And by dynamic website, I
mean not just static content

564
00:24:15,210 --> 00:24:19,530
like we created yesterday, by
just hard coding in the Latin text

565
00:24:19,530 --> 00:24:21,820
and other such things,
but rather the ability

566
00:24:21,820 --> 00:24:25,367
to log in, the ability to buy
something, the ability to check out

567
00:24:25,367 --> 00:24:26,950
with your shopping carts, or the like.

568
00:24:26,950 --> 00:24:30,590
All of that requires dynamism and you
need some language like one of these.

569
00:24:30,590 --> 00:24:35,060
>> AUDIENCE: So does Python have its own
extension, similar to like [INAUDIBLE]

570
00:24:35,060 --> 00:24:36,060
DAVID J. MALAN: It does.

571
00:24:36,060 --> 00:24:42,250
So in the world of Python, Django is
a very popular framework for Python.

572
00:24:42,250 --> 00:24:46,520
WSGI is another mechanism that's
sort of different from this

573
00:24:46,520 --> 00:24:47,640
but similar in spirit.

574
00:24:47,640 --> 00:24:52,200
It's an add-on that allows you
to run Python code on a server.

575
00:24:52,200 --> 00:24:53,950
There's other-- yeah.

576
00:24:53,950 --> 00:24:57,250
So these we'll call frameworks.

577
00:24:57,250 --> 00:24:58,870
And it's a little bit of an abuse.

578
00:24:58,870 --> 00:25:00,920
This is more of a web server technology.

579
00:25:00,920 --> 00:25:04,610
But we'll keep it simple and put
it in this column nonetheless.

580
00:25:04,610 --> 00:25:05,780
>> OK.

581
00:25:05,780 --> 00:25:07,850
WSGI.

582
00:25:07,850 --> 00:25:09,020
WSGI.

583
00:25:09,020 --> 00:25:12,100
Another thing-- and actually, let
me move that to its own column,

584
00:25:12,100 --> 00:25:17,000
because I would yell at myself for
putting them in the same bucket.

585
00:25:17,000 --> 00:25:24,910
Let's put this into server
features, let's say.

586
00:25:24,910 --> 00:25:26,710
That's not a technical term.

587
00:25:26,710 --> 00:25:29,180
>> So here we might be WSGI.

588
00:25:29,180 --> 00:25:32,580
There's CGI, which is an older
technique for serving up languages

589
00:25:32,580 --> 00:25:35,890
like Perl or PHP, or some others.

590
00:25:35,890 --> 00:25:39,000
Again, I've mentioned these terms
not so much to sort of ingrain them,

591
00:25:39,000 --> 00:25:40,749
but so that if you see
them it's something

592
00:25:40,749 --> 00:25:42,130
you simply google to read more.

593
00:25:42,130 --> 00:25:46,110
There's no real juice
to some of these things.

594
00:25:46,110 --> 00:25:47,850
>> But let's go back to the languages.

595
00:25:47,850 --> 00:25:50,499
We talked about C#, Python.

596
00:25:50,499 --> 00:25:52,790
What else might you use for
web programming these days?

597
00:25:52,790 --> 00:25:54,302
Let's focus on that still.

598
00:25:54,302 --> 00:25:55,247
>> AUDIENCE: PHP.

599
00:25:55,247 --> 00:25:56,080
DAVID J. MALAN: PHP.

600
00:25:56,080 --> 00:25:57,413
And let's come back to that one.

601
00:25:57,413 --> 00:25:59,310
So PHP is very commonly used.

602
00:25:59,310 --> 00:26:01,560
PHP tends to get a bad rap.

603
00:26:01,560 --> 00:26:05,790
It started off as a language implemented
by folks who maybe weren't necessarily

604
00:26:05,790 --> 00:26:06,960
the best language designers.

605
00:26:06,960 --> 00:26:11,290
And so you can read all sorts of
articles online about how bad PHP is.

606
00:26:11,290 --> 00:26:13,660
And unfortunately, this is
a manifestation, in part,

607
00:26:13,660 --> 00:26:18,727
of just the religious debates
that erupt among programmers.

608
00:26:18,727 --> 00:26:20,560
And this is something
worth keeping in mind,

609
00:26:20,560 --> 00:26:24,410
from a business perspective, that
it's very easy for technical people

610
00:26:24,410 --> 00:26:26,900
to get all worked up with their
opinions on certain things.

611
00:26:26,900 --> 00:26:29,566
And it doesn't necessarily mean
that the one yelling the loudest

612
00:26:29,566 --> 00:26:31,870
or with the strongest,
angriest opinion is right.

613
00:26:31,870 --> 00:26:34,100
A lot of times, it really
just doesn't matter.

614
00:26:34,100 --> 00:26:37,970
>> And so people are just arguing whatever
their own biases or comfort zones are.

615
00:26:37,970 --> 00:26:40,760
And so you should keep
that in mind when making

616
00:26:40,760 --> 00:26:42,622
a decision, that just
because someone says

617
00:26:42,622 --> 00:26:45,080
this is the right language for
the job, that might be true,

618
00:26:45,080 --> 00:26:48,350
but it also just might be it is the
right language within their own skill

619
00:26:48,350 --> 00:26:49,267
set or comfort zone.

620
00:26:49,267 --> 00:26:52,600
Which is not bad, but you should realize
that there might be some context there.

621
00:26:52,600 --> 00:26:54,440
There are some objectively
wrong statements,

622
00:26:54,440 --> 00:26:59,080
like C is the wrong language to use
these days for implementing websites

623
00:26:59,080 --> 00:27:00,520
almost always.

624
00:27:00,520 --> 00:27:03,370
But it's not unreasonable
to say that any of these

625
00:27:03,370 --> 00:27:05,700
are wrong that we've circled thus far.

626
00:27:05,700 --> 00:27:08,180
>> PHP has gone through many versions.

627
00:27:08,180 --> 00:27:11,310
So languages tend to have version
numbers associated with them.

628
00:27:11,310 --> 00:27:15,390
PHP is up to, I think, version 7 now,
so it's been around for quite some time.

629
00:27:15,390 --> 00:27:18,270
And as languages get newer,
they often get new features.

630
00:27:18,270 --> 00:27:22,510
But you have to be mindful of this
because if your website has been

631
00:27:22,510 --> 00:27:27,539
implemented in version 7 of PHP but
you're trying to run your website,

632
00:27:27,539 --> 00:27:29,830
or maybe you've outsourced
the development of your code

633
00:27:29,830 --> 00:27:31,960
to someone else and they mail
it to you or send it to you

634
00:27:31,960 --> 00:27:33,960
and they say, here, put
this on your web server,

635
00:27:33,960 --> 00:27:36,610
if your web server is a few
years outdated-- whether it's

636
00:27:36,610 --> 00:27:39,465
your own server or a web host--
it might not actually run.

637
00:27:39,465 --> 00:27:41,340
So these are the kinds
of things that someone

638
00:27:41,340 --> 00:27:44,067
needs to be mindful of
when upgrading a site

639
00:27:44,067 --> 00:27:45,650
or implementing it for the first time.

640
00:27:45,650 --> 00:27:46,900
>> I heard JavaScript earlier.

641
00:27:46,900 --> 00:27:50,570
So JavaScript is an interesting
one in that it is generally

642
00:27:50,570 --> 00:27:53,030
client side, as we'll see
after the break, which

643
00:27:53,030 --> 00:27:55,000
means it runs in the user's browser.

644
00:27:55,000 --> 00:27:58,400
But you can also run
JavaScript these days

645
00:27:58,400 --> 00:28:03,450
using something called
Node.js, where Node.js

646
00:28:03,450 --> 00:28:08,000
is a mechanism for running
JavaScript code server side,

647
00:28:08,000 --> 00:28:12,430
instead of using Python, or
PHP, or other such languages.

648
00:28:12,430 --> 00:28:17,820
>> JavaScript is particularly well suited
for chat applications and real time

649
00:28:17,820 --> 00:28:22,050
applications, whereas PHP is not a great
language for implementing something

650
00:28:22,050 --> 00:28:25,050
like a chat server, where users
stay connected to it constantly.

651
00:28:25,050 --> 00:28:28,760
PHP is more of a visit me
once, get back a result,

652
00:28:28,760 --> 00:28:31,790
and then click another link some
seconds or minutes from now.

653
00:28:31,790 --> 00:28:36,020
Whereas Node.js and JavaScript can be
used more for persistent connections.

654
00:28:36,020 --> 00:28:40,840
Other languages that you suspect
are commonly used for web stuff?

655
00:28:40,840 --> 00:28:42,800
>> AUDIENCE: Would jQuery be a framework?

656
00:28:42,800 --> 00:28:44,050
>> DAVID J. MALAN: Good question.

657
00:28:44,050 --> 00:28:44,700
Neither.

658
00:28:44,700 --> 00:28:51,210
I would call jQuery a library, where
again a library is just a bunch of code

659
00:28:51,210 --> 00:28:53,250
that someone else has
written that generally

660
00:28:53,250 --> 00:28:56,390
solves some problems that
makes it, hopefully, easier

661
00:28:56,390 --> 00:28:57,760
for you to do your job.

662
00:28:57,760 --> 00:29:00,820
And let me do one example of
this in the context of the web.

663
00:29:00,820 --> 00:29:03,910
>> In the context of the web there's
this language, JavaScript,

664
00:29:03,910 --> 00:29:06,690
that we'll see later, whereby you
might say something like this--

665
00:29:06,690 --> 00:29:10,060
"document.getElementById."

666
00:29:10,060 --> 00:29:11,490
And what did I call it yesterday?

667
00:29:11,490 --> 00:29:16,800
First, I think, was the unique ID I gave
to an element that looked like this.

668
00:29:16,800 --> 00:29:23,110
"p id="first">" and then we had
like "lorem ipsum," et cetera.

669
00:29:23,110 --> 00:29:28,210
So if I were writing a program in
JavaScript to somehow manipulate,

670
00:29:28,210 --> 00:29:30,830
change the web pages that we
were playing with yesterday,

671
00:29:30,830 --> 00:29:33,010
I would use this
highlighted line of code

672
00:29:33,010 --> 00:29:38,700
to get that particular snippet of HTML
from my page, that particular node,

673
00:29:38,700 --> 00:29:39,680
as we'll call it.

674
00:29:39,680 --> 00:29:44,540
>> However, in jQuery, instead of writing
this, which is raw JavaScript code--

675
00:29:44,540 --> 00:29:48,870
just out of the box, that's how you
write it-- you would instead just say,

676
00:29:48,870 --> 00:29:50,260
"#first."

677
00:29:50,260 --> 00:29:52,330
That's equivalent.

678
00:29:52,330 --> 00:29:56,040
And so based only on this very
arcane example, what perhaps

679
00:29:56,040 --> 00:29:57,870
is the argument for using jQuery?

680
00:29:57,870 --> 00:30:01,390

681
00:30:01,390 --> 00:30:05,111
Why would a developer use a library like
jQuery, based on this isolated example,

682
00:30:05,111 --> 00:30:05,610
perhaps?

683
00:30:05,610 --> 00:30:06,335
>> AUDIENCE: Less code.

684
00:30:06,335 --> 00:30:06,780
>> DAVID J. MALAN: Yeah.

685
00:30:06,780 --> 00:30:07,530
It's less code.

686
00:30:07,530 --> 00:30:09,070
It's just faster to type.

687
00:30:09,070 --> 00:30:11,690
The counterpoint is
that it looks scarier.

688
00:30:11,690 --> 00:30:13,540
You can't really read it left to right.

689
00:30:13,540 --> 00:30:16,730
In fact, because it's mostly
punctuation now instead of actual words,

690
00:30:16,730 --> 00:30:20,950
I can kind of infer that
"document.getElementById" gets

691
00:30:20,950 --> 00:30:23,640
an element from the document by its ID.

692
00:30:23,640 --> 00:30:26,750
I really can use no such
mnemonics from this thing here.

693
00:30:26,750 --> 00:30:27,680
>> So it's a trade off.

694
00:30:27,680 --> 00:30:30,763
There's a sophistication that comes
often with using libraries, especially

695
00:30:30,763 --> 00:30:31,440
like jQuery.

696
00:30:31,440 --> 00:30:34,700
But the reality is jQuery has kind
of become a de facto standard,

697
00:30:34,700 --> 00:30:38,110
so that almost anyone these
days who writes JavaScript code

698
00:30:38,110 --> 00:30:41,520
uses jQuery or something
like it, and no longer writes

699
00:30:41,520 --> 00:30:45,200
such a verbose expressions as
this, because again, humanity

700
00:30:45,200 --> 00:30:47,850
has learned, wow, that was
sort of a missed opportunity

701
00:30:47,850 --> 00:30:49,030
to make our lives easier.

702
00:30:49,030 --> 00:30:51,140
So humans make their lives easier.

703
00:30:51,140 --> 00:30:53,310
Good question.

704
00:30:53,310 --> 00:30:55,870
>> Other languages to consider.

705
00:30:55,870 --> 00:30:58,660
I would say among this
list Ruby is quite popular.

706
00:30:58,660 --> 00:31:01,310
And so in the world of
Ruby, there's a framework

707
00:31:01,310 --> 00:31:03,590
called Rails, which is very popular.

708
00:31:03,590 --> 00:31:06,880
So Ruby on Rails is a
commonly used expression.

709
00:31:06,880 --> 00:31:10,330
Also in this world, let me
circle Java for web stuff,

710
00:31:10,330 --> 00:31:14,160
where in the world of Java
you might have JSP, or Java

711
00:31:14,160 --> 00:31:18,450
Servlets, which is a common technology.

712
00:31:18,450 --> 00:31:22,560
And this is just again ways of using
that language in a server environment.

713
00:31:22,560 --> 00:31:23,520
>> So what does this mean?

714
00:31:23,520 --> 00:31:25,770
If you've got a physical
server, you would literally

715
00:31:25,770 --> 00:31:30,510
download the web server software
and install it in such a way

716
00:31:30,510 --> 00:31:33,510
that you have support for one of
these frameworks, with which you

717
00:31:33,510 --> 00:31:37,260
could, in turn, use one or
more of these languages.

718
00:31:37,260 --> 00:31:40,260
And in reality, if you sign up for
like a web host or some of the cloud

719
00:31:40,260 --> 00:31:41,968
services we talked
about yesterday, often

720
00:31:41,968 --> 00:31:44,885
the stuff just comes with the
machine's configuration for you.

721
00:31:44,885 --> 00:31:46,510
You don't need to set this up manually.

722
00:31:46,510 --> 00:31:51,040
But if you did, this is where the role
of system administrator, so to speak,

723
00:31:51,040 --> 00:31:51,860
comes into play.

724
00:31:51,860 --> 00:31:54,151
He or she would actually do
this kind of stuff for you,

725
00:31:54,151 --> 00:31:58,510
or the so-called webmaster
would often do this for you.

726
00:31:58,510 --> 00:31:59,010
All right.

727
00:31:59,010 --> 00:32:03,300
Any questions on some of these here?

728
00:32:03,300 --> 00:32:06,690
Or any opportunities at
all to ask about languages?

729
00:32:06,690 --> 00:32:09,500
Frameworks?

730
00:32:09,500 --> 00:32:11,530
Then let me introduce
just one other library

731
00:32:11,530 --> 00:32:13,150
that's also very common these days.

732
00:32:13,150 --> 00:32:15,340
This list could go on infinitely.

733
00:32:15,340 --> 00:32:19,140
>> And this library is kind of
starting to fall out of favor.

734
00:32:19,140 --> 00:32:19,850
It's been around.

735
00:32:19,850 --> 00:32:22,040
It was popularized by
Twitter for some time.

736
00:32:22,040 --> 00:32:24,470
And now lots of websites,
lots of developers use it.

737
00:32:24,470 --> 00:32:26,629
But new things are coming
out and coming along.

738
00:32:26,629 --> 00:32:29,420
But let me just give you a sense
of what it means to use a library.

739
00:32:29,420 --> 00:32:32,250
So again, JavaScript is
a very popular language.

740
00:32:32,250 --> 00:32:35,340
CSS, or Cascading Style Sheets,
we talked about yesterday.

741
00:32:35,340 --> 00:32:36,600
That, too, is omnipresent.

742
00:32:36,600 --> 00:32:40,130
No one makes a web page today
without using HTML and CSS minimally.

743
00:32:40,130 --> 00:32:42,510
But it's not always easy
to do certain things.

744
00:32:42,510 --> 00:32:46,281
>> And so let me go to getbootstrap.com.

745
00:32:46,281 --> 00:32:46,780
Whoops.

746
00:32:46,780 --> 00:32:48,280
That's not how we spell.

747
00:32:48,280 --> 00:32:52,410
Getbootstrap.com, which
is going to lead me

748
00:32:52,410 --> 00:32:56,140
to the landing page for this library.

749
00:32:56,140 --> 00:32:59,720
So they generously call
themselves a framework, which

750
00:32:59,720 --> 00:33:02,032
is kind of sort of fair,
but I would still call it

751
00:33:02,032 --> 00:33:03,490
more of a library than a framework.

752
00:33:03,490 --> 00:33:05,760
But these are just arguable semantics.

753
00:33:05,760 --> 00:33:12,360
Let me go to their CSS tab and
let me go to something like this.

754
00:33:12,360 --> 00:33:15,450
>> So recall what our forms looked
like yesterday on Cloud9?

755
00:33:15,450 --> 00:33:16,370
It was pretty ugly.

756
00:33:16,370 --> 00:33:17,320
Old school buttons.

757
00:33:17,320 --> 00:33:20,420
I think the button was gray by
default. And everything was really

758
00:33:20,420 --> 00:33:22,420
formatted quite messily.

759
00:33:22,420 --> 00:33:26,940
So if you want your web forms to look
a little nicer-- let me zoom in here.

760
00:33:26,940 --> 00:33:30,050
>> And by nicer I really just
mean very nitpicky aesthetics.

761
00:33:30,050 --> 00:33:35,390
So notice how the email box there has
a rounded rectangular corners to it.

762
00:33:35,390 --> 00:33:37,010
So it's a little cleaner there.

763
00:33:37,010 --> 00:33:40,770
Notice that the word email
is there until I start typing

764
00:33:40,770 --> 00:33:41,797
and then it goes away.

765
00:33:41,797 --> 00:33:43,130
So that's a nice little feature.

766
00:33:43,130 --> 00:33:46,046
Notice how the thing is kind of
glowing nicely, which some of this you

767
00:33:46,046 --> 00:33:49,069
get for free from your browser,
but some of this is also libraries,

768
00:33:49,069 --> 00:33:51,360
code that other people have
written that give you this.

769
00:33:51,360 --> 00:33:53,480
>> Something like this
gives me my password.

770
00:33:53,480 --> 00:33:58,480
This button is a little sexier than the
default. Very much in vogue right now.

771
00:33:58,480 --> 00:34:03,570
Ever since iOS 7 or so, the
world has gotten very flat,

772
00:34:03,570 --> 00:34:09,000
whereas the world before had
lots of drop shadows, lots

773
00:34:09,000 --> 00:34:11,040
of reflections on icons.

774
00:34:11,040 --> 00:34:14,170
Much like in the clothing world,
there's fashion trends that come and go.

775
00:34:14,170 --> 00:34:16,190
Now everything is flat on your phone.

776
00:34:16,190 --> 00:34:19,159
>> In fact, buttons on your
iPhone are now just blue links.

777
00:34:19,159 --> 00:34:21,000
There's not often even circular buttons.

778
00:34:21,000 --> 00:34:22,791
So these are just things
that go in and out

779
00:34:22,791 --> 00:34:26,659
of vogue, and so this is how you might
make a more modern looking web form.

780
00:34:26,659 --> 00:34:27,159
Buttons.

781
00:34:27,159 --> 00:34:29,190
So Bootstrap has lots of pretty buttons.

782
00:34:29,190 --> 00:34:33,639
So if you want blue buttons,
green buttons, blue, orange, red.

783
00:34:33,639 --> 00:34:35,840
Bootstrap makes it easier
to do these things.

784
00:34:35,840 --> 00:34:38,131
These are the kinds of things
that you could absolutely

785
00:34:38,131 --> 00:34:41,840
have done yesterday with CSS and with
HTML, but it's just a pain in the neck.

786
00:34:41,840 --> 00:34:44,840
And so instead, what Bootstrap would
have you do is something like this.

787
00:34:44,840 --> 00:34:48,960
>> If you want a button-- turns out this
is an HTML tag we didn't use yesterday--

788
00:34:48,960 --> 00:34:53,070
and you want it to look
like this green button,

789
00:34:53,070 --> 00:34:57,380
you literally just give it a class,
which we did talk about yesterday,

790
00:34:57,380 --> 00:34:59,710
of "btn btn-success."

791
00:34:59,710 --> 00:35:00,971
>> Why those words?

792
00:35:00,971 --> 00:35:03,470
Twitter, the authors of Bootstrap,
came up with those words.

793
00:35:03,470 --> 00:35:05,428
They could have called
them anything they want.

794
00:35:05,428 --> 00:35:08,480
But what you are getting now is
someone else at Twitter, in this case,

795
00:35:08,480 --> 00:35:12,360
has figured out how do you make a
button look nice and clean and green.

796
00:35:12,360 --> 00:35:15,580
They packaged up that functionality
in a CSS class, called "btn"

797
00:35:15,580 --> 00:35:19,790
and "btn-success," so that any of us can
now use it without even thinking about

798
00:35:19,790 --> 00:35:20,290
it.

799
00:35:20,290 --> 00:35:22,880
So they have abstracted away
the notion of a green button

800
00:35:22,880 --> 00:35:25,320
so we don't have to care about
implementing it ourselves.

801
00:35:25,320 --> 00:35:28,520
We can actually focus on implementing
things of interest to us.

802
00:35:28,520 --> 00:35:30,902
>> If we scroll down here.

803
00:35:30,902 --> 00:35:32,110
Error messages on the screen.

804
00:35:32,110 --> 00:35:35,440
Sometimes you want a little message
to appear on the top of the browser.

805
00:35:35,440 --> 00:35:39,729
Any of us could do this with some
effort, after yesterday's lesson,

806
00:35:39,729 --> 00:35:40,770
but why would you bother?

807
00:35:40,770 --> 00:35:42,540
That's such an uninteresting
aesthetic detail.

808
00:35:42,540 --> 00:35:44,248
Let's stand on the
shoulders of Bootstrap

809
00:35:44,248 --> 00:35:49,440
and let them give us things like this,
where we literally, to get a red box,

810
00:35:49,440 --> 00:35:53,220
just have to do a paragraph
tag with a class of-- sorry.

811
00:35:53,220 --> 00:35:57,307
"bg-danger" would give us
this reddish box instead.

812
00:35:57,307 --> 00:35:59,140
Now let's go to the
more interesting things.

813
00:35:59,140 --> 00:36:02,950
If I go back to the top of
this page and go to Components,

814
00:36:02,950 --> 00:36:05,380
now the world gets more interesting.

815
00:36:05,380 --> 00:36:08,826
For instance, very common is
drop down menus like this.

816
00:36:08,826 --> 00:36:11,560
This would be an absolute
pain to implement.

817
00:36:11,560 --> 00:36:13,610
And it wasn't that long
ago that we programmers

818
00:36:13,610 --> 00:36:16,490
would have to implement these
kinds of menus from scratch.

819
00:36:16,490 --> 00:36:20,800
>> But it's such a common paradigm
that libraries like Bootstrap

820
00:36:20,800 --> 00:36:25,230
just give you the ability to make a
drop down menu far, far more easily.

821
00:36:25,230 --> 00:36:27,850
There's no one way to do it,
but if I read the documentation

822
00:36:27,850 --> 00:36:32,100
I would see that, OK, I should use
this HTML if I want a drop down menu

823
00:36:32,100 --> 00:36:34,030
that behaves like that.

824
00:36:34,030 --> 00:36:36,690
>> Similarly, let's go to button drop down.

825
00:36:36,690 --> 00:36:38,470
So this is even fancier.

826
00:36:38,470 --> 00:36:41,800
If I want this to look like a button
but that little triangle means

827
00:36:41,800 --> 00:36:44,080
I should click on it
and get this menu, this

828
00:36:44,080 --> 00:36:45,760
is using a language called JavaScript.

829
00:36:45,760 --> 00:36:47,470
And we could all implement
this in JavaScript.

830
00:36:47,470 --> 00:36:49,720
But again, this is a wheel
you don't want to reinvent.

831
00:36:49,720 --> 00:36:52,700
You just want to take it off
the shelf library for this.

832
00:36:52,700 --> 00:36:58,145
>> Let's go to something
like progress bars.

833
00:36:58,145 --> 00:36:59,770
So something like this is kind of cool.

834
00:36:59,770 --> 00:37:02,910
If you've ever seen a progress
bar moving across the screen,

835
00:37:02,910 --> 00:37:06,380
implementing that often
is just a spinning icon.

836
00:37:06,380 --> 00:37:10,200
In fact, just as an aside, let
me go to Ajax-- what is it?

837
00:37:10,200 --> 00:37:10,710
Ajax info?

838
00:37:10,710 --> 00:37:11,720
Whoops.

839
00:37:11,720 --> 00:37:13,035
Ajaxinfo.

840
00:37:13,035 --> 00:37:14,800
Let me remember the address.

841
00:37:14,800 --> 00:37:15,820
There we go.

842
00:37:15,820 --> 00:37:19,850
>> So if you've ever seen some animation
while the page is loading, or thinking,

843
00:37:19,850 --> 00:37:25,410
or saving, or creating something, you
might see such animations as these.

844
00:37:25,410 --> 00:37:28,800
So let's look at something
like this one here,

845
00:37:28,800 --> 00:37:33,550
and let's choose a foreground color of
green, which feels kind of friendly.

846
00:37:33,550 --> 00:37:34,545
Can I click this?

847
00:37:34,545 --> 00:37:35,500
Come one.

848
00:37:35,500 --> 00:37:36,000
OK.

849
00:37:36,000 --> 00:37:38,930
We'll just go with red because
that's what we're getting.

850
00:37:38,930 --> 00:37:40,250
So here we have it.

851
00:37:40,250 --> 00:37:43,940
>> So if you've ever seen this on a screen,
whereby suddenly it appears and then

852
00:37:43,940 --> 00:37:47,550
suddenly disappears, what is
it that's implementing that?

853
00:37:47,550 --> 00:37:48,970
Well, this is just a GIF.

854
00:37:48,970 --> 00:37:52,850
G-I-F. And this is an animated
file, which just means

855
00:37:52,850 --> 00:37:54,327
it's like an old school comic book.

856
00:37:54,327 --> 00:37:57,160
There's just a bunch of different
frames that are going [STUTTERING]

857
00:37:57,160 --> 00:37:58,085
and just repeating.

858
00:37:58,085 --> 00:38:00,090
And it's creating the
illusion of movement.

859
00:38:00,090 --> 00:38:03,070
>> So as soon as a page is done
loading or doing something,

860
00:38:03,070 --> 00:38:04,610
what does a programmer do?

861
00:38:04,610 --> 00:38:07,500
Well, he or she just hides this image.

862
00:38:07,500 --> 00:38:11,536
So all a progress bar is is kind
of like a movie you're watching.

863
00:38:11,536 --> 00:38:14,660
You're sort of oblivious to the fact
that it's not actually doing anything,

864
00:38:14,660 --> 00:38:15,940
it's just moving.

865
00:38:15,940 --> 00:38:19,150
>> And then, when it's done progressing,
they just hide it or turn it off.

866
00:38:19,150 --> 00:38:21,115
And that's all the magic
that's going on there.

867
00:38:21,115 --> 00:38:22,770
Bootstrap gives you
something a little fancier,

868
00:38:22,770 --> 00:38:25,030
whereby you can actually
see a percentage as it goes,

869
00:38:25,030 --> 00:38:27,840
but it too is just sort
of a simple animation.

870
00:38:27,840 --> 00:38:32,250
>> Let's look at some final
more complex examples here.

871
00:38:32,250 --> 00:38:35,526
Something like a modal.

872
00:38:35,526 --> 00:38:36,900
Does anyone know what a modal is?

873
00:38:36,900 --> 00:38:39,880

874
00:38:39,880 --> 00:38:42,550
A modal window is generally
one that is supposed

875
00:38:42,550 --> 00:38:46,880
to take control of the foreground and
prevent you from doing anything else.

876
00:38:46,880 --> 00:38:50,290
It sort of forces the user's
attention to the middle of the screen,

877
00:38:50,290 --> 00:38:52,290
locking them out, typically,
of everything else.

878
00:38:52,290 --> 00:38:55,830
>> So if I launch this demo, the
screen will generally become gray.

879
00:38:55,830 --> 00:38:57,060
Well, how do we make it gray?

880
00:38:57,060 --> 00:38:59,080
Well, we probably just
changed the background color

881
00:38:59,080 --> 00:39:01,060
like we did yesterday
or something like that.

882
00:39:01,060 --> 00:39:03,490
Maybe it's an overlay
that semi-transparent.

883
00:39:03,490 --> 00:39:06,320
And now notice you can do
fancy things like this.

884
00:39:06,320 --> 00:39:09,930
So if you ever click on a button
and want a little pop out to appear,

885
00:39:09,930 --> 00:39:10,710
you can do that.

886
00:39:10,710 --> 00:39:12,340
And so who cares about all-- yeah?

887
00:39:12,340 --> 00:39:15,791
>> AUDIENCE: So with Bootstrap,
to get it incorporated,

888
00:39:15,791 --> 00:39:21,002
is it as simple as like yesterday
we did the CSS styles page?

889
00:39:21,002 --> 00:39:21,960
DAVID J. MALAN: Indeed.

890
00:39:21,960 --> 00:39:22,835
Really good question.

891
00:39:22,835 --> 00:39:24,480
Let me go to Getting Started.

892
00:39:24,480 --> 00:39:26,090
And yes.

893
00:39:26,090 --> 00:39:30,920
All you have to do in order to
use Bootstrap is essentially copy

894
00:39:30,920 --> 00:39:35,910
and paste these three long lines of
code into the top of your own web page--

895
00:39:35,910 --> 00:39:38,892
the head of your page--
and you're up and running.

896
00:39:38,892 --> 00:39:41,850
And there's different ways of doing
it, but this would be the simplest.

897
00:39:41,850 --> 00:39:45,190
>> So what's helpful about all of this?

898
00:39:45,190 --> 00:39:47,524
Well, if you're not so much
the implementer of a website

899
00:39:47,524 --> 00:39:50,106
but you're trying to design it,
or you want to provide someone

900
00:39:50,106 --> 00:39:53,220
with wire frame diagrams, so to speak,
or just artist's renditions of what

901
00:39:53,220 --> 00:39:56,080
you want to do, I, to this
day, will often go to a site

902
00:39:56,080 --> 00:39:58,660
like Bootstrap, where if I
want to implement something--

903
00:39:58,660 --> 00:40:02,290
like recently on campus
we wanted to implement

904
00:40:02,290 --> 00:40:06,170
a web based tool for navigating
Harvard's course catalog,

905
00:40:06,170 --> 00:40:08,770
making it easier for students
to browse through courses

906
00:40:08,770 --> 00:40:10,930
and add courses to
shopping list, so to speak,

907
00:40:10,930 --> 00:40:13,070
to kind of decide what
they wanted to take.

908
00:40:13,070 --> 00:40:16,252
>> I was trying to imagine for
myself, what ingredients would

909
00:40:16,252 --> 00:40:17,460
we want to use to build this?

910
00:40:17,460 --> 00:40:19,050
What would the user interface be like?

911
00:40:19,050 --> 00:40:22,800
And just looking through a site like
this or other such library sites,

912
00:40:22,800 --> 00:40:26,560
you can gain inspiration, because wow,
I can use this widget, and this widget,

913
00:40:26,560 --> 00:40:27,330
and this widget.

914
00:40:27,330 --> 00:40:29,080
And then really what
the programmer starts

915
00:40:29,080 --> 00:40:32,800
to do, especially in these days in this
more modern world of web programming,

916
00:40:32,800 --> 00:40:35,827
is programming is increasingly
about wiring things together.

917
00:40:35,827 --> 00:40:38,910
Sort of taking this off the shelf,
this off the shelf, this off the shelf,

918
00:40:38,910 --> 00:40:41,954
and you being the smart one
to connect all of those dots,

919
00:40:41,954 --> 00:40:45,120
but ultimately build something by again
standing on the shoulders of others,

920
00:40:45,120 --> 00:40:49,370
so that you don't spend a month
implementing a stupid drop down menu,

921
00:40:49,370 --> 00:40:52,080
which is actually hard to do if
you want it to work on Chrome,

922
00:40:52,080 --> 00:40:55,220
and IE, and Firefox, and any
number of other browsers.

923
00:40:55,220 --> 00:40:59,060
This is why there is this rich
commercial and open source software

924
00:40:59,060 --> 00:41:01,220
industry as well.

925
00:41:01,220 --> 00:41:06,810
>> AUDIENCE: So does Bootstrap get updated
and you have to then update your links?

926
00:41:06,810 --> 00:41:07,820
>> DAVID J. MALAN: It does.

927
00:41:07,820 --> 00:41:09,090
Well, yes, it does.

928
00:41:09,090 --> 00:41:12,540
Bootstrap is currently at version 3.3.6.

929
00:41:12,540 --> 00:41:16,720
And generally what you would do--
this is actually worth mentioning.

930
00:41:16,720 --> 00:41:19,200
There's what's generally
known as a semantic versioning

931
00:41:19,200 --> 00:41:20,160
system in the world.

932
00:41:20,160 --> 00:41:21,320
Not everyone does this.

933
00:41:21,320 --> 00:41:26,410
>> But if you've seen version numbers
that are of the form x.y.z--

934
00:41:26,410 --> 00:41:30,240
so for instance, the first version
of a program might be 1.0.0.

935
00:41:30,240 --> 00:41:34,970
Or if it's very, very beta, or
even alpha status, which means use

936
00:41:34,970 --> 00:41:37,620
at your own risk, it's not
really ready for prime time,

937
00:41:37,620 --> 00:41:42,080
you might even start 0.0.1
or some such designation.

938
00:41:42,080 --> 00:41:47,260
But if software starts at version
1.0, or equivalently 1.0.0,

939
00:41:47,260 --> 00:41:50,530
typically, what's common these
days-- though not omnipresent-- is

940
00:41:50,530 --> 00:41:53,520
if a company or an
individual programmer fixes

941
00:41:53,520 --> 00:41:56,140
some bug in some piece
of software that really

942
00:41:56,140 --> 00:42:01,620
was a bug, whose correction should not
impact you at all-- it doesn't change

943
00:42:01,620 --> 00:42:03,940
the program's behavior,
it just fixes something

944
00:42:03,940 --> 00:42:06,580
that was not working
properly-- you would typically

945
00:42:06,580 --> 00:42:08,890
update the z value there.

946
00:42:08,890 --> 00:42:12,900
Which means someone like Kareem
could simply go into his website,

947
00:42:12,900 --> 00:42:19,470
blindly change the version number
from 1.0.0 to 1.0.1, save it, ship it,

948
00:42:19,470 --> 00:42:21,880
and in theory, not have to
worry that he's just broken

949
00:42:21,880 --> 00:42:24,430
his website because of
some lack of functionality,

950
00:42:24,430 --> 00:42:25,870
because something else broke.

951
00:42:25,870 --> 00:42:28,740
>> Meanwhile, if I the
programmer or some company

952
00:42:28,740 --> 00:42:35,500
were to make some significant
change that adds functionality,

953
00:42:35,500 --> 00:42:40,320
I might update us to
1.1.0 because I'm actually

954
00:42:40,320 --> 00:42:42,200
changing the behavior of the library.

955
00:42:42,200 --> 00:42:44,470
I'm giving you maybe more functionality.

956
00:42:44,470 --> 00:42:48,490
Finally, if I were to actually
fundamentally change the software so

957
00:42:48,490 --> 00:42:54,380
much that it will break many
users websites or applications,

958
00:42:54,380 --> 00:42:59,550
then I'm obliged, in this model, to
upgrade the major version number too,

959
00:42:59,550 --> 00:43:01,059
which is a breaking change.

960
00:43:01,059 --> 00:43:03,725
In other words, I might have
discontinued support for those drop

961
00:43:03,725 --> 00:43:04,350
down menu.

962
00:43:04,350 --> 00:43:07,790
So if you upgrade to 2.0, half
your website might stop working.

963
00:43:07,790 --> 00:43:10,950
And this is sort of a signal
to the community as to what's

964
00:43:10,950 --> 00:43:13,223
involved in making an upgrade.

965
00:43:13,223 --> 00:43:16,710

966
00:43:16,710 --> 00:43:18,020
A good opportunity to raise.

967
00:43:18,020 --> 00:43:18,718
Other questions?

968
00:43:18,718 --> 00:43:21,761

969
00:43:21,761 --> 00:43:22,260
All right.

970
00:43:22,260 --> 00:43:26,945
Well let's take a look at one final
topic in this segment of programming

971
00:43:26,945 --> 00:43:30,640
of technology stacks,
namely related to mobile.

972
00:43:30,640 --> 00:43:36,232
>> So in the world of cell phones today
you have-- and iPads, and surfaces,

973
00:43:36,232 --> 00:43:37,940
and all those kinds
of devices-- you have

974
00:43:37,940 --> 00:43:40,950
a lot of choices when
it comes to implementing

975
00:43:40,950 --> 00:43:47,270
an application or a website for
your customer's mobile devices.

976
00:43:47,270 --> 00:43:51,570
So just to state the
obvious, perhaps these days,

977
00:43:51,570 --> 00:43:54,960
what are the platforms to
develop for in the mobile space?

978
00:43:54,960 --> 00:43:59,650
What devices might you want to
support with your app or website?

979
00:43:59,650 --> 00:44:00,317
>> AUDIENCE: Apple.

980
00:44:00,317 --> 00:44:01,108
DAVID J. MALAN: OK.

981
00:44:01,108 --> 00:44:01,820
So Apple devices.

982
00:44:01,820 --> 00:44:06,740
So that means iPhone, and that
means iPad, and maybe even iPod.

983
00:44:06,740 --> 00:44:07,627
What else?

984
00:44:07,627 --> 00:44:11,006

985
00:44:11,006 --> 00:44:11,505
Olivier?

986
00:44:11,505 --> 00:44:11,970
>> AUDIENCE: Android.

987
00:44:11,970 --> 00:44:13,111
>> DAVID J. MALAN: Android.

988
00:44:13,111 --> 00:44:13,610
OK.

989
00:44:13,610 --> 00:44:17,335
So Android phones, Android
tablets, the Android market

990
00:44:17,335 --> 00:44:21,240
is even messier because-- and
even Apple is becoming messy.

991
00:44:21,240 --> 00:44:23,960
Whereas once upon a time
iPhone was a certain size,

992
00:44:23,960 --> 00:44:26,560
and iPad was a certain size,
and iPod was a certain size, now

993
00:44:26,560 --> 00:44:33,420
we have iPad Minis, and the thin
ones, and the iPhone 6 Plus and 6.

994
00:44:33,420 --> 00:44:34,407
It's becoming a mess.

995
00:44:34,407 --> 00:44:35,740
It's becoming the Android world.

996
00:44:35,740 --> 00:44:39,030
>> And I say this with sort of rolling
my eyes because from a developer's

997
00:44:39,030 --> 00:44:41,680
perspective, it is a
pain in the neck when

998
00:44:41,680 --> 00:44:45,686
you don't have Steve Jobs'
vision of absolute control

999
00:44:45,686 --> 00:44:47,060
over all of these specifications.

1000
00:44:47,060 --> 00:44:49,726
Apple still does because they're
the ones building the hardware.

1001
00:44:49,726 --> 00:44:52,690
But it's a nice thing, if
I'm a software developer,

1002
00:44:52,690 --> 00:44:54,520
to just know that my
iPhone is always going

1003
00:44:54,520 --> 00:44:56,850
to be this big because
that means I always know

1004
00:44:56,850 --> 00:44:58,847
how much screen real estate I have.

1005
00:44:58,847 --> 00:45:01,180
So if I want to put an icon
in the top left-hand corner,

1006
00:45:01,180 --> 00:45:04,530
it's going to be in the exact same
place on every single customer's device.

1007
00:45:04,530 --> 00:45:07,140
>> But in the world of iPhone
6s and iPhone 6 Pluses

1008
00:45:07,140 --> 00:45:10,570
and in the world of Android
phones, it's all over the map.

1009
00:45:10,570 --> 00:45:13,580
And so it makes it harder to program
things, especially user interfaces,

1010
00:45:13,580 --> 00:45:18,270
because now you have to start arranging
your user interfaces relatively, not

1011
00:45:18,270 --> 00:45:19,730
absolutely.

1012
00:45:19,730 --> 00:45:23,524
And the same has been true on browsers,
and desktops, and laptops for years

1013
00:45:23,524 --> 00:45:25,690
because you, of course,
have different screen sizes.

1014
00:45:25,690 --> 00:45:26,189
>> What else?

1015
00:45:26,189 --> 00:45:30,170
You might have surfaces,
like from Microsoft.

1016
00:45:30,170 --> 00:45:31,270
You might have--

1017
00:45:31,270 --> 00:45:32,270
AUDIENCE: Windows phone.

1018
00:45:32,270 --> 00:45:32,816
DAVID J. MALAN: What's that?

1019
00:45:32,816 --> 00:45:33,570
AUDIENCE: Windows phone.

1020
00:45:33,570 --> 00:45:34,403
DAVID J. MALAN: Yes.

1021
00:45:34,403 --> 00:45:37,570
So windows phones can still be found.

1022
00:45:37,570 --> 00:45:41,840
Kind of sort of BlackBerrys,
but they keep trying.

1023
00:45:41,840 --> 00:45:43,900
And then bunches of other devices.

1024
00:45:43,900 --> 00:45:48,020
So for the most part, let's
say these are the ones

1025
00:45:48,020 --> 00:45:49,520
to care about at the moment.

1026
00:45:49,520 --> 00:45:51,890
Certainly the Apple stuff,
certainly the Android stuff,

1027
00:45:51,890 --> 00:45:55,640
and among Windows, like surface tablets
seem to be catching on pretty well.

1028
00:45:55,640 --> 00:45:58,030
>> And so among those devices,
if you want to roll out,

1029
00:45:58,030 --> 00:46:02,677
let's say, a mobile presence for your
company, what kinds of design decisions

1030
00:46:02,677 --> 00:46:03,510
do you have to make?

1031
00:46:03,510 --> 00:46:06,350
Well, we already said
in the Apple world,

1032
00:46:06,350 --> 00:46:08,790
there is at least two languages
that are typically used.

1033
00:46:08,790 --> 00:46:10,260
One was called what?

1034
00:46:10,260 --> 00:46:11,260
>> AUDIENCE: Objective-C.

1035
00:46:11,260 --> 00:46:11,560
>> DAVID J. MALAN: Yeah.

1036
00:46:11,560 --> 00:46:13,600
So Objective-C, which is the older one.

1037
00:46:13,600 --> 00:46:17,720
It's also the language that many Mac
applications are still written in.

1038
00:46:17,720 --> 00:46:18,964
Then the other newer one was?

1039
00:46:18,964 --> 00:46:19,630
AUDIENCE: Swift.

1040
00:46:19,630 --> 00:46:20,590
DAVID J. MALAN: Swift.

1041
00:46:20,590 --> 00:46:23,900
And those are the kind of
two to know to impress folks.

1042
00:46:23,900 --> 00:46:28,238
Then in the Android world,
what language does Android use?

1043
00:46:28,238 --> 00:46:30,618
>> AUDIENCE: C#?

1044
00:46:30,618 --> 00:46:31,570
>> AUDIENCE: Java.

1045
00:46:31,570 --> 00:46:34,230
>> DAVID J. MALAN: Java is
the language of "du jour."

1046
00:46:34,230 --> 00:46:37,950
In the Windows world, sure,
we'll say C# in that case.

1047
00:46:37,950 --> 00:46:40,590
So already this is kind of
annoying, because what's

1048
00:46:40,590 --> 00:46:43,070
the takeaway for a business
owner or someone who just

1049
00:46:43,070 --> 00:46:44,570
wants to roll out a mobile presence?

1050
00:46:44,570 --> 00:46:45,220
Like, damn it?

1051
00:46:45,220 --> 00:46:48,590
Like, if I want to support
a fairly broad user base,

1052
00:46:48,590 --> 00:46:52,180
I have to write, it would seem,
three separate applications.

1053
00:46:52,180 --> 00:46:55,630
One in one of these languages,
one in Java, one in C#.

1054
00:46:55,630 --> 00:46:59,620
And even if I want the functionality
to be identical, it doesn't matter.

1055
00:46:59,620 --> 00:47:02,940
I still need to use different
languages because Apple, and Microsoft,

1056
00:47:02,940 --> 00:47:06,084
and Google all support
different environments.

1057
00:47:06,084 --> 00:47:07,750
And this has been a challenge for years.

1058
00:47:07,750 --> 00:47:10,100
Back in the day, when
people used to buy software

1059
00:47:10,100 --> 00:47:12,230
at a computer store in
shrink wrapped boxes,

1060
00:47:12,230 --> 00:47:14,470
you would either have to
reach for the Mac shelf,

1061
00:47:14,470 --> 00:47:19,040
or for-- maybe this very small Mac
shelf-- or the larger Windows shelf

1062
00:47:19,040 --> 00:47:19,980
and buy some software.

1063
00:47:19,980 --> 00:47:22,813
And very often, there wasn't even
anything for you on the Mac shelf.

1064
00:47:22,813 --> 00:47:23,430
Why?

1065
00:47:23,430 --> 00:47:26,900
Well, companies decided if 90%
of the world, 95% of the world

1066
00:47:26,900 --> 00:47:31,180
has PCs, why bother even
implementing things on Mac OS?

1067
00:47:31,180 --> 00:47:34,370
>> As an aside-- a total
digression-- why is it

1068
00:47:34,370 --> 00:47:40,960
that Mac seems so impervious to viruses,
and worms, and security threats?

1069
00:47:40,960 --> 00:47:44,040
Is Apple better at this?

1070
00:47:44,040 --> 00:47:45,934
Better at keeping computers secure?

1071
00:47:45,934 --> 00:47:47,750
>> AUDIENCE: Smaller audience?

1072
00:47:47,750 --> 00:47:50,720
>> DAVID J. MALAN: That's
probably the bigger bit to it.

1073
00:47:50,720 --> 00:47:54,740
So the many users of Macs have
long claimed, oh, use a Mac,

1074
00:47:54,740 --> 00:47:57,630
you'll be immune to viruses, and
worms, and all of these things

1075
00:47:57,630 --> 00:47:59,180
that have long plagued PCs.

1076
00:47:59,180 --> 00:48:02,050
That might be because Apple
has better programmers

1077
00:48:02,050 --> 00:48:05,250
and they write better software, or the
operating system was better designed.

1078
00:48:05,250 --> 00:48:06,870
Maybe, but probably not.

1079
00:48:06,870 --> 00:48:10,840
>> It's probably that when you're
a 12-year-old, or a 30 something

1080
00:48:10,840 --> 00:48:13,510
sort of sitting at home writing
malicious software to take over

1081
00:48:13,510 --> 00:48:17,480
the world, you're going to go after
the much larger target audience.

1082
00:48:17,480 --> 00:48:20,590
The 95% of the world who might
be running Windows or some

1083
00:48:20,590 --> 00:48:21,740
variants thereof.

1084
00:48:21,740 --> 00:48:23,800
So there's a little bit on both sides.

1085
00:48:23,800 --> 00:48:25,710
But to their credit,
Apple, to my knowledge,

1086
00:48:25,710 --> 00:48:28,270
hasn't really touted themselves
as being more secure,

1087
00:48:28,270 --> 00:48:32,110
since you're just inviting drama if
you make that claim, I would think.

1088
00:48:32,110 --> 00:48:32,610
>> All right.

1089
00:48:32,610 --> 00:48:36,490
Without getting too far down
that, how do we solve this?

1090
00:48:36,490 --> 00:48:39,670
Do you have to buy or do you have to
pay three different people to develop

1091
00:48:39,670 --> 00:48:41,540
your apps?

1092
00:48:41,540 --> 00:48:42,870
Do you pick one over the other?

1093
00:48:42,870 --> 00:48:45,460
What should guide your
thinking here do you think?

1094
00:48:45,460 --> 00:48:47,960

1095
00:48:47,960 --> 00:48:48,460
Kareem?

1096
00:48:48,460 --> 00:48:51,001

1097
00:48:51,001 --> 00:48:51,500
Nope.

1098
00:48:51,500 --> 00:48:54,190
Someone else.

1099
00:48:54,190 --> 00:48:56,885
>> AUDIENCE: Just come with the hardware.

1100
00:48:56,885 --> 00:48:58,510
DAVID J. MALAN: Come with the hardware?

1101
00:48:58,510 --> 00:48:59,533
What do you mean?

1102
00:48:59,533 --> 00:49:01,282
>> AUDIENCE: For the
environment. [INAUDIBLE]

1103
00:49:01,282 --> 00:49:04,867

1104
00:49:04,867 --> 00:49:06,200
DAVID J. MALAN: So that is true.

1105
00:49:06,200 --> 00:49:09,280
But your customers,
meanwhile, might have iPhones,

1106
00:49:09,280 --> 00:49:13,530
they might have Android phones, they
might have tablets made by Microsoft.

1107
00:49:13,530 --> 00:49:19,040
So how do you have a mobile strategy
for all of these different users?

1108
00:49:19,040 --> 00:49:23,320
It would seem that if it costs,
let's say $1,000 to make an iPhone

1109
00:49:23,320 --> 00:49:25,940
application, it's going
to cost you $2,000 to make

1110
00:49:25,940 --> 00:49:29,250
an iPhone application and an
Android application, or $3,000

1111
00:49:29,250 --> 00:49:31,407
to also support Windows devices as well.

1112
00:49:31,407 --> 00:49:33,990
That's probably quite an
understatement, and it might not even

1113
00:49:33,990 --> 00:49:36,050
be a linear relationship like that.

1114
00:49:36,050 --> 00:49:41,065
>> AUDIENCE: If you want to have an app or
not, you can have responsive website.

1115
00:49:41,065 --> 00:49:41,940
DAVID J. MALAN: Good.

1116
00:49:41,940 --> 00:49:46,255
AUDIENCE: Or you can have a native app.

1117
00:49:46,255 --> 00:49:47,130
DAVID J. MALAN: Yeah.

1118
00:49:47,130 --> 00:49:50,260
So in all this context here,
we've been talking about what

1119
00:49:50,260 --> 00:49:53,190
people would call native applications.

1120
00:49:53,190 --> 00:49:58,040
That is applications that are written
in the native language of that device.

1121
00:49:58,040 --> 00:50:02,190
So native Objective-C or Swift
code, or in Java, or in C#.

1122
00:50:02,190 --> 00:50:06,900
Which means when you download, let's
say Snapchat, a popular application,

1123
00:50:06,900 --> 00:50:10,060
or when you download
Facebook for a phone,

1124
00:50:10,060 --> 00:50:13,270
you are downloading either the
version written for your iPhone,

1125
00:50:13,270 --> 00:50:16,830
or written for your Android phone,
or written for your surface.

1126
00:50:16,830 --> 00:50:18,500
>> But there is an alternative.

1127
00:50:18,500 --> 00:50:26,020
As Olivier was alluding to,
you can actually use HTML 5

1128
00:50:26,020 --> 00:50:33,440
instead, using what's called a web
application, whereby you simply

1129
00:50:33,440 --> 00:50:35,940
implement your mobile presence
and any functionality.

1130
00:50:35,940 --> 00:50:37,030
What do I mean by mobile presence?

1131
00:50:37,030 --> 00:50:39,800
Like your website that has your
contact information, a list of all

1132
00:50:39,800 --> 00:50:43,049
your products, maybe it has a shopping
cart, maybe you sell things through it.

1133
00:50:43,049 --> 00:50:46,850
Whatever your application is, you
implement it, not in Objective-C,

1134
00:50:46,850 --> 00:50:51,200
or Swift, or Java, or C#, but in HTML
5, which was the language we looked

1135
00:50:51,200 --> 00:50:55,470
at yesterday, with JavaScript and CSS.

1136
00:50:55,470 --> 00:50:58,700
>> And what's nice about those
three is that to run them,

1137
00:50:58,700 --> 00:51:01,981
you need just what piece of software?

1138
00:51:01,981 --> 00:51:02,980
AUDIENCE: A web browser.

1139
00:51:02,980 --> 00:51:04,229
DAVID J. MALAN: A web browser.

1140
00:51:04,229 --> 00:51:07,610
And the best I know, all of these
devices come with web browsers,

1141
00:51:07,610 --> 00:51:10,480
so the user hasn't have to
install something special.

1142
00:51:10,480 --> 00:51:12,920
So you can just tell your
audience, your customers,

1143
00:51:12,920 --> 00:51:16,590
go to acme.com in your
browser and you'll just

1144
00:51:16,590 --> 00:51:19,730
have a web based experience
that still fills the screen,

1145
00:51:19,730 --> 00:51:25,100
but you don't have to worry about all of
these costs and all of this complexity.

1146
00:51:25,100 --> 00:51:28,600
But surely there is going
to be a catch here, right?

1147
00:51:28,600 --> 00:51:31,740
Especially if I point out
that a couple years ago,

1148
00:51:31,740 --> 00:51:35,700
the very first version of
Facebook's mobile application

1149
00:51:35,700 --> 00:51:38,810
was mostly an HTML 5 application.

1150
00:51:38,810 --> 00:51:42,490
And they have, more
recently, reimplemented it

1151
00:51:42,490 --> 00:51:44,700
in their other applications.

1152
00:51:44,700 --> 00:51:46,990
>> So why would you not
immediately want to say,

1153
00:51:46,990 --> 00:51:49,190
well, obviously we're going to do this?

1154
00:51:49,190 --> 00:51:51,560
What might the hidden costs be?

1155
00:51:51,560 --> 00:51:52,477
>> AUDIENCE: Performance.

1156
00:51:52,477 --> 00:51:53,643
DAVID J. MALAN: Performance?

1157
00:51:53,643 --> 00:51:54,567
How do you mean?

1158
00:51:54,567 --> 00:52:01,040
>> AUDIENCE: The native app
has more performance.

1159
00:52:01,040 --> 00:52:03,850
>> DAVID J. MALAN: So that is
true, for a couple of reasons.

1160
00:52:03,850 --> 00:52:05,270
We can oversimplify the answer.

1161
00:52:05,270 --> 00:52:08,061
And recall our discussion of
interpreted versus compiled languages.

1162
00:52:08,061 --> 00:52:12,030
This is HTML 5 and with it, just to be
clear, JavaScript-- commonly written

1163
00:52:12,030 --> 00:52:15,880
JS-- and CSS are all
interpreted languages,

1164
00:52:15,880 --> 00:52:21,020
even though only JavaScript
is a programming language.

1165
00:52:21,020 --> 00:52:25,820
>> And so versus these, which some of these
are compiled, at least these three--

1166
00:52:25,820 --> 00:52:29,990
Objective-C, Java and C#-- these,
in theory, should just be faster.

1167
00:52:29,990 --> 00:52:31,670
But there's another reality for--

1168
00:52:31,670 --> 00:52:32,440
>> AUDIENCE: Functionalities?

1169
00:52:32,440 --> 00:52:32,830
>> DAVID J. MALAN: What's that?

1170
00:52:32,830 --> 00:52:34,060
>> AUDIENCE: Functionalities.

1171
00:52:34,060 --> 00:52:34,570
>> DAVID J. MALAN: Functionality?

1172
00:52:34,570 --> 00:52:35,070
How so?

1173
00:52:35,070 --> 00:52:37,305
AUDIENCE: Use the camera
off your phone or something.

1174
00:52:37,305 --> 00:52:41,471
You can use those with the browser.

1175
00:52:41,471 --> 00:52:42,470
DAVID J. MALAN: Exactly.

1176
00:52:42,470 --> 00:52:43,011
They're sec--

1177
00:52:43,011 --> 00:52:45,034
AUDIENCE: [INAUDIBLE]

1178
00:52:45,034 --> 00:52:46,700
DAVID J. MALAN: That's another good one.

1179
00:52:46,700 --> 00:52:49,230
There's features that come
with mobile phones today

1180
00:52:49,230 --> 00:52:53,840
that are not, by design, for security
reasons, accessible to web browsers.

1181
00:52:53,840 --> 00:52:56,410
Because it would be kind of
a creepy thing if just when

1182
00:52:56,410 --> 00:53:00,710
you visit google.com, or
cnn.com, or any website.com,

1183
00:53:00,710 --> 00:53:04,490
that that website has the power to turn
on your camera, take a picture of you,

1184
00:53:04,490 --> 00:53:06,010
and then use it.

1185
00:53:06,010 --> 00:53:09,280
But you wouldn't want a random website
that you visit for the very first time

1186
00:53:09,280 --> 00:53:10,690
to have that capability.

1187
00:53:10,690 --> 00:53:13,460
>> And so what phone
manufacturers typically do

1188
00:53:13,460 --> 00:53:17,230
is they just deny access
to that kind of information

1189
00:53:17,230 --> 00:53:20,650
to a browser, which means you
can't implement the camera.

1190
00:53:20,650 --> 00:53:24,180
You can't implement push notifications,
the beeps that you get on your screen

1191
00:53:24,180 --> 00:53:26,120
with short messages.

1192
00:53:26,120 --> 00:53:31,350
And in fact, even GPS is only kind
of sort of available to web browsers.

1193
00:53:31,350 --> 00:53:34,140
If you've ever, on a laptop
or on a mobile device,

1194
00:53:34,140 --> 00:53:38,770
pulled up something like maybe
cnn.com, but also local news stations

1195
00:53:38,770 --> 00:53:43,890
tend to do this, you're prompted
often with a message-- foxnews.com

1196
00:53:43,890 --> 00:53:45,170
wants to know your location.

1197
00:53:45,170 --> 00:53:46,610
Approve or deny.

1198
00:53:46,610 --> 00:53:52,070
>> Well, the browser is trying to access
your GPS information from your phone.

1199
00:53:52,070 --> 00:53:54,740
But thankfully Microsoft,
and Apple, and Google

1200
00:53:54,740 --> 00:53:57,330
have decided that feels like
it's a useful situation,

1201
00:53:57,330 --> 00:53:59,461
we want Google Maps and
other tools to work,

1202
00:53:59,461 --> 00:54:02,710
but we don't want to creep people out
by just enabling any website to do this.

1203
00:54:02,710 --> 00:54:05,934
So let's sort of meet
halfway and prompt the user.

1204
00:54:05,934 --> 00:54:08,850
But that's not necessarily the case
with all hardware, like the camera

1205
00:54:08,850 --> 00:54:10,680
and with push
notifications and the like,

1206
00:54:10,680 --> 00:54:13,650
so you might have to
sacrifice certain features.

1207
00:54:13,650 --> 00:54:15,100
But performance too.

1208
00:54:15,100 --> 00:54:18,020
It's becoming less
noticeable nowadays, perhaps

1209
00:54:18,020 --> 00:54:22,400
as LTE catches on and faster
internet speeds on phones,

1210
00:54:22,400 --> 00:54:24,110
but you can kind of feel the difference.

1211
00:54:24,110 --> 00:54:28,190
Like a web based application
just feels slower, typically,

1212
00:54:28,190 --> 00:54:31,100
than a native application, partly
because a web based application

1213
00:54:31,100 --> 00:54:32,680
by definition is on the internet.

1214
00:54:32,680 --> 00:54:35,610
It's talking to the servers on the web.

1215
00:54:35,610 --> 00:54:39,590
And if your network connection is
slow, even scrolling might be slow.

1216
00:54:39,590 --> 00:54:43,710
>> But a native application, you have
already pre-downloaded-- probably

1217
00:54:43,710 --> 00:54:45,680
when you were at home
from the app store,

1218
00:54:45,680 --> 00:54:47,900
or you at least pre-downloaded
it in its entirety

1219
00:54:47,900 --> 00:54:49,640
earlier, whatever your
connection speed--

1220
00:54:49,640 --> 00:54:52,530
and so now you have all of the
bits that you generally need.

1221
00:54:52,530 --> 00:54:55,090
Except maybe some data
that comes from a server.

1222
00:54:55,090 --> 00:54:57,130
>> So these are trade-offs here.

1223
00:54:57,130 --> 00:54:59,980
There's kind of a middle
compromise, in fact.

1224
00:54:59,980 --> 00:55:00,907
And I think you--

1225
00:55:00,907 --> 00:55:02,895
>> AUDIENCE: Use the data offline.

1226
00:55:02,895 --> 00:55:06,355
In the native apps, you can [INAUDIBLE]

1227
00:55:06,355 --> 00:55:07,480
DAVID J. MALAN: Absolutely.

1228
00:55:07,480 --> 00:55:09,730
So there's the offline issue,
which is really annoying

1229
00:55:09,730 --> 00:55:13,120
if you can't play some game or use
some software just because you're

1230
00:55:13,120 --> 00:55:15,110
in a basement somewhere
or in an elevator.

1231
00:55:15,110 --> 00:55:18,700
A native application is resilient
with higher probability against that,

1232
00:55:18,700 --> 00:55:20,990
assuming you have all the
data you need locally.

1233
00:55:20,990 --> 00:55:22,900
>> So there is a third option here.

1234
00:55:22,900 --> 00:55:30,270
And let's draw the spectrum as
native app here and web app here.

1235
00:55:30,270 --> 00:55:32,460
And what's in the middle
is something called--

1236
00:55:32,460 --> 00:55:35,410
and I think you might have
used the word before, maybe?

1237
00:55:35,410 --> 00:55:37,170
Hybrid application.

1238
00:55:37,170 --> 00:55:40,980
And as the word implies,
it's something in the middle.

1239
00:55:40,980 --> 00:55:46,230
It's kind of a web application and
it's kind of a native application.

1240
00:55:46,230 --> 00:55:47,690
>> And what does this mean?

1241
00:55:47,690 --> 00:55:51,750
It turns out there are frameworks--
to use a term from earlier-- software

1242
00:55:51,750 --> 00:55:55,860
that other people have written
for every one of these platforms.

1243
00:55:55,860 --> 00:55:57,500
These and yet other devices.

1244
00:55:57,500 --> 00:56:02,390
In fact, let me go to PhoneGap,
which is one such framework that I

1245
00:56:02,390 --> 00:56:04,520
believe Adobe owns now.

1246
00:56:04,520 --> 00:56:07,830
Let me go to Getting Started.

1247
00:56:07,830 --> 00:56:09,430
Let's see.

1248
00:56:09,430 --> 00:56:12,450
See if I can see a list of tools.

1249
00:56:12,450 --> 00:56:13,150
Hardware.

1250
00:56:13,150 --> 00:56:15,845
Getting Started.

1251
00:56:15,845 --> 00:56:17,570
PhoneGap hardware.

1252
00:56:17,570 --> 00:56:18,672
>> Let's see.

1253
00:56:18,672 --> 00:56:23,459
PhoneGap hardware access.

1254
00:56:23,459 --> 00:56:26,125
Let me see if we can find a little
chart that they used to have.

1255
00:56:26,125 --> 00:56:29,170

1256
00:56:29,170 --> 00:56:31,640
This is on another site.

1257
00:56:31,640 --> 00:56:32,525
Is this useful?

1258
00:56:32,525 --> 00:56:33,030
No.

1259
00:56:33,030 --> 00:56:36,330
That's gonna waste our time there.

1260
00:56:36,330 --> 00:56:40,185
PhoneGap hardware.

1261
00:56:40,185 --> 00:56:40,685
Devices.

1262
00:56:40,685 --> 00:56:45,190

1263
00:56:45,190 --> 00:56:48,030
Device API.

1264
00:56:48,030 --> 00:56:49,270
Nope, they've moved it.

1265
00:56:49,270 --> 00:56:50,070
>> PhoneGap.

1266
00:56:50,070 --> 00:56:54,964
Let's go one last look at this
and see if I can show you.

1267
00:56:54,964 --> 00:56:55,630
Getting Started.

1268
00:56:55,630 --> 00:56:58,160

1269
00:56:58,160 --> 00:56:59,020
Install PhoneGap.

1270
00:56:59,020 --> 00:57:02,310

1271
00:57:02,310 --> 00:57:03,270
Install mobile app.

1272
00:57:03,270 --> 00:57:04,320
Come on.

1273
00:57:04,320 --> 00:57:07,220

1274
00:57:07,220 --> 00:57:08,580
They've reorganized everything.

1275
00:57:08,580 --> 00:57:09,750
All right.

1276
00:57:09,750 --> 00:57:11,370
Oh, all right.

1277
00:57:11,370 --> 00:57:12,550
Well, here we go.

1278
00:57:12,550 --> 00:57:16,130
This isn't all that enlightening, but
this is what I was kind of looking for.

1279
00:57:16,130 --> 00:57:20,940
>> So PhoneGap is a framework that you
can download for free that gives you

1280
00:57:20,940 --> 00:57:22,750
some starter code, essentially.

1281
00:57:22,750 --> 00:57:26,600
So some code that they have written
that doesn't do much of anything.

1282
00:57:26,600 --> 00:57:29,610
But what it gives you
essentially is the equivalent

1283
00:57:29,610 --> 00:57:34,910
of an application that just puts a
big rectangle on the user's screen.

1284
00:57:34,910 --> 00:57:38,040
It does not put a URL bar, like a
browser, doesn't put an address.

1285
00:57:38,040 --> 00:57:39,650
It just puts a big rectangle.

1286
00:57:39,650 --> 00:57:43,230
And you configure this big
rectangle, underneath the hood,

1287
00:57:43,230 --> 00:57:50,780
to actually go to acme.com, or maybe
m.acme.com, for mobile.acme.com,

1288
00:57:50,780 --> 00:57:52,910
but the user doesn't know
they're at that address.

1289
00:57:52,910 --> 00:57:55,520
All they see is the
contents of the web page.

1290
00:57:55,520 --> 00:57:59,822
>> But what's nice about this being
a hybrid app is that what PhoneGap

1291
00:57:59,822 --> 00:58:03,030
and other companies are giving you is
they're giving you a little bit of code

1292
00:58:03,030 --> 00:58:05,760
in Objective-C or Swift, or
a little bit of code in Java,

1293
00:58:05,760 --> 00:58:08,320
or a little bit of code
in C#, and essentially,

1294
00:58:08,320 --> 00:58:12,990
all you have to provide is minimally the
address of your web based application.

1295
00:58:12,990 --> 00:58:15,750
And then you bundle this
all together and you

1296
00:58:15,750 --> 00:58:20,670
have it either access your
site via the internet,

1297
00:58:20,670 --> 00:58:24,060
or you even cache a local
copy inside the application,

1298
00:58:24,060 --> 00:58:28,690
and then you save your application
in iPhone format, Android phone

1299
00:58:28,690 --> 00:58:32,030
format, surface format, or
any number of other devices.

1300
00:58:32,030 --> 00:58:34,960
>> You upload each of those versions
to the Google Play Store,

1301
00:58:34,960 --> 00:58:37,690
to the App Store, to the
Windows Store, and so forth.

1302
00:58:37,690 --> 00:58:41,570
And now, you can have all of your
audiences download truly a native app,

1303
00:58:41,570 --> 00:58:44,250
albeit most of the code was
written by someone else,

1304
00:58:44,250 --> 00:58:49,090
but the contents of that native app all
come from, typically, your own website.

1305
00:58:49,090 --> 00:58:53,950
So you continue writing your website
in HTML, JavaScript, and CSS.

1306
00:58:53,950 --> 00:58:56,400
>> So why blur these lines?

1307
00:58:56,400 --> 00:59:00,240
Why have a hybrid application
that's kind of native, but also

1308
00:59:00,240 --> 00:59:02,569
kind of web based?

1309
00:59:02,569 --> 00:59:04,610
What's the whole point of
adding this complexity?

1310
00:59:04,610 --> 00:59:07,180
I mean, even still, just from
glancing through this page,

1311
00:59:07,180 --> 00:59:11,790
the Getting Started guide feels like
it's got a whole lot of steps for me

1312
00:59:11,790 --> 00:59:13,514
to do before I can--

1313
00:59:13,514 --> 00:59:14,430
AUDIENCE: Reusability?

1314
00:59:14,430 --> 00:59:14,960
DAVID J. MALAN: Reusability?

1315
00:59:14,960 --> 00:59:15,618
What do you mean?

1316
00:59:15,618 --> 00:59:16,826
>> AUDIENCE: Of the source code.

1317
00:59:16,826 --> 00:59:19,438
So the same code would run on
all the different platforms.

1318
00:59:19,438 --> 00:59:20,313
DAVID J. MALAN: Yeah.

1319
00:59:20,313 --> 00:59:21,188
AUDIENCE: [INAUDIBLE]

1320
00:59:21,188 --> 00:59:23,200

1321
00:59:23,200 --> 00:59:24,200
DAVID J. MALAN: Perfect.

1322
00:59:24,200 --> 00:59:26,930
If time is tight and if you
don't have that many developers--

1323
00:59:26,930 --> 00:59:28,900
maybe you have one developer
and he or she certainly

1324
00:59:28,900 --> 00:59:31,050
doesn't know all of these
environments-- certainly not well,

1325
00:59:31,050 --> 00:59:33,341
and certainly can't program
in all three simultaneously

1326
00:59:33,341 --> 00:59:35,970
and ship three products in
the time allowed for one,

1327
00:59:35,970 --> 00:59:40,360
you can have him or her build everything
in HTML and JavaScript and CSS,

1328
00:59:40,360 --> 00:59:43,260
and then learn a tiny little
bit about native apps,

1329
00:59:43,260 --> 00:59:45,930
just enough to download
a framework like this,

1330
00:59:45,930 --> 00:59:48,750
to then upload your product to
all of the various app stores

1331
00:59:48,750 --> 00:59:51,700
so that you now have
a native application.

1332
00:59:51,700 --> 00:59:54,090
>> So that seems like a win-win,
but again, to be clear,

1333
00:59:54,090 --> 00:59:56,540
what are the potential
costs or the gotchas?

1334
00:59:56,540 --> 01:00:00,292

1335
01:00:00,292 --> 01:00:01,209
>> AUDIENCE: Performance?

1336
01:00:01,209 --> 01:00:02,083
DAVID J. MALAN: Yeah.

1337
01:00:02,083 --> 01:00:02,959
Performance.

1338
01:00:02,959 --> 01:00:04,250
It's hard to describe verbally.

1339
01:00:04,250 --> 01:00:07,590
So if you just take on
faith a mobile application,

1340
01:00:07,590 --> 01:00:11,430
a web application will
typically perform more slowly.

1341
01:00:11,430 --> 01:00:16,500
It might not look quite right, because
in iPhone, and in Android phones,

1342
01:00:16,500 --> 01:00:19,210
and Windows devices, there's
always a sort of default look

1343
01:00:19,210 --> 01:00:21,780
and feel to all of the
buttons and the menus.

1344
01:00:21,780 --> 01:00:25,160
>> And companies in the web, can try
to approximate those aesthetics

1345
01:00:25,160 --> 01:00:28,329
with libraries like Bootstrap,
but the user-- an astute user--

1346
01:00:28,329 --> 01:00:30,620
is going to know that
something's not quite right here.

1347
01:00:30,620 --> 01:00:32,510
And that's fine, maybe
that's not a big deal.

1348
01:00:32,510 --> 01:00:35,500
But the performance issue
absolutely is a big deal.

1349
01:00:35,500 --> 01:00:39,400
Native applications will tend to just
be much more responsive and therefore

1350
01:00:39,400 --> 01:00:39,946
better.

1351
01:00:39,946 --> 01:00:42,070
And so, what then might be
the best of both worlds?

1352
01:00:42,070 --> 01:00:44,584
If you're especially a small
company or a small group,

1353
01:00:44,584 --> 01:00:47,000
you don't have the resources
to develop an app in parallel

1354
01:00:47,000 --> 01:00:50,480
on all three platforms, and frankly,
feels like that's a bad idea anyway

1355
01:00:50,480 --> 01:00:53,526
because if you roll it out and on
all three simultaneously realize,

1356
01:00:53,526 --> 01:00:56,400
we should have added some features
or done something differently, now

1357
01:00:56,400 --> 01:00:59,530
you have to fix it in
three places, not one.

1358
01:00:59,530 --> 01:01:02,390
What's maybe the optimal
strategy here overall,

1359
01:01:02,390 --> 01:01:04,130
if resources and time are tight?

1360
01:01:04,130 --> 01:01:06,420
>> AUDIENCE: Just do it on iOS.

1361
01:01:06,420 --> 01:01:08,390
>> DAVID J. MALAN: That's not unreasonable.

1362
01:01:08,390 --> 01:01:10,670
iPhones, at least in the
US, are super popular.

1363
01:01:10,670 --> 01:01:13,820
Android still seems to have dominant
market share, globally, overall.

1364
01:01:13,820 --> 01:01:16,740
So you are not
necessarily representative

1365
01:01:16,740 --> 01:01:19,210
of the entirety of the globe this week.

1366
01:01:19,210 --> 01:01:21,180
But that's absolutely one decision.

1367
01:01:21,180 --> 01:01:23,620
I mean, on campus here I
think some atrocious number

1368
01:01:23,620 --> 01:01:26,600
or percentage of undergraduates
have iPhones and not Android phones.

1369
01:01:26,600 --> 01:01:28,490
But abroad, it's kind of the opposite.

1370
01:01:28,490 --> 01:01:30,040
So you decide based on your audience.

1371
01:01:30,040 --> 01:01:31,990
How do you know what your audience has?

1372
01:01:31,990 --> 01:01:34,080
>> Well, we learned a trick yesterday.

1373
01:01:34,080 --> 01:01:35,060
You could ask them.

1374
01:01:35,060 --> 01:01:37,910
If you have a captive audience
you can send them a survey form.

1375
01:01:37,910 --> 01:01:39,172
Or you could just do what?

1376
01:01:39,172 --> 01:01:40,076
>> AUDIENCE: Google Analytics?

1377
01:01:40,076 --> 01:01:40,680
>> DAVID J. MALAN: What's that?

1378
01:01:40,680 --> 01:01:41,876
>> AUDIENCE: Google Analytics.

1379
01:01:41,876 --> 01:01:43,250
DAVID J. MALAN: Google Analytics.

1380
01:01:43,250 --> 01:01:43,750
Yeah.

1381
01:01:43,750 --> 01:01:46,970
Or even more sort of technically, just
look at your own web servers logs.

1382
01:01:46,970 --> 01:01:49,100
Because what happens
every time a browser,

1383
01:01:49,100 --> 01:01:51,880
whether laptop, desktop or
phone visit your website?

1384
01:01:51,880 --> 01:01:56,847
They send that HTTP header that shows
you what browser and OS they're using.

1385
01:01:56,847 --> 01:02:00,180
So you can infer, with high probability,
what your demographic is using that way

1386
01:02:00,180 --> 01:02:01,410
and then adjust.

1387
01:02:01,410 --> 01:02:03,030
>> So suppose that's unacceptable.

1388
01:02:03,030 --> 01:02:07,760
That's sort of bad for business if
Android users can't buy our widgets.

1389
01:02:07,760 --> 01:02:10,942
>> AUDIENCE: Whether you're
gonna charge or not?

1390
01:02:10,942 --> 01:02:12,900
DAVID J. MALAN: Whether
you're going to charge?

1391
01:02:12,900 --> 01:02:14,900
So OK, you get what you pay for.

1392
01:02:14,900 --> 01:02:18,400
>> AUDIENCE: Whether your app is gonna
be free or whether it's gonna--

1393
01:02:18,400 --> 01:02:19,530
>> DAVID J. MALAN: OK.

1394
01:02:19,530 --> 01:02:21,920
So maybe you could recoup
costs that way, or--?

1395
01:02:21,920 --> 01:02:26,195
>> AUDIENCE: I read a study once that said
more Apple users pay for apps versus--

1396
01:02:26,195 --> 01:02:28,320
DAVID J. MALAN: That's true
because they're already

1397
01:02:28,320 --> 01:02:29,640
paying more for their devices.

1398
01:02:29,640 --> 01:02:31,295
So not unreasonable an assumption.

1399
01:02:31,295 --> 01:02:32,170
>> AUDIENCE: [INAUDIBLE]

1400
01:02:32,170 --> 01:02:34,439

1401
01:02:34,439 --> 01:02:35,230
DAVID J. MALAN: OK.

1402
01:02:35,230 --> 01:02:38,667
So if they're more willing to pay,
then to hell with the Android users.

1403
01:02:38,667 --> 01:02:40,500
They're not going to
pay us anything anyway.

1404
01:02:40,500 --> 01:02:43,499
We might as well focus our priorities,
at least for the first few months

1405
01:02:43,499 --> 01:02:44,810
or a year, on iOS.

1406
01:02:44,810 --> 01:02:46,240
Totally reasonable.

1407
01:02:46,240 --> 01:02:48,558
What's a more inclusive
strategy than that?

1408
01:02:48,558 --> 01:02:53,740

1409
01:02:53,740 --> 01:02:54,960
Maybe-- what's that?

1410
01:02:54,960 --> 01:02:57,040
>> AUDIENCE: [INAUDIBLE]

1411
01:02:57,040 --> 01:03:00,142
>> DAVID J. MALAN: A more expensive--
so maybe invest more in-- go ahead.

1412
01:03:00,142 --> 01:03:00,767
AUDIENCE: Yeah.

1413
01:03:00,767 --> 01:03:02,050
Just a mobile website.

1414
01:03:02,050 --> 01:03:03,966
>> DAVID J. MALAN: So do a
mobile website and not

1415
01:03:03,966 --> 01:03:05,440
even worry about this complexity.

1416
01:03:05,440 --> 01:03:07,970
Or maybe a reasonable strategy,
which even Facebook took,

1417
01:03:07,970 --> 01:03:10,890
is start with a hybrid
application because it's not

1418
01:03:10,890 --> 01:03:13,582
that much harder to do this than this.

1419
01:03:13,582 --> 01:03:16,040
You just have to read some
documentation and figure out how

1420
01:03:16,040 --> 01:03:17,480
to upload things to the App Store.

1421
01:03:17,480 --> 01:03:19,670
So maybe you start with
this, so that on day one,

1422
01:03:19,670 --> 01:03:21,112
you can support all of your users.

1423
01:03:21,112 --> 01:03:23,570
And then, just like Facebook
and other companies have done,

1424
01:03:23,570 --> 01:03:25,330
when you have the resources,
you have the people,

1425
01:03:25,330 --> 01:03:27,660
why don't you re-implement
just the iOS application.

1426
01:03:27,660 --> 01:03:31,460
You still have something for everyone,
even though it's an inferior experience

1427
01:03:31,460 --> 01:03:33,330
perhaps, with the hybrid application.

1428
01:03:33,330 --> 01:03:36,770
But you can gradually roll out
and replace your short term

1429
01:03:36,770 --> 01:03:40,280
measures of the hybrid apps with
your more native applications.

1430
01:03:40,280 --> 01:03:44,090
>> AUDIENCE: But with a hybrid app you
will have access to mobile features?

1431
01:03:44,090 --> 01:03:45,440
>> DAVID J. MALAN: Not necessarily.

1432
01:03:45,440 --> 01:03:47,810
So maybe you make a
conscious decision early on,

1433
01:03:47,810 --> 01:03:51,930
you can only upload photos on the
native iPhone application for Facebook,

1434
01:03:51,930 --> 01:03:56,060
but not on the Android application,
initially, for instance.

1435
01:03:56,060 --> 01:04:00,600
And that's a bit of a white lie because
web applications have more restrictions

1436
01:04:00,600 --> 01:04:03,620
than hybrid applications it turns
out, and if we read the documentation

1437
01:04:03,620 --> 01:04:07,260
for PhoneGap and things like it,
people have come up with ways

1438
01:04:07,260 --> 01:04:11,110
to give web based applications
access to the camera,

1439
01:04:11,110 --> 01:04:13,310
so long as you're using
a hybrid application.

1440
01:04:13,310 --> 01:04:14,214
>> How does that work?

1441
01:04:14,214 --> 01:04:16,130
Because the hybrid
application, by definition,

1442
01:04:16,130 --> 01:04:19,600
has a bit of code in Objective-C,
and Swift, and Java, or in C#,

1443
01:04:19,600 --> 01:04:20,920
it can access the hardware.

1444
01:04:20,920 --> 01:04:24,590
Not necessarily everything,
but it might very well

1445
01:04:24,590 --> 01:04:27,310
be the case that you have
enough access to get the camera,

1446
01:04:27,310 --> 01:04:32,960
even for Android platforms, for
instance, in that contrived example.

1447
01:04:32,960 --> 01:04:35,515
>> Any other questions?

1448
01:04:35,515 --> 01:04:36,279
All right.

1449
01:04:36,279 --> 01:04:38,070
Why don't we take our
15 minute break here.

1450
01:04:38,070 --> 01:04:44,060
We'll resume at three with a final
look at web programming, databases,

1451
01:04:44,060 --> 01:04:45,910
and Javascript.

1452
01:04:45,910 --> 01:04:48,877