Дейвид Дж Малан: Добре. Върнахме се. Така че, целта на тази финална сесия е да се въведат още няколко понятия но също така дава възможност на всеки някак да се простират вашите пръсти и действително направи нещо малко практически. Целта не да се превърне е всички нас в уеб разработчици с всякакви средства, но наистина само да ви даде вкус на някои на основните конструкции на това, което отива в уеб програмиране и днес уеб развитие, така че статична страна на things-- няма логика, не програмиране език, просто статично съдържание. И това ще ни даде възможност действително да видим какво е уеб сървър, Вижте какво е HTML файл е, да видим какво това е HTTP всъщност се сервира. Но преди да се потопите в, който и да е ретроспективен въпроси за изчислителни облаци или сигурност или нещо по средата? Не? Добре, добре, нека направите това, само в случай, процеса на записването за нещо отнема няколко минути. Ние ще го оставете да го направи във фонов режим. Давай напред, ако може, до този URL here-- c9.io. Това е трета страна service-- платформа като услуга, ако will-- че няма да ви поканя да се запишете за една сметка, и това ще даде на всеки от вас сметка в т.нар облака на инфраструктурата на някой друг, една компания, наречена Cloud9. Но това, което е хубаво за това е, че те ви дават приближение на действителното развитие в реалния свят среда, макар и в облак и в уеб браузър, и ще използваме това, за да всъщност експериментирате малко днес. И тогава давай напред и просто да навигирате пътя си към процеса на регистрация ако можеш. Така че ние се случи да използвате тази в класа Аз преподавам на всички наши ученици, както на територията на колежа и извън предприятието, и тя е заменена какво исторически иначе за сваляне на софтуер. Така че това, което се получи достъп до е един от тези виртуални машини, по същество, че описах по-рано. Така че тази компания Cloud9 вероятно наеми от трета party-- наистина в този случай, Google-- цяло куп виртуални машини че те някак си котлет нагоре в илюзията за отделни сървъри че всеки от нас има пълен контрол над. Това не е съвсем точно да се каже че те са виртуални машини, все пак, защото това, което Cloud9 действително използва е малко по-нова технология наречен контейнеризация. И нека да вземете тази снимка тук, за да нарисува тази картина. 

Контейнер е, ако Ако си спомняте на снимката от по-рано, малко по-леко тегло, отколкото на виртуална машина. В действителност, докато миналата време говорихме за там като оперативен система и хипервайзор и след това гост операционна система, гост операционна система, гост операционна система, в горната част на вашия физически хардуер, разликата с тази нова технология, контейнеризация, е, че всички те по някакъв начин да споделят същата операционна система. Но те все още се създаде илюзията за всеки като неговата или нейната собствена изключителен административни права и файлове на сървъра. Но има и по-малко софтуер в между вас и хардуера. В резултат на което е, в теория, по-висока производителност, защото използвате или губите по-малко ресурси на този така наречен виртуализиране слой. Така че това се нарича контейнеризация от природата чрез технология, наречена докер, който е много влизат в себе си. И това е нещо, което инженерите на компанията може вид на нещо като започнат да говорят около скоро, ако не сте го направили, макар че със сигурност не причина за скок на всякакви bandwagons. 

Така че с това каза, какво Вие вероятно виждате сега е екран, който изглежда малко като този. ДОБРЕ. И току-що ми се обади над ако не. И ако so-- аз ще дойда, ако не. Давай напред и да кликнете, че голяма плюс, за да се създаде работно място, и ще видите екран като този. Можете да се обадите на работното пространство назовем всичко, което искате за сега. И точно в действителност за простота, отидете and-- добре, някои от вас вече имат работни пространства. Наречете го каквото и да want-- бизнес, Харвард, четвъртък, каквото искате. Вие не се нуждаят от описание. Можете да го оставите лично, освен ако не вече има куп работни пространства. Ако сте принудени да се огласява публично, това е добре за днешните цели. Тук също е един от най upsells. Можете да получите един частен работно място чрез по подразбиране. Но ако искате повече, ще трябва да плащат за повече. В противен случай, те ви принуди да направи работата ви публично. Но това е добре, защото те също насочване на тази при отворен код общности да насърчи хората да всъщност си сътрудничат. 

И последното нещо, което е важно, обаче, е, след като сте избрали име и след като сте избрали частна или публична, кликнете HTML5, оранжево иконата на голям вторият от ляво, и След това кликнете върху Създаване на Workspace. И това вероятно ще отнеме минута или така, но след това ще има среда, след като направи това, което изглежда напомня на това, което имам на екрана тук сега. Но, отново, това може да отнеме няколко минути или повече, за да стигнем до този екран след като веднъж сте кликнали Създаване Workspace. Но просто ми знамето, ако искате да ми харесва за да разгледаме нещо или съвети. Добре. Така че аз ще фон това за сега. Обади ми свършва, ако вие като че ли някакви технически трудности. Но, отново, това може да отнеме известно малко за това да се отвори. И да вървим напред и да се говори за това, което тя всъщност означава да се направи уеб страница, какво е HTML и как цялата Сега свързва както ние започваме действително да използвате някои от технологиите. Така се оказва, че не мога да отида на малкото ми Mac тук, отвори една проста програма, наречена TextEdit, или на Windows можех отворен нещо, наречено notepad.exe. И аз може просто просто направи нещо като this-- "Здравей, свят". И тогава може да спаси това, както е hello.txt Така че няма магическа там. Това няма нищо общо с уеб програмиране, няма нищо общо с HTML. Просто създаване на обикновен текстов файл. Но се оказва, че един уеб страница е буквално точно това. Това е прост текстов файл, съдържащ текст че може да напишете в клавиатурата, но обикновено, но не винаги завършва не .txt но .html или .htm. И вие не само Типове думи във файла. Вие действително трябва да използвате неща, наречени тагове или, по-общо, нещо наречен език за маркиране. 

Така че аз ще много бързо пишете и след това се обяснява по-долу. Отивам да се първо въведете този, който казва, хей, браузър, тук идва уеб страница, написана на HTML. И тези две неща заедно казват, хей, браузър, следното е наистина HTML. Хей, браузър, тук идва главата или в горната част на страницата ми. Хей, браузър, от вътрешната страна на горната част на страницата ми, сложи заглавие, което е, "Здравей, свят. " Хей, браузър, след главата на моя страница, тук идва тялото на моята страница. И, хей, браузър, тялото ми страница също трябва да се каже, "Hello World". Така че какви са характерните детайли тук? Това е това, което е като цяло наречената декларация док-тип, и, честно казано, това е малко Трудно е да запомните това на първо време. Ти просто вид копиране и поставяне него. Това е формален начин да се каже, хей, браузър, Аз съм с HTML версия 5, която излезе малко по-наскоро. Това е един магически заклинания, че някои хората с лошо чувство за дизайн реши да постави в много началото на файла. Въпреки, че това е малко тайнствена, това е всичко, тя means-- хей, браузър, тук идва с версия 5 на HTML. 

Останалата част от този е бил с нас от известно време насам, исторически, но това е било развива, и това е вероятно е била става малко по-просто. Забележете няколко характеристики от това, което съм подчертани. Има тези неща с ъглова brackets-- лявата скоба и дясната скоба. И забележи симетрията тук. И от симетрия, искам да кажа, точно както аз имам този начален маркер тук или отворен таг ако щете, тук имам близо тагове или краен маркер, който е различно само дотолкова, доколкото го има този наклонена черта в началото на думата HTML. И вие може да се мисли за това като бях небрежно предложи преди, хей, браузър, тук идва някои HTML. И, обратно, хей, браузър, който е то за началото на HTML-- и края. 

Междувременно хей, браузър, тук идва на главата на моята страница. Хей, браузър, че това е за главата. Хей, браузър, тук е тялото на моята страница. Хей, браузър, че това е за тялото. И вътре, че е известна произволен текст за сега. И вътре в главата, междувременно, е някаква произволна но маркирани, така да се каже, текст, който казва, заглавието на моята страница е "Hello, World". Сега, за сега, можете да Предполагам, че браузъри Трябва only-- или, по-скоро, уеб страници имат само две parts-- главата и тялото. И главата обикновено е просто като лентата с менюта, нещата наистина само най-горната част. И тялото е смелостта на страницата, всичко в този голям правоъгълник която изпълва екрана. Така че аз ще отида напред и да направим това. Аз ще отида напред и кликнете Save, File Save. И аз ще се спаси това като hello.html, и аз съм просто ще Казано на компютъра си. И аз ще отида напред и кликнете върху Запазване. И notice-- ми Mac в малко е да ми крещи. Сигурни ли сте че искате да направите това? И аз отивам да се каже, да, използвайте HTML. Аз знам по-добре в този случай. И сега аз ще отида да ми десктоп където имам този файл изведнъж. И аз отивам да щракнете двукратно върху него. И вие ще забележите, че като подразбиране Chrome отвори. Това е, защото това е моят браузър по подразбиране. И тя просто казва: "Здравей, свят". Но тя казва "здравей, свят "на две места. Забележете горния ляв. Доста трудно да пропуснете това. Това е голям и смел. И къде другаде пък изглежда да се каже, "Здравей, свят"? 

АУДИТОРИЯ: В раздела. 

Дейвид Дж Малан: Да, самата раздела. Така че, когато каза ръководителят на страница е всичко top-- и наистина това е заглавието. Това е просто в раздела тук. И аз може да тегли този раздел така, че да не се обърка. Това е само един раздел сега, и наистина виждаме "Здравей, свят" до тук и "Hello, World" тук долу. Така че доста ясен. Но тя също е доста проста. И, всъщност, аз мащаба. Мога да промените размера на шрифта просто да увеличаваме за достъпност. Но нека сега да направим нещо малко по-интересна. 

