1
00:00:01,090 --> 00:00:04,930
In this video we're going to get an overview of the next big epic case you're going to work on.

2
00:00:05,010 --> 00:00:09,700
Now this next application really is significantly significantly larger than what we just put together

3
00:00:10,090 --> 00:00:12,310
way more complexity more services.

4
00:00:12,310 --> 00:00:14,980
Everything is just bigger in nature.

5
00:00:14,980 --> 00:00:20,350
I will personally give you a quick overview of some other applications already exist out there so you

6
00:00:20,350 --> 00:00:22,270
may or may not have heard of this app.

7
00:00:22,270 --> 00:00:24,880
It is popular in the U.S. to some degree I suppose.

8
00:00:24,880 --> 00:00:30,640
It's called StubHub and it's all about users selling tickets to sporting events concert stuff like that

9
00:00:30,820 --> 00:00:32,380
to other users.

10
00:00:32,380 --> 00:00:35,230
So we're gonna build something similar in nature to StubHub.

11
00:00:35,230 --> 00:00:38,740
I want to outline very quickly a couple of different properties around StubHub.

12
00:00:38,740 --> 00:00:42,500
So we come to this main page we see a lot of different events and whatnot.

13
00:00:42,850 --> 00:00:45,990
We can click on some given event.

14
00:00:46,070 --> 00:00:52,400
We then get the option to select some time or date to go so I'll select one of these we then get prompted

15
00:00:52,400 --> 00:00:53,840
to select an actual ticket.

16
00:00:53,840 --> 00:00:57,500
And again these are tickets that are for sale by other users.

17
00:00:57,500 --> 00:01:03,670
So I will select some ticket and then go to checkout and then I get prompted to enter a log in or enter

18
00:01:03,680 --> 00:01:09,060
payment information or whatever else I want to really think about what is going on behind the scenes

19
00:01:09,120 --> 00:01:11,490
as we're trying to purchase these tickets.

20
00:01:11,490 --> 00:01:16,170
Imagine that I'm trying to purchase a ticket for a very very popular event.

21
00:01:16,170 --> 00:01:20,850
I don't know what's popular these days but maybe it's just some really popular event so maybe the instant

22
00:01:20,880 --> 00:01:22,430
that tickets get listed for sale.

23
00:01:22,470 --> 00:01:24,310
People just dogpile on it.

24
00:01:24,390 --> 00:01:29,690
In other words tons people come to this website simultaneously and try to buy the exact same ticket.

25
00:01:29,970 --> 00:01:35,310
You probably want to make sure that nobody clicks on go to check out and enters their payment information

26
00:01:35,580 --> 00:01:39,040
for a ticket that has already been sold to some other user.

27
00:01:39,330 --> 00:01:43,800
So you probably want to have some ability to say Hey sorry but someone else is in the process of purchasing

28
00:01:43,800 --> 00:01:46,110
these tickets or something similar.

29
00:01:46,140 --> 00:01:50,190
So with all this in mind let's take a look at a brief summary of some of the business rules or on the

30
00:01:50,190 --> 00:01:53,470
app that we are going to put together.

31
00:01:53,940 --> 00:01:55,990
So we're going to build a ticketing app.

32
00:01:55,990 --> 00:02:00,770
It is definitely let me say right up front it is not going to be as fully featured as StubHub.

33
00:02:00,880 --> 00:02:07,490
So it's not going to have the ideas of say different dates if I can go back to that StubHub we saw just

34
00:02:07,490 --> 00:02:09,190
a moment ago I had different dates and whatnot.

35
00:02:09,190 --> 00:02:11,540
It also had these different defined events.

36
00:02:11,590 --> 00:02:14,240
We're not going to have that level of complexity.

37
00:02:14,290 --> 00:02:18,210
Instead really just going to focus on the ticketing aspect of this.

38
00:02:18,250 --> 00:02:23,530
So in our application users can list tickets for an event for sale.

39
00:02:23,530 --> 00:02:29,710
So these might be tickets to a concert sports a sporting event whatever else other users can then purchase

40
00:02:29,710 --> 00:02:36,180
that ticket after it's been listed any user who signs up to our application can list tickets and purchase

41
00:02:36,180 --> 00:02:36,760
tickets.

42
00:02:36,810 --> 00:02:38,490
So no user is more special than another.

43
00:02:38,490 --> 00:02:39,540
Anyone can sell a ticket.

44
00:02:39,570 --> 00:02:41,110
Anyone can purchase that ticket.

45
00:02:41,280 --> 00:02:45,030
And in our application we're even going to say you can purchase your own tickets if you wanted to for

46
00:02:45,030 --> 00:02:49,160
some crazy reason and here's the really important part.

47
00:02:49,260 --> 00:02:51,770
Whenever a user attempts to purchase a ticket.

48
00:02:51,780 --> 00:02:56,910
So in other words when a user clicks on some purchase button the ticket is then going to be locked for

49
00:02:56,910 --> 00:02:58,290
15 minutes.

50
00:02:58,410 --> 00:03:02,370
So the user will then have 15 minutes to enter their payment information.

