HOW TO LEARNG ABOUT HTML - GenZ Coder by DevNGamer #part1
DevNGamer
[{'start': '1.620', 'end': '7.359', 'text': '[Music]\nyo listen up i got a road map for you'}, {'start': '7.359', 'end': '14.599', 'text': 'want to be a full stack developer with\nAI lane chain for control for the low'}, {'start': '14.599', 'end': '20.600', 'text': "code invest your time in AI that's the\nprofitable mode javascript react next"}, {'start': '20.600', 'end': '30.279', 'text': 'jason fireas LLMs lane chain and more\nengineering door'}, {'start': '30.599', 'end': '35.760', 'text': 'practical module from my campus from\nJenderal Ahmad Yani University where'}, {'start': '35.760', 'end': '41.719', 'text': 'here there are several modules from\nHTML to'}, {'start': '41.719', 'end': '48.039', 'text': 'PHP basics well here I will\npractice how the basics of HTML'}, {'start': '48.039', 'end': '53.399', 'text': 'are html is one of the formats\nused in creating documents'}, {'start': '53.399', 'end': '56.280', 'text': 'and applications that run on web pages'}, {'start': '56.280', 'end': '61.320', 'text': 'actually HTML documents are just\nplain text documents and are called'}, {'start': '61.320', 'end': '65.439', 'text': 'markup languages, namely languages \u200b\u200bthat\ncontain certain tag marks that are'}, {'start': '65.439', 'end': '69.520', 'text': "used to set the display format of\na document without further ado let's"}, {'start': '69.520', 'end': '74.600', 'text': 'just execute here I\nuse Visual Studio Code eh'}, {'start': '74.600', 'end': '80.280', 'text': 'where you can check Visual Studio Code\nhere and then download and select'}, {'start': '80.280', 'end': '84.159', 'text': "Windows\nUbuntu Vedora or Maos if I'm"}, {'start': '84.159', 'end': '92.079', 'text': "here using Windows then use Windows\nokay click the direct download link here it's"}, {'start': '92.079', 'end': '97.520', 'text': "there right away because I already have it\nso just cancel it okay let's go"}, {'start': '97.520', 'end': '104.040', 'text': 'back to the module section where\nhere there is HTML head and body let'}, {'start': '104.040', 'end': '108.079', 'text': "'s just create the file like that  what do we\nmake the name of the"}, {'start': '108.079', 'end': '113.920', 'text': 'exercise 1.html'}, {'start': '114.040', 'end': '120.159', 'text': 'earlier here there is HTML which\nfunctions to wrap yes'}, {'start': '120.159', 'end': '122.840', 'text': 'just like this'}, {'start': '123.719', 'end': '132.160', 'text': 'html which had a\nhead then here there is a title title'}, {'start': '132.160', 'end': '138.280', 'text': 'for the title in the web for example'}, {'start': '138.280', 'end': '144.160', 'text': 'this is the title of our web we can open it here'}, {'start': '148.519', 'end': '153.840', 'text': 'here we\nopen it now it is visible'}, {'start': '153.840', 'end': '158.560', 'text': 'okay'}, {'start': '159.920', 'end': '166.920', 'text': 'continue where the contents were there the\ncontents of the web'}, {'start': '166.920', 'end': '174.120', 'text': 'easy web then the display will be like this\nGuys we refresh'}, {'start': '174.120', 'end': '182.000', 'text': "now that's so simple isn't it to make a\nsimple web like this okay we won't"}, {'start': '182.000', 'end': '189.599', 'text': 'use this I will start from\nshow preview okay here previously someone'}, {'start': '189.599', 'end': '193.360', 'text': 'asked "How do you display\nthis sub preview?"'}, {'start': '193.360', 'end': '199.799', 'text': 'Okay here you go straight to the extension\njust look for the live server like that okay well'}, {'start': '199.799', 'end': '205.920', 'text': 'after that install it\njust install it later you can open it'}, {'start': '205.920', 'end': '212.519', 'text': 'using right click there is soft preview or\nopen live server okay'}, {'start': '212.519', 'end': '217.040', 'text': "okay let's continue to the module section\nearlier yes"}, {'start': '217.040', 'end': '221.120', 'text': 'here we are told to\nmake'}, {'start': '221.120', 'end': '226.360', 'text': 'something like this where HTML\nT1'}, {'start': '226.360', 'end': '235.400', 'text': 'paragraph day image and also TR or\ntable okay we just execute it'}, {'start': '235.400', 'end': '242.760', 'text': 'we immediately make ee\ntask D html'}, {'start': '242.760', 'end': '250.879', 'text': 'we make it like this for example\nHTML head this is for wrapping the title for'}, {'start': '250.879', 'end': '258.000', 'text': 'example we make this one task we\nexit we right click shop preview'}, {'start': '258.000', 'end': '266.240', 'text': "immediately appears yes task one\nwell don't forget here there is a body now"}, {'start': '266.240', 'end': '270.759', 'text': 'what is the content of the body for\nexample the first'}, {'start': '270.759', 'end': '275.840', 'text': 'practice project well'}, {'start': '275.840', 'end': '282.639', 'text': 'this is normal before without a tag like\nthat yes now we have used the tag what is the'}, {'start': '282.639', 'end': '291.639', 'text': 'difference for example this is paragraph 1\nwell from here there is no difference'}, {'start': '291.639', 'end': '300.320', 'text': 'but for example we open\nhere we open the html task we click F12'}, {'start': '300.320', 'end': '307.080', 'text': 'well here it looks here using the tag\nhere no okay already yes in short'}, {'start': '307.080', 'end': '315.360', 'text': 'like that there is a difference we exit\nwe continue again the take A section take A'}, {'start': '315.360', 'end': '320.080', 'text': 'this is for what is this for a link\nfor example we press this we'}, {'start': '320.080', 'end': '328.000', 'text': 'make  The day is the URL of a\nYouTube, for example, copy paste'}, {'start': '328.000', 'end': '334.880', 'text': 'here, this is\nYouTube, then when we click it will'}, {'start': '334.880', 'end': '339.120', 'text': 'direct to YouTube,'}, {'start': '339.759', 'end': '344.560', 'text': 'now you can understand, take A is\nlike a link,'}, {'start': '344.560', 'end': '353.280', 'text': "okay, let's continue to the discussion\nagain, namely the br tag, what is this BR tag for?"}, {'start': '353.280', 'end': '363.360', 'text': 'This BR tag is usually used\nfor ee space below, for example,'}, {'start': '363.360', 'end': '367.280', 'text': 'adding B\nBB will'}, {'start': '367.280', 'end': '374.440', 'text': 'increase the space, see there is a\ndistance,'}, {'start': '374.440', 'end': '382.360', 'text': 'well after\nthat we create another name,'}, {'start': '382.360', 'end': '386.800', 'text': 'image, this image has src which means\nshort and'}, {'start': '386.800', 'end': '392.840', 'text': 'alt alt to indicate whether the photo is\nthere or not, so we just add a'}, {'start': '392.840', 'end': '399.720', 'text': "photo, okay, sorry, let's just add BR again,"}, {'start': '399.720', 'end': '406.639', 'text': 'enter, enter, save,\nokay,'}, {'start': '406.639', 'end': '414.680', 'text': "okay, let's add a photo,\nfor example, this photo, we copy it,"}, {'start': '414.680', 'end': '421.680', 'text': "here is my photo, okay, let's just call it"}, {'start': '421.680', 'end': '429.919', 'text': 'photo.png, why is it so big, bro,\nnow we just set the wid, for example, the'}, {'start': '429.919', 'end': '436.400', 'text': 'wid is 100, it will automatically shrink,\nokay,'}, {'start': '436.400', 'end': '445.360', 'text': 'now we continue to create a\ntable where'}, {'start': '445.360', 'end': '449.800', 'text': 'here there\nis a task to create a table like'}, {'start': '449.800', 'end': '456.479', 'text': "this, how do you do it, bro, okay, here's\nhow to do it,"}, {'start': '456.479', 'end': '465.360', 'text': 'we just create a table,\nwe give a table border, how'}, {'start': '465.360', 'end': '471.560', 'text': 'many are the selling,\nfor example,'}, {'start': '471.560', 'end': '478.199', 'text': '0, sell, how many are the paddings  for example 20\nwe add'}, {'start': '478.199', 'end': '485.840', 'text': 'TR tpr that is the row table there is already\nthis yes'}, {'start': '485.840', 'end': '491.080', 'text': 'well this is why is there this Bang because\nI use an extension'}, {'start': '491.080', 'end': '494.440', 'text': 'called code'}, {'start': '496.120', 'end': '506.039', 'text': 'Ium you can install this AI yes to\nhelp ee your code solving problem or'}, {'start': '506.039', 'end': '512.800', 'text': 'use this okay okay\nwell after that there is another extension'}, {'start': '512.800', 'end': '518.200', 'text': 'for example why are the rows so neat\nBang I use'}, {'start': '518.200', 'end': '525.959', 'text': 'this pret tier so that your HTML code is neat\nokay understand yes'}, {'start': '525.959', 'end': '532.000', 'text': 'okay here we'}, {'start': '532.080', 'end': '537.600', 'text': 'add\nee Okay well here we continue yes'}, {'start': '537.600', 'end': '543.240', 'text': 'we add a TR that\nis the R table where there is a'}, {'start': '543.240', 'end': '551.480', 'text': 'th table header which aims\nto create a header for example'}, {'start': '551.480', 'end': '556.399', 'text': 'welcome to the Unjani website'}, {'start': '562.240', 'end': '565.240', 'text': 'okay'}, {'start': '568.680', 'end': '572.560', 'text': 'then we add'}, {'start': '573.560', 'end': '577.000', 'text': 'a whatagi'}, {'start': '579.200', 'end': '583.399', 'text': 'yes ops sorry'}, {'start': '585.399', 'end': '590.399', 'text': 'now here we add TR where\nis the'}, {'start': '590.399', 'end': '597.519', 'text': 'row table and th table\nheader'}, {'start': '597.600', 'end': '604.880', 'text': 'okay we will create a table\nfirst of all this first yes some'}, {'start': '604.880', 'end': '610.000', 'text': 'display tables we make like that first where there'}, {'start': '610.120', 'end': '613.040', 'text': 'is a'}, {'start': '613.560', 'end': '618.120', 'text': 'name number if you want to copy paste you'}, {'start': '618.120', 'end': '626.240', 'text': 'can\nadd ILTC arrow sign yes so'}, {'start': '626.240', 'end': '632.640', 'text': 'name and name\nfor example there is a name here we just copy paste'}, {'start': '632.640', 'end': '638.880', 'text': 'yes let\nthis but here there is a little'}, {'start': '638.880', 'end': '644.240', 'text': 'different here there is something called'}, {'start': '644.279', 'end': '647.279', 'text': 'ee'}, {'start': '655.959', 'end': '661.320', 'text': 'TD which means the'}, {'start': '662.279', 'end': '667.279', 'text': 'data table the data table we want  what are the contents\nbro okay for example'}, {'start': '667.279', 'end': '675.360', 'text': 'one we want to copy paste again for example\nlon name is free'}, {'start': '675.360', 'end': '684.079', 'text': 'well we just copy paste this\ntek for example these'}, {'start': '684.839', 'end': '690.560', 'text': 'two\noriginal this is'}, {'start': '690.560', 'end': '697.360', 'text': "11999 okay so that's it\nokay let's continue to the student data section"}, {'start': '697.360', 'end': '702.200', 'text': 'now this is very similar here there is a'}, {'start': '702.200', 'end': '708.490', 'text': 'name number N we continue to the student data\nwhere we create a table'}, {'start': '708.490', 'end': '714.600', 'text': '[Music]\nagain emm our'}, {'start': '715.560', 'end': '720.920', 'text': 'table gives a border we just copy paste it\nyes use'}, {'start': '720.920', 'end': '726.240', 'text': 'this now\nwe give'}, {'start': '726.760', 'end': '730.160', 'text': 'for example TR'}, {'start': '731.399', 'end': '734.959', 'text': 'again then there is'}, {'start': '735.560', 'end': '741.480', 'text': 'TH then there is B which means student data bol'}, {'start': '741.920', 'end': '748.680', 'text': "don't forget above this we\ngive BR yes so there is a"}, {'start': '748.680', 'end': '753.120', 'text': 'distance then there is Csman'}, {'start': '754.240', 'end': '758.880', 'text': 'three we just use it'}, {'start': '759.040', 'end': '766.800', 'text': 'then there is again we give TR\nagain we give'}, {'start': '767.079', 'end': '770.079', 'text': 'th'}, {'start': '770.680', 'end': '775.040', 'text': 'number name and also'}, {'start': '776.639', 'end': '787.519', 'text': 'name okay there is a difference yes later\nwell here in TR we give eh in TH'}, {'start': '787.519', 'end': '792.480', 'text': 'okay here in TH we give\nwid'}, {'start': '792.480', 'end': '795.480', 'text': 'for example'}, {'start': '795.639', 'end': '799.760', 'text': '10% we just copy paste'}, {'start': '805.720', 'end': '813.079', 'text': "40% 40%\nnow it's similar"}, {'start': '813.079', 'end': '818.120', 'text': 'now after\nthat we just need to reduce it we give wid'}, {'start': '818.120', 'end': '821.360', 'text': '100%'}, {'start': '821.600', 'end': '825.240', 'text': 'yes like'}, {'start': '825.360', 'end': '831.720', 'text': 'this now for the data we first add a'}, {'start': '831.839', 'end': '837.800', 'text': 'row table for example we just copy paste from here yes'}, {'start': '838.440', 'end': '844.560', 'text': "Well, now it's the same as"}, {'start': '845.720', 'end': '855.240', 'text': "here, now we continue to the section like\nthis, sales data, okay, let's"}, {'start': '855.240', 'end': '862.680', 'text': 'continue, here we create\nanother table, we create a table,'}, {'start': '863.920', 'end': '871.720', 'text': 'then here there is something called TR table\nrow, we give th table'}, {'start': '871.720', 'end': '879.079', 'text': "header, sales data,\ndon't forget to give BR so"}, {'start': '879.079', 'end': '881.240', 'text': 'there is a'}, {'start': '882.199', 'end': '888.839', 'text': "distance, okay, after\nthat we use this first, so it's the"}, {'start': '888.839', 'end': '893.720', 'text': 'same and appropriate,'}, {'start': '894.040', 'end': '898.639', 'text': 'after that we\ncontinue to'}, {'start': '898.639', 'end': '905.160', 'text': 'create TR\nagain, RW table,'}, {'start': '905.160', 'end': '911.519', 'text': 'give the\nnumber, name of the'}, {'start': '911.839', 'end': '917.639', 'text': 'item, price and subtotal,'}, {'start': '920.000', 'end': '928.199', 'text': 'well, why did it become like this, bro, how do you do\nit? Well, the method is very easy,'}, {'start': '928.199', 'end': '935.920', 'text': "we first change some of it,\nfor example, here we don't add call span"}, {'start': '935.920', 'end': '941.759', 'text': "4,\nwell, it's appropriate, but why are they"}, {'start': '941.759', 'end': '947.319', 'text': "close together, wait,\nthis isn't 100% done, we"}, {'start': '947.319', 'end': '956.160', 'text': 'first fill in the data, for example, TR\nagain, we fill in the data table,'}, {'start': '956.160', 'end': '963.079', 'text': 'one\nPepsoden, then add TD,'}, {'start': '963.079', 'end': '969.959', 'text': 'for example\n2,500 5,000, here we'}, {'start': '969.959', 'end': '974.120', 'text': 'add\nalign'}, {'start': '974.120', 'end': '984.360', 'text': 'right, add more Re right\nha, okay, here it can be seen,'}, {'start': '985.240', 'end': '991.959', 'text': 'we can see,'}, {'start': '992.000', 'end': '999.240', 'text': "we can just copy paste this, but we'll change the"}, {'start': '999.240', 'end': '1006.680', 'text': 'ID later, Mi\nSarimi 6,000  the'}, {'start': '1006.680', 'end': '1009.680', 'text': 'price is'}, {'start': '1011.319', 'end': '1021.000', 'text': "Rp30,000\nokay let's add more this PR"}, {'start': '1021.240', 'end': '1026.280', 'text': 'earlier we just bolt it to our'}, {'start': '1028.520', 'end': '1035.880', 'text': 'total\nagain we bolt again total'}, {'start': '1035.880', 'end': '1045.439', 'text': "R.000 we make an example\nokay good let's make this again we line"}, {'start': '1045.439', 'end': '1050.480', 'text': 'right we move it to TD'}, {'start': '1055.840', 'end': '1060.160', 'text': 'we give call span'}, {'start': '1060.240', 'end': '1067.039', 'text': "three three well it's right right\nbut why is it so small"}, {'start': '1067.039', 'end': '1071.039', 'text': "bro don't"}, {'start': '1071.080', 'end': '1076.760', 'text': 'worry we will enlarge this\nfor example we'}, {'start': '1076.760', 'end': '1083.760', 'text': 'make it now like\nthis the width is 500'}, {'start': '1083.760', 'end': '1089.640', 'text': 'okay\npd we make it 10 only right it does'}, {'start': '1089.640', 'end': '1098.559', 'text': "n't match right it's similar right that's\nhow next we make another assignment what"}, {'start': '1098.559', 'end': '1102.640', 'text': 'is it bro here we make'}, {'start': '1102.840', 'end': '1111.360', 'text': 'this how to make this assignment is very easy\nwe make another one called'}, {'start': '1111.360', 'end': '1114.640', 'text': 'em\ntable like that'}, {'start': '1114.640', 'end': '1121.440', 'text': 'here I want to give a border\none sell'}, {'start': '1121.440', 'end': '1124.440', 'text': 'spacing'}, {'start': '1124.679', 'end': '1131.520', 'text': '0 sell peding 20\nokay here I want to use BR'}, {'start': '1131.520', 'end': '1137.000', 'text': 'so that it can be scrolled so it can be seen'}, {'start': '1137.880', 'end': '1142.320', 'text': 'okay we give it again for example TR table\nrow'}, {'start': '1142.320', 'end': '1149.520', 'text': 'th we give take font this new tag\nfor example size how much six like that'}, {'start': '1149.520', 'end': '1154.559', 'text': 'so it can be seen directly\nwelcome to the'}, {'start': '1154.559', 'end': '1162.400', 'text': "Unjani website well cool\nokay let's continue to span that three"}, {'start': '1162.400', 'end': '1165.919', 'text': 'style background'}, {'start': '1166.080', 'end': '1172.679', 'text': 'we can make CSS  Also in the\ninside of the tag, it is'}, {'start': '1172.679', 'end': '1181.559', 'text': 'usually called what between\ninline embedded or what I forgot'}, {'start': '1181.559', 'end': '1187.440', 'text': 'but you can search on Google,\nwhat is it called, eh, giving'}, {'start': '1187.440', 'end': '1193.760', 'text': 'style inside the tag, well, sometimes\nprogolimor also forgets what this name is, so we'}, {'start': '1193.760', 'end': '1199.559', 'text': 'continue, we just give it ol so that it is the'}, {'start': '1199.559', 'end': '1206.320', 'text': 'same,\nokay, after that we create ee TR again, the'}, {'start': '1206.320', 'end': '1212.400', 'text': 'row table, we give it TD, the\ndata table, eh, we give it'}, {'start': '1212.400', 'end': '1218.159', 'text': 'bing,\nwell, we give it again, the'}, {'start': '1218.159', 'end': '1226.159', 'text': 'name is ul, unordered list, well, we make the\nlist, what are these, for example,'}, {'start': '1226.159', 'end': '1231.360', 'text': 'Ojani\nDikti'}, {'start': '1232.600', 'end': '1235.880', 'text': 'ITB, after'}, {'start': '1237.000', 'end': '1244.520', 'text': 'that, UPS, sorry, there is an error here, we\nenter it into the data table, okay, be'}, {'start': '1244.520', 'end': '1248.440', 'text': 'careful, we\nhave to be careful in'}, {'start': '1248.440', 'end': '1254.080', 'text': "making\nor coding, let's continue"}, {'start': '1254.080', 'end': '1259.320', 'text': 'to the'}, {'start': '1260.159', 'end': '1266.360', 'text': 'th section, this should be in the\nrow table, we still make'}, {'start': '1266.360', 'end': '1272.840', 'text': 'th, we make the\nimage again, for example,'}, {'start': '1272.840', 'end': '1278.240', 'text': "just a photo, free or unjani, okay, wait,\nI'll copy and"}, {'start': '1278.240', 'end': '1282.799', 'text': 'paste it here, okay, here it is, for'}, {'start': '1286.159', 'end': '1291.000', 'text': 'example, there is no photo,'}, {'start': '1291.000', 'end': '1295.679', 'text': 'we can\nknow to mark it,'}, {'start': '1295.679', 'end': '1303.039', 'text': 'after that we make the wid 100,'}, {'start': '1305.400', 'end': '1311.520', 'text': 'okay, we use BR, we just make a space,\nwe make'}, {'start': '1311.520', 'end': '1317.240', 'text': 'unjani\nis'}, {'start': '1318.279', 'end': '1324.679', 'text': 'best private university in West Java'}, {'start': '1328.120', 'end': '1333.600', 'text': "okay we've made th we've made another th\nannouncement table"}, {'start': '1333.600', 'end': '1342.520', 'text': "header okay now the contents we use\nU u if I'm not mistaken"}, {'start': '1343.600', 'end': '1348.720', 'text': 'underline right\nwe use OL ordered'}, {'start': '1348.720', 'end': '1355.600', 'text': 'list yes where there is in the package\nli give U'}, {'start': '1355.600', 'end': '1358.600', 'text': 'again'}, {'start': '1360.000', 'end': '1365.159', 'text': 'christmas then we just copy paste TA1'}, {'start': '1367.000', 'end': '1371.080', 'text': 'seminar'}, {'start': '1379.840', 'end': '1386.080', 'text': 'thesis defense\nnow like this'}, {'start': '1387.039', 'end': '1395.480', 'text': "yes it's similar we continue to make the\ndesign section by admin who is that okay here"}, {'start': '1395.480', 'end': '1397.679', 'text': 'we make the last\n[Music]'}, {'start': '1397.679', 'end': '1404.120', 'text': 'here look at the packaging we can just do it like this\nwe make TR again table'}, {'start': '1404.120', 'end': '1407.279', 'text': 'Row we\nmake the'}, {'start': '1407.279', 'end': '1410.279', 'text': 'name'}, {'start': '1410.400', 'end': '1417.279', 'text': 'earlier we bol design\nby'}, {'start': '1417.279', 'end': '1422.240', 'text': 'Adrian\nAlpen'}, {'start': '1425.039', 'end': '1432.039', 'text': 'name 1 3 1 2 3\nNow Bang why is it like this Bang calm down'}, {'start': '1432.039', 'end': '1438.039', 'text': "we haven't added call spot\nthree"}, {'start': '1438.039', 'end': '1447.679', 'text': 'now the glue\nflashlight set is cool bro we add BG'}, {'start': '1447.679', 'end': '1452.279', 'text': 'color light\nblue'}, {'start': '1452.279', 'end': '1455.640', 'text': 'soda similar right now'}, {'start': '1456.159', 'end': '1464.440', 'text': 'coding is easy and\nfun of course not'}, {'start': '1464.440', 'end': '1469.080', 'text': 'but discuss it with friends this is an\ninitial experiment to make a template to'}, {'start': '1469.080', 'end': '1475.720', 'text': 'make a web where it is\ncommon if you are new to'}, {'start': '1475.720', 'end': '1480.720', 'text': 'HTML and for you to get to know it better\nyou can check on the web'}, {'start': '1480.720', 'end': '1485.559', 'text': 'trechool I usually study at the web'}, {'start': '1485.840', 'end': '1493.320', 'text': 'school to learn HTML yes\nhere there is an introduction to the basic editor'}, {'start': '1493.320', 'end': '1500.440', 'text': 'element attribute\nheading there are many other techniques'}, {'start': '1500.440', 'end': '1505.039', 'text': "okay that's all"}, {'start': '1505.039', 'end': '1512.200', 'text': 'from my practice to introduce\nHTML based on the practicum at'}, {'start': '1512.200', 'end': '1519.200', 'text': 'my campus\nokay good luck and see you'}]