Отивам да go-- Опа, нека ми се върна към текст моето досие. Връщам се към моята текстов файл, и аз ще съм да се промени това и да каже "Здравей, Disney World." Запазване. И се върна в моя браузър и натиснете Reload. И сега, разбира се, тя казва "Disney World." И аз ще изкуствено увеличение в точно така е по-лесно да се види. Така че сега, за съжаление, аз вид искате to-- всъщност, това е функция Mac. Искам да кликнете върху Disney World и отидете някъде като disney.com, но това не работи. Така че основен принцип на мрежата е хипервръзки, връзки, които отиват другаде. И така, как мога да направя това? Е, аз може просто да се каже, "Здравей, http://www.disney.com." Запази това. Презареди. Но това също не може да се кликва. И това, което е хубаво тук, въпреки че това все още не е функционален, е, че изглежда, че браузър прави буквално само това, което аз го кажа, за да се направи. Така че, ако аз просто въведете URL като този, това е просто щеше да ми покаже URL. Трябва да се използват тагове и маркиране език действително да кажа браузъра, за да направи дори повече. Така че аз ще отида напред и изтриете това за момент. И аз ще кажа, хей, браузър, започнете котва тук, линк така да се каже. И на хипер-препратка, дестинацията на които котва, трябва да бъде този URL. И забележи моите кавички. Мога да използвам единични кавички, твърде, но трябва да бъде последователна, и аз по принцип би просто използвайте двойни кавички, за да го прости. Забележете, аз отивам да затворите тага. И тогава тук Отивам да се каже, "Disney World." И сега имам нужда от малко symmetry-- отворена скоба, / а, затворена скоба. 

Така че това, което съм, въведена? Ние сме имали няколко тагове вече. HTML, Head, дял, тяло, са всички тагове, така да се каже, с отворени и затворени колеги. Но забележете, че това е нещо като на коренно различна. Това е, което ние ще наричаме в HTML атрибут. И атрибут е само ключ-стойност чифт. Това е често срещано нещо в компютър science-- ключ-стойност чифт. Това е нещо като инструмент на търговията. Ключов и стойност. Една дума и след това някои друга дума или думи. И в този случай, най-важното е HREF, и стойността е, че пълното URL. И това, което атрибут прави, че е оказва влияние върху поведението на един маркер. И в този случай, ние трябва да се повлияе поведението на маркера на котва, защото ние трябва да се закотви тази връзка някъде. И как се прави това е по пътя на атрибута. 

Така че аз ще отида напред и запишете файла сега. Върни се в моя браузър и презареждане. И готово, сега имаме начало на легитимен уеб страница. Super-прост, но ако аз мишката върху this-- известие долния ляв ъгъл на, това е супер-малък. Но нали виждате www.disney.com. И ако го натиснете, наистина това ме отвлече в disney.com. Сега, на любопитното тук е, че не е на best-- най-продаваеми URL, но това е добре, защото този файл не съществува на World Wide Web. Тя съществува като локални файлове в привидно моите Потребители directory-- / jharvard-- за Джон Harvard-- / десктоп. Но тя има URL. Тя просто се случва да бъде местен. За съжаление, никой от вас не може да посетите това, защото, ако сте написали този URL, вие искате да се казва на браузъра, за даден файл, наречен hello.html погледнем на твърдия ви диск. И, разбира се, освен ако не сте е следната заедно ръчно, това няма да съществува там. 

Така че това е добре. Ние все още се нуждаят от начин, в крайна сметка, за да получите този файл в мрежата, но нека да дразни с изключение на няколко последствия за сигурността на това, което ние просто видях и го връзвам обратно към по-рано обсъждане от тази сутрин. Оказва се, че, ако един браузър буквално прави това, което аз го кажа, за да се направи, и изглежда, да се окаже, че котва маркер е влияе от стойността на този атрибут наречен HREF но той показва това текст, това би изглеждало да се предполага, че може да изложи на URL адреса и на двете места и след това презареди и сега ще видим URL и отидете на URL адреса. Забележете, ако мишката върху долния ляв, Аз съм наистина става още да disney.com. 

Така че, ако някога сте били phished-- Р-Н-I-S-H-E-D-- с един от тези фалшиви имейли от подобно PayPal вашата банка, Вие вероятно сте придобили връзки вътре на имейла, че четете, че ви казва да кликнете тук, за да отидете, потвърдят парола или да потвърди датата си на раждане или социална или нещо социално вие инженерство, за да разкрие информация. Е, мога да вид вземе Предимството на този, не бих могъл? Бих могъл да кажа нещо като, www.paypal.com. И вместо disney.com, I може да отиде до тях, като, badguy.com. Презареди. И колко лесно е това да измамят, особено нетехническо четец или бегло четене четец, отколкото да кликнете връзка като тази, която, ако кликнете it-- Аз всъщност не искам да отида badguy.com. Аз не знам какво е всъщност там. Така paypal.com, известие, е това, което той казва, че ще, но, разбира се, ако аз гледам надолу супер-ниско, това е малко неясно, но тя казва badguy.com. Това е единственият кажа сега, че аз ще грешното място. И когато казах по-рано, че банките Наистина не трябва да насърчават или влак потребители да кликват линкове, този е само една проява на него. И това е толкова просто. Вече сте противник, ако правиш нещо подобно и се опитват да подведат потребителя в посещение на вашия сайт. Но за сега, ние ще продължаваме нещата хубаво и чисто. Ние ще вървим напред и назад тези промени. Презареждане на страницата. И аз се върна в disney.com. 

Нека да видим дали не можем да дразни това освен малко повече. Така "здравей, Disney World." Отивам да кажа тук. Може би аз ще се направят някои стая. "Надяваме се да се насладите на престоя си!" Запазване. Презареди. Това не е rea--, че не е това, което възнамерявах, нали? Искам да кажа, ако аз съм лечение на моя текст файл като текстообработваща програма, какво си се надявам да се случи тук? Да, аз се чувствам като там трябва да е знак за нов ред тук, така тя се чувства бъги по някакъв начин. Но това е всъщност умишлено, защото както преди, браузърът ще само да направите това, което го кажа, за да се направи. Не съм го казал, за да се прекъсне линии. Аз не съм го казал, за да се движи надолу, дори макар, интуитивно, имам чувството, че го направих. Така се оказва, че трябва малко повече за маркиране, и аз отивам да се определи това, както следва. Отивам да предговор този първи здравей с това, което се нарича точка маркер. И тогава аз ще отида напред и увийте тази друга присъда в друг параграф таг, въпреки че те са супер-кратки параграфи. Сега аз ще се спаси. Презареди. И сега ние имаме, че пространство, и ние нещо има семантиката на две отделни параграфи. 

Това е всичко, глоба и добра, но би било хубаво да добавите изображение към тази страница, така че аз ще отида за да изглежда Мики Маус на Google Images. И просто за забавление, аз съм Ще вземете този образ. Отивам да се продължи напред сега и вземете адреса на този образ, въпреки че там е различно начина да направите това. За сега, аз съм просто ще копирате адреса. Отивам да се върна в моя текст файл, и аз ще кажа тук, IMG SRC = цитат цитата че URL, супер-дълго. И тогава понятието за изображението е малко по-различна. Има наистина няма понятие за отправна изображение и завършва на изображение, като начален маркер край маркер. Така че тя се чувства малко странно да ми семантично да направите това, да имат етикет близък кадър. Това не е неправилно. Това е съвсем верен, и това е насърчавани, но има стенограмите нотация. Аз мога вид едновременно отваряне и затваряне на същия маркер, и че ще направи браузъра щастлив. Така че това е само малко по-кратък за неща че концептуално наистина не правя да има смисъл да се започне и край. Те просто са там, или те не са. 

Така че аз отивам да спаси това и да се върна да ми "Hello, World" страница и презареждане. И това е малко извън контрол, защото този образ е всъщност малко голям, но това е ОК. Можех да го преоразмерите в една програма. Или знаеш ли какво. Само за да се докаже, че съм Ще всъщност казват, че ширината на това нещо трябва да бъде само на 200 пиксела, 200 точки. Нека да вървим напред и да спаси и се презарежда, и сега на страницата изглежда малко по-разумен. Но забележете модела. Е, аз съм нещо като научи всичко на HTML в някакъв смисъл, най-малко концептуално, защото всички HTML е е тези tags-- отворени тагове, затворени тагове, и атрибути, които променят поведението си. И, очевидно, всеки маркер може да има нула или един или две или повече атрибути, всяка от който прави нещо по-различно. Сега, как да знам това, което съществува? Можете просто да слушате някого като мен да ви кажа това, което съществува, или просто Google наоколо за начинаещи на HTML, и той наистина е този прост. 

Наистина, когато бях студент Преди години и научих, HTML, един от моите математика преподаване асистенти просто изразходвани малко време ми уроци за подобно половин час, час, и след това аз бях на път. Аз бях на път към вземане най-отвратителен интернет сайта всякога, който, както изглежда, не съм наистина напредна отвъд. Но въпросът е, че, след като разберат тези прости ideas-- ако тайнствена text-- но тези прости идеи за стартиране на мисълта и затваряне на една мисъл, запазвайки всичко добре балансиран, търси нещо, за изменение на поведение на този етикет, че е наистина всичко има за него. И в действителност, ако сега отидете нещо като google.com-- всъщност, нека да отидем на място, малко по- reasonable-- stanford.edu. И аз ще отида да ги видите, Developer, View Source. Това е грозно, но notice-- и аз ще увеличите известие някои неща, които са запознати вече. Има това до тук, който е браузър. Тук идва HTML5. Има HTML. Очевидно, има един атрибут, че не го направих използвате, която определя език на страницата, и това може да помогне с автоматична превод и подобни неща. Ето главата на страницата. Ето заглавието на страницата на Станфорд. Има един етикет не го направих говорим за yet-- Мета таг. Това е просто нещо обща информация. Той помага с SEO, или Оптимизация за търсачки, или Google-резултати от търсенето или други подобни. Но ако ние продължаваме да търсим, имайте търси, тук е маркер за тяло. А има и букети от друга тагове ние все още не сме говорили за. Но Div е за разделение на страницата. Това е като един невидим правоъгълник ако нещо искате да умствено разделят на страницата си в различни единици онлайн. И тогава много divs I виж, нещо, наречено клас, но ние ще се върнем към това. 

