Tomas REIMERS: Hi, sa lahat. Tomas Reimers Aking pangalan ni. 

Mike RIZZO: At ako Mike Rizzo. 

Tomas REIMERS: Kami ay dalawa sa CS50s TS. At ngayon kami ay humahantong ang pantas-aral sa JavaScript at CSS para sa mga web apps. Kung nais mong sundin kasama, ang link ang tama doon. At huwag nais mong ilagay up ito sa computer sa madaling sabi? 

Mayroong ang link. Ito ay isang maliit na site, na may mga link sa mga lahat ng mga mapagkukunan kami ng pagpunta sa maging pagturo mo ngayon at din ay may napakaraming mga kapaki-pakinabang na impormasyon na nakasulat sa pamamagitan ng sa amin sa basahin ang mga mas malalalim na kapag kang bumalik, at sinusubukan mong matandaan kung ano eksakto ang sasabihin namin, ano ang mga mo pakikipag-usap tungkol sa, at iba pa. 

Mike RIZZO: Lahat ng karapatan. Kaya ni magsimula ipaalam. 

Tomas REIMERS: Kaya nais mong simulan? OK. 

Mike RIZZO: Oo. Kaya muna namin nais na magsimula sa isang malawak pangkalahatang-ideya tungkol sa internet at maghain uri kapag nagdidisenyo ng mga website. Habang ang pagtatanghal na namin nais na dumapo sa JavaScript marami magkano sa paglaon, gusto naming magsimula sa lamang, uri ng, tulad ng eye view ng isang ibon ng kung ano ang isang website ay at kung paano mag-isip tungkol sa pagdisenyo ng isang website para sa simula. 

Kaya mo guys, sa puntong ito - na may mga ito pagiging Biyernes gabi - ay dapat magkaroon naisumite ang iyong CS50 pananalapi Nagtatakda problema. Sana, na noon ay isang mahusay na panlasa ng kung ano ang web programming ay maaaring maging. Ngunit dito gusto naming, uri ng, magbigay ka ng isa pang lasa, pati na rin. 

Tomas REIMERS: Kaya lang sa pagbabalik-tanaw kung ano ang mangyayari, kapag nagta-type ka sa iyong URL upang iyong web browser, nakakakuha ang URL na iyon tumingala sa computer. At computer ang iyong mga nakakonektang sa isa pang computer, na nagho-host ng website na iyon. OK, kaya kapag pupunta ka sa google.com, ikaw ay nakakonekta sa isa sa Google mga computer, na may mga file para sa google.com. 

Pagkatapos ay humihingi ito para sa isang tiyak na file. Kaya kung kang pumunta sa - Hindi ko alam kung - example.com / index.html o / test.html, ka ng pagpunta sa magtanong para sa na tiyak na file. At ang web server ng pagpunta upang ibalik ito sa iyo. 

Pagkatapos, sa sandaling pumunta ka sa file na iyon - sa sandaling ikaw ay nakakakuha computer na iyon file - ito ay pagpunta sa simulan na bumuo ng isang web page. Kaya ngayon mayroon itong mga file na HTML, na kung saan ay uri ng tulad ng istraktura ng web page. Ang file na HTML ay maaaring ring sumangguni sa CSS file, na tukuyin ang estilo ng web page. 

Mga file ng JavaScript, na tumutukoy sa pakikipag-ugnayan sa mga web pahina. Mga file ng imahe, na kung saan ay lamang ang mga imahe. At marahil-link sa iba pang mga file na HTML, na maaari mong pagkatapos ay bisitahin ang. 

Mike RIZZO: OK, mahusay. Kaya mo guys mayroon lahat, siguro, painstakingly set up ang iyong lokal na host sa iyong mga virtual machine. At na lang, uri ng, ay ang lokal na domain na nagho-host lamang ang iyong computer para sa iyo sa iyong sariling IP address. 

Kaya sa loob na, pagkatapos ay maaari kang magdagdag ng dito ang iyong sariling mga pahina ng web. Ibig kong sabihin, sa CS50 Finance, dapat kang magkaroon ng Idinagdag ang ilang mga pahina ng HTML, na kung saan ay, uri ng, nakabalot sa wrapper PHP. Ngunit sa huli, kung ano ang iyong mga pahinang PHP ay outputting ay HTML. 

Ngunit nag-iisip pabalik sa pinakadulo simula ng PSET, nagkaroon kami upang i-set ang mga pahintulot para sa lahat ng bagay, tama? Kaya ay nagbibigay-daan ito talaga lang alam sa amin sino ang makakabasa, isulat, at posibleng isakatuparan ang bawat isa sa mga file. Kaya kami ay pagpunta sa gawin ang isang mabilis - Hm? 

Tomas REIMERS: Kaya kami ay pagpunta na gawin ang isang mabilis na demo. Kaya lamang ipaalala sa iyo, kapag nag- kumonekta sa computer ng Google - kung sinuman - at humingi ng isang file, ang computer muna Kailangang tiyakin na iyong awtorisadong upang aktwal na tingnan ang file na iyon o magbasa na maghain dahil hindi mo lamang maaaring hilingin para sa anumang mga file sa computer na iyon, i-right? Iyon ay magiging isang seguridad ipagsapalaran. 

Kaya mga file sa mga system na ginagamit namin, tulad ng ito CS50 appliance, mayroon tatlong pangkalahatang mga tao na maaaring magkaroon mga pahintulot sa isang bagay. Ang una ay ang aktwal na may-ari ng sinabi file. Pangalawa ay ang group na iyon ang file ay kabilang sa. Hindi namin pagpunta sa tumutok masyadong marami sa iyon. At ang huling bagay ay, uri ng, tulad ng mundo o tulad ang iba kung sino ang hindi tukoy sa file na iyon at hindi magkaroon ng anumang mga karapatan sa pagmamay-ari sa ibabaw nito. 

Kaya kung kami ay may-ari, group, at pagkatapos mundo. At pagkatapos ay, para sa bawat isa sa mga pangkat na ito, mo ay maaaring magkaroon ng isa sa tatlong mga pahintulot, OK, o maramihang ng mga ito. Maaari kang magkaroon ng nabasa na mga pahintulot. Maaari kang magkaroon ng karapatan na pahintulot. At maaari mong execute pahintulot. 

Kaya sa mga tuntunin ng aktwal na mga uri ng file, basahin ang pahintulot ay tulad ng aktwal na pagbabasa ang mga nilalaman ng file. Ang isang karapatan pahintulot ay sumusulat sa sinabi file. Isang execute pahintulot ay tumatakbo ang mag-file tulad ng gagawin mo kapag nagpatakbo ka ng isa sa CS50 iyong proyekto. 

Kaya kapag kami pinag-iisipan mo tungkol sa mga file tulad ng kapag kailangan namin upang basahin ang isang HTML file, na kailangang maging mundo nababasa, tama? Siguro, ang may-ari din nais ni upang magagawang i-edit ang file na iyon. Kaya ang nangyayari sa may-ari upang kailangan basahin at isulat ang mga pahintulot. Sila ay hindi talagang kailangan execute. 

Group, kami ay pagpunta sa paggamot sa mga katulad ng mundo sa ngayon. Kaya kailangan nila nabasa na mga pahintulot. Ngunit hindi nila kailangang pagpapawalang o nagsasagawa ng mga pahintulot. At ngayon, kung sa tingin namin pabalik sa dating PSETs, ano ang nauunawaan natin ay ang mga uri ng magmukhang binary, tama? 1 ang ibig sabihin ay oo. 0 para sa walang. At maaari naming talagang isalin ito sa binary. 

Kaya 110 sa binary ay magiging 6. 100 ay magiging 4. Parehong may mundo. Kaya ang bilang makakakuha ka ng para sa mga pahintulot para ito ay magiging 644. 

Mike RIZZO: At kung sa tingin mo pabalik sa kapag chmoded ka ng isang bagay, sa tingin ko sila ay nagbigay sa problema itakda ang halimbawa ng kung saan maaari mong gawin isang bagay tulad ng chmod 644 at pagkatapos ay i-file pangalan. Ang 644 pagkatapos, ikaw ay maaari nang direkta makita kung saan na nagmumula sa. Kaya na sana ay ginagawang na mas malinaw ng kaunti. 

At pagkatapos ay para sa kalinawan mo lalaki ni - oh oo, dito ito ay muli. Kaya 600 pagkatapos ay magiging lamang ang halimbawa Isinuko namin dito kung saan ang may-ari ay basahin at kanang mga pahintulot habang pangkat at mundo ay walang anumang mga pahintulot upang ma-access ang file. 

Tomas REIMERS: At pagkatapos ay mayroon kaming isang mabilis listahan ng mga karaniwang mga pahintulot. Kaya direktoryo, gusto mo upang aktwal na chmod 711. Mabilis na bukod - para sa isang direktoryo na mayroon executable pahintulot ay nangangahulugan na upang magawang upang buksan ang direktoryo. Mga imahe, CSS, JavaScript, mga pangangailangan ng HTML 644 dahil, talaga, ang mundo pangangailangan basahin ang mga pahintulot. 

At PHP, kung saan mo guys na nakita bagaman ay hindi uusapan natin ang tungkol dito mahigpit ay karaniwang chmoded may pahintulot 600 dahil na tumakbo kasama ang ang mga pahintulot ng may-ari. Hindi bababa sa appliance. 

Mike RIZZO: Kaya kung hindi mo gusto na partikular na tukuyin kung anong uri ng file Gusto mo sa aktwal na pagtatakda up ang pagtatanghal na ito - nagkaroon kami ng problema sa ito dahil ang lahat ng bagay ay hindi tama chmoded - ka pagpunta upang makakuha ng, uri ng, isang ipinagbabawal na error na ang website ay hindi aktwal na may pahintulot upang ma-access ang kahit anong file gusto mo ito i-access. At syempre, na maaaring nakapirming - bilang sa problema set - sa pamamagitan ng pagbabago mga pahintulot ng naaangkop. 

