1 00:00:02,070 --> 00:00:02,903 So let's make sure 2 00:00:02,903 --> 00:00:07,520 we do fetch the author data for populating this drop down. 3 00:00:07,520 --> 00:00:10,490 And of course we need to fetch that author data 4 00:00:10,490 --> 00:00:12,800 in this new post route, 5 00:00:12,800 --> 00:00:17,800 because here we render this create-post template 6 00:00:18,040 --> 00:00:20,993 and we need the author data in that template. 7 00:00:22,120 --> 00:00:25,280 So now we'll have to do a couple of things. 8 00:00:25,280 --> 00:00:28,180 But first of all, we have to connect to the database, 9 00:00:28,180 --> 00:00:30,090 then we have to run a query. 10 00:00:30,090 --> 00:00:34,430 Then we have to send the results of that query the offers 11 00:00:34,430 --> 00:00:35,540 into this template. 12 00:00:35,540 --> 00:00:36,700 And then in the template, 13 00:00:36,700 --> 00:00:39,000 we have to pick up that author data 14 00:00:39,000 --> 00:00:41,360 to display the data there. 15 00:00:41,360 --> 00:00:43,090 So a couple of steps. 16 00:00:43,090 --> 00:00:45,563 Now let's start with connecting to the database. 17 00:00:46,400 --> 00:00:50,980 In order to connect, we typically use a third party package 18 00:00:50,980 --> 00:00:52,320 because we don't wanna handle 19 00:00:52,320 --> 00:00:55,510 all that technical nitty-gritty details 20 00:00:55,510 --> 00:00:58,170 of establishing a connection ourselves. 21 00:00:58,170 --> 00:01:00,070 Instead, we want to use a package 22 00:01:00,070 --> 00:01:02,480 that deals with the connection for us 23 00:01:02,480 --> 00:01:05,620 and that then just allows us to run queries 24 00:01:05,620 --> 00:01:07,580 against that connection. 25 00:01:07,580 --> 00:01:10,910 Therefore, since we are using MySQL, 26 00:01:10,910 --> 00:01:13,640 you can search for node mysql 27 00:01:13,640 --> 00:01:16,450 to find packages that help you with that. 28 00:01:16,450 --> 00:01:20,120 And you will most likely find this MySQL package, 29 00:01:20,120 --> 00:01:21,350 which is great, 30 00:01:21,350 --> 00:01:24,710 but actually not the package I will use here. 31 00:01:24,710 --> 00:01:27,800 Instead, not a package you find on page one here, 32 00:01:27,800 --> 00:01:31,103 but a great package is node mysql2. 33 00:01:32,170 --> 00:01:34,650 If you search for node mysql2, 34 00:01:34,650 --> 00:01:37,940 you will find this MySQL 2 package. 35 00:01:37,940 --> 00:01:41,180 Now don't get confused, it's not a package 36 00:01:41,180 --> 00:01:44,270 that deals with a different version of MySQL, 37 00:01:44,270 --> 00:01:47,610 we are still using MySQL version eight here. 38 00:01:47,610 --> 00:01:50,300 At least I am when I'm recording this video, 39 00:01:50,300 --> 00:01:52,200 instead, it's just a different package 40 00:01:52,200 --> 00:01:55,610 which builds up on the other node MySQL package, 41 00:01:55,610 --> 00:01:57,870 I showed you a couple of seconds ago, 42 00:01:57,870 --> 00:02:00,803 but enhances its functionality a little bit. 43 00:02:01,780 --> 00:02:04,360 That's why we'll use this package 44 00:02:04,360 --> 00:02:09,360 and we simply install it by running npm install mysql2. 45 00:02:10,530 --> 00:02:14,453 Maybe with the --save flag, but that is optional. 46 00:02:15,580 --> 00:02:17,730 So you can copy this command. 47 00:02:17,730 --> 00:02:21,670 And then here, quit does running development server 48 00:02:21,670 --> 00:02:25,340 by clicking into this terminal and pressing Ctrl + C 49 00:02:26,490 --> 00:02:31,490 and then here, simply run npm install --save, mysql2. 50 00:02:33,170 --> 00:02:36,280 And this we'll now install this package into this project 51 00:02:36,280 --> 00:02:37,500 and that's a package 52 00:02:37,500 --> 00:02:40,180 that will help us with establishing a connection 53 00:02:41,710 --> 00:02:44,110 and therefore now that this was done, 54 00:02:44,110 --> 00:02:45,970 we can again run npm start again 55 00:02:45,970 --> 00:02:48,343 to start this development server again. 56 00:02:50,770 --> 00:02:54,110 Now, when it comes to establishing this connection, 57 00:02:54,110 --> 00:02:57,180 I now don't wanna repeat to code 58 00:02:57,180 --> 00:03:00,550 for a setting up such a connection over and over again. 59 00:03:00,550 --> 00:03:01,460 And therefore, 60 00:03:01,460 --> 00:03:04,920 instead of establishing the connection here, when I need it, 61 00:03:04,920 --> 00:03:08,070 I will create a new folder in this project, 62 00:03:08,070 --> 00:03:09,710 which will name data. 63 00:03:09,710 --> 00:03:13,510 And in there, I'll add a database.js file. 64 00:03:13,510 --> 00:03:15,780 Both those names are up to you, 65 00:03:15,780 --> 00:03:20,130 but they accurately describe what will happen in there. 66 00:03:20,130 --> 00:03:23,230 I'll store some code in this database.js file 67 00:03:23,230 --> 00:03:26,083 that establishes a connection to my database. 68 00:03:26,990 --> 00:03:29,440 Because in this database.js file, 69 00:03:29,440 --> 00:03:34,440 we can now import mysql2 like this 70 00:03:34,880 --> 00:03:37,720 and store it in a constant called mysql 71 00:03:37,720 --> 00:03:40,190 or whatever you wanna call it. 72 00:03:40,190 --> 00:03:44,750 And then mysql, this imported package here 73 00:03:44,750 --> 00:03:49,750 gives us create connection function to create a connection. 74 00:03:49,910 --> 00:03:51,790 However, even better than that, 75 00:03:51,790 --> 00:03:54,930 it gives us a create pool function, 76 00:03:54,930 --> 00:03:57,650 which creates a pool of connections, 77 00:03:57,650 --> 00:04:01,410 which doesn't matter too much here in local development 78 00:04:01,410 --> 00:04:03,350 and for simple websites 79 00:04:03,350 --> 00:04:05,480 but if you have bigger websites 80 00:04:05,480 --> 00:04:09,790 where you might be handling a lot of concurrent requests, 81 00:04:09,790 --> 00:04:14,100 so a lot of requests reaching your server at the same time, 82 00:04:14,100 --> 00:04:17,519 then such a pool of connections is more efficient 83 00:04:17,519 --> 00:04:20,973 than creating individual connections all the time. 84 00:04:21,810 --> 00:04:25,870 Hence we'll call create pool here to connect to the database 85 00:04:25,870 --> 00:04:29,280 and let this package actually behind the scenes 86 00:04:29,280 --> 00:04:31,920 establish a pool of connections 87 00:04:31,920 --> 00:04:34,920 that will then be used and managed automatically 88 00:04:34,920 --> 00:04:36,253 by that package. 89 00:04:38,550 --> 00:04:41,960 Now createPool, just like create connection 90 00:04:41,960 --> 00:04:46,510 needs a JavaScript object as a parameter value. 91 00:04:46,510 --> 00:04:50,370 And in this object, we simply tell the package 92 00:04:50,370 --> 00:04:53,060 how to connect to our database. 93 00:04:53,060 --> 00:04:56,840 For example, we need to add a host key 94 00:04:56,840 --> 00:04:58,850 and this must be named host 95 00:04:58,850 --> 00:05:01,313 because the package will look for this key. 96 00:05:02,160 --> 00:05:07,160 And that is a string with the URL off our database server. 97 00:05:08,980 --> 00:05:10,920 Now here, the database server 98 00:05:10,920 --> 00:05:12,680 is running on our local machine 99 00:05:12,680 --> 00:05:16,490 and therefore the special URL is local host. 100 00:05:16,490 --> 00:05:19,053 So what we also used for visiting our website. 101 00:05:20,000 --> 00:05:22,700 The database is running on our computer as well, 102 00:05:22,700 --> 00:05:24,763 so the host is always a local host. 103 00:05:26,070 --> 00:05:29,500 It will just use a different port under the hood 104 00:05:29,500 --> 00:05:30,880 because the database server 105 00:05:30,880 --> 00:05:34,143 is typically running on port 3306. 106 00:05:35,380 --> 00:05:37,490 So now we set up the host, 107 00:05:37,490 --> 00:05:40,450 the port is configured automatically. 108 00:05:40,450 --> 00:05:42,820 The next thing we need to define here 109 00:05:42,820 --> 00:05:45,670 is the database we wanna connect to 110 00:05:45,670 --> 00:05:46,760 because keep in mind, 111 00:05:46,760 --> 00:05:49,850 we are connecting to a database server here 112 00:05:49,850 --> 00:05:53,180 on a server we can have multiple databases. 113 00:05:53,180 --> 00:05:55,640 We can see this in MySQL workbench as well. 114 00:05:55,640 --> 00:06:00,000 I got the block database here and the default sys database. 115 00:06:00,000 --> 00:06:01,010 And if you still have 116 00:06:01,010 --> 00:06:03,570 that restaurant's database from before, 117 00:06:03,570 --> 00:06:05,143 you would have that as well. 118 00:06:06,350 --> 00:06:09,570 So here I wanna connect to the block database. 119 00:06:09,570 --> 00:06:13,040 So we pass this as a string for the database key. 120 00:06:13,040 --> 00:06:16,900 The next thing we need to add is the user we wanna use. 121 00:06:16,900 --> 00:06:18,950 And that by default is a route 122 00:06:18,950 --> 00:06:22,610 that was that default user that was created automatically 123 00:06:22,610 --> 00:06:24,933 when you created your database before. 124 00:06:26,350 --> 00:06:28,440 The last thing for this package 125 00:06:28,440 --> 00:06:32,623 to successfully establish a connection is then the password. 126 00:06:33,610 --> 00:06:36,073 And here, of course, you should enter the password 127 00:06:36,073 --> 00:06:39,863 that you defined for creating that database. 128 00:06:43,180 --> 00:06:44,893 So I'll do that here as well. 129 00:06:46,000 --> 00:06:51,000 Now with that, this will return us a pool object, 130 00:06:51,350 --> 00:06:56,310 and it's now this pool object, which I will export here 131 00:06:56,310 --> 00:07:00,520 so that we can then import this pool into all the files 132 00:07:00,520 --> 00:07:04,600 where we wanna run a query against that database. 133 00:07:04,600 --> 00:07:06,610 So where we wanna use that pool 134 00:07:06,610 --> 00:07:09,170 to send the query to the database 135 00:07:09,170 --> 00:07:10,780 and the MySQL 2 package 136 00:07:10,780 --> 00:07:13,270 will then automatically use this connection, 137 00:07:13,270 --> 00:07:15,660 or one of the connections in the pool 138 00:07:15,660 --> 00:07:17,180 sent the query to the database 139 00:07:17,180 --> 00:07:20,103 and manage all of that for us, which is very convenient. 140 00:07:21,820 --> 00:07:25,440 Therefore, we can now save that file and close it. 141 00:07:25,440 --> 00:07:27,530 And then back in block.js, 142 00:07:27,530 --> 00:07:30,770 we can now use that database pool. 143 00:07:30,770 --> 00:07:33,270 So here at the top, I'm going to import it 144 00:07:33,270 --> 00:07:36,330 and store it in a constant named db. 145 00:07:36,330 --> 00:07:41,330 And I'll import from going up one level /data/database 146 00:07:42,480 --> 00:07:45,373 and store my pool in this db constant. 147 00:07:47,000 --> 00:07:49,990 And here where we then need all the authors, 148 00:07:49,990 --> 00:07:54,990 we can now use db and then use the query method. 149 00:07:55,650 --> 00:07:57,280 The built in query method 150 00:07:57,280 --> 00:08:00,420 to run a query with help of that connection pool 151 00:08:00,420 --> 00:08:03,120 and send that query to our database. 152 00:08:03,120 --> 00:08:05,430 Now here query as the name suggests 153 00:08:05,430 --> 00:08:09,390 wants a SQL query statement that should be executed 154 00:08:09,390 --> 00:08:11,420 and that's passed in as a string. 155 00:08:11,420 --> 00:08:13,700 And here I wanna get all my authors. 156 00:08:13,700 --> 00:08:17,683 So therefore I'll select everything from authors, 157 00:08:18,650 --> 00:08:22,990 and this will give me all my data from that authors table. 158 00:08:22,990 --> 00:08:25,090 And that's of course the same kind of query 159 00:08:25,090 --> 00:08:27,060 you saw before already 160 00:08:27,060 --> 00:08:30,000 early in the course in the last course section 161 00:08:30,000 --> 00:08:34,340 where we ran queries like this in MySQL workbench. 162 00:08:34,340 --> 00:08:39,000 Now we're telling node.js to send this as a query 163 00:08:39,000 --> 00:08:42,710 with help of the MySQL 2 package to our database 164 00:08:42,710 --> 00:08:47,023 so that this query is executed in our node.js application. 165 00:08:49,190 --> 00:08:51,820 Now, the result of that query, 166 00:08:51,820 --> 00:08:53,830 of course, should be the data that's fetched, 167 00:08:53,830 --> 00:08:56,950 but as you can probably imagine 168 00:08:56,950 --> 00:09:00,180 sending such a query to a database server, 169 00:09:00,180 --> 00:09:02,730 executing the query on the server 170 00:09:02,730 --> 00:09:04,780 and then returning the result, 171 00:09:04,780 --> 00:09:08,760 can take a couple of milliseconds or seconds. 172 00:09:08,760 --> 00:09:10,610 Of course, since it's all happening 173 00:09:10,610 --> 00:09:13,500 on the same machine here, it will be super quick, 174 00:09:13,500 --> 00:09:16,720 but if this would be running on a real machine 175 00:09:16,720 --> 00:09:20,267 on a real remote host, then the database server 176 00:09:20,267 --> 00:09:22,540 might be running on a different machine 177 00:09:22,540 --> 00:09:25,150 and then we might have some delay. 178 00:09:25,150 --> 00:09:28,720 And even on the same machine, there is a very small delay, 179 00:09:28,720 --> 00:09:33,000 maybe two or three milliseconds or anything like that. 180 00:09:33,000 --> 00:09:36,540 And therefore this does not finish instantly. 181 00:09:36,540 --> 00:09:39,750 Instead, this is an asynchronous operation 182 00:09:39,750 --> 00:09:41,740 and we talked about the those 183 00:09:41,740 --> 00:09:46,700 in the advanced JavaScript section a couple of hours ago. 184 00:09:46,700 --> 00:09:49,390 So definitely go through that section again, 185 00:09:49,390 --> 00:09:52,260 in case this doesn't tell you anything. 186 00:09:52,260 --> 00:09:55,190 There, you also learned about a couple of strategies 187 00:09:55,190 --> 00:09:58,230 for dealing with asynchronous operations. 188 00:09:58,230 --> 00:10:03,230 And one of these strategies or concepts was to use promises. 189 00:10:04,920 --> 00:10:09,660 The great thing is that MySQL 2 supports promises. 190 00:10:09,660 --> 00:10:13,970 We just have to go to database.js again 191 00:10:13,970 --> 00:10:17,630 and in there instead of requiring mysql2 tool like this, 192 00:10:17,630 --> 00:10:22,630 require mysql2/promise and then save this again. 193 00:10:23,880 --> 00:10:25,210 This will under the hood, 194 00:10:25,210 --> 00:10:28,770 make sure that all the query methods we execute 195 00:10:28,770 --> 00:10:31,390 will yield promises to us, 196 00:10:31,390 --> 00:10:34,210 which we can then listen to basically 197 00:10:34,210 --> 00:10:36,423 to eventually get our result. 198 00:10:37,830 --> 00:10:40,110 Now we can close that file again, 199 00:10:40,110 --> 00:10:43,070 after saving it again and back in block.js, 200 00:10:43,070 --> 00:10:46,800 db query now will actually return a promise 201 00:10:46,800 --> 00:10:50,653 so we can use then and catch as you learned it before, 202 00:10:52,050 --> 00:10:55,280 but even more convenient than then and catch, 203 00:10:55,280 --> 00:10:57,460 is to use async await 204 00:10:57,460 --> 00:10:59,470 and nerve a concept I discussed 205 00:10:59,470 --> 00:11:02,700 in this advanced JavaScript section. 206 00:11:02,700 --> 00:11:06,650 We use it by adding async in front of the function here, 207 00:11:06,650 --> 00:11:09,690 adding this keyword in front of our anonymous function, 208 00:11:09,690 --> 00:11:11,240 and then adding a wait 209 00:11:11,240 --> 00:11:14,240 in front of the asynchronous operation 210 00:11:14,240 --> 00:11:15,793 that yields a promise. 211 00:11:16,650 --> 00:11:19,930 With data it looks like synchronous code again, 212 00:11:19,930 --> 00:11:21,910 that executes step-by-step. 213 00:11:21,910 --> 00:11:23,380 But as you learned before, 214 00:11:23,380 --> 00:11:27,160 this just is transformed behind the scenes so to say 215 00:11:27,160 --> 00:11:31,060 that we automatically listen for this promise to resolve, 216 00:11:31,060 --> 00:11:35,283 and this code is an executed after the promise resolved. 217 00:11:36,900 --> 00:11:41,900 Now we get the result of that simply as a return value, 218 00:11:42,630 --> 00:11:45,160 and hence we can store it in a constant 219 00:11:45,160 --> 00:11:46,963 that we could name result. 220 00:11:48,020 --> 00:11:52,120 And the result we do get back when we execute query 221 00:11:52,120 --> 00:11:55,620 will actually always be an array 222 00:11:55,620 --> 00:11:59,500 where the first item is itself an array 223 00:11:59,500 --> 00:12:01,640 with all the records that were fetched 224 00:12:01,640 --> 00:12:04,683 and the second item holds some metadata. 225 00:12:05,680 --> 00:12:08,260 Now I'm not interested in that metadata, 226 00:12:08,260 --> 00:12:11,390 I'm not interested in that second array item, 227 00:12:11,390 --> 00:12:14,630 but I'm very interested in the first array item, 228 00:12:14,630 --> 00:12:18,033 which is stat array of data that was fetched. 229 00:12:19,280 --> 00:12:22,590 Hence, I'll use array de-structuring here 230 00:12:22,590 --> 00:12:24,470 and nerve a concept covered 231 00:12:24,470 --> 00:12:27,080 in this advanced JavaScript section. 232 00:12:27,080 --> 00:12:31,150 So now you can probably see why I had this section there. 233 00:12:31,150 --> 00:12:32,720 And with that, 234 00:12:32,720 --> 00:12:36,720 we can pull out the first element of that array 235 00:12:36,720 --> 00:12:40,210 that this promise resolves to in the end 236 00:12:40,210 --> 00:12:42,160 and give it any name of our choice, 237 00:12:42,160 --> 00:12:46,090 like for example, authors, but the name is up to you, 238 00:12:46,090 --> 00:12:48,350 but it will be an array full of authors. 239 00:12:48,350 --> 00:12:50,283 So this sounds like a fitting name. 240 00:12:51,370 --> 00:12:55,270 And then here, for create-post for this template 241 00:12:55,270 --> 00:12:57,730 where we need the authors data, 242 00:12:57,730 --> 00:13:00,810 we can now pass data into this template, 243 00:13:00,810 --> 00:13:04,840 maybe called authors and point at our authors 244 00:13:04,840 --> 00:13:06,500 we're getting here. 245 00:13:06,500 --> 00:13:08,270 So I got authors twice here, 246 00:13:08,270 --> 00:13:09,720 but that here is the key 247 00:13:09,720 --> 00:13:12,450 that will be exposed in the template. 248 00:13:12,450 --> 00:13:14,060 Whereas this here 249 00:13:14,060 --> 00:13:18,223 is simply my destructured authors array item. 250 00:13:19,840 --> 00:13:22,000 And again, this syntax here, 251 00:13:22,000 --> 00:13:24,020 that is called the de-structuring 252 00:13:24,020 --> 00:13:27,940 and we're simply pulling out the first item of an array 253 00:13:27,940 --> 00:13:30,900 and restoring it in a new constant called authors. 254 00:13:30,900 --> 00:13:32,563 That's what's happening here. 255 00:13:33,790 --> 00:13:36,650 And with that, we're passing this authors array 256 00:13:36,650 --> 00:13:41,030 under an authors key queue to create-post template, 257 00:13:41,030 --> 00:13:45,330 and hence in that template, we should now be able to use it. 258 00:13:45,330 --> 00:13:47,820 If you go to create-post.ejs, 259 00:13:47,820 --> 00:13:50,020 now here in this dropdown, 260 00:13:50,020 --> 00:13:52,720 we should now be able to actually display 261 00:13:52,720 --> 00:13:56,483 a list of the offers we fetched from the database. 262 00:13:57,500 --> 00:14:02,330 So here we can now use EJS to create a for-loop, 263 00:14:02,330 --> 00:14:05,860 as we learned it in one of the earlier course sections 264 00:14:05,860 --> 00:14:08,880 and loop through all the authors. 265 00:14:08,880 --> 00:14:12,710 So author of authors going through all the authors 266 00:14:12,710 --> 00:14:14,210 in this authors array. 267 00:14:14,210 --> 00:14:17,003 And yes, that's a lot of authors I'm aware of that. 268 00:14:17,960 --> 00:14:22,460 And of course also close stat with this syntax, 269 00:14:22,460 --> 00:14:24,720 and then between those tacks, 270 00:14:24,720 --> 00:14:29,050 we can now render our option, HTML elements. 271 00:14:29,050 --> 00:14:32,510 That's what you'll learn in the forums course section 272 00:14:32,510 --> 00:14:35,370 that does select input element 273 00:14:35,370 --> 00:14:39,080 has an option element or multiple option elements 274 00:14:39,080 --> 00:14:40,120 inside of it, 275 00:14:40,120 --> 00:14:43,370 which are the options that are shown in the dropdown. 276 00:14:43,370 --> 00:14:46,330 And then every option can have a human readable text 277 00:14:46,330 --> 00:14:51,330 and optionally also internally stored value 278 00:14:51,540 --> 00:14:55,140 that would be submitted when the form is submitted. 279 00:14:55,140 --> 00:14:57,540 And we're going to utilize both. 280 00:14:57,540 --> 00:15:00,940 Let's start by outputting some human readable text here 281 00:15:00,940 --> 00:15:05,940 by using this EJS templates tag and saying author.name here, 282 00:15:06,490 --> 00:15:08,643 displaying the name of the author. 283 00:15:09,830 --> 00:15:12,880 Then in addition on the option element, 284 00:15:12,880 --> 00:15:15,600 I will add the value attribute 285 00:15:15,600 --> 00:15:18,320 and the value for that attribute 286 00:15:18,320 --> 00:15:21,640 will also be output with help of EJS. 287 00:15:21,640 --> 00:15:24,810 This will not be visible to the visitor of our website, 288 00:15:24,810 --> 00:15:28,440 but it will be the value that is submitted to the server 289 00:15:28,440 --> 00:15:31,950 when an option is chosen and the form is submitted 290 00:15:31,950 --> 00:15:35,850 and here I wanna have the id of the author. 291 00:15:35,850 --> 00:15:36,990 Because on the backend, 292 00:15:36,990 --> 00:15:40,520 I'll hover work with the idea of the author than the name, 293 00:15:40,520 --> 00:15:42,860 because I know that the ID is unique 294 00:15:42,860 --> 00:15:45,820 because that's how we configured our tables. 295 00:15:45,820 --> 00:15:48,060 The ID is our primary key there, 296 00:15:48,060 --> 00:15:50,073 and it's guaranteed to be unique. 297 00:15:52,000 --> 00:15:55,680 And with all of that, if we save all these files 298 00:15:55,680 --> 00:15:59,510 and we now go back and reload this page, 299 00:15:59,510 --> 00:16:04,510 we should have a dropdown where we can see our authors. 300 00:16:04,610 --> 00:16:07,670 If this is not working, if you're getting some error, 301 00:16:07,670 --> 00:16:11,360 make sure your database credentials in database.js 302 00:16:11,360 --> 00:16:12,470 are correct. 303 00:16:12,470 --> 00:16:15,140 Also use one of my code snapshots, 304 00:16:15,140 --> 00:16:17,910 which you find in the last lecture of every module 305 00:16:17,910 --> 00:16:20,170 to compare your coach to mine 306 00:16:20,170 --> 00:16:22,210 and make sure you don't have any error 307 00:16:22,210 --> 00:16:26,600 somewhere here in the template or here in your query. 308 00:16:26,600 --> 00:16:29,010 And again, double check the credentials 309 00:16:29,010 --> 00:16:30,570 which you use for connecting. 310 00:16:30,570 --> 00:16:33,000 Make sure you have no firewall in the way 311 00:16:33,000 --> 00:16:34,150 or anything like that, 312 00:16:34,150 --> 00:16:35,650 and then it should work 313 00:16:35,650 --> 00:16:38,023 and you should get a result similar to mine.