Това е interesting-- форми. Формулярите са всички в мрежата. Всяко поле за търсене сте някога са използвали е форма. И така, нека действително види. Форма. Действие. Действието на тази форма, за каквато исторически причини, е, че URL. Метод е "пост". Оказва се, че исканията HTTP могат да използват глагола "да", като видяхме преди, или "пост". И ще видите разликата на това в един миг. Нека наистина да видим какво е това. Нека се върнем към страницата на Станфорд. Под каква форма са те говорят около, как мислиш? Какво скача при вас? 

АУДИТОРИЯ: полето за търсене. 

Дейвид Дж Малан: Да. Така нагоре в горния десен ъгъл тук е този на полето за търсене. И това е, как те изпълняват it-- на маркер, който е буквално отворена скоба форма. И тогава нека да търси нещо. Да търси за един приятел на mine-- "Ник Parlante." Enter. И, разбира се, тя отиде да малко по-различен URL. Нека да се върнем тук. Нека да търси за "курсове." По дяволите. Ходих на различен URL. Така че, Станфорд добавяне на някаква магия че те не са ме води на адреса че видяхме в действие атрибут там. Но тази форма тук се изпълнява чисто по пътя на това маркиране тук, тези тагове. Всъщност, тук е входът за типа на търсене, който искате. Тук е суровина за друг вид търсене. Тук е входът за самата низ. И така, целта не е да се увива съзнанието ни, около всички тези тагове но само за да видя. Това е просто отваряне и затваряне тагове и търсят нещата. Да? Виктория? 

АУДИТОРИЯ: [недоловим] Дейвид Дж Малан: Това е добър въпрос. Това е малко по-сложни, за да видите. Нека да се върнем към това въпрос само за няколко минути когато гледаме нещо, наречено CSS, или Cascading Style Sheets, и можем да се опитаме да се направи извод като много от страницата. Така че, ако ние сега да разгледаме google.com, нека да видим какво им страница прилича. Може би they're--, че е сладък днес. ДОБРЕ. Готово. Добре, така View Source. Може би мислят, Google има много хубаво изходния код. Така че, както изглежда, това, което се случва тук? И в действителност, това не е дори HTML. Това е нещо, наречено JavaScript. И нека да продължава напред, и си отиват. Аз дори не знам къде на страницата започва. Отивам да използвате Command F, отворена скоба HTML. Добре, ето го. Открих началото на страницата, и има толкова много неща тук. 

Какво всъщност се случва? Ами, знаете ли какво, ние може да се почисти това нагоре. Ако вместо това отидете на този Огледайте лента с инструменти, този специален инструмент за диагностика, и не ходи да мрежа, където ние продължаваме да става днес, но ако отида да Elements, това, което е много хубаво е, че браузърът има много много по-добри очи от мен. И на браузъра може да чете че бъркотия на уеб страница, че HTML ние пощата просто погледна, и може да тя анализира или чете и анализира го и го преформатира в хубав човек-лесен начин. Така че това, което аз виждам сега в този екран тук под Elements, точно същото съдържание, но те са с отстъп всичко, те го Оцветени, но това е точно същия текст че съм изтеглен от сървъра. 

И това, което е хубаво сега е Виждам в тялото, за instance-- предизвестие, страницата все още е съставен на само на главата и тялото, и мога да йерархично потопите в тук. Забележете, че Google изглежда да има да divs-- този един и този един. Мога да се разшири, че. Има цял куп други divs. Така че е малко по-сложна. Но почакай. Това изглежда много по- четим, относително, отколкото това. Защо е Google неудобно Самата само с изпращането тази огромна бъркотия на код на някои подреди просто да приложи нещо че изглежда толкова проста на пръв поглед? Подобно, защо не те добавят повече пространства? Защо не те удари Въведете както направих аз? Виж колко добър бях при написването на уеб страница. Ударих Въведете толкова усърдно. Аз разчленена, така че всичко е толкова красива и четлив. Защо Google не практикуват същото? 

АУДИТОРИЯ: [недоловим] Дейвид Дж Малан: Добро. Много честно. Те не разполагат с някои човек в Google ръчно актуализиране на началната страница вече. Това не е 1999 вече. Така че те имат софтуер. Те имат и други инструменти, които генерира динамично те са HTML. Разбира се, че този код се е написана от хора, но реалността е, това е съвсем справедливо да се каже, браузъра със сигурност не прави интересува колко разхвърлян кодът е. Но има и още по- непреодолими технически причини че Google разпространява тяхното HTML код по такъв помия, привидно поразителен начин всички опаковани заедно с много малко way-- много малко в начина на форматиране, както направих аз. 

АУДИТОРИЯ: [недоловим] 

Дейвид Дж Малан: По-бързо? Защо? И това, което казахте, Лидия? По-бързо? Защо по-бързо? АУДИТОРИЯ: [недоловим] Дейвид Дж Малан: Няма няма място за четене. Да. Така че мисля за това какво място е. Така че всеки символ от клавиатурата отнема някои големи пространства за представяне, или физически, като го заема, че много пространство, или по някакъв начин под качулка, която изисква памет. И като aside-- и ние ще говорим повече за това tomorrow-- всеки символ от клавиатурата обикновено изисква 8 бита, или един байт. Така модел на 8 нули или такива, или само 1 байт, както ние хората обикновено биха казали. Така че това е малка, но тя все още не е нула. Това е все още някои големи пространства. Така че, ако един инженер или Google удря бар пространство, само веднъж, и предполагам Google-- това е супер-popular-- Предполагам, че един милиард души посети дома им страница на ден, или някакъв брой хора посетете началната страница за по милиард пъти на ден, колко допълнителни байта има, че софтуерен инженер просто струва Google от удря си пространство бар веднъж? 

АУДИТОРИЯ: [недоловим] Дейвид Дж Малан: Не съвсем, че лошо. Само на един байт пъти милиарда долара. Така A-- АУДИТОРИЯ: 8 милиарда гигабайта. Дейвид Дж Малан: Не е 8 милиарда. 8 милиарда байта. Но 1 гигабайт. 1 гигабайт ще бъде единица мярка. Ако той или тя прави две пространства, 2 гигабайта. Три гигабайта. Така ли е? Тя везни скъпо. И така, в случаи като Google, които, предоставени, са крайни случаи, има и други въпроси, които възникват само като направи много разумни решения или като много прости човешки действия, защото има това увеличено ефект. Така че една от причините, това изглежда толкова сгъстен е точно като Виктория said-- че е просто, генерирани от компютри, така или иначе. Така че не е голяма работа. Нека браузъра го разбера. Но той също така умишлено не разполага с много пространство, защото пространството не е необходимо. И пространството всъщност струва пари. 

То било струва време, защото просто да натиснете че много повече данни от седалище google.com просто има да отнеме известно количество време, дори ако това е милисекунди или микросекунди, но това добавя до над толкова много потребители, или по-вероятно, то вероятно струва пари. Google вероятно се свързва с някой друг в света, една на тези, взирайки точки, и ако те имат някакъв вид финансова отношения при което техните данни струва пари, те може и да минимизиране колко данни те плюят върху тяхната интернет връзка. 

Така че нещо странно, макар че, в крайна сметка, или може би успокоително нещо, е, че въпреки че това изглежда ужасно поразителен, в края на деня, тя все още е с точно същите принципи като тази много проста страница тук на HTML стр. Така че просто да се обобщят и, така че да да има каноничен версия, ако не бяха след заедно с избор тук, тук може да се окаже най-простите на уеб страници, така нещо да си играе с може би по-късно. 

Ами, нека да се въведе Няколко други идеи сега. Ние сме на път да се въведе нещо, наречено маркер стил. Ние можем да стилизирам тази страница в по-интересни начини. Така че, докато HTML имейл е всичко за маркиране данните, нещо като определящи за браузър как да се структурира данните, къде да се постави това, CSS, или Cascading Style Sheets, е втори език, който обикновено получава примесени с HTML както ще see-- но ние можем да се почисти че в един moment-- че отнема то крайната миля, и тя го stylizes. Той получава цветовете точно, на размера на шрифта точно, позиционирането точно. Това е всичко за естетиката или форматиране, не за самата основна данни. И най-лесният начин да се покаже това е може би чрез пример. Така че аз ще отида да ми обикновен текстов файл. И в един момент, аз ще ни преведе през процеса на това прави себе си. 

Отивам да се върна в моя файл тук и се презарежда страницата само за да се потвърди това, което изглежда. Това е, когато ние сме в момента. Имам чувството, че децата ще се радват като цвят към тази уеб страница. Така че аз ще отида до тук в главата на страницата. И аз ще направя стил, / стил. И след това вътре на това, аз ще съм да каже на тялото на моя page-- и това е форматиране, в пръв поглед, може би малко по- Странно, но конвенционален. Отивам да се каже, че на фона Цвят на тази страница трябва да е зелен. И това е за съжаление сортиране на не най-добрия дизайн. Забележете, че по-рано в света на HTML, Казах, че атрибути са тези двойки ключ-стойност. Нещо се равнява цитат край на цитата "нещо." В света на CSS, което беше проектирана от няколко различни хора, те решиха, че в техния свят, двойки ключ-стойност Би било дума нещо на дебелото черво. Така че това е една и съща идея, все пак. Той е асоциирането на стойност с някои ключови, че по някакъв начин оказва влияние върху поведението на тази страница. 