Tomas REIMERS: At ang huling komento para sa mabilis lokal na pag-unlad ay - namin nagdala ito up, ngunit gusto naming lamang upang ilabas itong muli - kung hihilingin mo para sa isang server - kaya lokal host, halimbawa, com o kahit ano. - at hindi mo tukuyin ang isang tiyak na file, ang file na ang iyong computer ay pagpunta upang humingi ng ay tinatawag na index.html. O kung na hindi umiiral, index.PHP. 

Cool. Kaya ito lamang ay isang pagbabalik-tanaw ng lahat ng bagay, sana ay, na namin ang saklaw sa seksyon, at magbigay ng panayam, at sa ngayon sa CS50. At ngayon kami ay pagpunta sa simulan ang pakikipag-usap tungkol sa partikular na mga aklatan. JavaScript at CSS aklatan para sa mga web apps. 

Kaya isa mabilis dahilan kung bakit mayroon kaming mga aklatan ay ang mga programa - mayroong isang pulutong ng mga problema sa programming, na panatilihin popping up muli, at muli, at muli. Maaari mong mapansin na ang isang pulutong ng mga website Kailangan ng kakayahan upang magkaroon ng drop down mga menu, halimbawa, o kailangan ng kakayahan upang magkaroon ng isang napaka-karaniwang mga pindutan estilo, na kung saan ay maaaring hindi ang pinakamadaling bagay. Ngayon na simulan mo upang makakuha ng sa HTML, mo Napag-alaman na ang mga pindutan maaari talaga Inaasahan talaga pangit kung ikaw huwag gumawa ng kahit ano. 

Kaya ng maraming tao ang nakasulat na tinatawag na mga aklatan. At sa kontekstong ito, ang mga ito ay tinatawag din Framework. Kami ay pagpunta sa gamitin ang dalawang salitan. At ano ang mga ito ay ang mga ito ay isa lamang premade piraso ng code - alinman sa CSS o JavaScript - na tumagal ang layo ng maraming mga Koponan mayroon ka sa coding. 

Kaya sila pre-tukuyin ang isang bungkos ng mga klase o pre-tukuyin ang isang bungkos ng mga pag-andar para sa Kaso JavaScript, na Maaari kang tumawag sa susunod. At pagkatapos mo, uri ng, kumuha ng pag-access sa ang code na ito nang hindi na kinakailangang gawin. Isang halimbawa ng mga library ay CS50.H. Iyon ay isang library Ibinigay namin sa iyo pabalik sa linggo isa, na pinapayagan kang gawin mga bagay tulad na GetInt at GetString nang hindi na kinakailangang sumulat iyong sarili ang anumang code. 

Mike RIZZO: Lahat ng karapatan. Kaya dito, tulad lamang namin ay may upang isama sa aming c mga file sa iba't ibang mga aklatan, kami din ay dapat isama sa ang aming HTML file iba't ibang mga aklatan. Halimbawa, kung gusto naming isama isang tukoy na library JavaScript dito, marahil, isa na na naisulat namin ang ating mga sarili bilang lokal na ito ay naka-host tinatawag script.js, namin lamang gamitin pagtatanda na ito. 

Kaya mayroon kaming uri ng script Kapantay JavaScript pinagmulan Kapantay JavaScript.js. At kung sa tingin mo pabalik sa iyong CS50 itakda ang problemang pananalapi, kapag tiningnan mo sa header.php sa folder ng mga template, Dapat na nakita mo ilan sa mga kasama. Kaya ito muna isa - ang mga script - ay kabilang ang isang JavaScript library. Kabilang ang isang CSS library ay Medyo naiiba. 

Dito, sa halip na ang script TAG kailangan mo ng tag na link. At pagkatapos, ang uri ng teksto CSS ay isang maliit na naiiba. Wala ka laging may upang isama style sheet rel. Ngunit tingin ko ito ay, sa pangkalahatan, mahusay na kasanayan. 

At pagkatapos ay sa wakas, ang HREF, na kung saan mo marahil nakita sa iyong ATAGs para sa pag-link sa iba't-ibang mga link lamang Tinutukoy ang link ng kung saan upang mahanap iyon. Halimbawa, kung gusto naming i-link ang isang iba't ibang mga library - sabihin nating lamang - na nanirahan sa styles.css. At gusto naming i-link na sa na naka-host sa web, gusto naming kopyahin iyon. At pagkatapos ay i-paste ito sa kahit anong mayroon kaming dito mismo sa halip. 

Tomas REIMERS: OK, sana sa iyo guys ay nasa pamilyar may kung paano i-link ang CSS. Nagkaroon ka upang gawin iyon sa ang iyong huling kayumanggi set. JavaScript, ang ilan sa iyo siguro may ilang mga karanasan sa. Hindi Ang ilan sa maaari kang. 

Kaya para sa ngayon, alam na ang isang JavaScript na file ay napaka tulad ng isang CSS file sa ang pakiramdam na maaari mong i-link o na maaari mong isama ito sa loob. At nagbibigay-daan sa mo ito sa script na bagay. At kami ay pagpunta sa dadalhin ka sa pamamagitan ng kaunting JavaScript sa susunod. 

Kaya gamit ang isang library - sa oras na iyong isinama ito, ito ay bilang simple ng literal na pagtawag sa mga pag-andar o pagdaragdag ng mga pangalan ng klase dito. Ang huling bagay na nais namin na makipag-usap tungkol sa mga tuntunin ng library - at ito ay higit pa sa isang teknikal na tala - ay open source paglilisensya. Kaya kapag nakita mo ang mga aktwal na mga aklatan, maaari kang iniisip i tanong ay ito OK na lang ako gamit ang code ng ibang tao, lalo na dahil iyon ang isang bagay na lubhang namin magkano Sinabi mong hindi ginagawa sa kursong ito. 

Kaya sa kaso ng open source sa paglilisensya, ng maraming mga nag-develop - sa sandaling nakasulat sa isang library, na sa tingin nila ay maaaring maging kapaki-pakinabang sa iba pang mga tao - Ipa-publish nito sa web at bigyan ito ng isang lisensya. At isang lisensya talaga sabi ni am ko sa pamamagitan nito pagbibigay ng pahintulot sa iba pang mga mga tao upang gamitin ang bahagi ng software may mga sumusunod na uri ng takda. 

Nagsama kami ng isang link sa isang magandang site upang matulungan kang maunawaan ang mga lisensya sa case patakbuhin mo sa kanila. Karaniwang mga takda ay mga bagay tulad ng ikaw ay malugod na tinatanggap na gamitin ang aking library kaya hangga't mabigyan ninyo sa akin ang credit. Maaari kang gamitin ang aking library kaya hangga't kapag ito Pinaghihiwa hindi mo masisi sa akin. Maaari kang gamitin ang aking library kaya mahaba bilang hindi mo ginagamit ito upang kumita ng pera para sa iyong sarili. Ito ang mga uri ng mga karaniwang takda. 

Para sa mga ito CS50 panghuling proyekto, ang mga ito hindi dapat sobrang may-katuturang dahil ang mga proyekto na gamitin mo guys ay marahil sa halip, isang uri ng, na kilala. Ngunit kapag aktwal mong pumunta out papunta sa mundo at simulang gamitin ang mga library, na maaari o maaaring hindi pati na rin ipinatupad bilang ang ilan sa mga mas sikat na mga bago kami pagpunta sa ay pagpunta sa pamamagitan ng. Ito ay handa na upang madalumat ang mga lisensya at sa maunawaan kung ano ang ibig sabihin ng mga ito. At balik. 

Mike RIZZO: OK. Kaya ngayon ang paglipat patungo sa daloy ng mga halimbawa ng aktwal na CSS. Sa puntong ito sa ngayon, maaari mo Hindi Nakaranas na ito. Ngunit maaaring nakatagpo mo ito sa ang iyong araw-araw na buhay na kung saan ang isang bagay na mukhang isang paraan sa isang browser Maaaring hindi tumingin sa parehong paraan sa ibang browser. 

Ito ay tinatawag na browser browser compatibility. At increasingly ito ay nagiging mas at higit pa sa isang problema, lalo na bilang mga browser tumagal ng higit pa at higit pa kalayaan upang ipatupad ang mga bagay na gusto nila. Kaya sa pagtagumpayan iyon, doon talaga isang mahusay na library na tinatawag na Normalize.CSS. 

Tomas REIMERS: Isinama namin ang link. Sa puntong ito, ito ay kapaki-pakinabang kung mayroon kang ang iyong laptop sa doon tumitingin sa site. At binibigyan ka namin ay ito sa iyo pakanan dahil ngayon lamang ang CS50 panghuling proyekto ay aktwal na pagpunta sa tatanungin ka upang ipatupad ito katulad at sa pamamagitan ng mga browser. 

Kaya lamang upang panatilihing sa likod ng iyong ulo, ito ay isang kahanga-hangang library dahil habilin ito, uri ng, ilagay sa pamantayan bagay. Sa Firefox, isang bagay na maaaring magpakita bilang isang pixel sa kaliwa. At pagkatapos ay maaaring magpasya ang Chrome na talaga ano nilalayong mo ay 10 pixels sa kaliwa. At gusto mong ilagay sa pamantayan na ito. Normalize ang talagang gawin ang isang talagang magandang trabaho ng pagtiyak na ang iyong site mukhang ang parehong buong mga browser. 

Mike RIZZO: Kaya kung gusto naming lamang i-click ang link talagang mabilis at palabas sa iyo kung ano na kamukha, mo Maaari itong i-download gamit ang pindutan ng higanteng Download. O kaya naman hinihikayat ka ko na basahin ang higit pa tungkol dito sa pamamagitan ng pag-click sa link na ito sa ibabang kanang sulok. 

Tomas REIMERS: At kung ikaw talaga i-click ang Read Higit pa doon - i-click ang pinagmulan sa GitHub - makikita mo talaga makita ng open source bigyan ng lisensya sa LICENSE.md doon. At makikita mo dito ay ang napaka-tanyag na lisensya MIT. Muli, kung basahin mo sa pamamagitan ng text, magagawa mong mahanap ito sa site namin na-reference bago at ma- maunawaan ito nang hindi na kinakailangang basahin sa pamamagitan ng legal na hindi maintindihang pag-uusap. 

