1
00:00:07,090 --> 00:00:10,490
Hey everybody what's going on this is Caleb with Debb slopes dot com.

2
00:00:10,540 --> 00:00:16,030
And welcome to the intro to MBC in Iowa s target topic in this course.

3
00:00:16,030 --> 00:00:22,420
We're going to be talking about model view controller which is a very very common design pattern in

4
00:00:22,420 --> 00:00:25,890
software development but especially in Iowa.

5
00:00:26,080 --> 00:00:31,200
Now there are plenty of other design patterns that currently exist and are currently being developed.

6
00:00:31,330 --> 00:00:37,410
But model view controller is one of the core tenets of object oriented programming.

7
00:00:37,510 --> 00:00:41,640
Now object oriented programming has been around since the 70s.

8
00:00:41,740 --> 00:00:46,050
It's been around for a long time and because of that it is tested and true.

9
00:00:46,270 --> 00:00:49,090
It is very reliable and very common.

10
00:00:49,090 --> 00:00:55,300
Actually it's commonplace in most software development workplaces so if you know object oriented programming

11
00:00:55,360 --> 00:00:58,240
if you know model view controller you're going to be good to go.

12
00:00:58,240 --> 00:01:03,640
For the most part now that's not to say that model view controller is the best design pattern.

13
00:01:03,640 --> 00:01:06,590
It's not to say it's the only one that will ever be around.

14
00:01:06,610 --> 00:01:08,690
I think it will eventually be replaced.

15
00:01:08,830 --> 00:01:14,920
But for the time being it's an excellent design pattern because it helps us to logically separate very

16
00:01:14,920 --> 00:01:17,420
important parts of our application.

17
00:01:17,530 --> 00:01:23,080
So we're going to begin by just sort of talking about the overarching theory of model view controller

18
00:01:23,470 --> 00:01:27,630
and using some analogies and some examples to help you understand it.

19
00:01:27,760 --> 00:01:33,610
And then we're going to put it right into practice by building an iOS app using Model View and controller

20
00:01:33,730 --> 00:01:34,930
as a design pattern.

21
00:01:34,990 --> 00:01:38,600
So to begin we're going to start with the model component.

22
00:01:38,710 --> 00:01:44,930
Now for the model I want you to imagine a blueprint case to envision a blueprint in your mind.

23
00:01:45,040 --> 00:01:47,170
Think about the purpose of a blueprint.

24
00:01:47,170 --> 00:01:51,040
Think about what it does it tells how to make something.

25
00:01:51,160 --> 00:01:55,400
It gives very important key information on how to build a certain device.

26
00:01:55,540 --> 00:01:58,920
As you can see in this blueprint it includes lots of information.

27
00:01:58,920 --> 00:02:02,410
There are some notes about how the device should be built.

28
00:02:02,560 --> 00:02:07,230
There are some measurements there are you know size and shape.

29
00:02:07,270 --> 00:02:12,070
There might even be some description of how things should look on certain blueprints.

30
00:02:12,070 --> 00:02:15,840
Now the model component is very much like a blueprint.

31
00:02:15,850 --> 00:02:20,770
It's going to basically tell how something should be built.

32
00:02:20,800 --> 00:02:23,500
Now the model is going to store data.

33
00:02:23,500 --> 00:02:31,180
So we're going to use the model layer to basically create blueprints for our different data types.

34
00:02:31,180 --> 00:02:36,610
So for instance if I wanted to create a watch like this if I wanted to build a watch I would say all

35
00:02:36,620 --> 00:02:40,350
right this watch needs to be rectangular in shape.

36
00:02:40,510 --> 00:02:42,160
It needs to have two buttons.

37
00:02:42,160 --> 00:02:47,710
It needs to have two slots for a strap needs to have a screen and needs to have a speaker.

38
00:02:47,740 --> 00:02:49,970
It needs to have a heart rate sensor on the back.

39
00:02:50,080 --> 00:02:55,110
And of course this is a very complex watch but watchmaking in general is pretty complex.

40
00:02:55,270 --> 00:03:00,260
So I have then given instructions on how that watch should be built.

41
00:03:00,280 --> 00:03:05,710
Then later a watchmaker could take that blueprint and they could actually follow those steps to build

42
00:03:05,770 --> 00:03:08,150
a watch that anyone could use.

43
00:03:08,320 --> 00:03:11,400
The model is very similar to a blueprint.