И вероятно можете да се досетите. Какво е това най-вероятно ще да се направи, дори ако никога не сте виждал HTML или CSS преди? АУДИТОРИЯ: Промяна на цвета на фона. Дейвид Дж Малан: Да, промените цвета на фона. И по-конкретно фоновия цвят на тялото. Но доколкото тяло за сега е в интернет page-- това е единственото нещо, под заглавната лента really-- на това е най-вероятно ще повлияе на едно и също нещо. Така че нека да видим. Да спасим това. Отидете тук и се презарежда. Това е доста отвратително. И какво се случва тук е страничен ефект. Аз просто избрах тази снимка на случаен принцип. Защо е не зелено проникваща зад Мики? АУДИТОРИЯ: [недоловим] Дейвид Дж Малан: Точно така. Оказва се, че изображенията, доста много на всички изображения, които могат да използват, всички са rectangles-- на правоъгълници. Дори ако Мики има някои криви за себе си и има опит, В този контекст трябва да има нещо. Тя трябва да бъде бял. Тя трябва да бъде черен или нещо друго. Тя може да бъде прозрачен. И в действителност, можех отворите Mickey Mouse тук в една програма, наречена Photoshop или нещо подобно и променят всичко това бяло фона на прозрачен, така зеленото ще блесне. Но това е нещо, което ще ми трябва да поиска за себе си или графичен дизайнер или проектант в моя компания, например, да се направи, особено след като току-що назаем тази една от интернет. Но това е, защо това се случва. 

И така, какво друго да искаме да направим? Е, ние може да искате да казваме наистина се надявам да се насладите на престоя си. И за да подчертае, искам да направи това силна, и така аз ще кажа открито силна и затворите силен и след това презареди. И това е малко трудно да се види на проектора но може би наистина сега скача при вас малко повече. Така че можете да добавите курсив в тази начин, смели настилка по този начин. Бихме могли да се променят цветовете. В действителност, само за ритници, аз съм ще отида напред и да направим това. Аз наистина не харесвам как ми параграфи са толкова близо заедно, така че може да се направи нещо подобно. Отивам да се каже на браузъра, променят всяка точка таг, за да имат, нека say-- всъщност, знаеш ли какво, нека да се приведе в съответствие го текстови подравняване, център. И отново, знам, че това само защото някой го научи да ме или аз да го погледна в онлайн справки. Така че нека да спаси това. И, ах, сега съм центриран изображението там. И всъщност, знаеш ли какво, ако Аз се движат моя образ в параграф tag-- така трета точка, въпреки че това не е текст. Да спасим, че и презареди. Сега на страницата започва да изглежда вид of-- Искам да кажа, тя все още е доста грозно, но поне тя изглежда като прекарах две минути, вместо една минута което го прави. 

И така, постепенно, можем да направим тези естетически промени сега, за да страницата? Аз не съм наистина се промени данните в страница, различна от добавянето на думата наистина. Добавих метаданни, ако щете. Хей, браузър, направи Думата "наистина" смели. Но данните не е силен. Това е метаданни. Данните са "наистина." Така че ние все още имаме някои от същите концепции, както преди. Сега, разбира се, това не е в интернет, така че аз ще направя една последна стъпка тук. 

Отивам да отида да hello.html и просто маркирате и копирате това. И сега аз ще отидат в Cloud9, които Аз ще ви преведе през в един момент. И шансовете са ви скоро ще бъде, ако не вече, на екран като този. И нека само да ви дам един бърз обиколка на какво Cloud9 всъщност е. Така че отново Облак 9 е този облак-базирана услуга че ти и ми дава илюзията от с нашата собствена виртуална машина в облака, технически контейнер в облака че имаме пълно административни привилегии на. Така че на теория, никой другаде по света има достъп до екрана съм гледаш в момента, с изключение може би на хората който тече на сайта, защото технически те имат физически достъп и така нататък. 

Така че това, което виждаме в тази среда? Отивам да се отдалечите, защото това е малко малък. И нека да се отбележи над тук само за миг. На лявата ръка на моя и вашия екран, има файлов браузър в ляво. Така че подобен по дух за Mac OS и Windows. Това са всички по- файлове в моя профил. И по подразбиране, ако си сметка е като моя, ще видите или скоро виж helloworld.html и readme.md. Над тук в дясно, това е където моите текстови файлове ще отида. Ако някога сте се използва Microsoft Word или Notepad или TextEdit, това е думата ми редактиране на файлове е да отиде. И тогава най-тайнствена характеристика на тази среда че ние не наистина ще трябва да се използва, е тук се нарича терминален прозорец. Ако сте използвали DOS от недалечното минало, това е Linux или Linux еквивалент на DOS. Това е базиран на текст interface-- не кликвания на мишката, без плъзгане. Всичко, което може да направите, е да въведете команди, но тези команди да създавате файлове, преместване на файлове, отворени директории, близки указатели, направите произволен брой неща. Но за сега, ние просто ще прекарваме времето си тук. 

И така, нека да направим това. Ако сте в тази среда, които трябва да било, ако сте създали работно място вече, давай напред и просто отиде във файл, New за миг. И това ще ви даде нов раздела точно тук, в центъра. И аз just-- И нека давай напред и да направим това. Да вървим напред и сега се File, Save и давай напред и да го наричаме hello.html, да не се бърка с helloworld.html, които дойде с новия си безплатен акаунт, което е само примерен файл. Вие ще видите, че изведнъж се появи, Най-вероятно на лявата ръка, и раздела все още ще бъде отворен. И нека да ви насърчи сега, за да пресъздаде този файл или някои техни варианти. И ако може да не е съвсем го видите на екран, е идентичен с препаратите че най-вероятно са в друг раздел. 

Така че в кратко, направи първата си уеб страница, освен това, и след това в един момент, Аз ще ви покажа как можете всъщност може да видите това. Но промените поне едно нещо. Промяна HelloWorld да нещо по ваш избор, така че вие ​​сте убедени, че това е вашето файл и не тази, която току-що създадохте. Добре. И когато сте ready-- не rush--, когато сте готови, давай напред и да запишете файла след като веднъж сте направили тези промени. И ако кликнете на Стартирай бутон до върха, този трябва да отваряте нов раздел, който ще разкаже вие какво URL можете да посетите вашия файл в, но това може да отнеме известно време, за да цитат цитата "започне Apache," които е името на уеб сървъра. Така че бъдете внимателни, за да се направи точно това, което е във файла в крайна сметка. Така че точно сега, аз ще я вътре. Ако започнете да пишете отворена скоба HTML, известие Това ме накара да завърши мисълта си. И ако аз завърши мисълта ми го, автоматично ми дава затварящия маркер. Но очакването е тогава аз ще удари Въведете, и след това се премести вътре има и се отправят вътре и След това правя тяло вътре. И това е малко странно на пръв поглед, защото това прави работата за вас, но осъзнавам, че в крайна сметка той ви спестява клавиши. И в действителност, много често срещана характеристика на програмни среди тези дни както за уеб програмиране като това и действителната програмиране, които ние ще говорим за утре, е тези авто-пълна функции, неща, които просто дават възможност на програмист или дизайнер да въведете малко натискания на постигне едно и също нещо. Понякога е по-добре, все пак. Понякога това е просто досадно. И, отново, след като веднъж сте транскрибира слайда или някакъв вариант от него, можете да щракнете върху бутона Run до върха. И след това в долната част прозорец, ще бъде информиран на каква URL можете да посетите уеб страницата си. Mine, например, е най- business-daharvard.c9users.io и т.н. Добре, така че, нека me-- някакви въпроси? Всякакви други въпроси за само за да се тази работа, преди да добавите функции? И нека да предложи, просто за да получите хора comfortable-- защото това е едно нещо, просто да копиране и поставяне на сляпо, което съм направил. Но само толкова, че хората се борят с най-малко един за задача, Отивам да включите малко музика. Отивам да предложи списък на неща, които могат потенциално да добавите. И със сигурност може да се използва Google. И защо не можем просто предлагам да опитате да решите най-малко един особен проблем тук. Така че от гледна точка на етикети, нека да използвате отново този тук. 

Всъщност, нека да сложи то във форма, описание. Да кажем, че сред таговете бихме могли да използвате ето някои тагове тук. Виждали сме в параграф маркер. Сега тя ще се попълни автоматично. Параграф тагове, котва маркер. Да кажем, че искате да направи нещо по-голямо, така че може да like-- маркер за регулиране на чувствителността може да помогне. Е, може би трябва малко помощ за които в един момент. Виждали сме Разделение. Ще видите, че има маса. Има нещо, наречено TR, TD. Th, TD. Върни се, че в един момент. Какво друго може да е удобно? Има силна. Има акцент, или по-скоро ги. There's-- какво друго може да ти харесва тук? Е, ние ще се погледнете, че заедно. Форма, които сме виждали. Има форма. Има вход и няколко други. Добре, така че нека да направим това. За да отговорите на Виктория въпрос, нека първо Просто се уверете, че всеки е в състояние да получи тяхната здравей работен. Тогава нека представим Няколко други идеи. След това ще позволи хора решават някои проблеми на техните собствени. Тогава ние всъщност ще се върне за това понятие за форма, и ние всъщност ще приведе отново в действие заедно предния край интерфейс, така да се каже, за себе си Google. Ще използваме Google като задния край и нека ги вършат тежката работа, търсенето, но ние ще пресъздаде предния край на Google и формата за търсене че те имат по своя начална страница. И така, ние ще се върнем към тези тагове в един момент. 

