1
00:00:07,190 --> 00:00:15,740
Finally, finally the time has come to write or to create our first website using HTML.

2
00:00:15,950 --> 00:00:18,380
So let's look at the process.

3
00:00:18,650 --> 00:00:26,540
The first step is that we need to create a folder for our project, and I'm going to name my folder

4
00:00:26,540 --> 00:00:31,520
as web development and you can name it whatever you want.

5
00:00:31,520 --> 00:00:37,910
And inside I want to create subfolder and I'll call it as a HTML.

6
00:00:38,700 --> 00:00:44,760
And inside I will create one folder and I will say getting started.

7
00:00:45,360 --> 00:00:45,870
Perfect.

8
00:00:45,870 --> 00:00:49,050
So I have this folder that I'm going to work with.

9
00:00:49,080 --> 00:00:54,750
You can name it something like my website or my portfolio or my company website.

10
00:00:54,990 --> 00:01:02,790
So next step is we need to open this folder using our Visual Studio code and we have two ways of doing

11
00:01:02,790 --> 00:01:03,210
it.

12
00:01:03,240 --> 00:01:10,020
The first step is we can drag and then drop it on the Visual Studio code as that.

13
00:01:10,350 --> 00:01:17,560
Or we can use the Explorer by going to file and open or open folder.

14
00:01:17,580 --> 00:01:19,590
So let's click on Open.

15
00:01:20,730 --> 00:01:25,210
And here we can select the folder that we are going to work with.

16
00:01:25,230 --> 00:01:29,010
So our consulate, because I have already opened it.

17
00:01:29,190 --> 00:01:33,690
Next step is we need to create a file for our project.

18
00:01:33,900 --> 00:01:38,850
And the file is going to contain the code that we are going to write.

19
00:01:39,150 --> 00:01:42,690
For the file creation, we have two ways to go by.

20
00:01:43,020 --> 00:01:50,430
One is we can right click and click on new file, or we can click on this icon.

21
00:01:51,080 --> 00:01:54,620
And for the naming, it might be descriptive.

22
00:01:54,860 --> 00:01:58,330
Let's say that you are designing about page.

23
00:01:58,640 --> 00:02:00,860
It's supposed to be about us.

24
00:02:01,860 --> 00:02:05,550
If it is a login page is going to be look in.

25
00:02:06,280 --> 00:02:10,660
But for this project, we are going to create a single file.

26
00:02:11,320 --> 00:02:14,740
And by convention we use what is called index.

27
00:02:15,010 --> 00:02:17,650
This is a name of my file.

28
00:02:17,680 --> 00:02:20,950
And this index represents home page.

29
00:02:21,280 --> 00:02:24,610
So the next step is going to be the extension.

30
00:02:24,850 --> 00:02:28,930
The extension is anything that comes after period.

31
00:02:29,110 --> 00:02:33,550
So if I type in period and I type something like this.

32
00:02:34,000 --> 00:02:36,700
This is extension of HTML.

33
00:02:36,760 --> 00:02:44,700
With this extension visual, the code will know that we are using HTML and this is how we use it.

34
00:02:44,710 --> 00:02:49,570
And as soon as I type in the extension, you can see that the icon has changed.

35
00:02:50,020 --> 00:02:50,740
Do you get it?

36
00:02:50,770 --> 00:02:51,460
Yes.

37
00:02:51,490 --> 00:02:54,160
Let's say that we want to create CSS.

38
00:02:54,160 --> 00:02:58,240
So the extension is going to be dot CSS.

39
00:03:00,390 --> 00:03:07,500
If you are using JavaScript is going to be JavaScript for Python going to be PI for Java, it's going

40
00:03:07,500 --> 00:03:12,780
to be something like this, but we are going to use a HTML as that.

41
00:03:13,460 --> 00:03:17,660
And this is where we are going to write our code.

42
00:03:18,170 --> 00:03:18,800
Perfect.

43
00:03:18,800 --> 00:03:20,060
So over here.

44
00:03:20,090 --> 00:03:23,180
How are we going to create our first website?

45
00:03:23,540 --> 00:03:32,210
For the meantime, we are going to type in something like This is my first website.