Mike RIZZO: OK, mahusay. Kaya na-normalize. Nais naming bigyan ka ng na talagang mabilis. Oh, ang mayroon kang isang katanungan? 

Madla: Kaya kapag nag-download mo ito, mo sundin lamang ang code na iyon na mayroon sila sa ilalim ng pindutang I-download? 

Tomas REIMERS: Oo, kaya kapag nag-download ka - 

Mike RIZZO: Oh, iyan ay isang magandang punto. Kaya ang tanong ay kung paano gawin talaga naming i-download ito? Kaya kung click namin sa link, makikita natin na ito aktwal na nagpa-pop up sa source code. Kaya't upang gawin ito, kung ano ang magagawa namin ako ay i-click lamang ang I-save Bilang. I-save Bilang at na dapat ilabas ang isang file. At pagkatapos ay maaari pinili naming i-save ang ito bilang normalize.CSS. At pagkatapos ay ang kailangan mong i-link ito sa - 

Tomas REIMERS: Ang parehong paraan sa iyo mag-link sa anumang iba pang mga file. At sandaling i-link mo ito sa, kung ano ang mahusay na tungkol sa normalize ay ito ay talagang mag-ingat ng lahat ng mga mahirap gumagana sa pamamagitan ng mismo. Kahulugan na wala kang magdagdag ng anumang mga klase. 

Hindi mo na kailangang gumawa ng kahit ano kakaiba. Ito ay normalize nang hindi mo paggawa ng kahit ano pa. Oo, mayroon kang upang maisama ito. Hindi tumutugon ang Google Chrome. 

Lamang ng isang mabilis na bukod - Napansin ko namin jumped sa ito. Ang natitira sa ang pagtatanghal na ito ay pagpunta sa maging isang mabilis na pangkalahatang-ideya. Ang isang survey ng mga aklatan. 

Talaga, ano ang mga ito. Ano ang kanilang ginagawa. Paano ang mga ito ay kapaki-pakinabang. Paano maaari mong ipatupad ang mga ito. Kung nais mong simulan ang pagtingin sa mga ito, sumusunod sa kahabaan, at pagbabasa sa pamamagitan ng mga ito, lubos Gusto ko hinihikayat na. 

Bilang kahalili, maaari kang din sa simulan ang pag-download ng mga ito at kabilang ang mga ito sa isang paningin lamang upang makita kung ano ang kanilang mukhang o ano ang kanilang ginagawa kung mayroon kang ang iyong laptop sa harap ng sa iyo. Kung hindi, maaari kang panatilihing nakikinig sa amin makipag-usap. Kami ay pagpunta sa panatilihin ang pakikipag-usap. At mayroon kaming oras sa dulo, sana ay ipapakita namin talagang makakuha sa pagpapakita sa iyo kung ano ang ilan sa mga aklatan magmukhang. 

Mike RIZZO: Cool. Ang lahat ng mga karapatan, kaya ngayon ay makipag-usap ipaalam tungkol sa Font Kahanga-hanga. 

Tomas REIMERS: Kahanga-hanga kaya Font ay isang talagang malinis at maayos site, lalo na para sa mga ng sa amin kung sino mas artistically may ulo. Pagbalewala ang Font pangalan Kahanga-hanga, nagbibigay ito sa ka ng grupo ng mga icon, na mga napaka kapaki-pakinabang. Kaya ng maraming beses makikita mo ipatupad ang isang icon baka gusto tulad ng isang maganda x kaya na maaari mong isara ang isang bagay. 

O baka gusto ng ilang mga uri I-edit ang pindutan ng may isang lapis pagguhit tulad ng lahat ng tao pa ang may. At na kapag malaman mo na pagguhit ng mga icon ay maaaring maging napaka nakakapagod at mahirap. Font Kahanga-hanga - kung aktwal mong pumunta sa site - ay nagbibigay sa iyo ng maraming mga icon sa ilalim ang mga icon sa itaas. Oo, lamang ang tuktok. Ito ay magbibigay sa iyo ng maraming ng mga icon para sa libre. 

Kaya dito nakikita mo ay mayroon kaming mga bagay tulad ng isang asterisk, bar, isang kidlat tornilyo, isang kalendaryo, isang bug, isang libro, at iba pa. Maaari itong maging napaka-kapaki-pakinabang. Ang paraan isama ka na ito ay isinama mo Literal na CSS file. At pagkatapos mong kasama ang CSS file, ano ang maaari mong gawin ay lumikha ka ng isang tag na tinatawag I. Nag satands para sa na icon na may klase FA nakatayo para Font Kahanga-hanga. At pagkatapos, kahit anong klase gusto mo. 

Kaya kung gusto ko ang isang icon ng plus Square dito mismo, nais kong bigyan ito ang klase FA. At pagkatapos FA gitling plus gitling square. 

Mike RIZZO: Mahusay, OK. 

Tomas REIMERS: At pagkatapos, ang huling CSS library gusto naming makuha sa pamamagitan tayo sinusubukan upang panatilihin itong minimal na sa CSS mga library dahil kami mapagtanto ang pamagat ng pagtatanghal na ito ay JavaScript Aklatan. Ngunit naisip namin na maaaring namin pati na rin ipakilala sa mga iba pang mga library habang pinag-uusapan natin ay tungkol sa mga aklatan. 

Ito'y Google Web Mga Font. At kung ano Google Web Mga Font ay nagpapahintulot sa iyo upang gawin ay ang magdagdag ng mga font sa iyong website, na kung saan ay isang talagang madaling paraan upang gawin itong medyo at upang makilala ang iyong mga hanay mula sa lahat ng iba pa ay kung ito ay may gandang font o kung mayroon itong isang magaling koleksyon ng mga font. Google Web Mga Font maganda hindi tulad ng iba pang mga mga library sa kamalayan na ito ay isang talagang may gabay sa pag-install. 

Kaya kung sinusundan mo ang link na ito, google.com / font, naniniwala ako. Kung mong sundin iyon, mo Maaari piliin ang iyong mga font. Maaari kang pumili sa kaliwa mula sa kapal, tagilid, at iba pa. At pagkatapos, sa sandaling pinili mo ang isa, maaari mong i-click ang mabilis na paggamit. Mag-right doon. Ika-kanan ng box. 

At pagkatapos, mag-scroll pababa. Una sa lahat, bibigyan ka lang nila ng CSS na kailangan mo upang aktwal na naka-link dito. Ito ay mula doon. Maaari mo lamang kopyahin at i-paste na in At ang gandang bagay tungkol sa ang isang ito ay hindi mo talaga kahit na kailangan upang i-download ang file. 

Ano ang ito ay pagpunta sa gawin ay itong ibang mapupuntahan mag-link sa bersyon ng ito ng Google. Kaya pabalik sa kung ano ang ibig sabihin iyon. Nangangahulugan iyon na kapag gumagamit ng Dina-download ang iyong mga file - Dina-download ang iyong pahina ng HTML - ang iyong HTML pahina ay pagpunta upang isangguni ang file na ito. 

Kaya pagkatapos, ang nangyayari sa iyong computer upang makita, oh, ito ay naka-host sa google.com sa halip kaysa sa theirsite.com. Hayaan akong pumunta tanungin ang Google para sa file na iyon. At pagkatapos, ito ay pagpunta sa isama ito halos parang ito ay isang bahagi ng iyong sariling site. 

Tomas REIMERS: Cool. At minsan isama mo na, pagkatapos ay sa isama ito sa iyong CSS, nagbibigay sa iyo ng ang aktwal na linya. Kaya itinakda mo ang pamilya ng font ng ari-arian katumbas ng pangalan ng iyong font. 

Mike RIZZO: OK. Kaya lang tapos na kami sa CSS. At ang ilan sa ikaw ay maaaring iniisip, mahusay, nagkaroon kami ng ilang mga CSS sa CS50 Finance. Ngunit CSS library ay bootstrap. Talaga namin ang Bootstrap ng kaunti sa ibang pagkakataon sa ilalim ng JavaScript dahil sa ay dumarating rin sa library ng Bootstrap CSS na may maraming mga JavaScript na Bootstrap o Twitter - sino ginawa Bootstrap - Ginagamit upang pamahalaan ang lahat ng kanilang mga CSS. 

Tomas REIMERS: sinuman mayroon ba anumang mga tanong sa ngayon tungkol sa CSS sa pangkalahatan? Humihingi kami ng magandang? Kahanga-hanga. 

Mike RIZZO: Kahanga-hanga. 

Tomas REIMERS: Kaya gumagalaw on sa JavaScript. 

Mike RIZZO: Kaya gusto naming makipag-usap tungkol sa jQuery upang magsimula sa. Ay kahit sino nakarinig ng jQuery bago o ginamit ito? Oo, ilang? Kaya kung nagtatrabaho ka lang sa katutubong JavaScript, makikita mo ang iyong sarili pag-type ng maraming mahaba ang tagapili ng maraming. Kaya kung ano ang ginagawa jQuery ay nagbibigay ito ng gandang wrapper para sa JavaScript wika na nagbibigay-daan sa iyo na madaling piliin at manipulahin ang iba't ibang mga elemento sa loob ng modelo dokumento sa bagay ng web page o ang DOM, na sa palagay ko ka guys narinig ng sa magbigay ng panayam sa puntong ito. 

Tomas REIMERS: Kung hindi mo pa naririnig ng ito o kung hindi mo pa napanood magbigay ng panayam pa, ang Dokumento Bagay modelo talaga kung paano ang mga bagay ay kinakatawan. Kaya uri ng hitsura ng HTML tulad ng isang puno kapag aktwal mong iguhit ito. Mayroon kang ang elemento ng HTML sa itaas. Mayroon kang ang ulo at katawan. 