Така че това е, което аз предложен само преди миг. Можем да добавим стилизация на страница вътре в този стил маркер, и ние можем да стилизирам фона цвят, подравняване на текст, дали това е център или наляво или надясно. Но много бързо бихте намери или уеб дизайнер ще откриете, че това става малко тромаво, защото правиш това, което е нарича смесване съдържание с представяне от него. Вие сте смесване на данните ви и естетиката него. И в действителност, ако се счита, какво ще се случи през time-- това е много малък уеб страница, разбира се. Но ако мога да добавя съдържание към тази страница и да добавя стил към тази страница, страницата много бързо получава по-дълго и по-дълго. И предполагам, че искам има втори уеб страница, която споделя някои от тези атрибути. Да предположим, че втората ми уеб страница за моя site-- също, искам всичко център, и аз също искам всичко със зелен фон. Аз съм доста много ще трябва да се копирате и поставите някои от тези линии в този втори файл, който се чувства добре. Това ще реши проблема. 

Но какво, ако искам трета страница или 30-ти страница или на 40-то страница? Сега ще трябва да се копира и поставите много дубликат код в множество файлове. И така, да предположим, че Реша или аз съм казал, хей, ние не използвате Вече зелен фон. Отиваме да започнете да използвате оранжево. Какво трябва да се промени? Е, ще трябва да се промени, че стил от зелен на оранжев в колко много места? Подобно на 30 или 40 места. Това е досадно. Това е склонен към грешки. Има редица причини където не бихте искали да се индуцира този вид болка за себе си. И така, не би ли било хубаво ако можем да вземе това, което току-що поставя между тези две жълто тагове, тези тагове стил, то фактор навън, и сложи всичко на моя стилизация в един централен файл че всички 30 или 40 на други мои файлове назаем от или по някакъв начин справка, не за разлика от работата в мрежа диаграми, което правехме преди? 

Така че, ако аз отида в тук, аз съм Ще всъщност предложи че заменяме стил етикет с нещо наречен маркер връзка, която е ужасно, ужасно име, защото вие не използвате линк маркер, за да се създаде това, което ние, хората знаят като връзка в уеб страница. За това, можете да използвате която маркер? Как да се създаде връзка в уеб страница? АУДИТОРИЯ: А. Дейвид Дж Малан: А, или котва маркер, който отиде в Disney преди. Маркерът за връзка тук се казва, this-- връзка към файл, наречен styles.css, връзката, към която ще бъде, че това е моята стилове. Така че това е един от най-S в CSS-- Cascading Style Sheets. Стил sheet-- две от S в CSS. Cascading лист стил. Това просто означава, хей, браузър, отидете намерите styles.css на локалния сървър и да го използвате като стилове, което означава, вътре в този файл ще бъде всичко на стилизациите че ние току-що направено. И така, какво този файл може да изглежда така е това. И аз просто ще направите това е бърз Например, тъй като ние не се нуждаем за да получите твърде много в бурените тук. Но ако копирам това, което аз съм предлагане е, че един програмист създаде нов файл, поставете в тези lines-- whoops-- поставете в тези линии, да го запишете като styles.css, и след това, в От друга файл, изтрийте всички, които и да го замени, вместо с този линк маркер. Така че, ако свържа HREF = "styles.css", връзката е "стилове" близо тагове. Запази го. Върни се в моя HelloWorld. Презареди. 

Буквално нищо не се е случило. Това е нещо добро, защото тя означава, че всъщност цялата работа. За да се докаже, тъй като много, предполагам, че се направи печатна грешка, и аз наричам това "styles.css" с капитал S, който е неправилно, и след това се презареди. Сега можете да видите това просто не работи. Сега, защо? Ами, нека да се използва техника от по-рано. Нека да вървим напред и, в браузъра ми, в Chrome, аз съм Ще се отвори този специален раздела мрежа, както и преди, и нека да се презарежда страницата. Какво не сте изненадани да видим сега? Или може би сте изненадани да го видите. Така или иначе, това, което виждате сега? АУДИТОРИЯ: [недоловим] Дейвид Дж Малан: Това не е намерен. Защо е не е намерен? Е, Styles.css-- капитал S-- не съществува. Аз го сполучлив термин. Обикновено печатна грешка. Но аз съм се разбираемо сега е 404, защото сървърът се казва, хей, това не е намерен. Буквално, аз не знам когато този файл е. Така че, в резултат, на браузъра показва какво може, суровата съдържанието на страницата, който е бил 200, на HTML, но стилизация не мога се добавя след това. И това е, което е писано от каскадни. Вие нещо да го добавите след, и това нещо усъвършенства естетиката на уеб страницата. И дори може да замени тези, стилове с още други каскадни стилове файлове ако искаш. Това не е намерено, все пак, в този случай, защото, разбира се, аз го сполучлив термин. Така че аз ще трябва да се определи, че на първо място. 

Така че нека да вървим напред и да предлагам следното. Да вървим напред и да направим това. Като се започне с може би Вашата HelloWorld файл, нека просто да покани няколко на функцията предложения. Така че, Виктория, което исках да направи някакъв текст по-голяма, нали? Добре, така че можем да правят текст по-голяма. И ние ще всеки разкъсаш само един проблем за решаване. Направи текст по-голяма. Аз няма да се занимавам написването на тази, когато ние има куршум технология право върху тук. Така че някои проблеми. Така че ние ще се опитаме да се направи текст по-голяма. Добре. Какво друго би някой да предложи? Какво друго може да искаме да се направи в дадена уеб страница? Нека да излезе с кратък списък на нещата, и след това да делегира на група да разбера това. 

АУДИТОРИЯ: [недоловим] 

Дейвид Дж Малан: ОК, текст позиция върху различни страни на страницата? Добре. Нещо друго. 

АУДИТОРИЯ: [недоловим] Дейвид Дж Малан: Това е. Така че един GIF е просто различен формат. Ние просто се използва, какво, а PNG или JPG вероятно? Ние използвахме JPG. Ако сте любопитни, прекомерен отговоря на вашия въпрос е JPG обикновено се използва за фотографии, защото той подкрепя милиони цветове или 24-битов цвят. А GIF обикновено се използва за, като, интернет меми тези days-- анимации, като анимирани GIF файлове. Но това се случва, за да се използва по-малък цветен палитра, само 256 възможни цветове, но поддържа прозрачност и анимация. И тогава там е PNG, който поддържа прозрачност и повече цвята но не анимация. Така че това е компромис. Така че добавянето на GIF, все пак, ще бъде функционално еквивалентен на добавяне на PNG или JPG. Да. Източник на изображението е равен. Така че нещо друго. Нека да излезе с нещо, че ние изпратихме до Виктория да правим тук. 

АУДИТОРИЯ: Добавете бутони за форма. Дейвид Дж Малан: OK. Така добавите бутони за форма. И ние ще направим, че един заедно. Така че ще бъде перфектен Segue веднага след това предизвикателство. Нещо друго? Какво може да искате да направите? В Мрежата се чувства много underwhelming ако това е всичко, което можем да направим. АУДИТОРИЯ: Промяна на цвета на текста. Дейвид Дж Малан: Промяна на какво? АУДИТОРИЯ: Цвят на текста. Дейвид Дж Малан: Промяна на цвета на текста. Добре. Така че, нека да направим това. Просто отново така не, че сте, просто наизуст, без да прави точно това, което правя, Отивам да включите музика за може би пет минути тук. Вие сте добре дошли да използват Google. Вие сте добре дошли да ме пита, и Аз ще шепна намек в ухото си. Вие сте добре дошли да търсят над на раменете на другите. Но реши само един от тези проблеми. Но ние ще направим последната, на образува един, ако бихме могли заедно. Така пет минути за решаване всяка една от тези проблеми използване на Google, интуиция, или който и да е други достъпни за вас начин. 

[МУЗИКА] Добре. Не се тревожете, ако искате да запази бърникането, но аз ще се развали няколко на тези отговори. Така че първото предложение от Виктория беше да се направи текст по-голяма. Така че има няколко начина да направите това. Аз съм в момента възстановено екрана ми до този размер, че съм увеличени в изкуствено, само за да види нещата. И нека да направим това. Нека да вървим напред и да вземете някои генерични латински текст Просто така че ние имаме нещо да се работи. Така че ми даде само един миг. Аз ще направя три точки. ДОБРЕ. Това ще бъде по-добър пример. Така за по-любопитните, в ми hello.html, аз просто поставили три безсмислен Латинска параграфи Просто така че ние имаме някакъв текст, за да се работи. И гол Виктория беше да направи някои от текста по-голяма. Така че бих могъл, както и преди, отидете тук. И нека да го направим по правилния начин. Отивам да имат връзка етикет, който сочи към файл наречен "styles.css" връзката на която е отново "стилове." И тогава аз ще се спаси, че и отварянето на тази "styles.css." 

Така, както преди, имам способност в този CSS файл действително да замени по подразбиране естетика на уеб страница, и естетиката по подразбиране, разбира се, са доста скучна. Това е нещо нормално размер на шрифта, черен текст, бял фон, и така нататък. Така че предполагам, че искам да направя Всички този текст по-голяма. Мога да направя няколко неща. В моя styles.css файл, I Може да се каже, че знаете какво, Прилагат се следните да тялото на моята страница. Давай напред и да направи размер на шрифта 24 пункта, който е номер мога да използвате в Microsoft Word. Нека се върнем към моя уеб страница тук и се презарежда, и може да се види, че това е вече много по-голям. И ние можем да се получи малко луд, точно както можем, по desktop-- направи 96 точки. Презареди. И става все по-малко тромава в този момент. 

