WEBVTT

1
00:00:01.223 --> 00:00:03.562
<v ->All right, so let's go ahead and move into Eclipse.</v>

2
00:00:03.562 --> 00:00:04.800
What we're gonna to do is we're gonna make use

3
00:00:04.800 --> 00:00:07.130
of that same project from before,

4
00:00:07.130 --> 00:00:09.051
jdbc-student-tracker.

5
00:00:09.051 --> 00:00:10.450
And in the previous video I showed you

6
00:00:10.450 --> 00:00:12.587
how to open this project and how to import it.

7
00:00:12.587 --> 00:00:14.150
So if you don't have it open yet,

8
00:00:14.150 --> 00:00:18.317
please go back to the previous video and follow those steps.

9
00:00:20.759 --> 00:00:23.814
All right, so this is our student db tracker version one.

10
00:00:23.814 --> 00:00:25.889
I'm going to move into the actual source code,

11
00:00:25.889 --> 00:00:28.422
and I'll actually start with the Java code first.

12
00:00:28.422 --> 00:00:31.582
And I'll actually start with this StudentDbUtil.java.

13
00:00:31.582 --> 00:00:33.724
So remember, this is our helper class

14
00:00:33.724 --> 00:00:38.394
that we use for communicating with the database.

15
00:00:38.394 --> 00:00:41.644
And it's just a regular ole Java class.

16
00:00:48.988 --> 00:00:50.952
All right so here's our StudentDbUtil,

17
00:00:50.952 --> 00:00:52.992
we're gonna make use of something called an instance.

18
00:00:52.992 --> 00:00:54.143
We're gonna have a dataSource,

19
00:00:54.143 --> 00:00:56.065
which basically handles the connection pool.

20
00:00:56.065 --> 00:00:57.526
And then we'll have the jndiName

21
00:00:57.526 --> 00:01:01.127
that we'll use for looking up that object from

22
00:01:01.127 --> 00:01:02.710
Tomcat's JNDI tree.

23
00:01:03.930 --> 00:01:06.319 line:15% 
So here we have this getInstance method.

24
00:01:06.319 --> 00:01:07.851 line:15% 
So again, we're actually gonna make use

25
00:01:07.851 --> 00:01:09.615 line:15% 
of a Singleton Pattern to make sure

26
00:01:09.615 --> 00:01:11.209 line:15% 
that we only have one instance of

27
00:01:11.209 --> 00:01:13.984 line:15% 
this database utility and memory at a given time.

28
00:01:13.984 --> 00:01:16.117 line:15% 
So we're gonna expose this public method

29
00:01:16.117 --> 00:01:17.901 line:15% 
and they can call it, and if we don't have

30
00:01:17.901 --> 00:01:21.045 line:15% 
an instance created, we'll create a new one,

31
00:01:21.045 --> 00:01:23.110 line:15% 
else we simply just return the current

32
00:01:23.110 --> 00:01:24.527 line:15% 
instance that we had.

33
00:01:24.527 --> 00:01:27.282 line:15% 
So this is an example of a Singleton method,

34
00:01:27.282 --> 00:01:29.699
I'm sorry, a Singleton class.

35
00:01:30.667 --> 00:01:33.018
So here's the constructor here for the class.

36
00:01:33.018 --> 00:01:35.163
We make it private StudentDbUtil

37
00:01:35.163 --> 00:01:37.762
to make sure that we only access this

38
00:01:37.762 --> 00:01:39.487
via the getter method above.

39
00:01:39.487 --> 00:01:43.052
And that's our constructor, we simply get our handle

40
00:01:43.052 --> 00:01:44.207
to the dataSource.

41
00:01:44.207 --> 00:01:45.349
And you may wonder,

42
00:01:45.349 --> 00:01:47.983
well what exactly is this getDataSource method?

43
00:01:47.983 --> 00:01:49.445
Well it's defined right here.

44
00:01:49.445 --> 00:01:50.767
So what we do here is that

