1
00:00:00,410 --> 00:00:03,310
There are a few ways to quickly
get started using Bootstrap.

2
00:00:03,310 --> 00:00:07,000
Each way might appeal to a different
skill level or use case.

3
00:00:07,000 --> 00:00:07,950
To download Bootstrap,

4
00:00:07,950 --> 00:00:13,240
you can click the big Download button here
on the main page at getbootstrap.com.

5
00:00:13,240 --> 00:00:15,580
And this brings you to
the Download section of the docs,

6
00:00:15,580 --> 00:00:18,420
where you're presented with a few
different sets of instructions for

7
00:00:18,420 --> 00:00:21,390
how to download and
install the Bootstrap framework.

8
00:00:21,390 --> 00:00:26,210
For example, you can download the compiled
and minified CSS and JavaScript, and

9
00:00:26,210 --> 00:00:28,270
link them to your HTML file.

10
00:00:28,270 --> 00:00:32,490
Or download everything, including
Bootstrap's source Sass, JavaScript, and

11
00:00:32,490 --> 00:00:34,120
documentation files.

12
00:00:34,120 --> 00:00:37,480
And if you wanna pull in Bootstrap's
source files into a new or

13
00:00:37,480 --> 00:00:43,620
existing project, you can use package
managers like npm, Bower, even Composer.

14
00:00:43,620 --> 00:00:47,290
Now, the fastest way to get a project
up and running with Bootstrap

15
00:00:47,290 --> 00:00:51,840
is using the Bootstrap CDN,
or content delivery network.

16
00:00:51,840 --> 00:00:54,730
So if you don't want to download or
install any files and

17
00:00:54,730 --> 00:01:00,390
get started right away, simply use the CDN
links provided here in the download page.

18
00:01:00,390 --> 00:01:04,907
And when you add these sets of links to
your HTML, you load Bootstrap's CSS and

19
00:01:04,907 --> 00:01:07,453
JavaScript remotely from the CDN servers.

20
00:01:07,453 --> 00:01:10,700
So now, I'll click the Introduction link.

21
00:01:10,700 --> 00:01:13,350
And the Starter template of this page

22
00:01:13,350 --> 00:01:17,660
provides all the CDN links you need to
include Bootstrap in your web page.

23
00:01:17,660 --> 00:01:22,370
You can also use this Starter
template as a basis for your page.

24
00:01:22,370 --> 00:01:27,570
So, in this course, we're going to build
our website using the Bootstrap CDN.

25
00:01:27,570 --> 00:01:31,170
That way, we won't have to worry about
using additional tooling, like a build

26
00:01:31,170 --> 00:01:34,790
system, to compile our code and
view our latest changes in the browser.

27
00:01:34,790 --> 00:01:38,890
We'll simply focus on the CSS and
JavaScript tools Bootstrap provides,

28
00:01:38,890 --> 00:01:41,160
without having to download or
install anything.

29
00:01:41,160 --> 00:01:44,070
But you can check the teacher's notes for
resources and

30
00:01:44,070 --> 00:01:46,880
related videos on downloading,
installing and

31
00:01:46,880 --> 00:01:52,090
using Bootstrap with other methods listed
here along with other front end tools.

32
00:01:52,090 --> 00:01:56,060
Now, if you feel comfortable using
Bootstrap by downloading the source files

33
00:01:56,060 --> 00:01:58,650
or installing it with a package manager,
then go for it.

34
00:01:58,650 --> 00:02:01,120
Just make sure,
you follow the instructions carefully, and

35
00:02:01,120 --> 00:02:04,170
have all the required dependencies
installed on your computer.

36
00:02:04,170 --> 00:02:07,640
And if at some point you feel like you've
strayed too far off course, that's okay.

37
00:02:07,640 --> 00:02:09,450
You can always launch
the latest workspace,

38
00:02:09,450 --> 00:02:12,230
or download the project files and
pick up right where I left off.

39
00:02:13,380 --> 00:02:16,510
Speaking of which, go ahead and
launch the workspace with this video or

40
00:02:16,510 --> 00:02:18,980
open up the project files,
if you're using your own text editor.

41
00:02:18,980 --> 00:02:22,690
I already have a Bootstrap 4 starter
template all set up for you.

42
00:02:22,690 --> 00:02:28,150
The template contains a link to
Bootstrap's CSS as well as the responsive

43
00:02:28,150 --> 00:02:32,080
viewport meta tag to ensure proper
rendering and zooming for all devices.

44
00:02:32,080 --> 00:02:33,870
Now, the page needs a title.

45
00:02:33,870 --> 00:02:41,471
So inside the head tag, I'll add a title
tag with the text, Full Stack Conf.

46
00:02:45,115 --> 00:02:49,376
Let's also change the h1
content to Full Stack Conf.

47
00:02:53,019 --> 00:02:55,140
I'll give this a Save.

48
00:02:55,140 --> 00:02:59,600
And when you preview index.html in
the browser, it doesn't look like much yet

49
00:02:59,600 --> 00:03:02,600
because besides the heading,
there's no other content.

50
00:03:02,600 --> 00:03:03,520
We'll add that next.

51
00:03:04,700 --> 00:03:06,570
We've setup our starter template, so

52
00:03:06,570 --> 00:03:09,740
we're ready to begin building
a simple webpage with Bootstrap.

53
00:03:09,740 --> 00:03:10,630
In the next video,

54
00:03:10,630 --> 00:03:14,362
you'll see how Bootstrap makes it really
easy to style and lay out your content.