Но мога да бъда малко по-прецизно. Вместо да прилага тази стилове на тялото на моята страница, какво друго бих могъл да го прилага за вместо, това, което е друг маркер, че все още може да функция по същия начин? 

АУДИТОРИЯ: стр маркер? Дейвид Дж Малан: P маркер. Така че главата не би било правилно, защото в главата, Вие не може действително контролиране на естетиката на. Има един текст там или не. Но стр tag-- мога да се потопите в малко по-дълбоко, така да се каже, да параграфа тагове. И въпреки, че те са три, това е съвършено глоба, защото в CSS, когато аз просто казват "р", това означава прилагат следните за всеки таг, който съвпада с този селектор, селектора просто е името на маркера. Така че, където и да видите "Р", прилага размера на шрифта, и нека да го направи по- разумен again-- 24 точка. И знаеш ли какво, просто за добра мярка, нека да направи цвета червен само за момента. И сега, ако аз се презареди, сега ние виж три грозни точки. 

Но сега предполагам, че аз съм нещо като of-- Искам първа алинея да скочи на потребителя. Аз не искам да се увеличи само размер на шрифта от всичко. И така, аз всъщност искат да се идентифицират или разграничат сред тези параграфи. Така че нека да се отървете от червеното, защото това е просто вид на лош вкус, и да вървим напред и да направи размер на шрифта 12 пункта по подразбиране, така че ние сме назад с нещо малко по-разумен. И сега аз просто искам да се увеличи размер на шрифта от първия параграф. Мога да направя това в някои начини, но един начин, който е може би най-инструктаж в момент е да направите следното. Нека да вървим напред и да се каже, това параграф има уникален идентификатор на "първия". Аз може да се нарече това нещо, което искам. Аз може да се нарече това "Foo" или всяка друга дума, но аз ще го дам някои семантично смислено име като "първи". Това е уникален идентификатор, идентификационния номер, за първата си точка. 

Това, което сега мога да направя в моя стилове е да бъде малко по-прецизно. Вместо да кажем, се прилагат следната към стр тагове, Мога да кажа на following-- прилага следното, или изберете, на HTML елемент че има уникален идентификатор на "първия". Какво искам да се прилагат за него? A размер на шрифта от 24-точка. Така че аз имам две селектори сега. Един прави всичко на точки 12 точки. Но това, особено след като става въпрос second-- става въпрос последно в file-- това е с каскаден ефект. Току-що направени всички от моето параграф тагове 12-точкови, но това сега каскади и има предимство, че за всички елементи в страницата, всеки маркер в страницата, чиито уникален идентификатор е цитат цитата "на първо място." И таг в този контекст просто означава "единен идентификационен код". Аз не го сложи в HTML файл. Аз, тук, само да кажа, цитат цитата "на първо място." 

Така че нека да се презареди. И сега виждам, ах, OK. Искам да кажа, че не е толкова доста, но това е вид на подобно предговора към книга или нещо подобно, където първия параграф е по-голям. Може да е още по-прецизно с само първите букви, но най-малко Аз бях упражнява по-голям контрол. Сега maybe-- може би искам да направя това от време на време, независимо от причината, и така аз не искам това да се прилага само за един HTML таг. По-скоро, нека say-- нека Също така направете следното. Клас = "внос". Като има предвид, ID се използва за еднозначно идентифицира едно нещо, един маркер, в уеб страницата си, един клас има за цел да бъде използва на произволен брой елементи или тагове на вашата уеб страница. Така че това е за многократна употреба. Един ID не е за многократна употреба. А клас е за многократна употреба. 

И знаеш ли какво, за каквото и философска reasons-- Аз не си довърша thought-- Отивам да се каже, че първият параграф и втори параграф, са важни. Така че аз ще се прилага за този клас, наречен "Важно", че, ако запишете файла ми и се презарежда, не разполага с още функционално въздействие. Но аз добавя някои метаданни във файла, сортиране на нещо отделно от основните данни на файла, така че сега в моя стилове, ако аз вместо да каже ".important" - знаете, нещо, което е важно, че съм ще направи шрифт цвят, red-- или по-скоро не шрифт цвят, просто цвят. Има несъответствия в CSS за съжаление. И презареди. Сега забележите първите две точки са червени но не и на третия, защото аз само прилага класа на "важни" за първите две от тези неща. 

Така че в IDs, имате възможност да се уточни, много прецизно. С класи, имате възможност за повторно използване. Но и в двата случая, обявлението за сортиране на принцип добър дизайн където I отчетени всички от естетика на моя styles.css файл. Така че няма обърканост тук. Няма никакво споменаване на червено или смела изложение или големината на шрифта в този файл. По-скоро имам семантично, по значение характеризира моите данни като, тук е някои важни данни. Ето някои по-важни данни. Освен това, тук е "Първо" на моите важни данни. Така че HTML е всичко за сортиране на маркиране, буквално думи и параграфи и конструкции във вашия страница с тези малки намеци, ако ще, че можете да някак си наберат използвайки други техники като CSS по този начин. 

Така че в отговор на въпроса на Виктория, можем да направим текст по-голяма по този начин. Има много други начини, но шрифта tag-- отворена скоба "шрифт" - всъщност няколко години. И това е проблем, също с разчитайки само на онлайн resources-- те са склонни да се остарял. И наистина, което не се използва, защото светът осъзна, какво означава "шрифта = 7" означава? Не. И така, в продължение на много години и това day-- един от страничните отбелязва тук е, че е действително невероятно болезнено все още понякога да развиват обектите за уеб, защото Microsoft и Google и Mozilla и други често не са съгласни за това как да тълкува спецификация като HTML. 

Налице е набор от правила за HTML, че обикновено казва, какво означава всеки таг. Но понякога това е оставено на преценка изпълнението на, дискретност и Google Microsoft. И така че ще много често виж на уебсайт нещо изглежда по различен начин на компютър отколкото го прави на Mac, и това е наистина, защото, в края на деня, те не го тестваме и на двете платформи. Но това е също тъй разумно, умни хора ще са съгласни и фирми ще са съгласни, и така едно от предизвикателствата на програмиране за мрежата или проектиране неща за мрежата пише вашия сайт по начин, който работи на всеки уеб браузър. Но дори и това е неразумно, нали? Има толкова много версии на толкова много браузъри там, че в някакъв момент, вие също трябва да се направи преценка повикване и вие трябва да решите като компания, особено за електронна търговия стил сайтове, където сте се опитват да използват най-новите и най-великият технологии, за да дадат един наистина добър потребител опит. Но някакъв процент от вашите потребители може да все още да е с помощта на Internet Explorer 6 или 7 или 8, особено в зависимост от страна, че те идват от. 

И така, много често консултирани нещо като "статистика на уеб браузъра." И ако се върнем to-- нека видим Wikipedia и да видим как до актуална тази таблица е ако има такъв. Така че тук можете да видите където браузъри всъщност са, според декември 2015 г., според правителството на САЩ. Chrome е при 42% пазарен дял, следвана от IE до голяма степен в корпоративни настройки или настройките на PC, разбира се, последвано от Firefox, След Safari, тогава Opera не е направил направи карта тук по някаква причина, и след това останалите. Може би това е под др. Но по-проблематично, отколкото, че is-- нека да видим дали Wikipedia също има версии на браузърите version-- 

Нека се върнем към статистиката на браузъра. IE. Дори и това не е достатъчно. статистики браузър. Моята версия. Това няма да бъде прав. Нека видим версии. Browser пазарен дял. Да видим дали това идва. ДОБРЕ. Сега това става все по- малко по-полезни. Така че тук, забележи, че имаме всички различни версии на браузъри. И, Боже мой, ако look-- Chrome 48, Chrome 47, Chrome 31, Chrome 45. Искам да кажа, браузърите все актуализира, и понякога някои от тези промени са значително по от гледна точка на функционалност. И така, в един момент, в продуктови мениджъри или инженерите Трябва да се направи decision-- ви знае какво, само 1% от света е все още използват IE 7. Да вървят по дяволите. Ние просто не започваш да се подкрепа на този браузър. И какво означава това да не подкрепят? Това може да означава, че бутоните не работят на вашата уеб страница, или тя може да означава форматиране е напълно изключен. Или може би трябва да се направи същото това решение повикване в мобилните тези дни, когато сме Няма да подкрепя IOS 5 вече. Така че хората просто трябва да ъпгрейд. Или ние няма да подкрепи Cupcake на Android OS за устройства с Android, тъй като world-- като тек света иска да се движи напред, то вид иска да плъзнете свят с него, така че те не го правят трябва да продължи да бъде обратно съвместим, така че те могат да предложат нови и добри характеристики. Това наистина е една от причините, защо толкова много компании се въвеждат поетапно автоматични актуализации и сортиране на принуждавайки най-новите версии на софтуера за нас. И дори компании като Apple ще сортира на ви принуди почти или принудят ти по отношение на пазарните сили да си купите нов телефон, защото те просто не ще актуализира стария си телефон вече. Така че ви пропуснат Най-новото и най-големите възможности, защото това е скъпо да ги като фирма за поддържане на по-стара, може би низши версии на софтуера. Но нетният ефект е, че ние също страдат това, както добре. 

Така че нека да разгледаме най-точно Няколко финални неща тук. Нека да свалям доста бързо някои от тези други куршуми, ако любопитен. Така че, ако сте се опитвали да, например, позиция текста на различни страни на страница, аз ще направя един бърз начин, но там е различно начини за това. Нека да вървим напред и да eliminate-- опрости това, както следва. Нека само да се върна в моя прости, прости точки. Нека се върнем към моя styles.css. И аз съм просто ще използвате simple-- който може да си видял на Google или извикайте от earlier-- текст-да е отдясно. И презаредете тази страница. Сега всичко изглежда да бъде прав подравнен, както може да се види на режийните тук. 