51
00:03:02,370 --> 00:03:07,200
So when I say when the user attempts to purchase a ticket I mean like you saw me do just a moment ago

52
00:03:08,070 --> 00:03:11,180
I clicked on go to checkout.

53
00:03:11,250 --> 00:03:16,320
So we're going to take clicking on something like go to check out as a user intending to buy this ticket.

54
00:03:16,320 --> 00:03:21,240
And at that point time we are going to lock the ticket and no other user should be able to purchase

55
00:03:21,240 --> 00:03:24,290
this ticket from out from underneath this person.

56
00:03:24,300 --> 00:03:28,290
So when I click on go to checkout I've not actually entered any payment information or anything like

57
00:03:28,290 --> 00:03:29,030
that.

58
00:03:29,250 --> 00:03:33,610
So I user still has to pay or enter their payment information within 15 minutes.

59
00:03:33,630 --> 00:03:38,460
It is just expressing the intent to purchase the ticket that's going to lock it for 15 minutes.

60
00:03:38,460 --> 00:03:43,330
Now if you don't like the idea of 15 minutes here if you think that's too long it doesn't matter.

61
00:03:43,350 --> 00:03:45,410
I mean we can make this 30 seconds very easily.

62
00:03:45,510 --> 00:03:50,290
When I was first building this application I made the timer 30 seconds just to make it easier to test.

63
00:03:50,310 --> 00:03:54,930
So 15 minutes not at all relevant while that ticket is locked.

64
00:03:55,030 --> 00:03:57,540
No other user can purchase that ticket as a matter of fact.

65
00:03:57,550 --> 00:04:00,310
It's just not even going to be displayed to other users.

66
00:04:00,310 --> 00:04:05,320
So the instant someone locks the ticket other users who are searching for tickets they just won't even

67
00:04:05,320 --> 00:04:10,690
see this one that has been locked naturally after those 15 minutes the ticket should automatically be

68
00:04:10,780 --> 00:04:11,640
unlocked.

69
00:04:11,710 --> 00:04:14,730
So 15 minutes by it or not that's it that's all you get.

70
00:04:16,210 --> 00:04:22,240
And then of course we want to probably allow users to edit tickets because who knows maybe ticket prices

71
00:04:22,240 --> 00:04:25,590
are dropping really quickly and they want to update the price or something like that.

72
00:04:25,660 --> 00:04:31,170
So we should be able to edit a ticket price if the ticket is not already locked.

73
00:04:31,750 --> 00:04:38,560
And this little item right here this nice little thing is going to be a source of some really interesting

74
00:04:38,560 --> 00:04:39,220
challenges.

75
00:04:39,490 --> 00:04:43,630
I mean a lot of this stuff is but this one in particular because it's going to very clearly demonstrate

76
00:04:43,870 --> 00:04:48,540
some big challenges around asynchronous communication in micros services.

77
00:04:48,580 --> 00:04:55,360
I can very easily tell you why imagine this scenario in which some user out there lists a ticket for

78
00:04:55,360 --> 00:05:00,340
one hundred dollars and then some amount of time later another user clicks on purchase ticket.

79
00:05:00,340 --> 00:05:04,780
So in like one is it in time a user attempts to purchase the ticket and things should be locked.

80
00:05:04,810 --> 00:05:10,930
And let's imagine that at the same exact point in time the user who owns the ticket and who listed it

81
00:05:11,110 --> 00:05:14,620
changes the price to a thousand dollars or something like that.

82
00:05:14,620 --> 00:05:19,960
So at the same time one person tries to lock it at the same time someone else tries to change the price.

83
00:05:19,960 --> 00:05:23,650
We're going to run into a ton of scenarios like that where we have to figure out how to handle these

84
00:05:23,650 --> 00:05:28,240
events in some very precise well codified testable fashion.

85
00:05:28,240 --> 00:05:32,570
And that's gonna be where a lot of not just this scenario right here not just this editing why lock.

86
00:05:32,570 --> 00:05:37,280
There's a lot of things like that inside this application we have to deal with.

87
00:05:37,370 --> 00:05:37,610
All right.

88
00:05:37,640 --> 00:05:39,970
That's the overview of the business logic inside a wrap.

89
00:05:40,050 --> 00:05:42,470
Now really quickly I just want to run through a couple of backups.

90
00:05:42,470 --> 00:05:44,600
These mockups are not at all exhaustive.

91
00:05:44,660 --> 00:05:49,850
So these mock ups for example are not showing the actual ticket creation process or editing a ticket

92
00:05:50,060 --> 00:05:50,990
stuff like that.

93
00:05:50,990 --> 00:05:54,830
Nonetheless I want to show you a couple of mockups just so we have some picture in mind of what we're

94
00:05:54,830 --> 00:05:58,520
gonna be building is we're not gonna work on the UI for this for a good amount of time.

95
00:05:58,520 --> 00:06:01,880
We're going to first focus on a lot of back and setup and I just want you to have some picture in your

96
00:06:01,880 --> 00:06:06,860
mind of what we're going to eventually head towards so any user first comes your application.

