Would you like to inspect the original subtitles? These are the user uploaded subtitles that are being translated:
1
00:00:00,840 --> 00:00:04,650
In the last section, we finished up our first project, but there's still a lot for us to learn about
2
00:00:04,650 --> 00:00:05,030
Flutter.
3
00:00:05,400 --> 00:00:08,810
So in this section we're going to start working on our next big project.
4
00:00:09,270 --> 00:00:13,980
We're going to first generate a new project at our terminal using the flutter CLI and we'll talk about
5
00:00:13,980 --> 00:00:19,260
what we're going to built so that my terminal and you'll notice that I've changed into a sort of workspace
6
00:00:19,260 --> 00:00:19,980
directory.
7
00:00:20,280 --> 00:00:24,000
So I'm no longer inside of the pix folder that we had previously generated.
8
00:00:24,780 --> 00:00:30,570
So inside this workspace directory, I'm going to generate a new project by running Flutter Create and
9
00:00:30,570 --> 00:00:35,490
then the name of our project, which is going to be log-in, underscore, stateful like so.
10
00:00:36,780 --> 00:00:41,730
So run that command that's going to generate a bunch of different files and folders and start installing
11
00:00:41,730 --> 00:00:45,980
a couple of dependencies while that runs, we'll talk about what we're going to build here.
12
00:00:48,060 --> 00:00:49,810
All right, so here's what we're going to be making.
13
00:00:50,220 --> 00:00:54,460
We're going to make a login form or kind of a sign up form of sorts.
14
00:00:55,020 --> 00:01:01,110
A user is going to be presented with an email field where they can enter in some email and a password
15
00:01:01,110 --> 00:01:02,940
field where they can enter in some password.
16
00:01:03,570 --> 00:01:06,450
Then they'll click on the submit button and that's pretty much it.
17
00:01:07,510 --> 00:01:12,160
Now, this application might seem very simple and straightforward in nature, but in reality, there's
18
00:01:12,160 --> 00:01:15,650
going to be a lot of hidden complexity in here that we'll talk about in just a moment.
19
00:01:16,510 --> 00:01:20,500
The one thing I want to mention is that when a user enters an email and password and then clicks on
20
00:01:20,500 --> 00:01:24,410
simit, we need to make sure that we validate both the inputs that they enter in.
21
00:01:24,700 --> 00:01:29,770
So we need to make sure that they actually entered a valid email and a valid password.
22
00:01:30,310 --> 00:01:35,620
So maybe the password has to have some minimum number of characters inside of it to be considered valid.
23
00:01:36,580 --> 00:01:40,450
To be clear, we are not wiring up authentication here at all.
24
00:01:40,750 --> 00:01:45,450
OK, so there's really no idea of actually assigning in a user or anything like that.
25
00:01:45,880 --> 00:01:50,740
We're just focused on building a form and validating some inputs that a user provides.
26
00:01:51,610 --> 00:01:57,280
Now, let's talk about why this is going to be a little bit more complex app or a little bit more complicated
27
00:01:57,280 --> 00:01:59,200
than it might seem at first glance.
28
00:02:01,080 --> 00:02:07,560
OK, so at this point, we've spoken a fair amount about something called stateful widgets inside a
29
00:02:07,560 --> 00:02:12,330
flood of applications, remember flutter or something, stateful widgets are used any time we have some
30
00:02:12,330 --> 00:02:14,280
data that's going to change over time.
31
00:02:14,760 --> 00:02:17,820
And whenever that data changes, we would want the UI to update.
32
00:02:18,540 --> 00:02:24,060
In the last application we put together, we used a stateful widget to handle that interaction.
33
00:02:24,330 --> 00:02:30,090
We had a stateful widget that would update some data and whenever that updated poof, the screen magically
34
00:02:30,090 --> 00:02:30,600
changed.
35
00:02:31,650 --> 00:02:36,900
The problem with the stateful widget is that it doesn't really scale up to larger applications that
36
00:02:36,900 --> 00:02:43,110
have multiple different screens, in essence with a stateful widget, it's kind of challenging to pass
37
00:02:43,110 --> 00:02:46,680
around data from one screen to another inside of your application.
38
00:02:47,600 --> 00:02:53,750
So the stateful widget is kind of seen as kind of an introductory level way of managing state in a flutter
39
00:02:53,750 --> 00:02:54,450
application.
40
00:02:54,770 --> 00:02:58,640
It's a perfectly fine way to manage state if you have a simple app.
41
00:02:59,000 --> 00:03:03,710
But as soon as your app starts to grow in nature or grow in size, well, it starts to get a little
42
00:03:03,710 --> 00:03:06,110
bit complicated and a little bit more challenging.
43
00:03:07,820 --> 00:03:13,610
As a solution to this flutter, designers came up with something called the block pattern, and this
44
00:03:13,610 --> 00:03:17,030
is an alternate way of managing state in a flutter application.
45
00:03:17,780 --> 00:03:21,560
Now, there's definitely a lot of different ways to manage state inside of a flutter app.
46
00:03:21,770 --> 00:03:26,000
But we're going to be focusing on this block pattern thing right here, because this is the way that
47
00:03:26,000 --> 00:03:29,290
is supposedly highly recommended by the flutter team.
48
00:03:29,630 --> 00:03:35,360
And in fact, even in a recent video published by the Flutter team talking about state management,
49
00:03:35,360 --> 00:03:40,010
they say very clearly, yeah, we really recommend checking out the block pattern is just the best way
50
00:03:40,010 --> 00:03:40,690
of doing things.
51
00:03:41,450 --> 00:03:45,740
So the reason I'm kind of mentioning the fact that the Flutter team is endorsing this is that there
52
00:03:45,770 --> 00:03:50,660
are actually many different means of state management inside a flutter right now, a lot of different
53
00:03:50,660 --> 00:03:51,440
ways of doing it.
54
00:03:51,740 --> 00:03:55,750
And no one's really got the expertise to say which way is better than the other.
55
00:03:56,120 --> 00:04:01,310
However, the Flutter team has publicly endorsed this block pattern, which is why we are going to go
56
00:04:01,310 --> 00:04:02,150
in that direction.
57
00:04:03,270 --> 00:04:07,680
Now, the reason I'm showing you this diagram right here is kind of tied back to the application we're
58
00:04:07,680 --> 00:04:08,280
going to build.
59
00:04:09,610 --> 00:04:15,930
So the block pattern is definitely the way we want to design applications, but it's rather challenging,
60
00:04:15,940 --> 00:04:18,220
that's rather complicated to understand.
61
00:04:18,760 --> 00:04:24,130
So to give you a really smooth introduction into this block pattern thing, we're going to first build
62
00:04:24,130 --> 00:04:30,520
out this login form or the sign up form application using the more classic stateful widget approach,
63
00:04:30,550 --> 00:04:32,920
the approach that we just learned in our last application.
64
00:04:33,650 --> 00:04:38,170
So we're going to build out the entire application with that approach and then we're going to rebuild
65
00:04:38,170 --> 00:04:42,610
the entire app a second time, but instead use the block pattern.
66
00:04:43,240 --> 00:04:48,560
So essentially, we're making this two times, but with radically different approaches.
67
00:04:49,150 --> 00:04:54,310
So with these two approaches, you'll have your own ability to kind of compare and contrast the two
68
00:04:54,730 --> 00:04:59,380
and you'll have your own opinion on which way you like the most and whether you want to stick with the
69
00:04:59,380 --> 00:05:06,010
more classic but simple stateful widget approach or use the fancier but kind of harder to understand
70
00:05:06,010 --> 00:05:07,240
block pattern instead.
71
00:05:08,420 --> 00:05:12,230
So that's the idea, we're going to build the same out two times, and that's going to give you a really
72
00:05:12,230 --> 00:05:17,060
strong opinion in which way is best for building any particular application.
73
00:05:18,030 --> 00:05:19,590
So let's take a quick pause right here.
74
00:05:19,810 --> 00:05:23,220
We'll continue in the next section and get started with our application.
75
00:05:23,470 --> 00:05:25,340
So quick break and we'll see you in just a minute.
8289
Can't find what you're looking for?
Get subtitles in any language from opensubtitles.com, and translate them here.