Ние можем да го правят да изглежда малко по- резервират-подобни, и ние можем да кажем "оправдае" и се презарежда. Сега това е хубаво и квадрат на двете страни, което е вид хубаво. Друга цел, която имахме тук е промяна на цвета на текст. Така че ние видяхме, че с моя червен текст. И сега се добавят бутони за форма. Така че защо да не се опитваме да правим точно това? Но първо нека да отиде на място, че повечето от нас използват всеки day-- Google. И нека да разгледаме най- как Google всъщност работи. Но аз ще направя това. Първо нека да го направи in-- Аха, да ме пусне да Google първи. Отивам да се наложи да отида в настройките на услугата, защото искам да деактивирате нещо, наречено Мигновени резултати. 

Така че може би сте забелязали в Google тези days-- нека се върнем и се превърне това в. Така че, ако започне да търси за "котки", като този, забележите, че не само, че Получавам автоматично завършване на отгоре, всички изведнъж, на самата страница Изглежда, да се променят доста бързо, както и, и това е Google с помощта на език нарича JavaScript опитва да бъде от полза. Но за съжаление, това вид на бъркотии нашата дискусия на какво всъщност се случва под капака тук. Така че аз съм просто вид на бързо изключите мигновени резултати. И аз отивам да кликнете върху Запазване. И сега аз ще отворя че диагностично лента с инструменти, които аз запази отвор в раздела Network. Така че нека да направим това. Нека me-- whoops-- превъртете това надолу малко. И нека да търси за "котки". 

И сега notice-- всъщност, това е добра възможност за да обсъдят за миг. Обърнете внимание на момента, в който type-- го спре. Спри. ДОБРЕ. Обърнете внимание на момента, в който въвеждате буквата C, да гледате на долната част на екрана. A- T- S. Какво дъното на този екран, ми раздела Network, Предлагам се случва всеки път пиша писмо? За съжаление, на жаба е много разсейващи днес или детелина или каквото и да е. Какво се случва всеки път, когато написах? И нека да изчистите буфер и го въведете отново. So-- Опа. Всеки път, когато въвеждате буква, C- A- T-- така нов ред очевидно продължава да се появява. Какво означава всеки един от тези редове представляват, въз основа на това, което сме виждали и обсъдени до този момент? АУДИТОРИЯ: A търсене? Дейвид Дж Малан: A търсене, или по-общо, заявка за HTTP от браузъра си, за да сървър. Е, защо се направи HTTP моя браузър да поиска всеки път, когато въвеждате буква? 

АУДИТОРИЯ: [недоловим] Дейвид Дж Малан: Да, това е даване мен тези авто-пълна резултати. Подобно, когато правя тези Резултатите от търсенето идват от? Е, всеки път, когато въведете писмо, Google изпраща повече и все повече и повече на думата Аз съм пишете. Защо? Защото те искат да ми даде по-добре и по-добре, по-добро предложение, списък с предложения, за какво дума Опитвам се да всъщност пълна. Така че това е, за да се каже, буквално всеки характер, който въвеждате в Google се изпраща, в крайна сметка в насипно състояние, но също така понякога един в момент, за да се приложат тези авто-пълна отличителни знаци, когато данните са, разбира се, в интернет. 

Сега, нека да разгледаме какво всъщност се случва, когато щракнете Google Search. И тогава ние ще използваме този себе си. Така че, ако превъртите надолу, сега до самия първата заявка, че току-що се е случило. Обърнете внимание на следното. Той е изпратен в един доста дълъг URL-- https://www.google.com/search? и след това цял куп неща. Нека да видим това всъщност сега в раздела браузър себе си. Нека да се отървете от лентата с инструменти тук. Ето страницата с резултати от търсенето. И известие тук е URL адреса. Сега, най-вероятно да се досетите това, което се случва тук в част. Така че на първо място, определение. Това очевидно е дестинацията където се подава формата. Така че, когато аз напечатани в думи "Котки" и натиснете Enter, Очевидно Google изпратен вход моя текст за този URL че съм подчертано там, наклонена черта търсене. Оказва се, в един URL, нищо, че се случва, след като въпросителен знак е, като ние продължаваме да казва, двойка ключ-стойност че е бил въведен във формата или по някакъв начин предавани от браузър на сървъра. 

Така че всеки път, когато въведете вход във форма в интернет и това е изпратен като ние сме Обсъждахме, чрез GET, една от тези виртуални пликове, съдържанието на които envelope-- да, държа Първи пълнени физически в плика в клас днес, но технологично това е действително пуснати в URL адреса. Така че в действителност, нека да се пресее през тази. Къде виждате приноса на потребителите? Къде виждате нещо че аз се въведе до тук? Да, така че "котки". Така ли е? Така че нека да дестилират това в нещо по-просто. Отивам да изтрие всичко за този URL, че аз не разбирам, и аз съм просто ще напусне то като this-- / търсите? Q = котки. Ще видим, където Q идва от в момент, но, че се чувства като минимум количество информация, че аз условие. И сега аз ще удари Enter. И забележи, че все още работи. Ние все още се върна цял куп котки. Така че Google е любител отколкото това тези дни. Това е 2016, а не 1999 година. Така че има и други неща, които ми браузър изпраща към сървъра. Но това е минимално всичко, което е необходимо. 

Е, какво става? Ами, първо, нека отида напред и да отидете обратно към Cloud9 и ме пусна напред и затвори моите раздели по-рано. И аз ще направя това на моя притежава само за миг. Отивам да се продължи напред и да се създаде нов файл. И аз отивам да го запишете като google.html. И аз ще много quickly-- Отивам да се открадне, всъщност, някои от този текст, само за да се спести време. Отивам да поставите този тук. Аз няма да се занимавам с всеки стилизация този път. Ние ще наричаме това "My Google." И аз отивам да се отърват на всичко в организма. И аз ще направя следното. Нека да я увеличите инча Форма action-- и както аз накратко споменато earlier-- whoops-- както аз накратко споменато по-рано, на действието на форма е мястото, където можете да изпрати данните, да. Така google.com/search. И метода Искам да използвам може да бъде едно от следните две неща. Това може да бъде или "да", тъй като ние продължаваме обсъждане, или тя може да бъде "пост". За сега, фундаменталните Разликата е, ако използвате "получи" цялата информация, че потребителят предоставя се предават в URL адреса. 

Това е чудесно за неща като търсене двигатели и няколко други приложения, но при какви обстоятелства би Вие не искате да попълните формуляр и са на информацията, до края на URL, като в адресната лента на браузъра си? Какви форми you-- направя АУДИТОРИЯ: [недоловим] Дейвид Дж Малан: Да, като това, което? АУДИТОРИЯ: Паролите. Дейвид Дж Малан: Да, така че можете да влезете в Facebook или някой сайт. Това е приноса на потребителите от форма, текстово поле, но най-вероятно не го искат показва в URL на браузъра. Защо? Искам да кажа, може би има някои, последствия за сигурността на мрежата, но MORE-харесва, по-просто, това, което, ако съквартиранта, вашият значими други, децата си, съпругата ви изглежда чрез историята на браузъра ви? Има си прав парола има в историята на браузъра ви. Това не се чувствам като добър дизайн. Или още по-технически, Предполагам, че се опитвате да качите снимка на Flickr или Facebook или wherever-- че е приноса на потребителите, въпреки че това е малко по-interesting-- как мога да тъпча на изображение в лентата за URL? Можете вид на вид не може. Можете вид може. Но, наистина, аз съм отруден да си представим това, че. Така че аз трябва друг метод за качване на снимки в уебсайт, и че друг метод се нарича "пост". Но за сега, ние ще говорим само за "Получите", която е най-простият от двете. Тя просто поставя всички приноса на потребителите в URL адреса. 

Така че тук е формата аз съм създаване. Искам един вход. И знаеш ли какво? Отивам да се направи предположение тук. Отивам да си припомни ми вход "Q" за "заявка". И мисля, че това е един от най- оригинален дизайн, може би, от 1999 година. И след това вида на този вход е просто ще бъде "текст". И тогава аз ще има друг вход че не се нуждае от име, тъй като скоро ще виж, видът на които е "бутона." И това ще е дайте ми специален бутон. И това е. 

Така че нека да вървим напред и да запазите този файл. Отивам да се върна в моя браузър и отидете на google.html. Enter. И това е вид рядка меко казано. Но нека да продължа напред и търсене на "котки". И забележи момента съм На този URL Cloud9. Но в момента, аз щракнете това, където се надявате, че ще свърши? 

АУДИТОРИЯ: Google. 

Дейвид Дж Малан: Google. Така че нека да кликнете върху Изпращане. И наистина съм отново реализира Google. Така ли е? Това е по-просто. Това е по-лек. Искам да кажа, моя код е ясно по-добре, отколкото тяхна, от бъркотията видяхме по-рано. И знаеш ли какво? Отивам да се подправят това до малко. Аз не спомена това по-рано. Има тагове като H1, за функция 1, най-важната функция на страница. "My Google," Ще се обадя на този. Нека да се презареди. Това изглежда малко по-добре вече. И, всъщност, знаеш ли какво? Аз бях already-- излъгах. Казах, че няма да оформите това, но аз отивам да оформите това като преди. И тялото ми ще бъде, да речем, текст-приравни център. Той гледа по-скоро като Google вече. 