At pagkatapos, sa loob ka na may lahat ng iba pa. Iyon ay tinutukoy bilang ang DOM - Dokumento Bagay Model. Kaya isang modelo na kung saan ay kumakatawan sa mga bagay sa ang dokumento ay isang madaling paraan upang isipin tungkol iyon. At ang isa sa mga dakilang bagay tungkol sa jQuery ay ito talagang gumagawa ng traversing na at pagmamanipula ng mga elemento sa loob na hindi mapaniniwalaan o kapani-paniwala simple. 

Kaya simple, sa katunayan, na ang karamihan ng JavaScript library o kung hindi ang karamihan, sa grand karamihan ng mga bago makikita mo ang tunay na nangangailangan ng jQuery kaya na maaaring tumakbo ang kanilang mga sarili lamang dahil kung hindi ka magkaroon ng jQuery, mo Gusto aksaya ng maraming oras sinusubukang i- malaman kung paano pumili ng mga tiyak na mga elemento at kung paano gawin iba pang mga bagay. At ang iba pang mahusay na bagay tungkol sa jQuery ay na ito ay ang cross browser compatible. 

Kaya tandaan pabalik kapag sinabi namin na hindi ipatupad ang lahat ng mga browser bagay sa parehong paraan? Ito ay totoo kahit sa JavaScript. At ang isa sa mga dakilang bagay tungkol sa jQuery ay na ito detect ang browser at makita ang naaangkop na pamamaraan. 

Kaya kung kailangan mong pumili ng isang sangkap, Maaaring sabihin ng Internet Explorer ikaw ay dapat gawin ito paraan. Firefox ay maaaring sabihin ang tamang paraan ay ganitong paraan. hindi na mahalaga sa jQuery. Kapag sabihin mo sa jQuery upang pumili ng isang elemento ito ay malaman kung paano ito ipagpalagay na gawin ito sa loob ng browser ang gumagamit ay sa kasalukuyan, at pagkatapos ay gawin ito na paraan. 

Mike RIZZO: Kaya hayaan hindi na makipag-usap tungkol sa ang paggamit ng jQuery kaunti. Tulad ng PHP, jQuery ay may isang partikular na pagkamatuwain para sa dollar sign. Kaya makikita mo makita na ang anumang jQuery - well, hindi lahat. Maaari mong minsan ay palitan ang dollar mag-sign na may salitang jQuery. Ngunit sa pangkalahatan, dahil lang sa ito ay mas maikli, sa tuwing nakikita mo jQuery pagiging ginamit magkakaroon ito ay may isang dollar sign. 

Kaya dito kami ay pagpapakita lamang ng isang simula tagapili para sa isang elemento sa DOM. Dito, mayroon kaming ang dollar sign sinundan sa pamamagitan ng bukas na mga panaklong at pagkatapos ay i-quote. At sa loob ng mga panipi pumunta sa aming tagapili para sa iba't ibang mga elemento. Tulad ng sa CSS, kinailangan naming tagapili sa makakapag-style iba't ibang mga elemento sa loob ng pahina. Yaong iba't ibang mga tagapili isalin eksakto sa jQuery at JavaScript, para sa pinaka-bahagi. 

Kaya dito mayroon kaming isang tuldok foo. Kaya kung isipin mo mula sa panayam, ang tuldok ay nangangahulugan lamang ng uri. Kaya ka pagpili namin elemento may klase foo. Kaya kung pumunta ako nang mas maaga at buksan up ang aming JavaScript console dito talagang mabilis nagpapakita lamang ito, kung lamang nagta-type ako ang dollar sign, nakita namin na ito ang ilang function na ay lumalabas. At lamang ito ay tinukoy sa pamamagitan ng jQuery. 

Tomas REIMERS: Para sa mga ng sa iyo hindi marunong, ang console ay isang kasangkapan sa loob ng Chrome, na nagpapahintulot sa iyo na, talaga, magpatakbo ng JavaScript sa kasalukuyang pahina. Ito makikita mo ang hindi mapaniniwalaan o kapani-paniwala kapaki-pakinabang kapag aktwal na pag-debug at mo kailangan na maging tulad ng, kung ano ang kasalukuyang halaga ng ilang mga global variable o ano ay iba pang dahilan? Ito ay uri ng tulad ng GDB na may pagbubukod na maaari mong talaga manipulahin elemento sa pahina sa ito sa isang lubhang mas madaling paraan. At din ito ay hindi, talaga, suriin in gamit mo bago ginagawa nito kahit ano. 

Kaya samantalang, GDB ay maaaring maging tulad ng, ikaw ay bang gusto mong patakbuhin ang susunod na hakbang? Ang console ay sa real. Kaya bilang mga web page ay rendering at paggawa ng kahit anupamang ito ang ginagawa, ang konseho ng ring tumatakbo sa tabi nito. At maaari kang maglagay magbintang code na ito sa console na, na na patatakbuhin sa pahina. 

Mike RIZZO: Kaya na pumasok sa console, Hulaan ko dapat ako sa madaling sabi banggitin kung paano gawin iyon. Sa huling mga problema na maaaring mayroon ka gamit na Chrome na siyasatin elemento mga pag-andar o tingnan ang pahina ng source - at ang mga ay naa-access sa pamamagitan lamang ng karapatan ng pag-click sa pahina o isang partikular na elemento at paggawa alinman siyasatin elemento o tingnan ang pahina ng pinagmulan. Pwede rin kaming ma-access ang JavaScript console nang direkta sa pamamagitan ng pagpili siyasatin elemento. Kaya pagkatapos ay pindutin mo lamang console sa malayong kanang bahagi. 

Bilang kahalili, maaari mo pa ring nawala sa itaas na kanang sulok, na kung saan ay cut off sa screen na ito kung saan mayroon itong tatlong pahalang na mga bar. At kang pumunta down sa mga tool at pagkatapos ang JavaScript console dito kung saan maaaring makita - hindi bababa sa Windows - ang shortcut ay Control Shift J. Kaya pagkatapos kung gusto naming pumili ng isang elemento sa loob ng pahinang ito, tulad ng ipinakita ko bago, ginagawa namin dollar sign bukas parens at pagkatapos ay i-quote. 

Ang isang kagiliw-giliw na bagay ay, sa pangkalahatan, single quote at i-double quotes ay maaaring palitan. Kaya ng maraming mga tao gamitin na lamang ang nag-iisang quote dahil hindi nila mas mabilis i-type kaysa double quote dahil hindi mo gusto mayroon upang i-hold pababa ang Shift. Kaya ko makikita lamang gawin iyon ngayon. 

Kaya gusto kong piliin ang isang bagay may klase. Lalagyan, dahil lang alam ko na isang bagay na sa aming web page ngayon. At pindutin ko ang Enter. At maaari naming makita na ito napiling ito. Kaya ito ay nagpapakita up na ito Nagbalik ang bagay na iyon. Kaya na ang isang pangunahing pagpipilian. Kung gusto naming talagang manipulahin ito, Gusto mo kailangang tumawag sa isang bagay sa pagpili na, na makikipag-ugnay kami sa ibang pagkakataon. 

Tomas REIMERS: Kaya lamang upang tumingin sa na mga mas malalalim na, ito ay hindi naiiba kaysa sa mga tawag sa function na aming ginawa sa C. Ang pangalan ng function na dito ay isang maliit na kakaiba. Ito ay dollar sign. Ito ay lamang ng isang pangalan ng isang function. Mayroong walang espesyal tungkol sa ito ay. 

Mayroon kaming bukas panaklong. Pagkatapos, mayroon kaming ang aming isang argument, na sa kasong ito ang mangyayari sa maging isang string, na kung saan ay isang tagapili para dito. At pagkatapos, mayroon kaming ang aming closed panaklong. Iyan na ang lahat. 

Ito ay hindi na malaking-malaki naiiba. Bagaman, ito ay tumingin napaka-kakaiba. At iyon ay maaaring maging, uri ng, isang malagkit ituro para sa maraming mga tao. 

Mike RIZZO: Kaya katulad, kung gusto naming upang piliin ang isang elemento na mayroong isang ID, ngayon gusto naming piliin sa pamamagitan ng ID sa halip ng klase. Gusto ito ay isang katulad na bagay kung saan kami gawin lamang ang matalim pag-sign para sa ID. Kaya kami ng pagpili dito lahat elemento na may ID bar. 

Tomas REIMERS: At ito ay umaabot. CSS na umaabot. Tulad ng sa CSS, maaari mong piliin ang lahat ng mga link, na kung saan ay may klase foo. Narito, ito ay ang parehong bagay. 

Maaari mong gawin a.foo, na magiging piliin lahat ng mga link na may klase foo. Maaari mong gawin ang isang matalim bar, na gagawin piliin ang link na may ID bar at sa gayon sa at iba pa. Anumang tagapili ng CSS ay hindi isang wastong jQuery tagapili. 

Mike RIZZO: Oo. OK, kaya ngayon sabihin makakuha ng sa ilang sandali ng pagmamanipula ng maaari naming gawin sa ang aming jQuery. Kaya jQuery ay may partikular na uri ng pagtatanda na kung saan namin gamitin na lamang ang dot sa dulo. At maaari mong isipin na ito tulad ng sa C kung paano namin ay may iba't ibang mga structs. At upang pumunta sa mga structs, gagawin mo gumamit ng isang tuldok upang makapunta sa mga ito. 

Ito ay, uri ng, isang katulad na bagay. Tanging ngayon mayroon kaming mga pag-andar sa loob ng ito selector na maaari naming tumawag sa ito. Kaya dito, ang pinakaunang halimbawa maaari mong makita ay isang CSS selector. At talaga, kung ano na ang ginagawa ay ito Nalalapat ang unang elemento ng CSS upang ito bagay na iyong pinili - ang elementong ito na iyong pinili - ng halagang iyon. 

Tomas REIMERS: Kaya isang madaling pagsasalin ng na magiging kung jQuery, talaga, kinuha lamang foo. At pagkatapos sa CSS sinabi, kulayan pula at malapit. Ito ay ang parehong mga ideya. Ano tapos na ito ay ito ay pinili lahat ng elemento ng foo. At pagkatapos ito ay inilapat. Pagsunud-sunurin ayon ng, ang kulay ng ari-arian ay katumbas ng pula. 