97
00:06:07,060 --> 00:06:10,810
We're gonna show my list of all the different tickets that are for sale on the top right.

98
00:06:10,810 --> 00:06:14,650
Will have a header that will allow the user to either sign up or sign in for application.

99
00:06:14,680 --> 00:06:17,100
This is going to be real production great authentication.

100
00:06:17,110 --> 00:06:20,680
So like I said we're not really gonna take a lot of shortcuts this time around except for a couple of

101
00:06:20,680 --> 00:06:22,690
locations I can be very clear about.

102
00:06:22,690 --> 00:06:25,010
So this will be very production great authentication.

103
00:06:25,140 --> 00:06:27,520
A user can sign up with an email password.

104
00:06:28,530 --> 00:06:30,840
Once they've signed up they can also sign in.

105
00:06:30,990 --> 00:06:36,150
Once they are authenticated the main landing page is still going to show tickets for sale but then we'll

106
00:06:36,150 --> 00:06:37,580
also update the header as well.

107
00:06:37,590 --> 00:06:39,590
A user can then say sign out.

108
00:06:39,690 --> 00:06:44,700
They can attempt to sell some tickets or they can attempt to take a look at all the orders that they

109
00:06:44,700 --> 00:06:45,770
have in progress.

110
00:06:45,780 --> 00:06:50,090
So in order is when the user has locked a ticket they have created it in order.

111
00:06:50,100 --> 00:06:53,130
Also when a user has successfully purchased a ticket that is an order as well.

112
00:06:53,130 --> 00:06:59,080
So my orders is essentially going to list all the tickets that a user is trying to purchase if a user

113
00:06:59,080 --> 00:07:01,170
clicks on one of these tickets right here.

114
00:07:01,200 --> 00:07:05,680
We're then going to show some them some information about that ticket so it's price and whether or not

115
00:07:05,710 --> 00:07:08,050
it is currently available for purchase.

116
00:07:08,110 --> 00:07:12,850
A user can then click on purchase right there which is equivalent to over on StubHub that go to checkout

117
00:07:12,850 --> 00:07:13,540
button.

118
00:07:13,600 --> 00:07:18,430
So as soon as a user clicks on that purchase right there that is going to start up that 15 minute timer

119
00:07:18,580 --> 00:07:24,070
that's going to lock the ticket as a user will go to a screen like this right here something and says

120
00:07:24,330 --> 00:07:26,310
All right you got 30 seconds left to order.

121
00:07:26,340 --> 00:07:29,380
We're going a little timer right there that automatically counts down.

122
00:07:29,530 --> 00:07:33,340
We'll have a little button right there that is you can click on to pay for the tickets when they click

123
00:07:33,340 --> 00:07:38,770
on that will pop up a little modal like this that allows them to enter in their credit card and expiration.

124
00:07:38,770 --> 00:07:41,010
We are going to handle real credit cards here.

125
00:07:41,110 --> 00:07:44,470
So we're gonna use stripe J.S. or stripe as payment processing.

126
00:07:44,830 --> 00:07:50,350
So we will be able to enter in in theory real credit card numbers with real money all that kind of good

127
00:07:50,350 --> 00:07:51,720
stuff to purchase these tickets.

128
00:07:51,730 --> 00:07:57,230
Again not really cutting a lot of corners here finally I want to mention beyond the fact that remember

129
00:07:57,230 --> 00:07:58,880
this is not the full set of mockups.

130
00:07:58,880 --> 00:08:02,900
I didn't I meant to mention this in the last video we were talking about some of these big changes to

131
00:08:02,900 --> 00:08:03,800
our application.

132
00:08:03,980 --> 00:08:07,910
We are going to have real databases this time around as opposed to our first application.

133
00:08:07,910 --> 00:08:13,760
We're also going to make use of a way more production great event bus than the homemade one we had previously.

134
00:08:13,760 --> 00:08:16,360
So as you can see there's a lot of interesting stuff here.

135
00:08:16,370 --> 00:08:20,660
Lot of UI to build even though this flow right here looks very simplistic in nature.

136
00:08:20,690 --> 00:08:27,920
There's a lot of super subtle very nasty little bugs and opportunities to go crazy in this application.

137
00:08:27,980 --> 00:08:29,650
So it's a tremendous amount of work.

138
00:08:29,660 --> 00:08:34,330
I cannot tell you how much more work this is going to be than the first application but we're going

139
00:08:34,330 --> 00:08:36,260
to learn so much along the way.

140
00:08:36,260 --> 00:08:40,200
And I don't know you can tell from my voice but I'm super excited about this.

141
00:08:40,220 --> 00:08:41,390
So let's take a pause right here.

142
00:08:41,390 --> 00:08:45,980
We're gonna come back the next video and I want to outline some general architecture some the different

143
00:08:45,980 --> 00:08:47,850
technologies we're going to be using.

144
00:08:47,960 --> 00:08:50,940
Is there really is like I said a lot of stuff going on here.

145
00:08:51,010 --> 00:08:52,780
It's a quick pause and I'll see you in just a minute.