How do Dart and Flutter Work Together? Video Lecture | Coffee with a Googler - IT & Software

[MUSIC PLAYING]
LAURENCE MORONEY: So
Emily, one thing before we
get started are
talking about Flutter,
I noticed when I looked
at our internal site
and I was doing a little
bit of research about you,
your job title was
chief meme officer.
EMILY FORTUNA: Yes
LAURENCE MORONEY:
What's with that?
EMILY FORTUNA: So
internally, Google
has a culture of creating--
we call them memes,
technically image macros,
to joke about and comment
about things that are going
on internally in the company.
And amongst our team I have
done more than my fair share,
so my manager started calling
me the chief meme officer,
and I'm now tasked with
keeping the team up
to date on trends in
the company about memes.
LAURENCE MORONEY: Nice.
I mean, I love memes, both
inside and outside of Google,
of course we have
them outside, too.
So I have to watch out
for some of your memes.
So when you're
not meming, you're
also a software engineer, right?
You're working on Flutter?
EMILY FORTUNA: Dart, actually.
LAURENCE MORONEY: Dart, oh.
So Flutter, Dart, how do
they all work together?
EMILY FORTUNA: Yeah.
Dart is the programming
language that Flutter is then
built on top of.
LAURENCE MORONEY: OK.
EMILY FORTUNA: And I've been
on the Dart team for quite a
while Dart is about
six years old,
and when it was
originally created,
it was intended to be a
web programming language.
I personally work on the
Dart to JavaScript compiler,
so if you want to deploy a
Dart application on the web,
we will be assisting
you with that.
But as Dart has evolved, and
there's many more use cases
aside from just the web--
I mean, internally
in the team, we
use it as just a general
sort of scripting language--
and then Dart has also
been applied to mobile.
And I'm super excited
about how Flutter
is using it to basically
deploy on iOS and Android
as mobile applications.
LAURENCE MORONEY: So tell
me a little bit about Dart
as a language.
Like what's exciting?
What's interesting about it?
EMILY FORTUNA: So I find
it is a very approachable
scripting style language.
It is syntactically
pretty similar
to things like Java,
JavaScript, that sort of thing.
When I first came
to the Dart team--
because Dart hadn't
been created yet,
I obviously didn't
know Dart, but I
found it very easy to pick up.
It's designed to
be very familiar.
And I just programmed kind of
like generic C-ish language,
and it worked, and then once
you got familiar with that,
you can move on.
There's lots of nice idioms
and it makes it very concise.
It has some functional
components, as well, that are--
LAURENCE MORONEY: So now
I can use all of that,
and with Dart to JS,
I can spit out JS code
and run it on a browser?
EMILY FORTUNA: Yes.
Yes, you can deploy so it
can run on Firefox, anywhere
on the web.
And what's cool about
how Dart was designed
is it is well-suited for
being both JIT-ed and ahead
of time compiled.
And so a little
compiler lesson, if--
I don't know how
up on compilers--
so basically you
have interpreters
on your extreme end
of the spectrum,
literally going token by
token and executing as you go.
You have ahead of time
completion for C++ and those
sorts of things,
run GCC, get x86.
And then JIT-ING is in between.
You're like, oh, I'm running
this particular function
a whole lot.
I need to optimize it.
I'll compile that little
chunk into machine code.
And the cool thing
with JIT-ing is
it gives a really nice
developer experience,
so it's kind of webby in,
like, you save your file
and it goes and updates.
Flutter takes that webby style
of development, where you just,
like, I'm going to
build a button, save,
and then it appears.
And then, because Dart also
can be ahead of time compiled,
we compile it down
to native ARM code
and it will be super smooth
and super performance.
So it's pretty much like have
your cake and eat it too.
LAURENCE MORONEY: So I
can see you're clearly
excited about Flutter and
how Dart fits in with it.
And one of the things--
I did an interview with
Eric, and he was telling me
about how Flutter
has been designed
to run on the metal,
and something that
came to mind with me
was that it might make
it a lot easier for learning.
EMILY FORTUNA: That
is an area that I
think has not yet
been explored enough,
but I think it has
a lot of potential.
When you are learning just
computer science in general,
or if you're doing
mobile app development,
obviously you're going
to be making mistakes.
And with hot
reloading, you can--
particularly with mobile,
you can see the part
that's working and not.
And so you're like, OK, well,
I need to add this button
and I messed up a semi-colon.
This little chunk is
broken, but oh, I'll
just hot reload
rather than having
to wait, build, and
then like, oh, this
is a couple of screens in.
I have to find it.
It's just there.
LAURENCE MORONEY: I've run
code labs, and a lot of times,
particularly for people
who are learning something
for the first time,
and it's hard enough
to get someone to
understand, OK, this is code.
But you've got to get
them, OK, this is code,
and now I'm compiling it,
and now I'm deploying it,
and now the
emulator's booting up,
and now the application is
loading in the emulator,
and now the debugger
is booting up.
And there's all those
concepts that they
have to learn before they
can see their button.
EMILY FORTUNA: Yeah, and
that aren't even related
to the idea of algorithms.
LAURENCE MORONEY: Yeah.
EMILY FORTUNA: So just
eliminate that stuff.
LAURENCE MORONEY: It was
great stuff to learn,
but you probably don't
want to on day one.
EMILY FORTUNA: Yeah, you
don't need it on day one.
LAURENCE MORONEY:
So the whole idea
of being able to,
like you say, just
I want a button and the button
is just there without going
through all that compiling,
it's pretty cool.
EMILY FORTUNA: It's
instant gratification
for programmers, basically.
LAURENCE MORONEY: Yeah, exactly.
So that, to me,
would be the hook.
That hooks me into
Flutter, thinking,
I got to check this out.
I got to kick the
tires on this and see
if it suits me as a developer.
Are there any other cool
things about it that
would help you as a developer?
EMILY FORTUNA: So if
you are a web developer,
Dart is a great segue-- or
Flutter is a great segue,
because you can take what
you know, if you know Dart,
and then develop in mobile.
And it's a very familiar
development experience.
Then the cross-platform
thing is amazing, too.
So Flutter takes care of
compiling your code to iOS
and Android, so you
don't have to learn
two different
languages, you don't
have to worry about spinning
up two different teams with two
different code bases
that do the same things.
And then Dart itself--
so there's Dart 2
that's just come out,
that's been announced
relatively recently.
As we were saying, Dart has
been evolving over time.
And so we were seeing
how it's being used
and Dart 2 has a lot of changes
that modernize the language.
Things like optional,
new, [INAUDIBLE]
and then we also are
adding a more robust type
system, because it
turns out people
want to be not surprised.
LAURENCE MORONEY:
Yeah, we like types.
EMILY FORTUNA: Yes.
So yeah, it is a lot
of things to help
make developers' lives nicer.
LAURENCE MORONEY:
Now one of the things
that whenever we
hear a cross-platform
and it works in iOS and
it works on Android,
that gets the spidey
senses tingling,
is that often we see
these kind of things
but it's just web with
a thin veneer over it,
and then it's lowest
common denominator.
But Flutter is very
different from that, right?
EMILY FORTUNA: No.
Flutter is, literally,
native code.
So compiling to
ARM, what have you.
And the magic of the
Dart VM, basically,
is doing all of
this compilation.
So there's no weird interaction
between native code and Flutter
code, because it is native
code, and Flutter's drawing
all those pixels.
LAURENCE MORONEY:
So it is an app
or it is that kind of
thing actually running.
It's not a bundle of web stuff.
EMILY FORTUNA: Right, right.
LAURENCE MORONEY: OK, cool.
So I'm a developer and
I want to get started.
What do I do?
EMILY FORTUNA: Well, you can go
to flutter.io, download things.
There's also a bunch of YouTube
talks, some of them teaching,
someone looks kind of like this.
LAURENCE MORONEY: Yeah, I
heard you did a talk at IO,
and the meming came back.
EMILY FORTUNA: Yes.
LAURENCE MORONEY:
You've come full circle.
EMILY FORTUNA: Yes, yes.
We gave a talk last year
at IO, and we'll actually
be at IO this year as well.
But we were doing a
live coding in-app
in Flutter, 30 minutes,
both iOS and Android,
and we were doing a live--
or an insta-meme meme chat,
is what we called it, but
chatting via image macros,
basically.
LAURENCE MORONEY: I here you
had to put some very custom
memes in that, is that right?
EMILY FORTUNA: Yes.
Well, because we
didn't want to have
to worry about copyright
infringement of very
famous memes, we,
at the last minute,
ran around and recreated
a lot of famous memes.
So we got ones of
the Bart Simpson
where he's like slowly
going into the bush.
LAURENCE MORONEY:
It's Homer, right?
EMILY FORTUNA: Oh,
yes, sorry, Homer.
LAURENCE MORONEY:
I love that meme.
EMILY FORTUNA: So you
have I'm like slowly
sinking into the bushes.
[LAUGHTER]
LAURENCE MORONEY: Oh,
I gotta see that one.
I really want to
do a facepalm one.
EMILY FORTUNA: Oh, we did that.
We had a triple facepalm.
We had a couple of people on
the Flutter team all be like--
LAURENCE MORONEY: Nice.
So that that's your IO
talk and that's online?
EMILY FORTUNA: Yes.
LAURENCE MORONEY:
OK, well, we'll
put a link to in the comments
below so people can see it.
So again, if I want
to get started,
I want to build
this kind of stuff
for myself, so your talk is
going to show me how to do it.
But then I download the
bits from just flutter.io?
OK.
EMILY FORTUNA:
And Flutter is now
beta, which is super exciting.
It means it's a
level of stability
that some people were unsure
about in the early days,
but yeah, it's great components,
lots of awesome support
with Firebase.
LAURENCE MORONEY: I've
heard of Firebase.
EMILY FORTUNA: Yeah.
Oh, and something that is
near and dear to my heart,
but Flutter supports
animated gifs.
LAURENCE MORONEY: Oh.
EMILY FORTUNA: For added
meming opportunities.
LAURENCE MORONEY: Added
meming opportunities.
And you call them
"gifs" not "jifs."
but hopefully our viewers--
EMILY FORTUNA: Hopefully
no one hates me.
Depending on what
team you're on, it's--
LAURENCE MORONEY: So
one thing, though,
that really stunned me when
I've been learning a little bit
about Flutter was that it
was alpha for a long time--
and you just mentioned it's
only just gone into beta--
but despite it being
alpha, lots of people
were building great apps on it.
And that, to me, is very rare.
Usually when
something is in alpha,
developers will play
with it and think
about planning for
the future, but you've
had lots of great
apps built on it.
Do you have any favorites?
EMILY FORTUNA: A
favorite of mine.
I mean, personally, I
love the Hamilton app.
Based on the Hamilton musical,
it is the official app.
You can get ticket lotteries
and all sorts of things.
There's fun native overlays.
You can picture yourself
with a King George crown.
LAURENCE MORONEY:
What comes next?
EMILY FORTUNA: Yeah.
LAURENCE MORONEY: I
have the app myself,
and I enter the lottery every
day, but I haven't won yet.
Because it's running in
Seattle, I'm from Seattle,
and you're based in Seattle too.
It's almost done in Seattle,
but I have won a ticket yet.
EMILY FORTUNA: I haven't
seen it yet though.
[LAUGHTER]
LAURENCE MORONEY: OK,
so again, flutter.io,
if somebody wants
to get started.
So thank you so much, Emily.
This has been so much fun.
Thanks, everybody, for
watching this episode of Coffee
With A Googler.
Again, if you have
any questions for me
or if you've any
questions for Emily,
please leave them in
the comments below,
and we'd love to see what
you build on Flutter.
Thank you.
[MUSIC PLAYING]