44
00:03:11,400 --> 00:03:13,040
OK keep that in your mind.

45
00:03:13,060 --> 00:03:20,950
Let's move on now to the view layer in software development the view layer basically tells how things

46
00:03:21,040 --> 00:03:22,160
should look.

47
00:03:22,210 --> 00:03:27,850
It's going to allow us to customize the appearance of the various elements on the screen it tells how

48
00:03:27,850 --> 00:03:28,840
it should look.

49
00:03:28,870 --> 00:03:33,940
Think of the view like the face of a watch when you look at the watch face there's a certain way it

50
00:03:33,940 --> 00:03:39,370
should look you should be able to see the numbers that go around the watch so you know what hour it

51
00:03:39,370 --> 00:03:44,500
is you should be able to see the watch hands the hour hand and the minute hand and you should be able

52
00:03:44,500 --> 00:03:46,050
to see all of that.

53
00:03:46,060 --> 00:03:47,660
Now the watch looks beautiful.

54
00:03:47,680 --> 00:03:53,550
It looks amazing but what good is it if the numbers don't change if the hands don't move.

55
00:03:53,560 --> 00:03:58,050
That is where the controller layer comes into place the controller.

56
00:03:58,180 --> 00:04:05,560
As you may expect controls the view and in many instances it is actually called The View Controller.

57
00:04:05,560 --> 00:04:08,500
Now the controller is like a watchmaker.

58
00:04:08,500 --> 00:04:09,940
Think of it like that.

59
00:04:09,940 --> 00:04:17,200
The controller communicates with both the model and The View and The View Controller basically controls

60
00:04:17,470 --> 00:04:18,700
what the view does.

61
00:04:18,700 --> 00:04:25,450
It controls how it changes and it takes the data from the model and it's going to pass it to The View

62
00:04:25,480 --> 00:04:26,980
and display the changing data.

63
00:04:26,980 --> 00:04:31,720
So imagine if I'm looking at my watch I have I'm looking at the.

64
00:04:32,110 --> 00:04:39,880
So imagine I'm looking at the view of my watch there is maybe it's 320 p.m. If the minute were to increase

65
00:04:39,880 --> 00:04:46,460
to 3:21 p.m. The controller would then say hey the model has changed let's update the view the view

66
00:04:46,480 --> 00:04:49,410
controller is like the watchmaker winding a clock.

67
00:04:49,470 --> 00:04:53,830
Cade the watchmaker might look at the time and then adjust the clock accordingly.

68
00:04:53,830 --> 00:04:55,660
Or just the watch accordingly.

69
00:04:55,720 --> 00:04:57,580
So the model is like a blueprint.

70
00:04:57,610 --> 00:05:04,770
The view is like a watch face and the controller is like a watchmaker who's communicating between model

71
00:05:04,950 --> 00:05:11,070
the data of our application and the view the watch face of our watch and it can react to those changes

72
00:05:11,070 --> 00:05:13,850
in data and present it on the view.

73
00:05:13,980 --> 00:05:19,860
So the model view and controller work together as a team they're very important in software development

74
00:05:19,890 --> 00:05:26,310
and this is just basically kind of an overarching theory of how model view controller work together

75
00:05:26,610 --> 00:05:28,560
to create amazing applications.

76
00:05:28,560 --> 00:05:30,920
Now I know that some of this might be a little bit of theory.

77
00:05:30,930 --> 00:05:36,810
It's a little out there but the analogy I believe holds true the model is a blueprint.

78
00:05:36,810 --> 00:05:40,080
It tells us how we should construct a certain data type.

79
00:05:40,140 --> 00:05:44,150
The view is like a watch face it customizes what we should be seeing.

80
00:05:44,580 --> 00:05:51,470
And the controller is like a watchmaker who constructs the data types and passes the data to the view.

81
00:05:51,540 --> 00:05:55,920
K. so we're going to move on now to the next video where we're going to go into a playground and we're

82
00:05:55,920 --> 00:06:00,990
going to mess around a bit with model view controller and then by the end of this target topic you will

83
00:06:00,990 --> 00:06:06,080
have built a small application that utilizes the principles of model view controller.

84
00:06:06,210 --> 00:06:07,070
Awesome job guys.

85
00:06:07,080 --> 00:06:09,720
Let's head over to the next video and let's do that now.