Mike RIZZO: Katulad nito, kami ay maaari ring baguhin ang aktwal na nilalaman ng kung ano ang lumilitaw sa HTML ng pahina, na ay talagang cool na dahil ang ibig sabihin nito ang iyong web mga pahina ay maaari na ngayong maging ganap na dynamic na at hindi kailangang maging static na kang mag-print out gamit ang PHP sa pinakadulo simula ng ang pahina na load. Kaya dito kung gusto naming makapagpabago sa aktwal na HTML ng pahina, ginagawa namin ngayon tawagan ang HTML function, kung saan pagkatapos lamang insert namin ang kahit anong tumukoy sa na elemento na aming pinili. Kaya dito kami ay pagpili elemento na may class na foo at pagkatapos ay sinasabi ito ng HTML ito ay halo mundo ngayon. 

Tomas REIMERS: At kapag sa tingin mo tungkol sa ano ang mga kapaki-pakinabang na mga application ng ito, ito ang CSS isa, ang unang bagay na maaari simulan upang isipin ang tungkol ay sa mga tuntunin ng drop down na menu kahit. Maaari mong simulan upang gumawa ng mga bagay tulad ng, kapag isang user hovers sa ibabaw ng tuktok bahagi ng isang drop down na, Gusto mo bang gumawa sa ilalim na bahagi makikita. Mag-right? 

Kaya sa CSS, mayroon kaming mga pag-aari upang gumawa ng isang bagay na nakikita. Mga bagay tulad ng display tutuldok none gagawing invisible. Ipakita ang block gagawing nakikita. O kaya kahit na gusto mong pumunta mas simple, mo May mga bagay na tulad ay katumbas ng kakayahang makita nakikita, at kakayahang makita ay katumbas ng nakatagong. 

At maaari mong simulan upang ipatupad ang mga bagay tulad ng drop down na menu karapatan matapos makakuha ka sa pamamagitan ng ideya kung paano maaari mong malaman kapag nagbukas ito, na aasikasuhin namin sa pamamagitan ng napaka sa madaling sabi. Ngunit maaari naming simulan upang makita ang mga application ng ito. Sa isang katulad na kahulugan, kung ikaw ay upang subukan at magpatupad ng, sabihin nating, isang chat engine at nais mong gumawa ng isang maliit na makaisip ng speech bubble sa tuwing ikaw ay Nakakuha ng isang bagong mensahe, sa sandaling makuha mo ang mga bagong mensahe, maaari kang magsagawa ng kaunti makaisip ng speech bubble sa pamamagitan ng binabago sa HTML ng pahina, i-right? Sa pamamagitan ng pagdaragdag na ang dagdag na speech bubble may dagdag na teksto sa doon. Oo? 

Madla: So gusto mong i-embed ito sa loob ng ang HTML code sa isang uri ng tulad ng isang [Hindi marinig]? 

Mike RIZZO: Mag-right. Oo, susuriin namin na sa ilang sandali. Oo, ito ay katulad ng isang Medyo sa PHP. Hindi eksaktong katulad. 

Ang isang mahusay na pagkakaiba upang gumawa ay kung ano ito ay aktwal na pag-edit kapag nag-edit namin ang pahina dahil hindi ito magiging pag-edit ang aktwal na file na ay pagiging pinananatiling sa server dahil sa mundo hindi dapat magkaroon ng pahintulot i-edit ang iyong mga file. Ito ay lamang ng pag-edit kung ano ang nasa pahina at kung ano ang ipinapakita sa loob ang browser. Kaya't kung ikaw ay i-reload ang pahina pagkatapos, sabihin, ang pagtanggal ng isang bagay bilang namin tingnan ang maaari naming gawin sa pag-alis ng tawag, bagay na gusto pagkatapos ay muling lilitaw. 

Tomas REIMERS: Kaya isang paraan upang isipin ang tungkol ito ay kung ako iyong computer at Mike ay, uri ng, ang server. Ano ang mangyayari ay pupuntahan ko magtanong Mike, hey, maaari akong magkaroon ng isang kopya ng ang web page na? At makikita siya ninyo ako ng kopya nito. 

Hindi, hindi ito ang orihinal na bagay. Ito ay isang kopya lamang. At pagkatapos ay magiging tulad ng, oh, mayroong JavaScript dito. Malinaw, ang dapat kong i-edit ang pahina na maging tulad nito. At ako pag-edit ng iyong kopya. 

Ngunit na hindi effecting ang aktwal na kopya. At kung ako ay upang hilingin sa kanya muli refresh ang pahina, - hey, maaari akong magkaroon ng isa pang malinis na kopya - pupuntahan niya na bigyan ako isa pang malinis na kopya. At pagkatapos, pupuntahan ko gawin ang parehong bagay parang, oh, js ito dito na nagsasabing upang i-edit ito. At ako pagpunta sa panatilihin ang paggawa na. 

Mike RIZZO: Kaya isang talagang cool na bagay na maaari mong gawin sa jQuery ay talaga magdagdag ng iba't ibang mga uri ng ng mga animation sa iyong pahina. Hindi ko alam kung kailanman na iyong nakita kung saan sinusubukan mong i-isang fill ang isang form online at hindi mo punan ang tama ang mga bagay. Kaya isang maliit na bagay ang mga slides down na sa tuktok at sabi mo hindi pa tapos na ito ng tama. Mangyaring subukan muli. At pagkatapos, maaaring ito kahit na pataas ang slide lamang. 

Ginagawang out jQuery ay itinayo sa mga function na gawin ang lahat ng na animation talaga ito, talagang madali. Kaya doon ay unang mawala ng unti-unti ang out function, kung saan Maaari kang tumawag sa isang bagay. At ito ay isang paraan upang baguhin ang CSS ng elemento na sa isang animated na paraan. Kaya ito ay tumatagal ng kahit anong elemento kang tumawag ito fade out sa. At pagkatapos, dahan-dahan ay nagbabago dito ni opacity hanggang sa ito ay tumatakbo nang ganap transparent. 

Tomas REIMERS: Ang iba pang mga sikat isa ay slide pababa, na kung saan ay gumawa isang bagay lilitaw sa pamamagitan ng pag-slide ito pababa. Kaya sa kaso ng sa drop down na menu, muli, kapag nalaman namin kung paano i-detect kapag ito ay nai-hovered sa ibabaw, maaari mo lamang sabihin ito ibaba bahagi slide down na ngayon. At pagkatapos, nais itong lumitaw sa pamamagitan ng pag-slide pababa. 

Mike RIZZO: At pagkatapos ay, kung mayroon kang lamang ang ilang mga uri ng animation sa isip na jQuery ay hindi kinakailangang magbigay ng. Halimbawa, sabihin nating jQuery ang ibinibigay sa iyo ng isang slide down at up na slide. Well, sabihin nating na gusto mo sa slide isang bagay sa mula sa kaliwa o sa mula sa ang tamang uri ng tulad ng CS50 pangunahing pahina ginagawa tuwing kang pumunta sa isang bagong panel. Gusto mo pagkatapos ay marahil na kailangang ipatupad ito sa iyong sarili gamit ang bigyang-buhay pag-andar sa loob ng jQuery. 

Kaya katulad, animate mo lamang. At pagkatapos, sa loob nito gumugugol ito ng diksyunaryo ng iba't ibang mga halaga na kayo ay dapat na pumasa. Kaya dito, kung gusto naming bigyang-buhay ang elemento foo tulad na lapad nito alinman sa expand o mga kontrata sa 80 pixel, depende sa kung anong kasalukuyang ito ay. Gusto naming pumasa lamang na bilang ang argumento sa loob nito. 

Pagalawin din ng ilang mga iba pang mga argumento na maaari kang pumasa ito, halimbawa, ang bilis ng animation na gusto mong bigyan ito. At upang gawin iyon, nais kong sabihin lamang mabilis Google jQuery animate. At pagkatapos, nagdadala up pahinang ito, maaari mong makita ito ay nakuha ng grupo ng mga iba't ibang mga katangian na maaari mo itong ipasa. 

At hinihikayat kitang - kailanman dumating ka sa kabuuan ng isang bagay na hindi mo gusto alam o gusto lamang upang matuto nang higit pa tungkol sa isang partikular na paraan na maaari mong tawagin sa isang bagay - Google lamang ito. jQuery ay lubhang na rin dokumentado. At madalas na beses mayroong ng maraming halimbawa na nila magbigay para sa iyo. Kung mag-scroll down na namin - paraan pababa - na maaari naming gamitin, pati na rin. 

Muli, kapag ang isang developer aktwal na napupunta sa pamamagitan ng pag ng pagsulat ng library, ang mga ito ay karaniwang gusto isang tao na gamitin ito. Kaya katabi ay pagpunta sa maging isang babasahin. At na dokumentasyon ay maaaring maging karaniwan na matatagpuan sa pahina ng proyekto, na kung saan ay bakit Ibinigay namin sa iyo na orihinal na site sa sa simula, na nagli-link sa iyo sa mga pahina ng proyekto sa gayon maaari mong makita na ang papeles. 

Sa karaniwan, ang pahina ng proyekto sa kaso ng [hindi marinig], sinabi ito sa iyo ang mga pangalan ng mga klase. Sa kaso ng JavaScript, nagbibigay ito sa mo ang pangalan ng function. Sa pamamagitan ng ang paraan, kung mag-scroll kami ng hanggang sa tuktok, isang mabilis side tala sa mga pag-andar ay tuwing makikita mo ang isang function na ipinatupad tulad ng ito kasama ang matapang bracket sa gitna, paraan na na ari-arian na ay opsyonal. Lamang sa isang ulo up. Nakita ko ang isang pulutong ng mga katanungan tungkol iyon. 