Имам нужда от нов ред, въпреки че, за това бутона Submit. И се оказва, можете да използвате параграфи, или можете да по-буквално само да кажа, дайте ми линия, почивка here-- на BR маркер. И ако аз, презаредете, сега тя отива там. Това е малко грозна, така че аз може да направи няколко паузи линия, но нека да не се получи прекалено алчни тук. Така че сега нека да видим дали ще работи за "кучета." Това изглежда да работи за "кучета", както добре. Така че това, което е най-завладяваща Takeaway тук? One-- не е огромен скок за представим още няколко тагове, като маркер форма във входната маркер. Но по-фундаментално е, всичко, което правим е деблокирането на нашето разбиране на HTTP и факта, че форми в крайна сметка да променят това, което е в URL адреса на браузъра, и така, поради това, ние можем да механично даде своя принос към сървър като се направи HTML форма и знаейки че сървърът разбира HTTP, Просто обичам тялото ни разбира, като, разклащане ръката ми, че един и същ протокол, и така се върнем отговор че ние в крайна сметка се очаква. 

Така че нека да се опитаме да направим едно последно нещо сега с мобилен, и аз ще make-- Ще добавите този код, за да слайдовете. Така че, ако искате да калайджия, вие със сигурност може да го вземе от там. Но аз ще отида напред и да направим едно нещо. Отивам да се продължи напред и отворят моя индекс page-- ми здравей страница, както и преди, което има много тази изкуствена-латински текст, или безсмислени латински текст, и has-- тя изглежда като този в този размер на шрифта. Но нека да вървим напред и да направим това. Отивам да отидат в Cloud9. И не е нужно да се направи тази стъпка. Аз просто ще го направя сам. Отивам да щракнете върху Споделяне. И това е функция, само на Cloud9, при което Мога да направя моя среда публично. 

И само за целите на демонстрация, позволете ми да направя това. Отивам да се направи заявление ми публичен. Забележете, че ме предупреди, съм Аз съм сигурен, че искате да направите това, защото това ще направи всички в света, независимо дали те са тук сега или гледане на видео по-късно през интернет може да види това, което виждам. Но това е ОК. Отивам да се каже "Готово". И нека да ви насърчи, ако го направя това correctly-- нека го тества първия. Давай напред, ако не mind-- в браузъра на вашия компютър, отидете на този адрес, и се надяваме, ще видите моя латински текст. И за да бъде ясно, че е не работи на моя лаптоп. Това е в облака. Това е на Cloud9, буквално, но Аз направих моя работен плот на общественото така че всеки в интернет достъп до моята Латинска начална страница. 

Отиди в същото URL адреса на вашия телефон, ако може. Ако това ще ви струва, че, вие просто да погледнете над рамото. АУДИТОРИЯ: [недоловим] Дейвид Дж Малан: Съжалявам? АУДИТОРИЯ: [недоловим] Дейвид Дж Малан: Само латински думи. Това е всичко. Но това е, което трябва да видите. 

АУДИТОРИЯ: Да. Дейвид Дж Малан: Да. Да. ДОБРЕ. Така че мога да побере до вашия телефон само за миг? Така че, да се надяваме, ако сте достъп това, то трябва да изглежда почти нечетлив. Това е still-- Искам да кажа, това е нечетлив, защото на латински. Но тя също може да бъде прочетен за това, което е друга причина? Подобно на това, което ви е угодно за това? АУДИТОРИЯ: Това е малка. Дейвид Дж Малан: Това е супер, супер малък. И така, как бихме могли да поправя това? Това е супер, супер малък на телефона на Виктория и, ако сте изтеглен то до себе си, най-вероятно малък от телефона си, както и, освен ако не са активирани настройките за достъпност. Какво е това? Можете просто да се захванете и увеличение, което е осъществимо, но след това, което виждате само С няколко думи в даден момент. Така че чакай малко. Аз знам как да поправя това. Така ли е? Мога да използвате CSS, и аз може да промени размер на шрифта от 12 точки за 24-точка. Но страничен ефект от това, разбира се, ще бъде сега, на настолен или преносим компютър, Сега текстът е два пъти по-голям. И така вид би било хубаво да се прави разлика между устройства, и се оказва, че са начини за правене на това. Има няколко различни начини, в действителност, при която с помощта на CSS и красиви черти че ние няма да отидат в по-големи подробности, можете да същество заявка браузъра и да кажа, ако екрана е по-малък от този много пиксели, използват този размер на шрифта. Ако екранът ви е по-голям от този много пиксели, използват този друг размер на шрифта. 

Вие може да бъде дори по-красиви все още. Ако някога сте посетили уеб страница, която, на настолен, има голямо меню може би до най- страна, и след това цялото съдържание е на страната на която menu-- това е вид на обща парадигма. Меню на ляво, съдържание на полето, или обратното. наистина не работи на мобилния, когато си екран е само това много пиксела. Така че по-често на мобилния е, менюто си изведнъж ще получите се срина, а вие трябва да кликнете на бутона, за да го видите, или на интернет страницата ще изведе менюто над нея и да изложат на съдържанието под него. И вие може да прилага тези правила неща в множество начини, също. Можете да зададете своите програмисти, хей, екип, по всяко време виждате заявка за HTTP от Android устройство, устройство на Microsoft, а Google устройство, устройство на Apple, използвайте тази размер на шрифта и използвате тази оформление меню, или пък да използва тази подразбиране голяма оформление. 

Сега, като се използва каквото фундаментална техника днес могли инженерите използват да знам дали това е на iPhone, един Android телефон, лаптоп, настолен посещение на сървъра на компанията? При което те ще получат тази информация? 

АУДИТОРИЯ: Header? 

Дейвид Дж Малан: Да, хедъра на HTTP. Така че всяка заявка HTTP, идващи от своите клиенти до техните сървъри включва, вътре в тази виртуална плик, цял куп на HTTP хедъри, една от които е браузъра и операционната система дори, ако те е грижа за това ниво на детайлност. Сега, това е един загадъчен вид низ, но съществува софтуер, който просто ще опрости, че и вие може просто да попитам в програмирането code-- PHP, Java, C ++, whatever-- какво телефон е this-- какво устройство е този потребител, използващ? И тогава може да се каже, да им покажем това версия на сайта, ако това е телефон. Покажете им, когато тази версия на уебсайт, ако това е лаптоп или настолен. Но ти дори не е необходимо от страна на сървъра сложност. Можете да направите дори най-простите неща. 

Отивам да се направи това. Отивам да се продължи напред в ми Cloud9 среда, и аз отивам да добавите маркер че те видях в Google преди. Той е наречен метамаркер. И никога не си спомням този един, така че Отивам да го преписвам тук. Мета име = "прозореца за показване" и след това съдържание = "ширина = ширина устройство, intital мащаб = 1 "и това е всичко. 

Така че това може и да е като магическо заклинание. Това не е всичко, което ясно, но това е нещо общо с изгледа, и изгледа е само тялото на уеб страница, на правоъгълна област, която определя най на страницата. И това е просто казвам браузъра, знаете ли какво? Направете ширината на тази страница ефективно равна на ширината на устройството. С други думи, не мислете, че Имате ли нещо като неограничено пространство. Да предположим, че имате само толкова, пространство като самото устройство е голям. И така, сега, ако аз презаредете в браузъра ми, аз не виждам промяна. Но ако го направя това correctly-- и нека да пресече ми fingers-- ако всичко, което презареди си телефони, което правите виж убедителна промяна? Да, е that-- 

АУДИТОРИЯ: [недоловим] Дейвид Дж Малан: Да. ДОБРЕ. Така че може би по-разбираемо в момента? Все още малък, за да бъде справедлив, но не толкова малък, че да е неуправляем. И аз със сигурност може да отмени това допълнително с CSS или от страната на сървъра, но все по-често това, което сте виждат се все повече и повече функции се прибавя към от страна на клиента environments-- JavaScript, тъй като ние ще обсъдим утре, CSS, и HTML-- така че всички тези заявки може да се направи на клиента така че да се притеснява сървър много по-малко и не да се наложи да се справи с, за Например, на постоянна атака на новата операционна система версии, нови версии на браузъра. Можете просто да позволи на браузъра поиска от устройството, колко голям си ти, и след това да си малко по-логично решения въз основа на това. Но ще видим повече възможности за логични решения Утре в контекста на един език за програмиране. 

Така че, на всички въпроси, а след това, за уеб програмиране? Днес не е уеб програмиране, на себе си, тъй като почти всичко, което направихме Беше много естетически, ако щете. Не е за вземане на решения в кода, че сме написали, и така, че затова HTML е за маркиране език, а не един език за програмиране. Но утре ние ще се един бърз поглед, в крайна сметка, в JavaScript, който е действително програмиране език, който ни позволява да направим малко повече. 

Някакви въпроси? Е, нека да предложи два възможности по избор за домашна работа. Един is-- тези Cloud9 сметки няма да изтича. Вие сте добре дошли да използват тях да калайджия с. Това е безплатно ниво на обслужване. Осъзнайте, че, ако при създаването на на вашето работно място, вие го направи публично, че не означава, че всеки в интернет може да видите това, което пишете. Така че може би просто помисли не излагаш себе си ако сте пускането първата си уеб страница там публично случайно, но никой няма да знаете да погледне там така или иначе. 

И two-- да ме хвърля до този URL, както и, особено ако дойде в днес малко по-малко удобни, отколкото други, сигурни какво означава всичко това. Осъзнайте, че много повече от това видео, който е едновременно добър начин да заспите а също и да се смее, докато Правейки това, също има много societally интересно и свързани със сигурността дискусии в него от Джон Оливър, макар и комик. 

Но ако няма допълнителни въпроси, това ни води до рецепцията. Така че защо да не се включа музиката. Не трябва да има напитки и закуски отвън. Аз съм щастлив да се смесят, за колкото Докато хора биха искали, отговори на въпроси по един-на-един. Но, в противен случай, вие сте добре дошли да излети във всеки един момент, и ние ще се видим отново утре сутринта за малко повече. Добре, благодаря.