45
00:01:50.767 --> 00:01:52.794
we need to look at that connection pool.

46
00:01:52.794 --> 00:01:54.647
And we do that by making use of

47
00:01:54.647 --> 00:01:57.406
the JNDI tree and Tomcats.

48
00:01:57.406 --> 00:02:00.486
So JNDI is that Java Naming and Directory Interface,

49
00:02:00.486 --> 00:02:02.193
basically an area of memory

50
00:02:02.193 --> 00:02:05.685
where we can access objects that Tomcat has created.

51
00:02:05.685 --> 00:02:07.701
So Tomcat's created that DataSource

52
00:02:07.701 --> 00:02:11.034
and we can reference it using that code.

53
00:02:14.283 --> 00:02:17.895
So then I'll go ahead and move down to line 41 getStudents.

54
00:02:17.895 --> 00:02:19.573
So basically I want to get a list of students

55
00:02:19.573 --> 00:02:22.720
from the database and use it in my JSF page later on.

56
00:02:22.720 --> 00:02:24.518
So here the getStudents method,

57
00:02:24.518 --> 00:02:28.431
it will return a list of student objects.

58
00:02:28.431 --> 00:02:30.217
So in line 43, I simply create

59
00:02:30.217 --> 00:02:32.489
an empty ArrayList of those students.

60
00:02:32.489 --> 00:02:35.067
And now here, this is just kind of very basic

61
00:02:35.067 --> 00:02:36.712
JDBC code.

62
00:02:36.712 --> 00:02:38.512
So I go through on line 50,

63
00:02:38.512 --> 00:02:41.429
I get a connection to the database.

64
00:02:43.876 --> 00:02:45.201
And then I set up my sequels,

65
00:02:45.201 --> 00:02:47.815
select * from student, and I want to order

66
00:02:47.815 --> 00:02:51.982
by the last name to make sure it's sorted by last names.

67
00:02:53.561 --> 00:02:56.347 line:15% 
Create statement, I execute the query,

68
00:02:56.347 --> 00:02:59.764 line:15% 
it's going to return a result set for me.

69
00:03:05.542 --> 00:03:06.691
Now that I have the result set,

70
00:03:06.691 --> 00:03:09.039
now I just need to process the result set.

71
00:03:09.039 --> 00:03:10.752 line:15% 
So I just need to do a little while loop,

72
00:03:10.752 --> 00:03:13.246 line:15% 
loop over each of those rules in the result set,

73
00:03:13.246 --> 00:03:15.746 line:15% 
and create a list of students.

74
00:03:19.257 --> 00:03:21.041
So here on line 61 through 65,

75
00:03:21.041 --> 00:03:23.284
I simply retrieve the data from the result set.

76
00:03:23.284 --> 00:03:25.299
So I grab the student's id,

77
00:03:25.299 --> 00:03:27.861
firstName, lastName, email address,

78
00:03:27.861 --> 00:03:31.611
and I simply assign those to local variables.

79
00:03:33.582 --> 00:03:35.952 line:15% 
Then I go through, and I just create a new student object.

80
00:03:35.952 --> 00:03:37.850 line:15% 
I just call the constructor for a student object.

81
00:03:37.850 --> 00:03:39.254 line:15% 
Say new Student, then I pass in

82
00:03:39.254 --> 00:03:41.154 line:15% 
id, firstName, lastName, and email,

83
00:03:41.154 --> 00:03:43.858 line:15% 
same values that I just retrieved from earlier.

84
00:03:43.858 --> 00:03:45.764 line:15% 
And then I take that student object,

85
00:03:45.764 --> 00:03:47.415 line:15% 
I just created this tempStudent,

86
00:03:47.415 --> 00:03:49.326 line:15% 
and I add it to my list of students.

87
00:03:49.326 --> 00:03:53.084 line:15% 
So I'll say students.add(tempStudent).

88
00:03:53.084 --> 00:03:55.600 line:15% 
And I just repeat this process for all of those students.