Kaya dito maaari naming makita na ang Pagalawin tumatagal ng mga ari-arian bilang isang kinakailangang argumento. At lahat ng iba pa ay opsyonal. Side tala - maaari mong isipin na ito, uri ng, tulad ng tao mga pahina. Mga pahina Man ay dokumentasyon para sa C at para sa maraming iba pang mga bagay, pati na rin. 

Mike RIZZO: Kaya't aming natutunan kung paano baguhin ang iba't ibang mga CSS sa pahina, animate ito, at alisin magdagdag ng HTML. Ngunit ang isa sa mga talagang pinaka-makapangyarihang bagay tungkol sa JavaScript at lalo na jQuery - ano ito ay nagbibigay-daan gawin mo ay tumugon sa mga iba't ibang mga elemento na mangyari. Halimbawa, narito mayroon kami isang humahawak ng kaganapan. At na lamang ay nangangahulugan na sa tuwing ito kaganapan ang mangyayari, pangasiwaan namin ito sa isang ilang mga paraan. 

Kaya dito, ang mga generic na jQuery kaganapan handler ay ang tuldok sa. At pagkatapos, ang unang bagay na iyong ibinigay ay kung ano ang kaganapang dapat ito ay nakikinig para sa. Kaya dito, ito ay ang click na iyon kami ay naghihintay para sa. 

Tomas REIMERS: Kung hindi man, mayroon kang sa hover, na kung saan ay isang napaka-tanyag na ng isa. Kaya pabalik sa aking drop down na menu na ideya. Gusto mong magkaroon ng isa sa tuktok hover. At pagkatapos ay maaari mong baguhin iyon. 

Mike RIZZO: Mag-right. At pagkatapos ay, kapag nangyari iyon, ito lamang executes ito function na namin ibinigay ito bilang isang argumento at na ito ng mga alerto sa halo o hi. 

Tomas REIMERS: Kaya sa kaso ng JavaScript, ito ay isang lugar na kailangan namin upang alisin ang ating mga sarili mula sa C. makakaya namin talaga tumagal ng mga pag-andar bilang argumento. At doon ay marami ng mga talaga kumplikadong mga paraan upang gawin ito. Kami ay pagpunta sa i-promote ang isang paraan, na kung saan ay maaari mong tukuyin ang gumana doon. 

Kaya kapag tapos ka na humihiling para sa isang function bilang isang parameter, ikaw ay isa lamang lamang pagpunta upang tukuyin ang pag-andar sa lugar. At ang paraan ng tumutukoy ka ng isang function sa JavaScript ay sa iyo Literal na sabihin function. Pagkatapos, kadalasan, ang pangalan ng pag-andar. Ngunit hindi kailanman kami ay pagpunta upang isangguni ang pagpapaganang ito muli. Kaya mag-iwan namin ito hindi mailarawan. 

Pagkatapos ng panaklong, pagkatapos ang kulot tirante, at pagkatapos ay ang code sa loob na. Kaya naiintindihan namin ito lata maging isang maliit na nakalilito. Kaya bigyan ka namin ng pangkalahatang paraan ng kung ano ang hitsura ng isang humahawak ng kaganapan tulad ng sa ibaba, na kung saan ay sa mga kaganapan. At pagkatapos, ang iyong code sa loob na. 

Mike RIZZO: Mayroon bang anumang mga tanong tungkol dito? Maaari itong maging isang maliit na nakalilito ang unang pagkakataon na makita mo ito. 

Tomas REIMERS: mo talagang nais na buksan up ng isang file at ipakita sa kanila ang ilan jQuery ngayon? 

Mike RIZZO: Oo, ni gawin na ipaalam. OK. 

Tomas REIMERS: Kaya ngayon kami ay sa appliance. At kung ano ang iyong nagawa namin ay kinuha namin ang kalayaan ng paglikha ng parehong isang index.html file, na nagli-link sa isang JavaScript na file. At maaaring buksan up namin ang - oo. Well, ginagawa nito ang dalawang bagay. 

Ang una ay ito nagli-link sa ang JavaScript na file. At muli naming makita na up dito. Nakita namin na sa head ng mga HTML na dokumento, lalo na. Kaya makikita mo doon na namin, talaga, sabihin nating SRC, na ang ibig sabihin ay ang pinagmulan. At iyon ang URL. 

Kaya dito maaari mong sabihin hindi namin Kasama jQuery. At Kasama rin namin ang mga script. Ang iba pang mga paraan upang isama ang JavaScript ay na maaari mong isama ang isang inline script tag bilang mayroon kami sa ilalim kung saan ito sabi uri ng script ay teksto sa JavaScript. 

Kaya sinasabi na namin, makinig, hindi namin tungkol sa upang isama ang isang script. At ang uri ng script na ay JavaScript, na kung saan ay isang uri ng teksto. Napakasimpleng. 

Mike RIZZO: Kaya ito, uri ng, sino ang iyong tanong tungkol sa kung paano namin isama JavaScript sa aming mga file dahil kapag kami ay PHP, ang ginagawa namin ng isang bagay na katulad nito. At pagkatapos, mayroon ang aming mga function na PHP - sabihin nating stock gawin isang bagay na may na - napupunta sa doon. Gayunpaman, ngayon ay mayroon kaming ang mga script tag na namin ibinigay ito, na kung saan ay talagang bahagi ng sarili nito HTML dahil hindi ito faking pagiging isang HTML file tulad nito ay nasa PHP dahil kung aktwal mong pumunta sa at tumingin sa pinagmulan ng pahina, makikita mo ang mga script tag sa doon sa JavaScript nauugnay sa ang mga ito sa na. 

Kaya pagkatapos, kung gusto naming sumulat ng ilang JavaScript - sabihin nating lamang gusto naming baguhin ang katawan dahil sa ngayon wala akong anumang iba pang mga tag na maaari ko talaga i-edit bukod sa katawan. Sabihin nating lamang Nais kong baguhin ang CSS ng iyon. Kaya gagamitin namin sige at pagbabago ang kulay ng ito sa pula. 

Kaya i-save ko ang file. Sabihin bumalik sa aming web pahina, i-refresh, at ito ito ay awtomatikong ginagawa dahil hindi ito mukhang katulad ito naghintay sa lahat dahil tayo ay hindi nakikinig para sa isang kaganapan o anumang bagay tulad na. 

Tomas REIMERS: Kaya kung pumunta namin pabalik sa na maghain sa partikular - ang HTML mag-file - kung ano ang iyong pagpunta upang makita ay mayroon kaming - tandaan na ito ay load, uri ng, chronologically. Kaya mayroon kami muna ang ulo. naglo-load ito ng dalawang mga file na iyon. Pagkatapos ay pumunta kami sa katawan. At nakita namin kumusta mundo. Kaya render namin kumusta mundo. 

At pagkatapos ay ang huling bagay na mayroon kami ay mayroon kaming script tag. Kaya ito ay nagpapatakbo ng script tag dahil ito ay hindi na nagsasabi ito upang maghintay para sa kahit ano. At iyon ang pinaka-basic paraan upang magpatakbo ng JavaScript. 

Sa sinabi na, maaari mong ilagay ang script tag up sa header lamang upang ipakita sa puntong ito? At tumakbo na. Kami ay pagpunta sa mapansin na ito ay hindi palitan ang kulay. At ito ay isa sa mga problema ng JavaScript ay na bagay ang na-load sa isang magkakasunod-sunod. 

Kaya sa oras na iyon na code tumatakbo ay, piling namin - bumalik - ang katawan ng tag. Ang katawan ng tag na ay hindi pa umiiral dahil JavaScript ay nasa linya na may HTML. Kaya ang browser ay tulad piliin ang katawan. Walang pa tulad bagay. Kaya maaari naming huwag pansinin iyon. At panatilihin namin ang pagpunta. 

At pagkatapos ay tukuyin kami ng isang katawan ng tag. Ngunit na hindi kailanman ay makakakuha ng update. Kaya kapag naka-pagpapatupad ng script mga tag, tiyakin na inilagay mo sa pagkatapos ng tag katawan. Susunod na slide. 

Mike RIZZO: OK. Kaya nagbago kami ng isang bagay. Ngunit hindi ito mukhang ito ay tumugon sa sa amin sa lahat dahil ito lamang uri ng ginawa ito sa lalong madaling-load ito sa pahina. Kaya ngayon, sa halip na ginagawa ito, bakit huwag magdagdag kami ng isang handler ng kaganapan. 

Kaya hayaan gawin ng isang bagay sa katawan muli. At sabihin nating gawin namin ito sa - i-click. Susubukan naming magdagdag ng isang function. 

Pagbabago Sabihin: Tomas REIMERS ito ay muli ng kulay sa pula. Bakit hindi? 

Mike RIZZO: Oo, sabihin pagbabago nito 'kulay muli sa pula. Ayos lang. Kaya i-reload ang pahina ipaalam. OK, nakikita natin - tulad ng inaasahan, ito ay hindi pa maging pula. Ngunit pagkatapos ay maaari naming magpatuloy at i-click ito. 

Tomas REIMERS: At ito ay maging pula. 

Mike RIZZO: At ginagawa nito maging pula tulad ng inaasahan. 

Tomas REIMERS: At makikita namin kung paano maaari naming simulan upang makabuo ng napaka basic pakikipag-ugnayan. Iba pang mga bagay na maaari gusto naming gawin ay, kung hindi namin nais na gumawa ng katawan kulayan pula, ay gumawa ng HTML ipaalam kulay pulang background. Kaya lang nito ay kapareho ng CSS. 

At kapag baguhin namin ito, maaari naming makita na ito napaka dramatic na epekto ng pagbabago ng buong pahina. Kaya muli, kung ikaw ay pagpapatupad ng mga bagay, maaari kang magkaroon ng isa sa mga bahagi na kung saan ay sinadya upang mai-click. Hayaan ang mga sinasabi ng isang pindutan Lumabas at isang buong iba pang mga sangkap, na kung saan ay nilalayong tumugon. Kaya nais mong alisin ang isang window kapag nangyari iyon. 

