Would you like to inspect the original subtitles? These are the user uploaded subtitles that are being translated:
1
00:00:01,040 --> 00:00:05,650
My project is all generated and I've already changed into my new pages directory.
2
00:00:05,660 --> 00:00:09,730
I've also opened up my code editor inside this folder so make sure you do so as well.
3
00:00:09,860 --> 00:00:14,450
I'm not going to go ahead and start my development server and then while that's running let's go take
4
00:00:14,450 --> 00:00:17,300
a look at some documentation around bootstrap.
5
00:00:17,300 --> 00:00:18,890
Remember the CSX library.
6
00:00:19,100 --> 00:00:20,100
Old bootstrap.
7
00:00:20,330 --> 00:00:24,620
We're gonna use bootstrap once again to get some free styling to build up a kind of patch Nader that
8
00:00:24,620 --> 00:00:27,640
looks like that right there instead of a new browser tab.
9
00:00:27,680 --> 00:00:31,730
I'm to navigate to get bootstrap dot com at the very top.
10
00:00:31,730 --> 00:00:37,280
I'm going to find the section that says documentation and then on the left hand side I'll find components
11
00:00:38,330 --> 00:00:44,770
then finally under the component section there is a section called Pageant nation the pageant nation
12
00:00:44,860 --> 00:00:49,990
is essentially just a set of HDMI elements so we can put together with some very specific class names
13
00:00:50,210 --> 00:00:54,760
that's going to give us something it looks like that which is just about exactly what we need for our
14
00:00:54,760 --> 00:00:58,740
application whenever we select a given page.
15
00:00:58,740 --> 00:01:02,860
We can also highlight it in blue which you can see down here the kind of active state.
16
00:01:02,880 --> 00:01:07,530
So in this case it's very clear to the user that they're currently looking at page two and then in addition
17
00:01:07,530 --> 00:01:12,420
we can also disable the next in previous buttons because there might be some scenarios where we don't
18
00:01:12,420 --> 00:01:16,100
want to allow to allow user to go to the previous page or the next one.
19
00:01:16,140 --> 00:01:21,040
The most obvious case is if the user is already at the first page or the last one from that page one
20
00:01:21,240 --> 00:01:23,270
should be able to go to the previous page.
21
00:01:23,730 --> 00:01:28,760
You can see right away that this little bit of HDL and CSF that is included with the bootstrap it's
22
00:01:28,770 --> 00:01:32,590
going to really help us out to build this thing inside of our application.
23
00:01:32,630 --> 00:01:33,680
Let's go over to our terminal.
24
00:01:33,690 --> 00:01:39,220
We're going to once again install bootstrap and then wired up to our project okay.
25
00:01:39,250 --> 00:01:44,740
So at my terminal I'll open up a new terminal window still inside my project directory I'll do an npm
26
00:01:44,800 --> 00:01:53,260
install bootstrap and then once that is all done then flip backwards to my editor which again I already
27
00:01:53,290 --> 00:01:54,630
opened just a moment ago.
28
00:01:54,670 --> 00:01:58,850
So make sure you open up your editor inside this new project directory as well.
29
00:01:58,910 --> 00:02:04,870
Then once again inside of our our RC directory we'll find our global styles Nazi SS file and I think
30
00:02:04,900 --> 00:02:06,010
you know we're going to do here.
31
00:02:06,410 --> 00:02:06,760
Yep.
32
00:02:06,820 --> 00:02:15,060
Let's throw in import or bootstrap ist USS bootstrap Dot's USS like so
33
00:02:18,910 --> 00:02:20,320
well then save this file.
34
00:02:20,390 --> 00:02:26,450
I'm going to look back over to my browser and open up my running web development server.
35
00:02:26,480 --> 00:02:26,990
There we go.
36
00:02:26,990 --> 00:02:28,490
Here's local's forty two hundred.
37
00:02:28,520 --> 00:02:30,380
I've got my default landing page.
38
00:02:30,470 --> 00:02:34,910
I can kind of tell that bootstrap did load up successfully because once again the styling inside of
39
00:02:34,910 --> 00:02:36,900
here is just a little bit off.
40
00:02:37,100 --> 00:02:37,390
All right.
41
00:02:37,380 --> 00:02:38,780
So now that we've got everything we need.
42
00:02:38,780 --> 00:02:40,260
Let's take a quick pause right here.
43
00:02:40,310 --> 00:02:45,020
The next video I'm going to start to discuss how we're going to implement this thing using directives.
4498
Can't find what you're looking for?
Get subtitles in any language from opensubtitles.com, and translate them here.