89
00:03:55.600 --> 00:03:58.527 line:15% 
When it's finally done, I simply return students.

90
00:03:58.527 --> 00:04:00.981 line:15% 
So this will basically return an ArrayList of students

91
00:04:00.981 --> 00:04:03.921 line:15% 
back to the calling program.

92
00:04:03.921 --> 00:04:07.166 line:15% 
Finally on line 77 to 79, I just do some clean up work.

93
00:04:07.166 --> 00:04:09.869 line:15% 
I just close off my connections, result sets,

94
00:04:09.869 --> 00:04:11.702 line:15% 
and statement objects.

95
00:04:15.267 --> 00:04:17.119
And that's basically it, there are some other methods

96
00:04:17.119 --> 00:04:18.597
like addStudent and so forth.

97
00:04:18.597 --> 00:04:19.956
We'll get to those later.

98
00:04:19.956 --> 00:04:21.886
This is just kind of version one of the app,

99
00:04:21.886 --> 00:04:23.666
just listing the students right now

100
00:04:23.666 --> 00:04:25.017
or getting the students.

101
00:04:25.017 --> 00:04:27.221
All right, so that's our database utility.

102
00:04:27.221 --> 00:04:29.799
Let's go ahead and look at our Controller.

103
00:04:29.799 --> 00:04:32.299
So this our StudentController.

104
00:04:34.339 --> 00:04:35.852
And remember our StudentController

105
00:04:35.852 --> 00:04:38.490
is basically a ManagedBean that we'll make use of.

106
00:04:38.490 --> 00:04:41.750
So this ManagedBean is set up for SessionScope

107
00:04:41.750 --> 00:04:44.439
because we want to make sure that for a given user

108
00:04:44.439 --> 00:04:46.139
that's logged into our system,

109
00:04:46.139 --> 00:04:48.348
they have their own instance of a Controller

110
00:04:48.348 --> 00:04:50.202
because we're kind of setting some data,

111
00:04:50.202 --> 00:04:52.007
and then using it later.

112
00:04:52.007 --> 00:04:55.174
So we need to make that SessionsScope.

113
00:04:56.192 --> 00:04:58.851
So here, I just have the list of students

114
00:04:58.851 --> 00:05:00.027
as our field.

115
00:05:00.027 --> 00:05:03.610
I have a reference to the database utility.

116
00:05:04.542 --> 00:05:05.757
And here's my no argument constructor

117
00:05:05.757 --> 00:05:08.242
that we always have with ManagedBeans.

118
00:05:08.242 --> 00:05:11.808
In this case, I simply created empty list of students,

119
00:05:11.808 --> 00:05:12.910
and then I also get a handle

120
00:05:12.910 --> 00:05:14.800
to that student database util.

121
00:05:14.800 --> 00:05:17.544
So remember, that student database util is our helper class

122
00:05:17.544 --> 00:05:19.014
for communicating with the database.

123
00:05:19.014 --> 00:05:21.212 line:15% 
I'll make use of that getInstance method

124
00:05:21.212 --> 00:05:23.542 line:15% 
that will give us a handle or reference to it.

125
00:05:23.542 --> 00:05:25.458 line:15% 
Then also we have the students object

126
00:05:25.458 --> 00:05:27.471 line:15% 
that will provide a getter method for us

127
00:05:27.471 --> 00:05:30.459 line:15% 
so a JSF page can get a list of students

128
00:05:30.459 --> 00:05:33.376 line:15% 
or get a reference to the students.

129
00:05:34.233 --> 00:05:36.342 line:15% 
Now where does the heavy lifting occur?

130
00:05:36.342 --> 00:05:37.665 line:15% 
Like where do we actually talk to the database

131
00:05:37.665 --> 00:05:41.627 line:15% 
to retrieve information for the students?

132
00:05:41.627 --> 00:05:44.794 line:15% 
Well that occurs down here on line 31.

133
00:05:49.271 --> 00:05:52.099
So on line 31, we have this public void method loadStudents.