Mike RIZZO: OK. Tulad ng isang halimbawa - hindi mo makakuha upang makita ito nang mas maaga - Kukunin ko na lang ipakita sa iyo kung ano ang hitsura nito i kapag itago kami ng isang bagay. Kaya makikita ba akong magpatuloy at huwag pataas ang slide. 

Tomas REIMERS: Gustong balutin na sa isang uri ng talata bago namin gawin iyon? 

Mike RIZZO: OK. Oo, bakit hindi namin gawin iyon kaya lang maaari naming piliin ito ng kaunti pa. 

Tomas REIMERS: At sabihin bigyan ito ng isang klase. 

Mike RIZZO: Oo. OK, ni makita kaya hayaan. Sa halip ng pagpili ng aktwal na katawan ngayon, lamang ang makakakita pipiliin ko ang lahat ng bagay na may klase kumusta, na kung saan dito namin mayroon lamang isang bagay. Kaya hindi namin dapat magkaroon upang mag-alala tungkol sa na. 

Kaya ire-refresh ko ito. Makikita ba akong magpatuloy at i-click ito. At ito, uri ng, ginawang isang kakatwang mga slide up bagay, na hindi tumingin na kaakit-akit. Sa pangkalahatan, ang mga ito ang hitsura ng medyo maganda. Ako hulaan, ito - para sa ilang mga dahilan - ang hindi. Kukunin ko na lang gawin ang isang fade out kaya maaari kang tumingin sa na masyadong. Karamihan nicer. 

At pagkatapos ay, kung buksan ko up ang JavaScript Console muli at gusto naming makita kung ano ang ito mukhang kapag fade namin ito in Ngayon, tawagan ko lang ang fade in sa ito. At ito fades bumalik in 

Katulad nito, talaga namin ma-ring magpasa isang argumento sa fade in o fade out, na kung saan ay, uri ng, ang bilis ng ito. Kaya sabihin sige at sabihin ang gusto namin ito upang pumunta mabagal fade in Kaya hulaan ko ito tila pa rin medyo mabilis. Ngunit ito ay mas mabagal kaysa sa dati. 

Tomas REIMERS: At kung gusto mong mahanap ang ang higit pa tungkol sa mga bagay na ito, muli, pumunta lamang sa dokumentasyon jQuery, kung saan binigyan mo kami, at basahin sa pamamagitan ng mga ito. Idokumento nila ang kanilang mga pag-andar hindi mapaniniwalaan o kapani-paniwala na rin. 

Mike RIZZO: OK. Kaya hulaan ko sabihin bumalik sa ito. At maaari kaming makipag-usap tungkol sa aming mga huling pahina. Well, maaari naming tapusin na may Bootstrap. At pagkatapos ay gagamitin namin buksan up ito para sa ilang mga katanungan. At kung ikaw guys ay may anumang mga ideya na gusto mo bang subukan upang ihagis up at makita kung maaari naming ipatupad ang mga ito gamit ang JavaScript mabilis. 

Kaya talagang mabilis tungkol sa Bootstrap, na Awtomatikong kasama sa ang iyong huling problema itakda sa CSS folder at talagang naka-link sa sa iyong header.PHP. Kaya mo maaaring idinagdag klase na ay tinukoy sa loob Bootstrap dito. At sana ay awtomatikong naka-istilong naaayon ang mga bagay. 

Tomas REIMERS: Kaya Bootstrap ay isang napaka- mahiwagang bagay na binuo ng mga tao sa Twitter. At kung ano ito ay sinadya upang gawin ay - bago website ay talagang mahirap upang gawing Inaasahan maganda, lalo na kapag namin ay may ng maraming karaniwang mga bahagi. Kaya ng maraming mga pindutan sa web ay tumingin sa parehong. 

Ang isang pulutong ng mga patlang ng teksto ay maaaring gawin sa magmukhang mas mahusay kaysa sa karaniwang teksto field mo marahil malaman mula talaga lumang mga website o talagang hindi maganda ang ginawa mga website, na tumingin lamang tulad ng literal teksto ng mga kahon nang walang anumang anyo ng teksto anino o anumang uri ng magaling na balangkas. Kaya kung ano Bootstrap ginawa noon ay sinabi ito, mahusay, mayroon kaming ng maraming karaniwang mga estilo. Bakit hindi gumawa kami ng isa sa karaniwang mga hanay ng mga CSS at isang karaniwang hanay ng mga JavaScript bilang na rin, na maaaring estilo ito bilang ay at kung aling mga Maaari bigyan ang mga tao ng mga bagay tulad ng drop down na menu, na maaaring bigyan ang mga tao mga bagay tulad ng modals. 

Modal ay kung ano ang nagpa-pop sa ibabaw ng pahina sa tuwing mahigpit na ito ay nagsasalita isang bagay, na inhibits pa pakikipag-ugnayan hanggang sa iyo makipag-ugnayan sa ito. Isang bagay na tulad nito ay, sigurado ka ba gusto mong tanggalin ang bagay na ito? Hindi mo maaaring talagang gumawa ng kahit ano pa man hanggang sa ikaw ay sabihin ninyo ang oo o hindi. 

Kinuha nito ang lahat ng ito at ito package na ito sama-sama at sinabi, dito pumunta namin. Maaari na ngayong gamitin ang mga tao. At maaari mo itong mahanap sa ibabaw sa getbootstrap.com. Ito ay awtomatikong maisasama sa loob itakda ang iyong huling problema. At ikaw ay higit sa maligayang pagdating sa gamitin ito sa iyong huling proyekto. At kung gusto mong sundin na link upang makakuha ng Bootstrap. 

Makikita mo dito ay ang Bootstrap CSS site. Makikita mo ang Bootstrap. At kung mag-scroll ka pababa, makikita mo ang kung paano i-download ito, kung paano i-install ito, at iba pa. 

Mike RIZZO: At maaari mo ring, nang kawili-wili sapat, i-customize ito sa maging kahit anong uri ng mga tema na gusto mo. Alam ko na ang isang bagay na ginawa ko para sa aking huling proyekto noong kinuha ko ang klase ay ipasadya ito. Ang isang iba't ibang mga bersyon ng Bootstrap na nagkaroon ng ibang color scheme at ibang mga hugis ng ilang mga iba't ibang bagay. Kaya Hinihikayat ko kayo upang i-play na may na. Ito ay uri ng masaya na gawin. 

Tomas REIMERS: Naghahanap sa tuktok muli, ito ay halos kapareho sa Font Kahanga-hanga site. Ang isang pulutong ng mga papeles ay magsisimula sa mukhang katulad kapag ikaw ay nakita sapat ng ito. Kaya dito mayroon kaming ang CSS bahagi ng ito. At makikita mo kung paano ito Maaari style bagay. Kaya kung nag-click ka sa mga talahanayan, halimbawa, maaari mong agad na magsagawa ng medyo talahanayan sa pamamagitan ng simpleng pagdagdag ang klase talahanayan upang ito. 

Parehong bagay para sa mga pindutan. Kung nagdagdag ka lang ang klase BTN at BTN default o BTN pangunahing, maaari mong kumuha ng anuman sa isa sa mga button na ito may mga pre-made na mga estilo. At pagkatapos ay, kung ikaw ay naghahanap para sa isang bagay na mas kumplikado kaysa lamang restyling ano w mayroon ka, sa paglipas ng sa ang tab na JavaScript sa buong tuktok namin magkaroon ng isang bungkos ng mga bahagi. 

Kaya dito mayroon kaming mga transition, modals, dropdowns, mga tab, at tooltip. Isang tooltip ay kung ano ang nagpa-pop up sa ilalim ng iyong mouse kapag hover ka sa isang bagay. Popovers, mga alerto, mga pindutan, collapsible accordions ay kung ano ang Karaniwang ang mga ito ay tinatawag na. Carousels, na pumitik sa pamamagitan ng tulad ng mga imahe. 

Kaya mga ang mga bahagi ng Bootstrap. Gusto ko hinihikayat ka upang lubos na pumunta tumingin sa kanila. Mayroong isang bahagi ng JavaScript at isang bahagi ng CSS. Huwag mag-atubiling gamitin ang mga ito bilang habilin mo. Hindi namin pagpunta sa pumunta ng masyadong maraming sa mga ito dahil sa tingin namin ang dokumentasyon talaga magaling. At oo. Mayroon ba kayong anumang mga katanungan tungkol sa na? 

Mike RIZZO: Kaya bilang ay talagang mabilis gilid, ang disenyo ng web page na ito na mabilis naming ilagay-sama para sa ang pagtatanghal na ito ay talaga tapos mo ng gamitin Bootstrap. Tulad ng iyong nakikita, kapag nag-click kami sa mga iba't ibang mga tab, kami ay hindi kailanman talaga Aalis ito kasalukuyang pahina index.html. Kaya kung ano ang mayroon kami ay naiiba divs sa loob ito index.html. At pagkatapos, sa tuwing i-click kami ng ibang tab, lamang ito ay ang pagbabago na nagpapakita ng isang tao. 

Kaya nang naaayon ito posisyon ang mga ito, nagbabago ang HTML ng pahina upang ang ng kasalukuyang tab ay minarkahan bilang aktibong kaya ito lumilitaw naiiba at hitsura talagang maganda. 

Tomas REIMERS: Kaya na ang lahat ng tapos nang walang amin pagsusulat ng halos anumang CSS. Kami rin ng isang header sa tuktok, kung saan ang mga kulay ay sa pamamagitan ng sa amin. Ngunit ang aktwal na paglalagay ito sa tuktok ng pahina at sa paggawa ng ito scroll ay Bootstrap. At pagkatapos ay kahit na para sa isa pang library - ito ay hindi isa usapan natin ang tungkol ngunit isa maaari mong google kung gusto mo. Ito ay tinatawag na prettify.js. At ito ay syntax-highlight ang iyong code para sa iyo gamit ang parehong CSS at JavaScript. 

Ang huling bagay na nais namin na makipag-usap tungkol sa bago namin ilabas out mo papunta sa mundo upang tumingin sa mga aklatan upang malaman kung paano gamitin ang mga ito at sa, sana, basahin ang dokumentasyon at makita kung ano ang pangangailangan ay kung paano hanapin ang mga library. Kaya ang una ay hindi namin lamang pagpunta sa itulak Google. Pumunta sa Google. 

