What is bootstrap Video Lecture | Learn Bootstrap: From Basics to Building a Project - Front-End Programming

this is part one of bootstrap tutorial
in this video well this case what is
bootstrap and the advantage is fusing
bootstrap so what is bootstrap bootstrap
is a free open source and is the most
popular HTML CSS and JavaScript
framework developed by Twitter for
creating responsive web applications it
includes HTML and CSS based design
templates for common user interface
components like buttons dropdowns
typography tabs forms tables navigation
alerts carousel etc along with optional
JavaScript extensions bootstrap
framework is based on all open standards
HTML CSS and JavaScript this means
bootstrap can be used with any
server-side technology and any platform
you can use it with any web application
built with any silicide technology with
asp.net Java PHP etc so what are the
advantages of using bootstrap there are
several of them let's look at these
advantages one by one bootstrap supports
responsive design one of the greatest
advantage of using bootstrap is that it
helps us create responsive web
applications faster and easier so the
obvious question that comes to our mind
is what is a responsive web application
a responsive web application
automatically adapts to different screen
sizes that is desktop computers laptops
tablets mobile phones etc a responsive
application provides optimal viewing and
interaction experience that is easy
reading and navigation with a minimum of
resizing and scrolling across a wide
range of devices so you don't have to
worry about your application not being
compatible with multiple devices and
their screen sizes let me actually show
you an example on this web page right
here we have a responsive and a non
responsive app being viewed on a mobile
device look at the non responsive app on
the Left look at the image look at the
menu items and look at the text the
application is barely usable here
without Vee having to readjust it
whereas look at the responsive app look
at the image it's clear and crisp look
at the menu there is
one menu button there it says main menu
when we click on that that's when the
subsequent menu items will be displayed
and look at the text content it's very
much readable so in this case since the
application is responsive it has
automatically adapted itself to the
screen size that it is being viewed on
whereas the non-response you have it
didn't adapt itself let me actually show
you another example so this is a working
example from bootstrap Docs calm at the
moment we are viewing this on a laptop
screen notice the login controls here
and notice these three headings at the
moment since we are viewing it on a
laptop screen the headings are aligned
next to each other side by side look at
what happens as I start to resize you
know the browser vendor look at this we
are still at the moment on a laptop
screen size as soon as we reach a tablet
screen site so here we have reached a
tablet screen size and look at what
happened to these headings instead of
being side by side they are now one
below the other now look at what is
going to happen when we read the mobile
screen size look at what happened to the
menu item now it's a single button when
I click on the button that's when the
logon controls show up and look at the
headings again they are one below the
other as soon as we reach you know the
laptop screen size look at the headings
they are now side by side and the login
controls are like this so here the
application is adapting to the screen
size it's being viewed on so this is a
responsive app and Twitter bootstrap
makes creating responsive apps quicker
and easier saves a lot of development
time one of the biggest advantages of
using bootstrap is that it saves a lot
of development time instead of writing
code from the scratch bootstrap offers
ready-made blocks of code that you can
use and customize to suit your
application requirements there are also
many websites out there that offer free
and paid bootstrap
seems that saves even more development
time consistency bootstrap was developed
by Twitter to encourage consistency
across their internal tools by giving
their developers a centralized
development codebase since all the
developers are working using a
centralized codebase the end result is
consistent regardless of who is working
on the project and which web browser is
being used customizable bootstrap is
also highly customizable if you are
using only a few features of bootstrap
you can customize to download only those
features using the bootstrap customize
page let me actually show what I mean so
this is the bootstrap customize page
I'll have all these links available on
my blog as well as in the description of
this video if you need them so bootstrap
has got several features now let's say
within your application you are only
using a few features if that's the case
whatever features you are using leave
them checked and whatever features you
don't want you know uncheck them and
then as you scroll to the bottom of the
page you have a button here it says
compile and download when you click this
you have your custom version of
bootstrap ready to be used with your
application finally support as bootstrap
is the most popular framework it has a
very large community based and excellent
documentation bootstraps excellent
documentation examples and demos helps a
developer learn bootstrap quickly even
if you are new to it if you ever run
into an issue you'll usually get help
quickly and easily from the vast online
community and web forums that are
available in our next video we'll
discuss downloading setting up and
understanding different bootstrap
competence please stay tuned thank you
for listening and have a great day