134
00:05:52.099 --> 00:05:54.799
This is the method that the JSF page will call initially

135
00:05:54.799 --> 00:05:57.121
when the JSF page is first loaded.

136
00:05:57.121 --> 00:05:58.327
So the first thing we do is we

137
00:05:58.327 --> 00:06:01.319
clear out the students that we had previously in memory,

138
00:06:01.319 --> 00:06:04.387
and then we get a new list of students from the database.

139
00:06:04.387 --> 00:06:07.310
So I say studentDbUtil.getStudents.

140
00:06:07.310 --> 00:06:10.312
That'll talk to the database on our behalf,

141
00:06:10.312 --> 00:06:12.598
give us a list of these student objects,

142
00:06:12.598 --> 00:06:16.681
and then we can make use of them in our JSF page.

143
00:06:21.752 --> 00:06:24.202 line:15% 
And then I have a normal exception handler.

144
00:06:24.202 --> 00:06:25.952 line:15% 
If there's an error message,

145
00:06:25.952 --> 00:06:29.423 line:15% 
I wanna create this as a JSF FacesMessage

146
00:06:29.423 --> 00:06:31.798 line:15% 
and make it available to the JSF page.

147
00:06:31.798 --> 00:06:34.117 line:15% 
So here, I just create a new FacesMessage

148
00:06:34.117 --> 00:06:36.942 line:15% 
based on whatever exception that I have,

149
00:06:36.942 --> 00:06:41.109 line:15% 
and then I simply add that message to the FacesContext.

150
00:06:42.642 --> 00:06:44.349 line:15% 
So FacesMessage and FacesContext,

151
00:06:44.349 --> 00:06:48.016 line:15% 
these are actually classes from the JSF API.

152
00:06:52.822 --> 00:06:54.674
All right, so that's our StudentController.

153
00:06:54.674 --> 00:06:55.892
Basically load students and then

154
00:06:55.892 --> 00:06:58.541
we can call getStudents a little bit later.

155
00:06:58.541 --> 00:07:01.499
We'll pull this together in the next file here

156
00:07:01.499 --> 00:07:04.926
so you can see how it all works together.

157
00:07:04.926 --> 00:07:06.663
All right, so let's look at our JSF page.

158
00:07:06.663 --> 00:07:09.843
So this is the JSF page that's actually gonna make use of

159
00:07:09.843 --> 00:07:11.510
our Controller bean.

160
00:07:12.619 --> 00:07:15.452
So here is our test-db.xhtml file.

161
00:07:18.682 --> 00:07:20.894
All right so very basic JSF page.

162
00:07:20.894 --> 00:07:24.141
On lines six through eight, basically what we're gonna do

163
00:07:24.141 --> 00:07:26.467
is we're gonna make use of that preRenderView,

164
00:07:26.467 --> 00:07:27.428
so this event.

165
00:07:27.428 --> 00:07:29.712
So basically, when the page is first loaded,

166
00:07:29.712 --> 00:07:32.249
before we render the page, we're gonna say

167
00:07:32.249 --> 00:07:35.907
listener="#{studentController.LoadStudents()}".

168
00:07:35.907 --> 00:07:37.912
So this'll actually call that method.

169
00:07:37.912 --> 00:07:39.568
It'll load the students in memory,

170
00:07:39.568 --> 00:07:41.198 line:15% 
and then we can make use of it.

171
00:07:41.198 --> 00:07:45.917 line:15% 
So on line 21, when we say #{studentController.students},

172
00:07:45.917 --> 00:07:47.721 line:15% 
that'll simply give us a reference

173
00:07:47.721 --> 00:07:50.005 line:15% 
to the object that has already been pre-loaded,

174
00:07:50.005 --> 00:07:52.708 line:15% 
so there's no database work at line 21.

175
00:07:52.708 --> 00:07:55.785 line:15% 
All of the database work occurred a little bit earlier

176
00:07:55.785 --> 00:07:58.618 line:15% 
when we made use of that listener.