46
00:03:32,630 --> 00:03:34,þàÊøòÌ²q0‹Æ¨|V#{°C	û#*‡%§~Mµ°íÍÑ„qä»$X>Š­5lÝÇà¹ì†«`„PÜJ“Ø¤|–HO@1‹yÛÎc
B‚–?ä)@Õ„\<	Ù„:²w5ÁY¶’øÊõË”^ÜNÚ{}êú1»o?ýµ1õþP3—•vîÈ6'$(ržÖóâ>•ò‹9` í‰"œÔíÁ©•­»¶ã>œV@‹}¡7	UY"ØúåYîxµlD“¦£ƒA]ùŽ£­?yÛ²*–CK[@:SYãeIkñV´²’WØÁˆñ¥HFÛiÅúÞP9’¸‚°3­+×,è[¡ô‡vN#.Ç9]ô”ü€š)èÚ¶%JZclJÍ“N_»,
ïä80rYtvÄ†‘t4Q¹lÌÄ_Ô DY†cþÝ,„äà=øWáî\£PqÈ$t+Í%V‚zDÇ þê›H@x×£GõSÝcBQÏÚÇ²ïþ…8R&íô]êø*´Ö?©6iº8bÉ³‡ù"È°z¾Äa$ô‰©\MxÀ.Gß…?!¦_ÈØÌvÐ#cË½…-ÂªkÔ–q(ìpV—þg\#qh&yF-¯G(ÍìÊ­IÅÌ-øcÃ–¬¶7´¢-rÉ†Ž½O\ç>ü-3š‹QJl0£Ž#Â`¿†ÖÃÏÜÏ¿_9•çºuöp–ç#5z0ÄÄ¤:¢Ý”vtv¯xÛ•³´£†PÑ÷úªNö½ªf¥z­þAÓm˜4ü£Kå.á÷A«‘Àø Š~s	’c…ËuãOŽàVë+%{×IÕžz›ËäÙ 	aeÃðWQ³UPýíšÉÏöñôñ|ªž¦•	Ç©ýþ°Ô(ÐmÙü_™3µ¦2û²³5ë--–«lÓþÈ„E‚´à§ã§ªãã[]&ÁE9Õ“{dœIÀÕÑË÷às†ÌBÎíRÏñX/™áºo¢·~dyˆîÊf‡ˆ–¶h„ÿÊc¿nO8?Ig’Oí„ÿ+¸p­O/–³¢©³´Ï]ÄêDøÙÑ…û	îHã1ZJKí°RO9úî¤	¹æH®ûG—0#­–Yeq`Ö³K¯J'PŽ4Å”Ú{šÆïJœîÈJÃ L(©søª(mIˆ®9½Iç«kÐïFz#M¢–T—*Ýÿ–ðÃJ9+CH{–@ë5®¶äMnê…ÙíOÈúô¦P©
Ú¬DW>‘Ä™ÎþqW$ÉF”‚Cðo;yÌ&‡†{^ÜÐîÔ_5Œ»†bKrÎn‚/ÜÓêI>mŒ¥‹hQ­NŠÎ¥¸’RGÕ‰[ÁÜ…zG¥E<P…±€§œ7áÍÃ	´s-Æ3kzy´í˜ø[ªzèÙÊw(q%™^é`ã6Ošg®HÕ‰Ü}Ý¦wù^©žƒ%Í"óÆ¸ÖøUw*Ù–_y¥dù™¦§®2üà8UÒ~òèO)ªDyÝ?×ZÌ¼+¡ã®áˆc’CW7…?}lÐrV™‹žóŒ¹·â.häëýþ*í;%Qj!ôŒâ5˜¦~è~uE+éÖX&/dj…ÊË*¡&]á]B#O>ZÆz!?‡LgêÿF¨º;_óÞ˜ÑÇ–³(›š\T
	®Þ'÷ñ†3d^îÉß|‘€’ûW¸´@ÍzOEr	LÚ	dF9zô	oÚ#ªw'õ_œÃáa	Î™ò?Æ)2KpÍmò]Ý/ª“²úrAZÏ\˜›{gctXjØÍJ84¥üïüño†x)ÍŸ›ÆY¢åóáAÀ¯†,Ï£ÊâÝÎRÅg£²stR1³é­~•aû–>ÿBå<i“øŽ¤c$œå&ŸHØÔOz›ÈÖª ÞÎú/ò­¼.â †Æ#ž=søëatÿW}ßß”¾ùW6à½ñ¹ Z¤é›RVÿrdF÷/c`›n&GäÌ4ÃJŒ°Á&™ËR•È“Á²Dß}Míâ.‘Úe“¡³€Á ›pŒúSp<&¡×¾$2_Ö®`b{érØ¼ÈQhüþ“šû¯^ñ‡ÿ	O|ôfe¨mÂûƒs°vý1'!ÿZS¿. ¾fÂùKÐ¤m#ô€Iì*hQ+ËºLÁDÐÀ‚³Iïö[È"ÑëÍkåhÖ±så£”ø¼ñ]|`µØû3û³S*}"qhbêà‡/Îƒõ
  
sË89Ñ½NL³!ˆ«qü<^n7îµý ôz¸:ÀÍB»äkåý¨ìUK%T9o´iÎ3eACB³ô~„’;<n9‹ ~ò¼SÛ¸ÂPzæÜ”ÈpÇè&hÿA/¦	ÿì¤í:k$â?Ó5Ã3[œ§¤ŒçÆp"O-¡!¿o›ˆ<­Ñ‰B²˜É‡…ŽÛ«µC:À¹É…¨âP¬$mWLBÌ3èåßáAËA^,:ø?n$8"«mz^	œâ÷á¿°t.>N×š9¾]¡|;N_À‰ò¿Ð«{Âö¾û÷)™¬Žœ2âˆ¨˜x7.Ë¤¿H˜´üÅ°­Zað^uŠqi›7_Tî ².ê<T§ñÍÉÍ¯pö{pãÅ{5a]4sž+F»ÓÑa$ÐêTÃ„b”Þ¢¢å	íÛ«…]FúQçu¶w²^Ï@Sáö,9›wV°‰)*ˆ¾Ý0ïÃâE²_Î–ð`NûYÌA>±s—&iJÏBÒ
ãCê1uÐ»µ‡ûS™Î–ÆcK{Â˜fw:¯ÃÌÅ×RÀ2ÚÒP“òùÇ£Y$4-ä_KñŸ©,ÿ².ÚJ><3ØŽ])°]„5¥¯IíÜ%¶^@¸‘	¯‰tÆGA>«ñ!ZþÊ3ÜÄq’x¸+q‰~GÎ.&üÍ’Ó,¼)7ùUÞÛä¥§ÿ¡ïç÷úüšíQgéaåÈ‰V;aÃxcäÎY$Y­O3!›ÞØ/ßÇmz"YÐ<EÄÓ¯ˆ¸v¤ºî',åiUâškÒý­w´•£ýG×•-ã³ZJHt‘'¢½BÝB	VKšhO8åcn¬ûb¯/i¶P Û«Ì2Ë_‡¢v€ˆpR'å^Ø®yd¹Ë©ó¯d‚)\<ç0Àëxt™¾UñÁ•žwÁù©^<©i†}pö-×§qO¶x?@˜9røSÕÉD!GdaZH®…;vžb^~;ºÏ&äücÑSÌÄf(b¯RUT”ºi…ðà€.F ÐJÆùvädÒVªÙq¸ºœõú¶[òÞÎôÑd½‚#CNè„¤›+J”áè¹`àýËLhXÑ\ .®óe=CbrÌŠcRÒ+ýßÃíÖ¬Ã\/í®fMŽ¶ãÔ'š‘fÐ>"ž­ö”·6ržZB@‡€ÈÔ7ÊìÉjŒG%…S’B8uÇÝ*|:ÆþX­ÎSÍËRÁòéwl2À[ÐÛ…ùZÎ°‡×2­Ž?jÖÆ¤1b¢ú&yn•è¤cyú_‚b"'H®€l<Úù*öÎ,o]þãA ·x¢÷yè8®íiž`ÒîC™ŒdqÔÖPêeÉú±!*a§“Ehó·€˜àJ\§çn’èÎÜ©¼¡òZ–QÍ¬™6#DÖ!çìEž#µ´×ÚºÄGE¿ò2_S«( áfËºØßsˆ5.w`solžñ
{ áscEºj6Ò¬âF7ÙÖ¹`ÖhiX×¯Ò`™0&Íêô˜;8/Pâˆ¢nþƒ46±ŸStf7ûÁóy¼pÖÉmí†blk„F ÑàM†émÉ7C€‚ê†+¿ä»Ç?üòœ8.?G4S¹§·† âIý¹M‰*0´füÚÇËÐ‘cPÁ(¿—É=7íËr=6»ö…}]‡YÓ¤]ÞNª“Ðt4â`d-WŽpf&´“Œôt‡é² 
å‡ÉÖ´Þ‰kÙå©P¹Ø•Ú	lˆ#„º…ˆ¡7#L(HO²Ùh€GÅNÊ'Ô	ñ\%8tßîVÕü
¥vh¶(M‡cXÛg–`èÍõÂÙóbŽÉúK+K%føp¿îX°*¢*Ró%ÂCU~u^…‰¬È¨lehž×üÛL:_‡J.W®SK‡Q&~À