hey guys i hope that i am live right now
if you guys are able to listen to me
properly as well as there's no issues
with the audio or the video
uh please do let me know guys
hello everybody i hope that i'm live
right now if you guys are able to listen
to me properly as well as there's no
issues with the audio or the video
please do let me know
is there any back-end boot camp yes
we are going to have a back-end bootcamp
starting from the 1st of september you
guys can go to our website def town dot
n okay if you are going to deaftown dot
n then go to events section you will be
able to see all the upcoming boot camps
that we have scheduled for example we
are having the back-end web development
uh bootcamp that is in association with
postmath that is going to start off uh
from the first of september then we are
having the a to z uh cds that we are
starting on artificial intelligence then
the instagram click on using html and
css
and then we are having one more on
machine learning similar to that we are
currently scheduling one more boot camp
after this on data structures and
algorithms as well
so
yeah that is also something that we are
currently uh
planning right now
okay so suresh kumar guys uh this is
full of fake uh they are not teaching
well so yes yes we are fake just like
his english
so
at least learn a bit
no issues in that those who are here to
study they will study those who are here
to do masti let's enjoy the same like
let's share the jokes amongst us let's
enjoy there's no issues in that as well
okay
okay
um can the project be completed without
laptop yes durgesh you don't have to
worry about it like i said the project
will be made in such a way that you guys
are able to do it from your mobile
phones as well that is the reason why
we'll be using code sandbox okay
so how is your health so actually like
due to all the cuff and everything i'm
not able to speak very clearly but i i
hope that you guys are able to
like listen to me properly itself okay
i'm so sorry
i think so that should be a diploma i
think so obey so i am a diploma holder
should i go for a degree or should i go
for a job
uh okay that totally depends on what
kind of job you are able to get uh if
you are able to get a good job then of
course like um
[Music]
you should go further with it but my
suggestion would be get a degree from a
good prestigious university first of all
okay and i'm talking about a good
prestigious university not some like
normal university try to make sure that
you are able to get into a good
university itself okay
uh today a lot less number of students
have come up to the class itself can you
guys uh
let me know what has happened because i
want to make sure that everybody
is able to learn in the classes like
nobody is missing out on classes itself
sorry sir i not mean it but again suresh
you need to work on your english but no
issues in that
i not mean it but as
uh my point you can give more practical
concepts in the class so that everyone
will be benefited um
suresh i will definitely like to know
that uh some examples of what you want
me to teach because see um it's fine
like i always appreciate feedback even
if it's negative because uh when you
give negative feedback only then i will
be able to improve myself in the classes
but i would like to know like some
examples of any kind of practical uh
like
concepts that i'm not able to teach you
guys because like i said i want to make
sure that i'm able to start from the
basics when you're starting from the
basics there's not a lot of
projects involved yes at the end of the
bootcamp we are going to work on a
project but still like if you have some
ideas please let me know
please arrange a bootcamp on cyber
security next so puneet we have already
scheduled boot camps for the entire
month of september and the first half of
october as well uh i will definitely
take this as a point if you guys want a
bootcamp on cyber security in the second
half of october i will definitely try to
arrange a boot camp on cyber security as
well okay
uh so guys i wanted to make sure that um
you guys see i will never force you guys
to study or anything like that i want to
make sure that we are able to develop a
relationship in such a case that you are
able to trust me at the end of the day
and you have full confidence that if you
are here to study we are here to study
only i want to lay like
get from you guys do you want to study
today or do you want to leave like well
i'm able to see a lot num less number of
people have turned up to the boot camp
compared to
usual uh people so do you guys want to
continue today or do you guys uh
want to go further with the match itself
because my suggestion is that we should
be studying like uh that is what i want
at the end of the day
okay so uh
let's
okay almost everybody is writing with uh
let's start okay so uh let's get started
guys today we are going to start off
with uh learning about html we have got
a basic understanding in the previous
classes uh could you guys let me know
what was the example that i used to let
you guys know like what is html do you
guys remember that like i told you guys
the structure for the entire website
just like your skeleton system is so
just like your skeleton system is uh
your
html provides a structure to your
website itself the full form of html is
hyper text markup language now these
markup languages are something that uh
maybe some of you might be familiar with
don't worry about it guys i will try to
make sure that today's class is a bit
short okay as i'm able to hear that just
the toss has been done so try to make
sure that today's class we are able to
get it over in like 45 minutes so you
guys can also enjoy the match but let's
study as well every day a bit a little
bit pieces of studying is extremely
important okay it builds up your habit
of studying at a longer term itself okay
so hyper text markup language now these
markup languages maybe some of you might
be familiar with it uh do you guys know
the hilo graphs that the egyptians used
at the end of the day are you guys
familiar with that okay let me just
search for it
uh
e g y p t i a
hello crafts
have you guys uh seen these kind of
stuff let me get my phone so that i'm
able to see your
live chat as well give me a second guys
okay yeah so i've brought in my phone as
well let me just open up the live chat
um
okay
react
yeah so many of you might be familiar
with the egyptian hylographs you must
have seen in maybe moonlight uh one of
the marvel series or maybe some ancient
like uh history tv 18 or discovery
channel you must have seen this so as
you are able to see these hilo graphs
that were made by egyptians use certain
um
like characters or certain like figures
itself to add a bit more meaning to
their text so normal uh alphabets and
everything they were using it but along
with that they used to use some images
as well that they used to add into their
text to add some more subtle meaning to
it at the end of the day okay and that
is basically what what a markup language
is that is something that is a markup
language that is you are using some
particular maybe some images maybe some
tags maybe something else to add more
meaning to the content that you are
writing are you guys able to understand
this please let me know
are you guys able to understand this
please let me know guys
great so the same thing is with html as
well html so here the egyptians use
these images in html you use something
called as tags okay so in html you write
your normal whatever you want to
showcase on your website and you use
these tags to add some more meaning to
these texts uh let us open up code
sandbox and immediately start working on
it so let me just open up code sandbox
like i said um
you guys will also be using code sandbox
from now on uh until the end of the
bootcamp itself so html css react and
the project will be doing it inside of
code sandbox so from today whatever we
are doing anybody who ever has a
smartphone will be able to practice okay
so please make sure that if you are
getting some time after the match has
ended uh or if you are not interested in
the match as well uh try to make sure
that you are able to
write like practice some of the things
that we have done there's not a lot that
we're going to do today but still okay
so uh right over here i've opened up
code sandbox you can log into the
platform using google or github once
you've done that i want you guys to
click on this particular create sandbox
button once you have clicked on the
create sandbox button you want to click
on this particular static template okay
recently used templates or official
templates and to find the static
template right over here uh once you
have clicked on this particular static
template uh it will open up the um i
online ide for you guys okay on the left
hand side you are having your files we
are concerned with only the index.html
file and
in the middle you are having your code
okay so the ceo of our company has
finally joined us as well
uh
okay so we don't want to have anything
inside of our index.html so this is
index.html the name of the file is index
and it's an html file just like dot pdf
dot ppt exists similarly this is dot
html okay and on the right hand side as
you're able to see that is your website
okay on the right hand side you are
having your website right over here now
this website i don't want it i only want
my code to be there on this particular
page okay i want this website to open up
on a new page for that there is a button
right over here on the top right corner
okay uh on the top right corner you will
be able to see a button called as open
in new window okay if you're hovering
over that button it will show you open
in new window i want you guys to click
on it okay it will open it up in a new
page and then you can just like collapse
it down you don't require it increase
the size you can
do this let me just
collapse it away and then you are having
your index dot uh html file where we'll
be writing all our code again now
starting off with writing a basic format
of html code um you have something that
so like i said uh you use tags in html
um let me just open up a
ppt so that it's much more easier for
you guys to understand uh give me a
second guys
okay
let me check i think so this one should
work
i'm so sorry so like i said um
html is based off on tags okay you are
having your opening tags and your
closing tags right over here okay the
opening tag and the closing time this is
one of these so for example you want to
write a paragraph on your website okay
you want to write a paragraph on your
website in that particular case what you
have to do is um
usually you will be writing a paragraph
you will be having a header footer and
all those kind of stuff now in html you
just have to use the paragraph tag okay
it's the opening p tag and the closing p
tag right over here whatever content is
present in between them that will be
your paragraph it will be like it will
appear on the website as a paragraph
itself the door is open you can open it
up
yes there's somebody at the door let me
just check it
uh just call the person who has ordered
it
okay so um yeah where were we
yeah so just like that you are having
your opening tags and your closing tags
okay so in this particular file that we
have created right over here in this
file index.html what we want to do is we
want to write our html code okay so
writing our html code we need to make
sure
that we are like we need to specify that
whatever code that we are writing right
over here is the html code itself so
we'll be having an opening html tag and
a closing html tag okay so let's get
started right over here okay you will
have a opening html tag as you're able
to see
and a closing html tag as well all your
html code that you want to write
everything all your html code that you
want to write will exist
i'm so sorry guys the ceo started
running away
okay
uh i'm so sorry but
yeah the susie started running away from
the house itself i had to go and uh get
her inside
okay so right over here whatever html
code that you want to write you will
write it in between these opening and
the closing html tags okay
uh so right over here
that is
the
opening and the closing html tags
now between that there are two parts
of your code of your html code the first
one is your head and the second one is
your body let's try to understand that
now
this head tag okay so what html has done
is all your metadata that you want to
have every kind of metadata that you
want to have will go inside of this head
tag now what do you mean by metadata
okay so for example you are buying a
iphone
okay you're buying an i
iphone right now you know that it's an
iphone it's off 126 gbs it is made in
california assembled in china um you
have all the information the cost is
like 1 lakh 10 000 rupees uh so it is
blue in color you know everything just
by looking at the phone itself but still
on the box there will be a lot of data
about that phone the phone is inside the
box
you know what that phone is you have all
the idea about that phone but still on
the box itself there will be a lot of
data that will be there for that
particular phone now data about data or
information about data is called as your
metadata okay information about your
data is called as a metadata are you
guys able to understand this please do
let me know yeah ceo basically means
chief entertainment officers i'm so
sorry for the disturbance and everything
okay
um
i did not attend uh for uh for the same
itself i don't know why is it happening
are you guys able to understand uh
metadata guys
please do let me know
everybody is able to understand metadata
okay great so whatever information that
you want to write at the end of the day
uh about the website maybe the name of
the website itself that is an
information about the website okay data
about the website um name of the website
creator of the website so all this is
basically something that you don't want
to showcase on the website itself is
just some information that you're
providing related to the website okay so
that is metadata so all these kind of
metadata that you want to specify about
the website will go inside of this head
tag okay the second tag that is there
inside of the html is your body tag okay
it's your body tag right over here
whatever you want to showcase on the
website maybe some image maybe some text
maybe some paragraph maybe some heading
any kind of stuff that you want to
specify on the website itself you want
to showcase to the user itself
that will go inside this particular body
tag okay that will go inside of this
particular body tag are you guys able to
understand this please do let me know
are you guys able to understand this
please do let me know guys
great so
let's we have created our head tag we
have created our body tag let's put up
the title of our website okay so we'll
be using the title tag ti
tle title tag right over here and we'll
be specifying our title inside of it
that is the name of the website that we
want to have let's name it as my
first
website okay so we are naming the title
of the website as my first website that
is the title of the website that is the
name of the website that is a metadata
we don't want to showcase it on the
website itself it's just some
information about the website
then inside of the body maybe i want to
like have a article sort of structure in
which we are having a big bold heading
along with that i want some
text written inside of it to get a big
bold heading in the uh using html on the
website you will be using the heading
tag okay we'll be learning about the
heading tank in a bit more depth after
like five minutes but we'll be using the
heading tag right over here that is the
h1 tag okay so to make the so right over
here if i'm just putting something like
uh this
is the
title
okay if i'm just putting some text right
over here saving my code going back to
my website reloading the page
as you're able to see the uh text is
very small it's not big it's not bold
okay it does not look good this is your
normal text that you're putting up right
over here you are just writing inside
the body tag you're writing some text
that is being shown on your screen
that's it now if i want to make this
text big and bold i will be including
this text using the markup language that
is html i'll be putting up it inside of
h1 tag okay so i will be putting up an
opening and a closing heading tag right
over here okay a glue opening and a
closing heading tag right over here let
us save this let us go back to our
website reload the page as you are able
to see now my text is big and bold okay
it's like a heading right now so that is
how like these tags basically work in
html are you guys able to understand
this please let me know guys
uh bhavit kaur i have told like how to
use code sandbox uh initially itself uh
like repeating that i think so would be
a waste of time so after this video is
over if you are going to practice it on
your own you can definitely like rewatch
the process of how to open up port
sandbox and everything in the video
itself okay
okay great so let's continue from right
over there let's go back to our ppt and
continue from there itself okay
so
before doing that let us take up some
practice
uh because i want to make sure that you
guys are able to understand something
and then we will proceed further with uh
some periodical aspect as well let's see
that we want to create a button okay we
want to create a button so this is our
problem statement okay make a button we
need to have a heading that is the h1
tag we know that and then we want to
have a button right over here so what
we'll be doing is we'll go back to our
code okay we have already have an h1 tag
this is a button
okay so we'll change the text to be utto
and button
and we want to create a button
below the h1 tag right now we just have
the h1 tag we want to create a button as
well but maybe i don't know maybe i
don't know about it so there are two
places uh three places which you can
usually go and refer to if you are stuck
somewhere inside of html or css okay so
the first place that you can go to is
the mdn documentation okay mdn web docs
so you can definitely go to the mdn web
docs whatever you want to search for you
could directly search for right over
here control f and let's find uh
b u t t o n button
so
sorry
you can just search for let's say button
from right over here
search for b u t t o n button
and you will get the button element you
can try it out you can test it out you
can learn a little bit more about it
okay so um
it will work from right over here the
second please that you can search for is
directly google it okay how to create
a button in html okay you can just like
search for it right over here it will
most probably take you to w3 school so
that was the third place that i was
going to tell you guys about where you
can go and search for at any point of
time if you're stuck somewhere you can
definitely come here and search for it
definitely when you're searching for
something try to read through the entire
stuff okay do not
stop once you're getting your answer do
not stop read through the entire stuff
there will be a lot of different things
that you will be able to learn okay at
the end of the day so let's create a
button right now okay we'll be using the
bu tto and button tag itself and we'll
have the text as click
here
okay we'll have the text as click here
and we'll go back to our website reload
the page
and then you are able to have your h1
element as well as your button on your
screen that says click here are you guys
able to understand this
please do let me know guys
are you guys able to understand this
please do let me know guys
are you guys able to understand this
please do let me know guys
great amazing guys amazing so the next
thing that we want to see is uh we want
to understand about the h1 tags i think
so that is the next task let us see yeah
so we'll be checking all the heading
tags right now the only heading tag that
we have learnt about is the h1 tag
itself okay that is the h1 tag now there
are six heading tags okay from h1 to h6
there is no zero there is no h7 it's h1
h2 h3 h4 h5 and h6 these are the six
heading tags that exists in the entire
known universe okay there's no more
there's no less okay so we'll be looking
at these uh
heading tags right now so what we are
going to do right now is we are going to
go back and we are going to delete our
button
and we are going to create our h
heading tags itself so this is
heading one
similar to that we will be creating it
from h1 to h6 guys
let's change the numbers so h2 h3 h4 h5
h6
that these numbers need to be changed
it's
two h3 h4 h5 at six
uh we need to change the numbers as well
two three four
five and six
let's save it right over here as you're
able to see we have created all the six
heading tags and we'll see the
difference on the website as well as
you're able to see this is uh what these
heading tags look like so you're having
the h1 tag that is the boldest and the
largest and the h6 stack that is the
smallest at the end of the day are you
guys able to understand this please do
let me know guys
okay
okay
so
let me go back to the ppt
okay the next thing that we want to
understand is that how to create a list
okay how to create a list in using html
okay that is what we need to understand
now there are two kinds of lists that
exist okay the first one is your
unordered list and the second one is
your ordered list let's try to
understand both of them okay
uh
let me open up paint so that it's easier
for you guys to understand as well
yeah it is important that you are making
the project on code sandbox you cannot
create the project on notepad because
like i have explained it yesterday
itself that javascript so when you will
be doing the project it will be a
javascript based react project so you
cannot do it on notepad uh you need an
ide a proper ide with the proper
software is installed like the versions
as well so for that uh code sandbox does
that automatically for you okay
okay
so right over here as you are able to
see uh there are two kinds of
lists that exist in html the first one
is the unordered list
and the second one is your ordered list
uh so the unordered list as you are able
to see right over here is usually like
for example bullet points okay you are
having bullet points right over here
there's no order right over here okay
there's no order right over here you're
having your html you're having a css
you're having a javascript so there's no
order i'm not numbering it uh or i'm not
specifying that html is like the first
and css is second and javascript is
third no so there's no order right over
here and the second one is your ordered
okay the second one is your ordered for
that you will be having like your one so
that is html to your css
three your javascript and maybe you can
number it as a that is html
b that is css
and
c that is your javascript right over
here okay are you guys able to
understand this uh please do let me know
guys
are you guys able to understand the
difference between an unordered and an
ordered list guys please let me know
guys you have to use code sandbox for
the entire bootcamp because you will
have to submit the project as well uh
the submission of the project will only
be taking place in code sandbox so that
we are able to check your projects so
that is the reason why i am specifying
it from right now as well that during
the duration of the bootcamp the project
and everything you have to use a code
sandbox only there is no other options
that are going to be made available to
you uh because you will not be able to
submit the project in the other cases
uh the second thing is yes after the
boot camp whatever is preferable to you
for example i am very comfortable in vs
code right now so i usually use vs code
for my own development purposes i will
suggest you guys the same atom is also a
great alternative but with atom there's
a lot of customization that you have to
do so i used to spend a lot of time
doing that customization instead of
coding itself there's a reason why i
shifted to vs code but yeah that is a
totally your choice okay
uh yeah i'm able to hear some noise in
the building as well
i think so somebody got out or something
like that
okay great so let's do one thing let's
stop right over here i'm able to
understand not a lot of students are
actually like uh listening to me and
there's a lot of disturbance as well
that is going uh out right over here so
no issues we'll continue from tomorrow
we'll start with the unordered and the
ordered list tomorrow there will be the
class will be a bit long so please be
ready for it okay i will be taking up
class for like one hour 45 minutes okay
so please be ready for it my aim is that
tomorrow we'll be finishing up with html
and doing half of css as well that is
our aim for tomorrow okay so no issues i
will repeat this again tomorrow just try
to make sure that you are able to
understand the difference between
unordered and ordered and we'll do it
tomorrow itself i'll give you guys the
attendance for today give me a second
guys i will give you guys the attendance
for today
no uh please try to use code sandbox
itself do not use any other platform uh
i know there are some other good great
alternatives that are available but uh
if there is any problem with those
platforms we will not be able to rectify
it that is the reason why i am
suggesting you guys to go with code
sandbox itself okay
let me just check if everything is
working properly
day three
uh this is the qr code for today's class
guys
uh
game for life uh happy birthday in
advance itself for the same okay
uh
yeah so a lot of students are actually
watching the match itself and there's a
lot of disturbance that is going on
right over here as well so no issues
we'll continue tomorrow okay just be
sure that uh you are able to do the
entire stuff okay
okay thank you so much guys thank you
uh
can we imagine watch the match uh on
stream together i don't know if i have
like the
permission to stream
the match on my pc on youtube or
something like that and i don't want to
be stuck right over there but definitely
like someday we can plan a watch
together for some movie or something
like that if you guys are interested in
it okay
okay thank you so much guys we'll meet
tomorrow and we'll have an awesome class
tomorrow as well thank you so much thank
you guys thank you