177
00:08:05.073 --> 00:08:07.523 line:15% 
And then line 23, we basically just have h:messages,

178
00:08:07.523 --> 00:08:10.165 line:15% 
so if there were any errors or any exceptions

179
00:08:10.165 --> 00:08:12.700 line:15% 
that have occurred in our exception handler,

180
00:08:12.700 --> 00:08:13.989 line:15% 
it would show up here.

181
00:08:13.989 --> 00:08:15.492 line:15% 
If everything was fine, then we won't see

182
00:08:15.492 --> 00:08:17.004 line:15% 
any error messages or anything.

183
00:08:17.004 --> 00:08:19.973 line:15% 
But the real work was there in that page.

184
00:08:19.973 --> 00:08:22.484
So let's go ahead and run this example,

185
00:08:22.484 --> 00:08:24.180
and you know, kind of see how this worked out for us.

186
00:08:24.180 --> 00:08:26.187 line:15% 
So let's simply do a right click,

187
00:08:26.187 --> 00:08:29.270 line:15% 
we say Run As, and the Run on Server.

188
00:08:34.276 --> 00:08:35.868
Okay great, so it runs and it looks good.

189
00:08:35.868 --> 00:08:39.539
So Database Test, and then we have the data.

190
00:08:39.539 --> 00:08:43.203
And then we simply just dump out that ArrayList.

191
00:08:43.203 --> 00:08:45.464
So it returns an ArrayList and we simply dump it out.

192
00:08:45.464 --> 00:08:47.732
So this is all ugly, this is raw.

193
00:08:47.732 --> 00:08:50.574
Don't worry about how pretty it looks right now.

194
00:08:50.574 --> 00:08:52.278
The key here is to make sure

195
00:08:52.278 --> 00:08:55.087
that we could actually get the data from the database.

196
00:08:55.087 --> 00:08:57.558
We'll make it pretty in some of the other slides.

197
00:08:57.558 --> 00:08:59.463
But how do we get this output here?

198
00:08:59.463 --> 00:09:02.499
So let's go look at the student class, Student.java.

199
00:09:02.499 --> 00:09:06.524
It's a real simple ManagedBean, has id, firstName, email,

200
00:09:06.524 --> 00:09:08.119
normal getters and setters.

201
00:09:08.119 --> 00:09:11.228 line:15% 
But I wanna focus on lines 55-59.

202
00:09:11.228 --> 00:09:15.200 line:15% 
Basically we overwrote the toString() method

203
00:09:15.200 --> 00:09:16.787 line:15% 
and we'll basically just

204
00:09:16.787 --> 00:09:18.506 line:15% 
print out information about the student,

205
00:09:18.506 --> 00:09:22.017 line:15% 
so the student's id, firstName, and so on.

206
00:09:22.017 --> 00:09:24.260 line:15% 
This method, toString, is actually called

207
00:09:24.260 --> 00:09:27.311 line:15% 
whenever we dump out the contents of the array,

208
00:09:27.311 --> 00:09:28.908 line:15% 
or the ArrayList.

209
00:09:28.908 --> 00:09:30.633
So the ArrayList will basically say,

210
00:09:30.633 --> 00:09:32.925
"Hey object, give me your toString method,"

211
00:09:32.925 --> 00:09:34.618
and that's how we get the output there.

212
00:09:34.618 --> 00:09:36.724
So, more kind of java one-on-one stuff,

213
00:09:36.724 --> 00:09:38.730
but again, the key here is that

214
00:09:38.730 --> 00:09:39.998
we're able to connect,

215
00:09:39.998 --> 00:09:41.447
we can get data,

216
00:09:41.447 --> 00:09:43.551
and then in the next example,

217
00:09:43.551 --> 00:09:47.771
I'mma show you how we can make this pretty.

218
00:09:47.771 --> 00:09:48.961
All right, so I actually have a file here called

219
00:09:48.961 --> 00:09:51.597
test-list-students.xhtml.