Iyon ay literal ano ang ginagawa namin kapag kami kailangan na gawin ang isang bagay ay namin ang Google. Mayroon bang isang JavaScript library na ay nagbibigay-daan sa akin upang manipulahin ang oras sa isang kapaki-pakinabang na paraan? Kaya kung alam ko na ang ilang mga gumagamit paglikha ng isang account dito, at ito ay ang kasalukuyang oras, paano ko makalkula ang pagkakaiba sa na nang hindi na kinakailangang kalkulahin ito sa aking sarili? Kaya talaga ito ay isang pangkaraniwang bagay, JavaScript oras library. At dito namin Moment.js-- ang isa pinakasikat. 

Kung kailangan namin ng isang library upang manipulahin ang isang bagay tulad ng kulay upang ma- bumuo ng grupo ng mga random na mga kulay - marahil, upang bumuo ng isang estilo o isang bagay - maaaring namin ang Google ng isang bagay tulad ng Kulay ng JavaScript library. At ako bang gusto namin na magpa-pop up sa isang libo at isa sa mga ito. Maaari kang basahin sa pamamagitan ng mga ito. 

Kaya karamihan ng mga bagay - kapag nakita mo ang mga ito - pupunta-host sa isa sa mga kung aling mga site host code. Sila ay handa ang ilang mga popular na mga bago. Ang pinaka-tanyag, sa pamamagitan ng malayo, ay github.com. At kung pumunta ka sa GitHub ito ay talagang kung saan ay naka-host normalize. Kaya kung nais mong bumalik sa isa na. Ipakita sa kanila na. 

Mike RIZZO: At iyan ay talagang kung saan ito ay naka-host din, kung napansin mo. 

Tomas REIMERS: Oo. Kaya kung kang pumunta sa paglipas ng sa normalize at pumunta sa GitHub. Nagawa ay na? 

Mike RIZZO: kaunti Iyon pusa bagay ay ang simbolo GitHub. 

Tomas REIMERS: Oh. Kaya GitHub ay gumagamit ng isang pamamaraan na tinatawag na Git sa code ng tindahan. Ay hindi mo alam kung ano na o ito frightens mo, na fine. Hindi mo na kailangang malaman kung ano ang Git ay dahil may isang pindutang I-download GitHub sa kanang ibaba. 

Ang iba pang mga kapaki-pakinabang na bagay upang malaman tungkol sa GitHub ay karamihan ng mga produkto ay magkakaroon ng read akin. At kung hindi sila magkaroon ng isang website, ang basahin ay akin makipag-usap tungkol sa kung paano mo i-install ito, kung paano mo gamitin ito, ano ito ginagawa, at iba pa, at iba pa, at iba pa. Ano naging kami talaga naglalakad ka sa pamamagitan ng. 

Mike RIZZO: sa pagtigil sa Internet. 

Tomas REIMERS: Iyon ay pinong. Ang huling dalawang mga bagay na gusto naming makipag-usap tungkol sa - na-usapan natin ang tungkol sa Git - ay sa pag-troubleshoot. At ang isang ito ay hindi bilang may-katuturan para sa ang panghuling produkto bilang ito ay kapag nag-iwan ka 50. At kapag nagpatakbo ka sa mga produkto pagpapatupad ng mga aklatan o pagpapatupad ng iyong sariling mga proyekto, ka ng pagpunta upang magkaroon ng mga katanungan o ikaw ay pagpunta upang tumingin para sa mga tanong. 

Muli, ang Google ito. Iyon ay literal ano ang ginagawa namin. Ito ay pagpunta sa tunog ulok. Ngunit nang literal, ang Google namin ito. At muli, isa sa mga unang bagay makikita mo karaniwang tumakbo sa ay stackoverflow.com, na kung saan ay isang kahanga-hangang tanong at sagot paningin. 

Ito ay kahanga-hanga ang parehong dahil maaari kang i-post ang mga katanungan at maghanap para sa sagot ngunit din dahil ito ay mayroon ng maraming pre-populated na nilalaman doon. Kaya karaniwan kapag ka ng Google ng programming tanong sa loob ng unang ilang mga hit ay maaaring nakalikha ka na tumakbo sa ito sa panahon ng iyong mga hanay ng problema. 

At pagkatapos, ang huling talagang panandaliang bagay ay JSFIDDLE, na kung saan ay may - na ngayon hindi namin nai-paggawa ng maraming trabaho sa JavaScript HTML CSS. JSFIDDLE ay isang web app, na kung saan talaga nagpapahintulot sa iyo na dalhin ang iyong HTML, IYONG JavaScript ilalim kaliwa, at iyong CSS kanang tuktok. At pagkatapos ay maaari itong lumikha ng isang mabilis na render ng ito at makita kung paano ito nakikipag-ugnayan. Ito ay napaka-kapaki-pakinabang kapag ang mga tao ay sinusubukang na gawin ang isang patunay ng konsepto tulad ng ito ay kung paano gagawin mo gawin ang isang drop down menu. Siguro isang mabilis na alisan ng takip o kahit ano. 

Mike RIZZO: Kaya't sabihin pumunta Magpatuloy at i-click ito. Isang maikling paalala - samantala, bago namin paggawa sa pag-click. Ginagawang out JCorey Korea ay mayroon ding isang built sa handler ng kaganapan ng pag-click na ito Ginagamit ng dahil lang sa figure na ito ikaw ay pagpunta sa nais na gawin ng maraming mga bagay kapag gusto mong i-click ang isang bagay. 

Katulad nito, mayroon din itong isang hover. Subalit upang makuha ang buong saklaw ng mga, tingnan sa jQuery dokumentasyon at gawin ito. Ginawa ko ng isang bagay bobo dito. 

Tomas REIMERS: Kaya Mayroon akong isang talagang mabilis programa dito mismo, na nagsasabing na pindutan sa pag-click. Pagkatapos kami ay may isang para sa loop. Para i Mababa sa 404. Lamang Ito ay pagpunta sa pop up mga mensaheng alerto. 

Mike RIZZO: At kung ano ay ang code 404 nakatayo para sa HTML? Matandaan ba? Hindi natagpuan, i-right. Chrome nagdagdag din ito kapong baka bagay kung saan maaari mong - 

Tomas REIMERS: Dahil ang mga taong katulad Sinimulan ni Mike ginagawa ito ng maraming at nakakainis na mga gumagamit, na nagpapahintulot sa mga mong makakita ng impormasyon. 

Mike RIZZO: Oo. 

Tomas REIMERS: mayroon kaming Huwag anumang mga katanungan tungkol dito, tungkol sa JavaScript mga aklatan, paghahanap ng mga aklatan, o mga hitsura kung ano ang web development tulad ng sa totoong mundo? Nagpapatakbo ka up kami laban sa oras. Kaya hindi ako sigurado kami ay pagpunta upang magkaroon ng panahon upang ipatupad maliban kung ito ay talagang mabilis. Sigurado namin mahusay? 

Mike RIZZO: Kahit ano ka guys gusto upang makita ang talagang mabilis sa, tulad ng, dalawang minuto o mas mababa? 

Tomas REIMERS: Kahit ano maaari naming linawin? Paano sumulat sa - 

Madla: [hindi marinig]? 

Mike RIZZO: Oo, kaya that's - 

Tomas REIMERS: Maaari mong pindutin lamang Control-U sa website. 

Mike RIZZO: Oh, ako ay hindi alam na. 

Tomas REIMERS: Sa tingin ko, oo. Control-U. Oo. 

Mike RIZZO: Oh, kaya iyon ang code para sa website. Ngunit kung ang iyong aktwal na nais upang i-download ang aming mga file at ang lahat ng bagay, ito ay naka-host sa github.com 

Tomas REIMERS: iwa ang aking pangalan - Tomas Reimers - slash CS50 gitling seminar. 

Mike RIZZO: At maaari mong hanapin ang lahat ng bagay doon. 

Tomas REIMERS: Ito ay kung ano GitHub kamukha, sa pamamagitan ng mga paraan. Kaya muli, kapag nakita mo ang isang open source proyekto, karaniwan, ang mga ito ay maging isang read ako doon na maaari mong basahin. At kung pumunta ka pabalik, mapapansin mo na mayroon kang ang pag-download zip, na daan sa iyo upang i-download ang pinagmulan code upang isama ang ng produkto sa iyong sariling mga bagay. 

Mike RIZZO: Oo, at kung mag-click namin lamang sa index.html talagang mabilis - 

Tomas REIMERS: Makikita mo dito ang source code para sa aming website. 

Mike RIZZO: Gayundin, Nakalimutan ko ang upang itulak karapatan bago na may malaking talahanayan ito kasama, ngunit mayroon ding isang talahanayan ng chmods na namin kasama para lamang sa iyong kaliwanagan. Ngunit kung mag-scroll namin ang lahat ng paraan down sa ibaba, kami ay hindi talagang gawin napaka magkano ang JavaScript bagay-bagay sa lahat na may ito. Ito ay eksklusibo mula sa lahat ng bagay bagay na namin ay may. 

Kaya salamat sa iyo guys para sa darating na at nakikinig. Umaasa kami na ito ay talagang kapaki-pakinabang. Kung mayroon kang anumang mga kaugnay na JavaScript mga katanungan o nais lamang na makipag-usap tungkol sa ano pa tulad ng kung ano ang iba pang mga cool na bagay maaari mong gawin sa JavaScript, nais naming pag-ibig -usap sa inyo. 

Tomas REIMERS: Kung mayroon kang isang katanungan tungkol sa iyong proyekto o kung maaari itong maging katuturan, ipapakita namin marahil manatili sa paligid Medyo matapos na ito. Ngunit bukod sa na, mayroon isang magandang weekend. 

Mike RIZZO: Oo, magsaya. Magkita guys. 

Tomas REIMERS: Tingnan ang Ya.