220
00:09:51.597 --> 00:09:54.680
So, this is again, another test file.

221
00:09:55.615 --> 00:09:57.810
What we'll do here is we'll use that preRender again

222
00:09:57.810 --> 00:09:58.742
for calling LoadStudents,

223
00:09:58.742 --> 00:10:00.385
but now what we're gonna do,

224
00:10:00.385 --> 00:10:01.737
is we're gonna make it pretty.

225
00:10:01.737 --> 00:10:03.070
So we're actually gonna make use of

226
00:10:03.070 --> 00:10:04.839
that h:dataTable component.

227
00:10:04.839 --> 00:10:06.803
So this is the same component

228
00:10:06.803 --> 00:10:08.440
that we used in some of the previous videos,

229
00:10:08.440 --> 00:10:10.015
so you've seen this before.

230
00:10:10.015 --> 00:10:13.119
For value, we simply say "{studentController.students}".

231
00:10:13.119 --> 00:10:14.387
It'll call the getStudent,

232
00:10:14.387 --> 00:10:16.326
it'll give us a handle to a tempStudent

233
00:10:16.326 --> 00:10:18.674
as we loop through it.

234
00:10:18.674 --> 00:10:19.886
But now all I wanna do here

235
00:10:19.886 --> 00:10:21.441
is just set up different columns.

236
00:10:21.441 --> 00:10:23.689
So I'll set up a column for First Name,

237
00:10:23.689 --> 00:10:25.815
set up a column for Last Name,

238
00:10:25.815 --> 00:10:27.014
and then do a similar thing,

239
00:10:27.014 --> 00:10:29.528 line:15% 
setting up a column for email address.

240
00:10:29.528 --> 00:10:30.432 line:15% 
And that's all we're gonna do.

241
00:10:30.432 --> 00:10:32.161 line:15% 
So we're gonna create a very simple table

242
00:10:32.161 --> 00:10:33.841 line:15% 
to list out the information

243
00:10:33.841 --> 00:10:36.174 line:15% 
and make it somewhat pretty.

244
00:10:37.472 --> 00:10:39.212 line:15% 
All right, so let's go ahead and run this one.

245
00:10:39.212 --> 00:10:41.045 line:15% 
I'll just right-click,

246
00:10:42.303 --> 00:10:45.220 line:15% 
and I'll say Run As, Run on Server.

247
00:10:52.237 --> 00:10:53.818
Okay great, so here's the data.

248
00:10:53.818 --> 00:10:55.677
So now we have that same data.

249
00:10:55.677 --> 00:10:58.568
It's simply displayed using that dataTable component,

250
00:10:58.568 --> 00:11:00.294
so now it's in a tabular format.

251
00:11:00.294 --> 00:11:01.127
This is great.

252
00:11:01.127 --> 00:11:02.842
So now you understand the basic process

253
00:11:02.842 --> 00:11:04.136
of connecting to a database

254
00:11:04.136 --> 00:11:07.969
and displaying the information out as a table.

255
00:11:10.084 --> 00:11:11.707
All right, so a lot of good stuff here.

256
00:11:11.707 --> 00:11:13.930
So, we covered the application features.

257
00:11:13.930 --> 00:11:16.511
We also took a look at the big picture.

258
00:11:16.511 --> 00:11:19.426
We discussed the student database utility,

259
00:11:19.426 --> 00:11:22.224
our Controller and our JSF page.

260
00:11:22.224 --> 00:11:23.884
So we covered a lot of good stuff here.

261
00:11:23.884 --> 00:11:25.177
In the following videos,

262
00:11:25.177 --> 00:11:27.636
we're gonna pull it all together in our application.

263
00:11:27.636 --> 00:11:29.652
We're gonna make use of cascading style sheets,

264
00:11:29.652 --> 00:11:31.566
and we'll start to hook everything together.

265
00:11:31.566 --> 00:11:33.828
But, we've made some good progress so far

266
00:11:33.828 --> 00:11:34.828
so good job!