TOMAS Reimers: Kaixo, guztioi. Nire izena Tomas Reimers. MIKE Rizzo: Eta naiz Mike Rizzo. TOMAS Reimers: CS50s TS bi gara. Eta gaur mintegian liderra ari gara JavaScript eta web apps CSS. Batera jarraitu nahi baduzu, link eskubidea da han. Eta ez da jarri nahi baduzu ordenagailu laburki on? Ez dago esteka. Gune txiki bat, estekak ditu da baliabide guztiak izango goaz gaur zuk seinalatuz eta, gainera, asko du guk idatzitako informazio baliagarria irakurri sakonera gehiago denean atzera egin duzu, eta gogoratzen saiatzen ari zaren zer zehazki zuen, esaten dugu zer zinen , buruz et cetera hizketan. MIKE Rizzo: Guztiak eskubidea. Hargatik hasteko. TOMAS Reimers: Beraz hasi nahi duzu? Ados. MIKE Rizzo: Bai. Beraz lehenik zabal batekin hasi nahi izan dugu internet buruzko ikuspegi orokor eta motatako fitxategia webgune diseinatzeko. Aurkezpen honetan ez dugu nahi, bitartean Ikusteko Javascript-a sartu asko askoz sartu geroago, off hasteko ekin nahi izan dugu besterik gabe, mota, bezalako hegazti bat begi ikuspegia zer web orri bat da, eta nola dagoen ra bat diseinatzeko pentsatu Hasieratik webgunea. Beraz, guys duzu puntu honetan - berarekin Ostiral gauean izanik - izan behar dute Zure CS50 finantzak aurkeztu arazoa ezartzen du. Zorionez, duten zapore ona izan zen zer dagoen web programazioa izan daiteke. Baina hemen, mota, eman nahi dugu Gustu beste duzu, baita. TOMAS Reimers: Beraz, zer laburpena gertatzen da, zure URL idatzitako zure web nabigatzailea, URL hori lortzen Gora begiratu ordenagailuan. Eta zure ordenagailuaren konektatuta ordenagailu bestera, Horrek web acoge. Ados, beraz, joan google.com zuk, zu Google-en bat konektatutako ordenagailuak, horrek du google.com fitxategiak. Fitxategi zehatz baten ondoren, galdetzen du. Beraz, joan duzu bada - Ez dakit - example.com / index.html edo / test.html, egiteko eskatu zaren fitxategi zehatz duten. Eta web zerbitzari joan itzuli nahi duzu. Ondoren, behin fitxategi hori bidez joan - behin Oraindik ordenagailu lortzen dituen fitxategia - nik hasteko Web orri bat eraikitzeko. Beraz, orain HTML fitxategia dauka, moduko den bezala web orriaren egitura. HTML fitxategia izan ere erreferentzia CSS fitxategiak, zehaztu zein web orriaren estiloa. JavaScript fitxategiak, hau definitu Web orri elkarrekintza. Irudi fitxategiak, diren irudiak besterik. Eta beharbada beste HTML fitxategiak lotzen, eta gero bisita dezakezu. MIKE Rizzo: Ados, handia. Zu guys guztiak, agian, handiz sortu zure herriko ostalari zure makina birtuala. Eta hori besterik ez, mota, da tokiko duen ordenagailu acoge bakarrik domeinua zuretzat propioak IP helbidean. Beraz, horren barruan, gero gehitu dezakezu da zure web-orriak egin. Esan nahi dut, CS50 Ogasun, izan beharko zenituzke erantsia HTML orrialde batzuk, diren, ordenatzeko, PHP Wrapper bilduta. Baina, azken finean, zer da zure PHP orri ziren outputting HTML zen. Baina atzera pentsatzen hasieratik nahi pset du, 'ezarrita izan genuen guztia baimenak, ezta? Beraz, hau, besterik gabe, funtsean, aukera ematen dizu, badakizu gurekin nork irakurri, idatzi, eta, seguru exekutatu fitxategi bakoitzean. Hm - Beraz, azkar bat egin da joan? TOMAS Reimers: Beraz, goazen demo azkar bat egiteko. Beraz, besterik gogorarazteko, duzunean Google-en ordenagailu konektatu - duenak - eta fitxategi bat eskatu, ordenagailuan lehen ziur baimendutako ari zarela egin behar benetan fitxategi hori ikusi edo irakurri fitxategia ezin duzu besterik eskatu duelako ordenagailu horretan fitxategia edozein, ezta? Duten segurtasun arriskuren bat izango litzateke. Beraz, fitxategi sistemak erabiltzen ditugun bezala, on CS50 tresnaren honetan, hiru Jende general nor izan daiteke zerbait baimenik. Lehen benetako da fitxategia esan zuen jabeak. Bigarrenean taldearen dela fitxategiaren jabea. Ez dugu nahi zentratu joan gehiegi duten on askoz. Eta azken gauza da, ordenatzeko, bezalako mundu edo besteek nor den bezala da fitxategia duten espezifikoak eta ez du Edozein haren gainean jabetza-eskubiderik. Beraz jabeak badugu, talde, eta, ondoren, mundu. Eta, ondoren, talde horietako bakoitzeko, zu hiru baimen bat izan daiteke, Ados, edo horietako bat baino gehiago. Irakurritako baimenak izan dezakezu. Baimenik izan dezakezu. Eta exekuzio baimenak izan dezakezu. Beraz, benetako fitxategi mota dagokionez, irakurri baimena benetan irakurketa bezalakoa da fitxategiaren edukia. Eskubidea baimen bat da, idatziz fitxategia esan nahi. Exekutatu baimen bat dago martxan da denean bat exekutatu duzu egiten duzun bezala artxibatu Zure CS50 proiektuetan. Fitxategiak pentsatzen ari gara beraz, bezalakoa denean HTML bat irakurri behar dugu fitxategia, munduan izan behar duen irakurtzeko modukoa, ezta? Ustezko, jabea ere nahi fitxategi hori editatu ahal izateko. Beraz, jabea izan behar joan irakurtzeko eta idazteko baimenak. Ez benetan behar dute exekutatu. Taldea, ari gara tratatzeko joan oraingoz mundua bera. Beraz irakurritako baimenak behar dute. Baina ez dute idazteko behar edo exekuzio baimenak. Eta, orain, atzera uste ohia nahi dugu Psets, zer gara konturatzen da, mota hauek bitarraren itxurarik, ezta? 1 bai dago. 0 ez. Eta guk benetan itzuli ahal izango hau bitarra. Beraz bitarretan 110 6 izango litzateke. 100 4 izango litzateke. Mundua bera. Beraz zenbakia you for lortuko lituzke honen baimenak 644 izango litzateke. Behar dela uste duzu Eta bada: MIKE Rizzo zerbait chmoded duzu, uste dut eman arazoa dute ezarri Bertan egin ahal izango duzu adibide chmod 644 antzeko zerbait eta ondoren fitxategi izena. 644 izan ondoren, gaur ikusi ahal izango duzu zuzenean non datorren. Beraz, espero que hace apur bat argiagoa. Eta gero zuk lasaia en argitasuna - oh yeah, hemen hau da berriro. Beraz, 600 gero litzateke besterik adibide izan eman dugu hemen non jabeak ditu irakurri eta baimenak berriz taldea eta mundua ez dute baimenik fitxategian sartzeko. TOMAS Reimers: Eta gero azkar bat behar dugu baimenak komun zerrenda. Beraz, direktorioak, nahi duzun benetan chmod 711. Azkar alde batera - direktorio bat behar egiteko exekutatzeko baimena esan nahi du gai izan direktorioa ireki. Irudiak, CSS, JavaScript, HTML beharrak 644 delako, funtsean, mundu beharrak irakurtzeko baimenak. Eta PHP, eta horrek you guys ikusi Ez dugu, horri buruz hitz egiten, nahiz zorrozki da normalean batera chmoded baimena 600 Da exekutatu duelako jabearen baimenak. Gutxienez tresnaren hegaletik. MIKE Rizzo: Beraz, ez baduzu zehazki zehaztu zein fitxategi mota benetan ezartzeko nahi duzun Aurkezpen honetan gora - hau arazo bat izan genuelako guztia ez zen behar bezala chmoded - , mota, bat lortzeko ari zaren debekatutako error duten webgunean ez du benetan baimena edozein izanda fitxategia sartzeko atzitu nahi duzun. Eta, jakina, konpon daitezkeen - bezalako arazo girotuta - aldatuz baimenak egokian. TOMAS Reimers: Eta azken iruzkina Azkar tokiko garapen da - dugu ekarri hau, baina, nahi besterik ez dugu berriro ekartzea gora - zerbitzari bat eskatu duzu bada - beraz tokiko ostalari, adibidez, com edo dena delakoa. - eta ez duzu fitxategi zehatz bat zehaztu, Zure ordenagailuan va fitxategia behar da index.html izeneko eskatu. Edo hori ez badago, index.php. Cool. Beraz, hori guztia laburpena besterik, zorionez, hori dugu estalita atalean, eta hitzaldi, eta beraz CS50 urrun. Eta orain ari gara hitz egiten hasteko zehazki buruzko liburutegiak. Javascript eta CSS liburutegiak web apps. Beraz arrazoi azkar bat zergatik behar dugu liburutegiak programazioa da - hor arazo asko programazio, leihoa mantentzeko eta horrek berriro, eta berriro, eta berriro. Nabarituko dezakezu duten webgune asko beherakada izan behera gaitasuna behar menuak, adibidez, edo gaitasuna behar Oso estandarra botoia eduki behar estiloa, hau agian ez da gauzarik errazena. Orain arte HTML sartu hasten zara, duzun konturatzen botoiak can benetan itxura benetan itsusiak baduzu ez ezer egin. Beraz, pertsona asko idatzi dute liburutegiak izeneko. Eta testuinguru honetan, Oraindik dute ere marko deitu. Erabili goaz du bi interchangeably. Eta zer dira, funtsean, ari dira kode zati premade - bai CSS edo JavaScript - duten kentzen asko taldea coding duzu. Beraz, aurredefini klaseak sorta bat edo aurrez definitzen funtzio sorta bat Ikusteko Javascript-a ren kasuan, zein geroago dei dezakezu. Eta gero, ezin duzu, ordenatzeko, lortu Kode hau sartu gabe ezer egin beharrik. Liburutegian adibide bat cs50.h. zen Hori izan zen liburutegi bat eman dugu duzu atzera aste batean, eta hori esker egin duzun GetInt eta GetString bezalako gauzak idatzi beharrik gabe Edozein kodea yourself. MIKE Rizzo: Guztiak eskubidea. Beraz, hemen, besterik ez bezalakoa den artean, izan genuen Gure c desberdina artxibatuko liburutegiak, guk ere behar du, besteak beste, Gure HTML liburutegiak desberdinak fitxategiak. Esate baterako, gehitzea nahi badugu JavaScript liburutegi zehatz bat hemen, agian, bat prestatu dugu geure burua nik lokalean digu script.js deitu, besterik ez dugu izendapen hori erabili. Beraz, gidoi mota berdinen dugu JavaScript iturri berdinen JavaScript.js. Eta bizkarra uste duzu bada zure CS50 finantza arazo ezarri, begiratu ezkero Txantiloiak karpetan header.php, ikusi behar duzu horietako batzuk barne. Beraz lehenengoa hau - gidoiak - JavaScript liburutegi bat barne. CSS liburutegi bat barne da pixka bat desberdina. Hemen, ordez gidoia Tag link etiketa behar duzu. Eta gero, testu CSS motaren da apur bat desberdina. Ez dute beti behar duzu, besteak rel estilo-orria. Baina uste dut, oro har, praktika onak. Eta gero, azkenik, HREF, eta zuk Ziurrenik zure ATAGs ikusi lotzeko loturak ezberdinak zehazten besterik non duten jakiteko esteka. Esate baterako, bat lotzeko nahi dugu liburutegi ezberdinetan - utzi, besterik gabe esan - duten styles.css at bizi izan zen. Eta hori lotzeko hori da nahi dugun webean anfitrioi, hori kopiatu genuke. Eta, ondoren, itsatsi, edozein dela ere sartu hementxe dugu horren ordez. TOMAS Reimers: Ados, espero duzu mutilak dira dagoeneko ezagunak CSS nola lotzeko ere. Horretan egin behar izan duzu marroia zure azken multzoa. Ikusteko Javascript-a, batzuk agian esperientzia batzuk izan. Zuetako batzuk, beharbada ez. Beraz, oraingoz, ezagutzen JavaScript fitxategi batean Asko CSS fitxategi bat bezalakoa da Zentzu zuk horri lotzen edo ahal dela, besteak dezakezu barrutik. Eta aukera ematen du gidoi gauzak. Eta ari gara oinez igaro JavaScript pixka geroago. Beraz, liburutegi bat erabiliz - behin sartuta duzula, jo literalki deituz bezain erraza da funtzio edo gehituz klase da izenak. Hitz egin nahi dugun azken gauza liburutegi terminoetan buruz - eta hau da, ohar tekniko bat gehiago - Kode irekiko lizentzien da. Beraz, benetako liburutegi hauek aurkituko dituzu, duzu behar pentsatzen daiteke galderak gustatzen da OK besterik ez naiz I norbaiten kodea erabiliz, batez ere duten zerbait asko dugu delako Ikastaro honetan nahi ez esan duzu. Kode irekiko lizentzien kasuan, beraz, garatzaileek asko - liburutegi bat idatzi dut dute behin, horrek uste dute ezin izango beste pertsona lagungarria - jarraian argitaratzen sarera eta lizentzia bat ematen diote. Eta lizentzia bat, funtsean, dio egileak naiz emateko beste baimenik Jende software pieza hau erabili ahal izateko Honako moduko batera ezarritakoa. Sartzen dugu gune ona lotura bat lizentziak ulertzen laguntzeko maiuskulak exekutatu horretan sartu duzu. Ezarritakoaren komun bezalako gauzak dira Oraindik ongi etorri nire liburutegia erabili ahal izateko hain kreditu emango dizu luze jo zidan. Ongi etorri nire liburutegia erabiltzeko Oraindik hain luze hausten denean bezala ez duzu errua niri. Ongi etorri nire liburutegia erabili hain luze Oraindik Zuk ez bezala erabiliko da dirua zeuk. Horiek komun mota daude ezarritakoa. Azken proiektua CS50 honetarako, dute ez du izan behar super garrantzitsua delako you guys erabiltzen duten proiektuak dira seguruenik, hobeto esanda, ordenatzeko, ezaguna. Baina benetan joan kanpo sartu mundua eta hasi liburutegiak, erabiliz eta horrek daiteke edo ez izango baita abian direnak more popular gara batzuk be going to igarotzen. Ona da, ulertu ahal izateko lizentzia horiek eta zer esan nahi duten ulertu. Eta atzera egingo. MIKE Rizzo: Ados. Beraz, orain adibide gainean mugituz benetako CSS. Puntu honetan, orain arte, zuk agian ez dute aurkitu da hau. Baina zuk aurkitu izana bertan Zure eguneroko bizitzan non zerbait duten modu batean itxura arakatzaile batetik agian ez du itxura bera nabigatzaileak beste modurik. Hau da nabigatzaileak nabigatzailean izeneko bateragarritasuna. Eta gero eta gehiago ari da eta bihurtzen ari da arazo bat baino gehiago, batez ere, gisa Nabigatzaile hartu gero eta gehiago askatasun Gauzak martxan jarri nahi baita. Beraz, hori gainditzeko, ez dago benetan da liburutegi handia Normalize.CSS deritzo. TOMAS Reimers: esteka sartuko dugu. Honekin, lagungarria da bada eramangarria izan hor duzu gune begira. Eta eskubide hori ematen dizugu orain, besterik gabe, delako CS50 finalean Proiektu benetan joan hura ezartzeko eskatu duzun era berean, eta nabigatzaile bitartez. Beraz, besterik gabe, zure bizkarrean hartu burua, hau liburutegi bikaina da izango delako, ordenatzeko, gauzak normalizatzeko. Firefox, zerbait erakutsi ahal ezkerrera pixel bat bezala. Eta gero Chrome benetan erabaki dezake zer esan nahi duzu 10 pixel zen ezkerrera. Eta hau normalizatzeko nahi duzun. Normalizatu benetan egingo benetan ona Ziur egiteko lan zure webgunean itxura bera nabigatzaile zehar. Beraz, nahi badugu besterik: MIKE Rizzo klikatu esteka benetan azkar eta ikuskizuna duzu zer itxura, zuk deskargatu ahal erabiliz erraldoi Deskarga botoia. Edo zuk horri buruz gehiago irakurri animatzen dut link honetan klik beheko in arabera eskuineko izkinan. TOMAS Reimers: Eta baduzu benetan Ezkutatu Irakurri gehiago bertan - Ezkutatu GitHub on iturburua - benetan irekita iturri ikusten duzuna LICENSE.md on lizentzia bertan. Eta ikusiko duzu hemen da Oso ezaguna MIT lizentzia. Berriz ere, irakurri nahi izanez gero, testuan barrena, gai aurkitu gunean izango duzu erreferentziatutako dugu aurretik eta izan gai ulertzeko irakurri beharrik gabe lege jargon bidez. MIKE Rizzo: Ados, handia. Beraz Normalize da. Zuk eman nahi izan dugu benetan azkar. Oh, ez galdera bat izan duzu? IKUSLEEN: noiz jaisten baduzu, zuk Hori besterik ez dute kode hori jarraitu Deskarga botoia pean? TOMAS Reimers: Bai, hain deskargatutako - MIKE Rizzo: Oh, hori puntu bat da. Beraz, galdera zen nola egin benetan deskargatu dugu? Estekan klikatzen beraz badugu, ikusiko dugu dela benetan azalduko da iturburu-kodea ere. Beraz, hori egin ahal izateko, zer dugu Could ez besterik da klik Gorde honela. Save As eta behar duten ekarri fitxategi bat. Eta, ondoren, gorde ahal izango dugu hura normalize.CSS gisa. Eta, ondoren, lotu nahi izan duzuna - TOMAS Reimers: The way you bera beste edozein fitxategi esteka. Eta behin lotzen duzu, zer da handia Normalize buruz da benetan zaindu gogor guztien berak lan. Ez duzula izan zentzua Edozein eskolak gehitzeko. Ez duzu ezer arraroa egin. Egingo zu gabe normalizatzeko da are gehiago, ezer egin. Bai, besteak beste, egin behar duzu. Google Chrome ez du erantzuten. Just azkar bat alde batera utzita - Nabaritu nuen salto honetan sartu dugu. Aurkezpen honen gainerako da ikuspegi azkar bat izango da. Liburutegien inkesta bat. Funtsean, zer diren. Zer egiten duten. Nola erabilgarria ari dira. Nola liteke horiek ezartzeko. Haiek bila hasi nahi baduzu, batera ondoko, eta bidez irakurtzen horiek, oso nuke laguntzen dutela. Bestela, ere ari ongietorria emateko ditzakezu deskargatzeko eta barne hasteko ikusmena batean horiek zer duten ikusteko itxura edo zer egiten baldin baduzu eramangarria zure aurrean. Hala ez bada, Oraindik ongietorri mantentzeko Guri entzuten hitz egiteko. Ahotan izateko goaz. Eta denbora izan dugu amaieran, zorionez benetan dizugu erakutsiz sartu zer liburutegiak horietako batzuk itxurarik. MIKE Rizzo: Cool. Ondo da, beraz, gaur egungo hitz egin dezagun buruzko Font Awesome. TOMAS Reimers: beraz Font Awesome bat da gune benetan neat, batez dutenentzat gurekin nork dira hain artistikoki of talentu. Izena Font Txundigarrian jaramonik ez, hura ematen dituzu ikonoak, diren mordo bat oso erabilgarria. Beraz, asko aldiz bat ezartzeko dituzu icon baliteke bat x polita beraz bezala nahi duten zerbait itxi dezakezu. Edo Editatu botoia nolabaiteko nahi ahal izango duzu arkatza bezalako marrazki batekin gainontzeko guztiak ditu. Eta hori da ikasten dela ikono horiek marrazketa izan daiteke Oso lapurtera eta zaila. Font Awesome - zaren benetan bada Gunean joan - ikonoak asko ematen dizu pean goialdean ikonoak. Bai, besterik goian. Asko emango dizu doan ikono. Beraz, hemen ikusten duzun bat bezala gauzak dugu Izartxo, tabernak, tximista, bat egutegia, akats bat, liburu bat, et cetera. Hau oso baliagarria izan daiteke. Bide honetan, besteak duzun da, besteak duzu literalki CSS fitxategia. Eta sartzen dituzun ondoren CSS fitxategia, zer egin dezakezu sortzen dituzun bat Etiketa I. Da satands izeneko klasea FA ikonoa Font Awesome zutik. Eta gero, edozein klase nahi duzun. Plus horren ikono bat nahi nuen, hala bada hementxe plazan, litzateke eman dut klase FA. Eta gero FA gidoi plus gidoi karratu. MIKE Rizzo: Cool, Ados. TOMAS Reimers: Eta gero, azken CSS liburutegiaren bidez lortzeko gaude nahi dugun da gutxieneko mantentzeko CSS saiatzen liburutegiak delako konturatzen al gara Aurkezpen honen izenburua JavaScript Liburutegiak da. Baina pentsatu dugu agian dugu baita aurkeztuko duzu beste liburutegien dugu liburutegiak buruz ari ziren bitartean. Google Web Fonts da. Eta zer Google Web Fonts aukera ematen dizu egin da tipoak gehitzeko zure webgunean, eta hori egiteko modu oso erraza da polita eta zure set bereizteko denek besterik bihurtu en da badauka letra-polit bat edo polit bat badu tipoak bilduma. Google Web Fonts atsegina da beste ez bezala zentzu liburutegi bat dela instalazioa benetan gidatuta. Beraz, lotura jarraitu ezkero, ez da google.com / tipoak, uste dut. Horretan jarraituz gero, zuk zure letra-jaso ahal izango. Duzu ezkerrean dagoen aukeratu dezakezu bertatik lodiera, joera, et cetera. Eta, ondoren, behin aukeratu duzuna, sakatu dezakezu erabilera azkarra. Bertan. Behean kutxa eskuinaldean. Eta, ondoren, joan behera. Lehenik eta behin, zuk CSS eman dutela benetan lotu behar dituzu. Bertan. Besterik ez duzu kopiatu eta itsatsi sartu ahal Eta bat honi buruz gauza polita da ez duzu benetan, nahiz eta behar den deskargatu fitxategia. Zer da egin egingo da joan Google-ren den bertsio lotzen. Beraz itzuli zer esan nahi du. Denean erabiltzaile batek esan nahi deskargatzen ditu zure fitxategi - deskargatzen ditu zure HTML orria - zure HTML orrialdetan dago fitxategi honi erreferentzia egingo. Beraz, ondoren, ordenagailuaren ikustera joan, oh, nik baizik google.com ostatatutako on theirsite.com baino. Let galdetu Google fitxategi hori joan me. Eta gero, ez da eta, besteak joan ia balitz bezala bat bailitzan da zure webgunetik zati. TOMAS Reimers: Cool. Eta behin, besteak beste, duzu, eta gero nahi edo zure CSS-en, ematen du Benetako lerroan. Beraz jabetza-tipo familia ezarriko dituzu zure letra-izenaren berdina. MIKE Rizzo: Ados. Beraz, besterik CSS amaitu dugu. Eta zuetako batzuk pentsatzen egon daiteke, ondo, CS50 Ogasun on CSS batzuk izan genuen. Baina CSS liburutegi bootstrap zen. Egia esan, besteak dugu Bootstrap apur bat geroago JavaScript pean delako Bootstrap CSS liburutegia ere dator Ikusteko Javascript-a duten asko Bootstrap edo Twitter - egin duten Bootstrap - Beren CSS guztiak kudeatzeko erabiltzen du. TOMAS Reimers: Does Edozeinek edozein galderak, orain arte, oro har CSS buruz? Onak gara? Awesome. MIKE Rizzo: Awesome. TOMAS Reimers: Beraz, mugitzen Ikusteko Javascript-a behar da. MIKE Rizzo: Beraz, hitz egin nahi izan dugu buruzko jQuery hasteko. Du inor jQuery entzun aurretik edo erabiltzen da? Bai, pare bat? Duzu beraz, ama-rekin lan egiteko besterik ez bada JavaScript, zeure burua aurkituko duzu selectors luze asko asko idazten. Beraz, zer jQuery ez da eskaintzen Ikusteko Javascript-a egiteko Wrapper polit bat erraz hautatzea uzten du hizkuntza eta elementu ezberdinak manipulatzeko dokumentuaren objektu-ereduaren barruan web orria edo DOM, hau dut uste you guys entzun in puntu honetan hitzaldia. TOMAS Reimers: Ez baduzu entzun edo ez dituzula gainbegiratu bada hitzaldia oraindik, Document Object Model da funtsean gauzak nola irudikatzen dira. Beraz HTML moduko itxura zuhaitz bat bezalakoa denean benetan marraztu ezazu. Gainean HTML elementu daukazu. Burua eta gorputza duzu. Eta gero, zuk horren barruan beste guztia izan. Hori DOM aipatzen - Document Object Model. Beraz, objektu horrek adierazten du eredu bat Dokumentuaren pentsatzeko modu erraz bat da hori buruz. Eta jQuery gauzarik handienetako bat da traversing benetan egiten du duten eta elementuak manipulatuz barruan dut ez dela oso erraza. Hain sinplea, hain zuzen ere, gehienetan JavaScript liburutegiak edo ez bada gehienak, bai gehienak grand Ikusiko duzu benetan behar jQuery hain duten beraiek besterik gabe exekutatu ahal izango dute delako ez baduzu izan jQuery, zuk denbora asko alferrik litzateke nahian irudikatu nola jakin aukeratzeko elementuak eta nola beste gauza batzuk egiten. Eta jQuery buruzko beste gauza handia nabigatzailearekiko cross bateragarria dela. Beraz, gogoratu itzuli denean esan dugun Nabigatzaile guztiek ez ezartzeko gauzak modu berean? Hau egia da, nahiz eta JavaScript. Eta jQuery buruzko gauza handia bat da hori izango atzeman dut nabigatzaileak eta atzeman du metodo egokiak. Beraz, elementu bat aukeratu behar izanez gero, Internet Explorer Oraindik esan liteke ustezko bide hori egin ahal izateko. Firefox zuzena esan liteke modu modu horretan da. jQuery ez zaintzeko. Noiz jQuery esango dizu bat hautatzeko elementu irudikatu izango da nola egin suposatzen da egin behar nabigatzailea barruan Erabiltzaileak une honetan da, eta ondoren egin horrela. MIKE Rizzo: Hargatik ez buruz hitz egin jQuery erabilera pixka bat. Just like PHP, jQuery ditu aztergai bati dolarraren ikurra zaletasuna. Beraz aurkituko dituzu edozein dela jQuery - ondo, ez guztiak. Batzuetan dolarraren ordeztu dezakezu jQuery hitza sinatu. Baina, oro har, besterik ez delako laburragoa, betiere jQuery izateaz ikusten duzuna dolarraren kartelarekin besterik ez da izango erabiltzen. Beraz, hemen ari gara hasieratik bat erakutsiz DOM elementu bat hautatzaileak. Hemen, dolarraren ikurra jarraitu dugu parentesi ireki eta gero komatxo arabera. Eta komatxo barruan joan gure selectors barnean beste. Just CSS bezala, selectors behar genituela izan elementu ezberdinak style gai orriaren barruan. Selectors desberdin horiek itzultzeko zehazki sartu jQuery eta JavaScript, zati handiena. Beraz, hemen dot lelo bat behar dugu. Gogoratzen duzu hitzaldia hala bada, dot besterik klasea esan nahi du. Beraz, elementu hautatzen ari gara class foo batera. Beraz, aurrera I eta ireki bada gure JavaScript kontsola hemen benetan azkar erakutsi bakarrik da, nik idatzi besterik ez bada dolarraren ikurra, ikusiko dugu zenbait dela funtzioa datorren. Eta besterik ez da jQuery definitzen. TOMAS Reimers: zaretenok Ohituta, kontsola tresna da Chrome, eta horrek aukera ematen dizu, barruan funtsean, run JavaScript on uneko orria. Hau oso erabilgarria aurkituko dituzu denean benetan arazketa zu eta zu behar bezalakoa izan behar, zer da korrontea aldagai global batzuen balioa edo zer beste zerbait da? Mota da GDB bezala ezik egia esan, ahal duzun orrian elementu manipulatzen dituzten moda askoz errazagoa da. Eta, gainera, ez du, funtsean, begiratu Zurekin ezer ez aurretik. Beraz, berriz, GDB zitekeen bezala izango, zaude ziur hurrengo urratsa exekutatu nahi duzula? Kontsola errealean da. Web orri bihurtzean ari da, eta beraz, dena delakoa egiten ari da, egiten du kontseilu horrek ere ondoan exekutatzen. Eta jarri dezakezu impute kodea sartu Kontsola horretan, egingo den orrian da abiarazi. MIKE Rizzo: Beraz kontsola sartzeko, Uste dut, labur-labur hori behar dut aipatu nola egiten den. Hori izan dezakete azken arazoak erabilitako Chrome ikuskatu elementu funtzio edo orriaren iturburua ikusi - eta horiek eskuragarria besterik eskubidea dira orrialdean edo zehatz baten gainean klik elementu eta bai ikuskatu egiten elementu edo orriaren iturburua ikusi. Ere dugu JavaScript sartu ahal kontsola ek zuzenean ikuskatu elementu aukeratzerakoan. Beraz, ondoren, sakatu besterik ez duzu kontsolan Eskuineko aldean. Bestela ere, ezin duzu joan dira eskuineko goiko izkinan, hau da moztu pantaila honetan bertan Hiru taberna horizontal ditu. Eta jaisten dituzun tresna eta Orduz JavaScript kontsola hemen non ikus daiteke - gutxienez Windows on - lasterbidearen da Kontrol Shift J. Orduan elementu bat hautatu nahi badugu Orrialde honen barruan, I erakutsi bezala aurretik, dolarraren ikurra Parentesi irekiak egiten dugu eta ondoren aipatzen. Gauza interesgarria da, oro har, Komatxo eta komatxo dira trukagarriak. Beraz, pertsona asko, bakarrik erabili bakar komatxo idatzi azkarrago ari dira delako komatxo baino ez duzulako behera eduki Maius dute. Beraz, besterik ez dut egin oraintxe. Beraz, zerbait aukeratu nahi dut klase batera. Edukiontzi, badakit besterik ez delako hori da hori da zerbait gure Web orri oraintxe. Eta sakatu dut idatzi. Eta ikusi ahal izango dugu aukeratutako hori. Beraz, erakusten du dela objektu itzuli. Beraz, oinarrizko aukeraketa bat da. Benetan manipulatu nahi izan dugu, bada, zerbait deitu beharko zenuke aukeraketa hori, zein beranduago egingo dugu sartu. TOMAS Reimers: Beraz, besterik gabe, hori begiratu gehiago sakon, hau ez da desberdina funtzio deiak egin genituen C. baino Funtzioaren izena hemen da Apur bitxi. Dolarraren ikurra da. Funtzio baten izen bat besterik ez da. Ez dago ezer berezirik horri buruz. Parentesi irekia behar dugu. Ondoren, gure argumentu bat, izan dugu eta horrek kasu honetan gertatzen den kate bat izan nahi du, eta hori da hautatzailea da. Eta gero, ez dugu gure parentesi itxia. Hori da. Ez da vastly ezberdinak. Arren, oso arraro begiratzen du. Eta hori, ordenatzeko, itsastea izan daiteke Jende asko seinalatu. MIKE Rizzo: Beraz, era berean, nahi badugu duten izena dauka elementu bat hautatzeko, orain hautatu nahi dugu Klase ordez izena. Antzeko gauza bat izango litzateke non gauden besterik egin identifikazio seinale zorrotz. Beraz, hemen hautatzen ari gara duten izena barra izan elementu. TOMAS Reimers: Eta hau hedatzen. CSS hedatzen. Just CSS bezala, guztiak aukeratu ahal izango duzu loturak, zein klase foo dute. Hemen, gauza bera da. A.foo egin ahal izango duzu, zein hautatuko luke class foo loturak guztia. Bar zorrotz bat egin ahal izango duzu, zein izango litzateke hautatu izena barra eta beraz esteka , eta abar. Edozein CSS hautatzailea da baliozko ' jQuery hautatzaileak. MIKE Rizzo: Bai. Ados, beraz, gaur gaitezen pixka bat sartu manipulatzeko dugun egin ahal izango du gure jQuery. Beraz jQuery mota jakin bat du idazkera non erabili besterik ez dugu amaierako puntu bat. Eta atsegin honen zuk pentsa dezakezu hemen C structs ezberdinak nola izan genuen. Eta structs horietan sartu, duzun dot bat erabili horiek sartu. Hau da, mota, antzeko gauza bat. Gaur egun besterik ez dugu horren barruan funtzio hautatzaileak ezin dugula bere gainean deitu. Beraz, hemen, oso lehen adibidea Ikusten duzun CSS hautatzailea da. Eta, batez ere, zer egiten duen da berri honen lehen elementu CSS aplikatzen Hautatutako gauza - Hautatutako elementu honen - balioa duten. TOMAS Reimers: Beraz, itzulpena erraz bat hori izango litzateke bada jQuery, funtsean, besterik hartu foo. Eta gero CSS batean esan zuen, kolore gorri eta itxi. Ideia bera da. Zer egiten da da aukeratutako da foo elementu guztiak. Eta gero, zer aplikatuko da. Ordenatzeko, jabetza kolorea gorria berdina da. MIKE Rizzo: Era berean, baita ere alda dezakegu benetako zer da edukia orriaren HTML, on horrek erakusten benetan cool esan nahi duen, zeren zure orain, web orriak erabat dinamikoa izan daiteke eta ez dute estatikoak izan PHP erabiliz inprimatu duzula Oso hasieran orriaren kargatzen ari. Beraz, hemen, inguruan aldaketarik nahi dugu oraingo orriaren HTML, orain genuke HTML funtzioa, deitu eta gero besterik edozein dela ere zehaztu sartu dugu txertaketak hautatuta dugu elementu hori. Beraz, hemen elementu hautatzen ari gara batera class foo eta ondoren esaten da HTML Orain bat, kaixo mundua. TOMAS Reimers: Eta noiz uste duzu buruz zer dira aplikazio erabilgarriak hau, CSS hau, lehenengo gauza da pentsatzen has zaitezke dagokionez nahiz Goitibeherako menuak. , Bezalako gauzak hasteko dezakezu Erabiltzaile bat goiko gainetik pasatzen jaitsiera behera bat, egin nahi duzun beheko zatia ikusgai. Ezta? Beraz CSS batean, propietate dugu zerbait ikus dezaten. Bistaratzea colon none bezala gauzak Ikusezina egin luke. Bistaratzea blokea ikusgai egingo luke. Edo errazagoa joan, zuk nahi badituzu ere ikusgarritasuna berdinen bezala gauzak izan ikusgai, eta ikusgarritasuna ezkutuko berdin. Eta gauzak ezartzeko hasiko gara bezalako Goitibeherako menuak eskubidea nola ideia bidez lortu ondoren daiteke irudikatu duzu hau irekitzen denean, horren bidez lortu dugu, oso laburki. Baina ikusten hasi ahal izango dugu honen aplikazioak. Antzeko zentzu batean, saiatu zinen eta ezartzeko, demagun, txat batean motorra eta apur bat egin nahi duzun hitzaldian burbuila etorri direnean duzun Mezu berria du, behin lortuko duzu mezu berri bat, apur bat egin dezakezu hitzaldian burbuila etorri aldatuz orriaren HTML, ezta? Aparteko hitzaldian burbuila dela gehituz Han testu gehigarria batera. Bai? IKUSLEEN: barruan hau txertatzeko zenuke en moduko bezalako HTML kodearen bat [INAUDIBLE]? MIKE Rizzo: Eskuin. Bai, hori lortu dugu pixka batean. Bai, antzeko bat da PHP apur. Ez zehazki antzekoa. Bereizketa on bat egin da, zer hau benetan editatzean editatu dugu orrialdean ez da delako izango da uneko fitxategia hori izateaz editatzen zerbitzarian mantendu delako mundu ez luke baimenik Zure fitxategiak editatzeko. Hau zer orrian dago besterik editatzen eta zer barruan bistaratu nabigatzailea. Beraz, orrialde ondoren birkargatu zinen, esateko, zerbait dugun bezala ezabatzen ikusi remove deia egin ahal izango dugu, ondoren, gauza hori berriz agertuko zen. TOMAS Reimers: Beraz, modu batean pentsatu hau da zure ordenagailuan banago eta Mike da, ordenatzeko, zerbitzariak. Zer gertatuko da noa galdetu Mike, hey, ezin kopia bat daukat web orri hau? Eta eman dit egingo zuen kopia bat. Ez, ez da jatorrizko gauza. Kopia bat besterik ez da. Eta gero, oh bezala, izango litzateke ez da Javascript hemen. Bistan denez, editatu behar dut orrialdera horrela izango. Eta zure kopia editatzen dut. Baina hori ez gauzatzeko benetako kopia. Eta hura berriro eskatu beharko banu izateko orria freskatu, - beno, ahal beste kopia garbi daukat - baina niri emateko joan beste kopia garbi. Eta, ondoren, nik gauza bera egin dut bezala, oh, hau JS hemen dioen hau aldatu egiteko. Eta ez dut hori egiten jarraitzea. MIKE Rizzo: Beraz, benetan cool gauza bat hori egin ahal izango du zurekin jQuery da benetan mota ezberdinak gehitu Zure orrira animazioak. Ez dakit duzun inoiz bada non betetzerik bati forma bat sartzen saiatzen ari zara online eta ez duzu bete gauzak behar bezala. Beraz, gauza txiki bat slides behera goialdean eta dio duzu ez egin hau behar bezala. Mesedez, saiatu berriz. Eta gero, agian, are gehiago, besterik irristatu gora. Bihurtzen jQuery funtzioak eraiki ditu duten egiten duten guztia animazioa benetan, oso erraza. Beraz, ez dago iraungitze lehen da funtzio, zein zerbait on dezakezu deitu. Eta CSS aldatzeko modu bat da Modu animaziozko batean elementu hori. Beraz, edozein dela ere elementu hartzen du deitu desagertzen bertan daudelarik. Eta, ondoren, poliki-poliki bere opakotasuna aldatzen guztiz gardena doa arte. TOMAS Reimers: The bestea herrikoia irristatu behera, eta horrek egingo du zerbait da irristakorra behera agertzen dira. Beraz, zabaltzen den menua kasuan, Berriro ere, nola detektatu ikasi dugu , hala egiteko gainean baino gehiago, izan besterik behean honek esango dizu parte irristatu behera orain. Eta, ondoren, badirudi behera mamiarekin. MIKE Rizzo: Eta gero, zuk besterik ez bada Kontuan animazio mota batzuk jQuery ez du zertan ematen. Esate baterako, demagun jQuery du ematen duzun diapositiba batekin behera eta diapositiba sortu. Beno, demagun irristatu nahi duzu zerbait ezkerrera edo in Distantzia CS50 bezala mota eskubidea orri nagusia ez direnean joan panel berri bat duzu. Zenuke gero seguruenik behar erabiltzen da martxan zaitez animatzeko funtzioa jQuery barruan. Beraz, era berean, animatzeko besterik ez duzu. Eta gero, bere baitan hartzen du bestelako balio du hiztegi duten pasatzeko zauden ustezko. Beraz, hemen, animatu nahi dugu elementu lelo, hala nola, bere zabalera bai Zabaldu edo 80 pixel den kontratuak, gaur egun zer da arabera. Litzateke besterik gabe pasatzen dugun bezala bere baitan argumentua. Animatu ere beste argudio batzuk izan hori gainditu ahal izango duzu, adibidez, animazioaren abiadura Eman nahi duzula. Eta horretarako, litzateke, besterik diot azkar Google jQuery animatzeko. Eta, ondoren, orri hau jarriz, ahal duzun ikustea lortu desberdin mordo bat propietate hori gainditu ahal izango duzu. Eta animatzen dut - betiere, zatoz ez duzula zerbait zehar ezagutzen edo besterik bati buruz gehiago jakin nahi duten dei dezakezu bereziki metodo zerbait - besterik Google it. jQuery oso ongi dokumentatua. Eta askotan, aldiz, ez dira asko Gaur zuretzat ematen dute. Joan gara behera - Modu behera - hori erabili ahal izango dugu, baita. Berriz ere, noiz developer benetan doa idazketa baten arazoak bitartez liburutegia, normalean nahi dute Norbaitek hura erabiltzeko. Beraz, batera da joan dokumentazio bat izango da. Eta dokumentazio hori ezin ohi izan Proiektuaren orrialdea, hau da aurkitu zergatik dauden gune originala eman dizugu hasieratik, eta horrek lotzen duzun arte Proiektu orrialdeak ahal duzun beraz ikus dokumentazio horretan. Normalean, proiektuaren kasuan, orriaren of [INAUDIBLE], zuk esan ezazu Klase izenak. JavaScript kasuan, hura ematen zaren funtzio baten izena. Bide batez, sortu korrituko bada goian dugu, azkarrak albo funtzio ohar bat da betiere, ezarri funtzio bat ikusiko duzu hau gogorra duen bezala erdian parentesi artean, bide horretan jabetza hori aukerakoa da. Just buruak up. Galdera asko ikusi dut hori buruz. Beraz, hemen ikusi ahal izango dugun Animatu hartzen propietate beharrezko argumentu gisa. Eta beste guztia hautazkoa da. Alboko ohar - honen moduko uste dezakezu, du, man orriak bezala. Man orrialdeak C dokumentazioa direla eta beste gauza batzuk, eta baita asko. MIKE Rizzo: Beraz, ikasi dugu nola orrian CSS ezberdinak aldatu, animatzeko, eta kendu, gehitu HTML. Baina benetan indartsua da gehien bat JavaScript buruzko gauza eta, batez ere jQuery - zer egiten duzun aukera dago da erantzuteko elementu desberdinak gertatuko. Esate baterako, hemen dugu gertaera kudeatzailea bat. Eta bakarrik esan nahi du, betiere, hau Ekitaldia gertatzen da, hura kudeatzeko dugun batean zenbait modu. Beraz, hemen, generic jQuery ekitaldi handler on dot da. Eta, ondoren, eman duzun lehenengo gauza da, zer ekitaldi izan behar lukeen be entzuten. Beraz, hemen, klik da que ari gara zain. TOMAS Reimers: Bestela, duzu pasatzean, eta horrek oso ezagun bat da. Beraz, nire tanta menu ideia behera itzuli. Pasatzean on top bat izango litzateke. Eta, ondoren, hori aldatu ahal izango duzu. MIKE Rizzo: Eskuin. Eta gero, hori gertatzen denean, ez besterik funtzio hori dela ematen diogu exekutatzen argumentu gisa eta duen alertak kaixo da edo hi. TOMAS Reimers: Beraz, kasuan Ikusteko Javascript-a, hau leku bat behar dugu kendu geure burua C.-tik ezin dugu benetan funtzio hartzeko argudio gisa. Eta han asko dira benetan modu konplexu hau egiteko. Modu batean sustatzeko goaz, hau da, defini dezakezu funtziona bertan. Beraz, zuk funtzio gisa galdetzen ari zaren parametro bat, Oraindik funtsean besterik ez duzu funtzioa definitzen joan spot. Eta bidean funtzio bat definitzen duzunean Ikusteko Javascript-a da zuk literalki esan funtzioa. Ondoren, normalean, izena funtzioaren. Baina ari gara inoiz erreferentzia joan Funtzio hau gehiago. Beraz, izenik gabeko utziko dugu. Ondoren, parentesi eta, ondoren, kizkur du giltza, eta gero horren barruan kodearen. Beraz lata hau ulertzen dugu pixka bat nahasgarria izan. Beraz duzun forma orokorra ematen diogu zer gertaera kudeatzaile baten itxura azpitik, eta horrek gertaeren gainean. Eta, ondoren, zure kodea duten barruan. MIKE Rizzo: Ba al dago honi buruzko galderak? Hau pixka bat nahasgarria izan daiteke Ikusten duzun lehen aldia. TOMAS Reimers: Zuk benetan nahi ireki fitxategi bat eta erakutsiko ditu zenbait jQuery oraintxe? MIKE Rizzo: Bai,, utzi egin dela. Ados. TOMAS Reimers: Beraz, orain gaude aparatuaren. Eta zer egin dugu da hartu ditugu: bai index.html bat sortzeko askatasuna fitxategia, eta horrek lotzen JavaScript fitxategi bat. Eta ezin ireki dugu - bai. Beno, bi gauza egiten du. Lehenengoa da lotzen da JavaScript fitxategia. Eta hemen ikusiko dugu. Duten ikusiko dugu burua in HTML dokumentu, bereziki. Beraz ikusiko duzun dugu, funtsean, esan SRC, horren iturburua dago. Eta hori URL da. Beraz, hemen dugu esan dezakezu jQuery barne. Eta nik gidoiak ere sartzen dugu. Ikusteko Javascript-a sartzea, beste modu bat da, duten inline gidoi bat sartu ahal izango duzu dugu etiketa gisa behealdean bertan dio gidoi-mota da testu Javascript. Beraz, esaten ari gara entzuten, gaude buruzko gidoi bat, besteak beste. Eta gidoia duten mota da Ikusteko Javascript-a, zein testu mota bat da. Oso erraza da. MIKE Rizzo: Beraz, mota, lortzen den Zure nola sartzen dugu inguruko galdera Gure fitxategietan JavaScript delako dugunean izan PHP, honen antzeko zerbait egin dugu. Eta gero, gure PHP funtzioak - demagun izakin egin horrekin zerbait - han doa. Hala ere, orain gidoi tags dugu puntuazio emango dugula, eta horrek, egia esan, HTML beraren zati ez delako Gustatu HTML fitxategi bat izateaz faking PHP da baduzu benetan joan delako eta orriaren iturburua begiratu, ikusiko duzu gidoi etiketa han rekin JavaScript lotutako duten horiek. Nahi izan, beraz, ondoren, bada behar dugu JavaScript batzuk idatzi - dezagun, besterik gabe esan gorputza aldatu nahi genuen oraintxe bertan ez daukat delako beste edozein etiketa benetan ezin dut gorputzaren gain editatzeko. Dezagun esan nahi dut horren CSS aldatzeko. Beraz, aurrera egingo dugu, eta aldaketa duen kolore gorria. Beraz, gorde fitxategia dut. Goazen gure web orrira itzuli, freskatu, eta automatikoki egiten du ez dirudi delako itxaron bezalako ginen ez guztietan delako entzuten ekitaldi bat edo horrelako ezer. TOMAS Reimers: Beraz, atzera jo bada hori dugu bereziki fitxategia - HTML fitxategia - zer ari zaren ikusten dugu - gogoratu honek hori kargatuta, ordenatzeko, kronologikoki. Beraz, lehen buruan daukagu. bi fitxategi horiek kargatzen da. Ondoren, joan gorputza dugu. Eta kaixo mundua ikusiko dugu. Beraz kaixo mundua errendatu dugu. Eta, ondoren, azken gauza dugu script etiketa behar dugu. Beraz, script etiketa exekutatzen da, da delako Ez da kontatzeko ezer itxarotea. Eta hori da, oinarrizko Modu Javascript exekutatu. Horrekin, esan daiteke gidoia jarri duzu etiketatu sortu goiburua besterik Puntu honetan erakusteko? Eta exekutatu. Nabarituko dugu dela ez zuten kolorea aldatzeko. Eta hau da, arazo bat Ikusteko Javascript-a da gauzak kargatu dira kronologikoki antolaturik. Beraz, garai hartan duten kodea duten exekutatzen zen, hautatua dugu - atzera jo - gorputza etiketa. Gorputza etiketa ez da existitzen oraindik delako JavaScript HTML line da. Beraz nabigatzailea hautatu gorputza bezalakoa da. Ez dago gauza, hala nola oraindik. Beraz, hori ez ikusi ahal izango dugu. Eta jarraitzea dugu. Eta, ondoren, gorputzaren etiketa bat definitu dugu. Baina hori ez da inoiz lortzen eguneratu. Beraz, gidoi ezartzeko ari zaren tags, ziurtatu jarri gorputza tag ondoren. Hurrengo diapositiba. MIKE Rizzo: Ados. Beraz, zerbait aldatu dugu. Baina ez da itxura erantzun bezalakoa da gurekin guztietan delako mota besterik ez da egin du orria kargatu bezain laster. Beraz, gaur egun, horren ordez, hau egiteko, zergatik ez gertaera kudeatzaile bat gehituko dugu. Beraz, egin dezagun zerbait gorputza berriro. Eta demagun egiten dugun on - klikatu. Funtzio bat gehitu dugu. TOMAS Reimers: Dezagun aldaketa gorri kolorea da berriro. Zergatik ez? MIKE Rizzo: Bai, dezagun aldaketa bere 'gorri kolorea berriro. Ondo da. Hargatik berriro orria. OK, ikusi dugu - espero bezala, ez du buelta gorria oraindik. Baina gero aurrera dezakegu eta egin klik bertan. TOMAS Reimers: Eta ez du piztu gorria. MIKE Rizzo: Eta egiten du gorria piztu espero bezala. TOMAS Reimers: Eta ikusi ahal izango dugu nola Oso oinarrizko eraikitzen hasteko aukera izango dugu elkarrekintza. Beste gauza liteke egin nahi dugun da, ez badugu nahi gorputza egiteko kolore gorria, dezagun HTML atzealde gorri kolorea. Beraz, besterik ez du CSS bera da. Eta noiz aldatu dugu, hau ikus dezakegu: aldaketaren eragina oso dramatikoa Orrialde osoa. Beraz, berriro ere, zuk gauzak ezartzeko, osagai bat izan dezakezu hau da, bertan klik egin behar da on ekarri. Demagun Exit botoi bat eta beste osagai oso bat, hau da erantzuteko ekarri. Beraz, leiho bat kendu nahi duzun denean gertatzen den. MIKE Rizzo: Ados. Just adibide gisa - ez duzu lortuko lehenago ikusteko - Besterik ez dut erakutsiko dizu zer itxura gustuko zerbait ezkutatu dugu. Beraz, aurrera egingo dut, eta ez irristatu gora. TOMAS Reimers: duten itzulbiratu bat nahi duzu Egiten dugun paragrafo mota aurretik? MIKE Rizzo: Ados. Bai, zergatik ez dugu hori besterik ez, beraz apur bat gehiago aukeratu ahal izango dugu. TOMAS Reimers: Eta dezagun klase bat ematen diote. MIKE Rizzo: Bai. Ados, beraz, ikus dezagun. Horren ordez benetako gorputza hautatzeko gaur egun, besterik ez dut aukeratu guztia klase kaixo, hemen dugu besterik ez dute gauza bat. Beraz, ez luke behar kezkatu. Beraz freskatu dut. Aurrera egingo dut eta egin klik bertan. Eta hori, ordenatzeko, diapositiba bitxi bat egin zuten gauza, eta horrek ez zuen itxura duten erakargarria. Oro har, itxura ez dute nahiko polita. Uste dut, hau - batengatik arrazoia - ez. Besterik ez dut iraungitze bat beraz zuk ere hori begiratu daiteke. Askoz ikusgarriago. Eta, ondoren, ireki dut JavaScript bada berriro kontsolara eta ikusi nahi dugun, zer itxura denean desagertzen sartu garen bezala Orain, deitu besterik ez dut desagertzen in ezazu. Eta atzera fades sartu Era berean, izan benetan ere igaroko gara argumentu bat desagertzen edo itzali, hau da, mota, haren abiadura. Beraz dezagun aurrera, eta esan nahi dugu poliki-poliki joan da desagertzen sartu Beraz, uste dut oraindik ere zirudien nahiko azkar. Baina lehen baino motelagoa izan zen. TOMAS Reimers: Eta bilatu nahi baduzu Gauza horiei buruz gehiago, berriro ere, besterik jQuery dokumentazioa joan, bertan dugu eman dituzun eta irakurri horien bidez. Beren funtzioak dokumentatzeko dute oso ondo. MIKE Rizzo: Ados. Hargatik hau itzuli uste dut. Eta gure azken orrian buruz hitz egin ahal izango dugu. Beno, Bootstrap amaitzea dezakegu. Eta, ondoren, ireki egingo dugu gora zenbait galdera egiteko. Eta you guys edozein ideia izan bada gora bota eta ikusten saiatu nahi duzu dugu horiek gauzatu ahal izanez gero JavaScript azkar. Beraz, benetan azkar Bootstrap buruz, eta horrek sartu zuten automatikoki Zure CSS karpetan arazo azken multzo eta benetan lotuta zure header.php. Beraz, zuk klaseak gehitu zezakeen Bootstrap barruan definitzen dira bertara. Eta litzateke automatikoki styled dute gauza horiek kopuruen arabera. TOMAS Reimers: Beraz Bootstrap oso bat Jende garatutako gauza magikoa Twitter at. Eta zer esan nahi zen egin zen - aurretik webgune benetan gogorra egin ziren itxura polita, batez ere, izan genuen osagai komun asko. Beraz botoiak asko web bera begiratu. Testu-eremuak asko egin behar dira ahal testu estandarra baino hobeto begiratu benetan hasita Eremu duzun jakin seguruenik webgune zaharrak edo oso gaizki egin webgune, besterik literal itxurarik edozein testu forma gabeko testu koadroak itzal edo edozein polita eskema moduko. Beraz, zer Bootstrap egin zen, esan zuen, ondo, a lot estilo komuna dugu. Zergatik ez du CSS multzo komun bat egin genuen eta Javascript-multzo komun gisa baita, eta horrek estilo ahal da eta horren ondorioz tanta bezala gauza eman dezake pertsona menuak behera, zein pertsonek eman ahal modals bezalako gauzak. Modala da orrialdetan zehar zer azalduko da zorrozki har ari direnean zerbait, eta horrek are gehiago inhibitzen elkarrekintza duzun arte bertan elkarreragin. Honen antzeko zerbait da, ziur gauza hau ezabatu nahi duzula? Ezin benetan egin duzun beste edozer baietz edo ez duzun arte. Hori guztia hartu du eta ontziratutako da elkarrekin, eta esan zuen, hemen goaz. Pertsonek erabili ahal izango hau. Eta bertan aurkitu ahal izango duzu baino gehiago getbootstrap.com at. Barruan automatikoki sartzen zen Zure azken arazoa ezarri. Eta zauden ongietorri baino gehiago erabili zure azken proiektua da. Eta hori jarraitu nahi baduzu lotzen Bootstrap lortzeko. Ikusiko duzu hemen da Bootstrap CSS gunean. Ikusiko duzu Bootstrap. Eta behera mugitzen zarenean, ikusiko duzu nola deskarga egiteko, nola instalatu, et cetera. MIKE Rizzo: Eta, gainera, ahal duzun, Interesgarria da nahikoa, pertsonalizatu bertara edozein dela gaien mota izan nahi duzula. Badakit zerbait egin nuen nire azken proiektua klasea hartu nuen zen pertsonalizatzeko. Bootstrap bertsio ezberdin bat dela Kolore-eskema desberdinak izan eta batzuen forma ezberdinak gauza desberdinak. Beraz zuk nahi duen jolastu animatzen dut. Fun-mota egin da. TOMAS Reimers: Looking goian zehar berriro ere, oso Font antzekoa da Awesome gune. Dokumentazio asko hasiko da antzeko badirudi denean duzun da nahikoa ikusten. Beraz, hemen CSS dugu honen osagai. Eta ikusiko duzu nola Gauzak estiloa izan daiteke. Mahai gainean klik egin beraz izanez gero, adibidez, berehala egin dezakezu bat taula nahiko besterik gabe gehituta klase da taulan. Gauza bera botoiei. Duzu klase BTN eta BTN gehitu besterik gabe bada lehenetsi edo BTN lehen, ahal duzun botoirik horietako bat eskuratu aurrez egindako estilo hauekin. Eta gero, bilatzen ari zaren bada zerbait besterik baino konplexuagoa zer w dute dagoeneko, gorako restyling Goiko dugu topo JavaScript fitxan osagai mordo bat. Beraz, hemen trantsizio, modals dugu, Goitibeherako, fitxak, eta argibideak. Argibidea da, zer azalduko da zure pean saguaren denean pasatzean zerbait da. Popovers, alertak, botoiak, tolesgarriak akordeoiak da zer normalean ari dira deitzen. Zinta, eta horrek irauli bezalako irudien bitartez. Beraz, horiek dira osagaiak Bootstrap neurtzen. Animatzen nuke oso joan horiek begiratu. Ez dago JavaScript osagaia eta CSS osagaia. Feel free izango duzun bezala erabili ahal izateko. Ez gara gehiegi joan horiek sartzen joan dokumentazioa sentitzen dugulako benetan ondo egina. Eta bai. Ez da horri buruzko zalantzarik izanez? MIKE Rizzo: Beraz, benetan azkarrak dira albo, web orri honen diseinua duten Azkar jarri dugu elkarrekin egiteko Aurkezpen hau da benetan egin Bootstrap erabiliz. Ikusten duzun bezala, noiz egin klik horien gainean dugu fitxak desberdinak, Oraindik inoiz ez dugu benetan egungo index.html orri hau utziz. Beraz, zer dugu eta DIV desberdina da index.html honen barruan. Eta gero, beti ezberdin bat sakatu dugu fitxan, besterik aldatzen da norberaren erakustaldia bertan. Beraz, horren arabera kokatzen du haiekin, orriaren HTML aldatzen beraz uneko fitxa aktibo gisa markatuta dagoela, ezberdinean eta begiradak dirudielako benetan polita. TOMAS Reimers: Beraz, hori guztia egin zen ia edozein CSS idazten gu gabe. Goian zehar goiburu bat ere ikusiko dugu, Horrek koloreak guk daude. Baina benetako jarri da orriaren goialdean eta making du korritze Bootstrap zen. Eta orduan ere liburutegia beste - hau ez da bat hitz egin dugu bat baina Google dezakezu nahi baduzu. Hau da prettify.js deritzo. Eta sintaxia nabarmendu Zure kodea izango da bai CSS eta Javascript erabiliz zuretzat. Hitz egin nahi dugun azken gauza zuk askatu dugu aurretik sartu mundura liburutegietan begiratu irudikatu nola eta horiek erabili ahal izateko, zorionez, dokumentazioa irakurri eta jakin zer duzun beharrik ez da liburutegiak nola aurkitu. Beraz, lehenengoa izan da, besterik ez gara Google bultza egingo. Joan Google. Hori da, hitzez hitz, zer egiten dugun denean dugu zerbait egin behar dugu Google da. Dago JavaScript liburutegi bat aukera ematen du denbora manipulatzeko me batean modu erabilgarria? Badakit, hala bada, erabiltzaileak batzuk sortzeko kontu bat da hemen, eta hau da uneko ordua, nola ahal dut kalkulatu du duten ezberdintasuna beharrik gabe kalkulatu da neure burua? Beraz, hau da, benetan gauza komun bat, Ordua liburutegian JavaScript. Eta hemen dugu Moment.js-- Bat ezagunena. Liburutegi bat behar dugu, manipulatzeko bada kolorea ahal izateko horrelako zerbait ausazko kolore-sorta bat sortzea - seguru asko, bat sortzea estilo edo zerbait - antzeko zerbait Google genezake JavaScript kolore liburutegian. Eta ziur azalduko litzaiguke dugu naiz mila eta horietako bat. Ongietorri horien bitartez irakurri zara. Beraz, gauza gehienak - aurkituko dituzu - horietako batean sartu behar dira joan anfitrioi Horrek guneak ostalari kodea. Oraindik popular direnak gutxi dira. Ezagunena, egindako urruti, github.com da. Eta bazoaz GitHub da benetan Normalize non ostatatutako zen. Beraz, inork horretara itzuli nahi baduzu. Erakutsi horiek duten. MIKE Rizzo: Eta hori da benetan non hau ere anfitrioi da, nabaritu baduzu. TOMAS Reimers: Bai. Beraz baino gehiago duzu joan nahi izanez gero, normalizazioaren eta GitHub joan. Ziren da hori? MIKE Rizzo: Hori gutxi katu gauza GitHub sinboloa da. TOMAS Reimers: Oh. Beraz GitHub izeneko metodo bat erabiltzen Denda kodeari git. Da eta ez dakizu zer den edo duzu beldurtzen da, hori da isuna. Ez duzu Git zer den jakin nahi GitHub Jaitsi botoi bat duelako behean eskuinean. Beste gauza erabilgarria da jakitea buruzko GitHub produkturik da bat irakurri dit aukera izango dute. Eta ez badute, web orri bat izan da, irakurriko nola duzu buruz hitz egin zidan instalatu, nola erabiltzen duzun, zer ez, et cetera, et cetera, et cetera. Zer funtsean izan gara oinez bidez. MIKE Rizzo: Internet en irtetea. TOMAS Reimers: Hori da fina. Azken bi gauza nahi izan dugu hitz egin - Git hitz egin dugu - arazoak konpontzeko da. Eta hau ez da garrantzitsutzat jo azken produktua dagoen bezala denean 50 utzi duzu. Eta noiz exekutatu produktuak sartu duzu liburutegiak ezartzeko edo gauzatzeko Zeure proiektua, bazoazela Zalantzaren bat edo zauden galdera bila joan. Berriz ere, Google da. Hori da, hitzez hitz, zer egiten dugun. Hau da Silly soinua da. Baina literalki, Google dugu. Eta berriro ere, lehenengo gauza bat ohi dituzu sartu exekutatu stackoverflow.com, hau da wonderful galdera eta erantzuna ikusmena. Da, zoragarria, bai, ahal duzulako galderak bidaltzeko eta bilatzeko erantzunak baina ere delako Dagoeneko asko ditu pre-populatua edukiak han. Beraz, normalean programazio Googleren duzu Lehenengo barruan galdera pare hits daiteke dagoeneko exekutatu dituzun sartu zure arazo multzo zehar. Eta, ondoren, azken gauza benetan laburra gaur dugu - JSFiddle, hau da, ez da lan asko egiten dituzten JavaScript HTML CSS. JSFiddle web app bat da, funtsean Zure HTML hartu ahal izango duzu, aukera ematen dizu zure Ikusteko Javascript-a behean utzi, eta Zure CSS goiko eskuineko. Eta orduan sor daiteke azkar bat errendatu Da, eta ikusi nola elkarreraginean. Oso erabilgarria da jendea beste nahian bezalako kontzeptu froga bat egin hau da, nola egiten duzun goitibeherako menu egin. Agian uncover edo dena azkar bat. MIKE Rizzo: Beraz, goazen Animatu eta egin klik honetan. Ohar azkar A - , berriz ginen aurretik click on egiten. Bihurtzen ere JCorey Korea bat eraiki du click gertaera maneiatzailean dela erabiltzen Oraindik zifrak besterik ez delako Gauza asko egin nahi du zerbait egin klik nahi duzun. Era berean, pasatzean bat ere badu. Baina esparrua osoa lortzeko horiek, jQuery begiratu dokumentazioa eta egin. Zerbait ergelak egin nuen hemen. TOMAS Reimers: Beraz, benetan azkar bat daukat programa hementxe, eta horrek dio button click on. Orduan bat behar dugu begizta. For 404 baino txikiagoa da i. Besterik ez da agertuko joan Alerta mezu horiek. MIKE Rizzo: Eta zer izan da 404 kodea koa HTML? Norbaitek gogoratzen? Aurkitugabea eskuinera. Chrome ere neat hau gehitu Gauza non egin dezakezu - TOMAS Reimers: pertsona bezala delako Mike honek asko egiten hasi eta gogaikarriak erabiltzaileek, eta horri esker Informazioa ikusi beharrik. MIKE Rizzo: Bai. TOMAS Reimers: Ez galderaren bat egin dugu honi buruz, Javascript buruz liburutegiak, liburutegi aurkitzeko, edo zer web garapenerako begiradak mundu errealean bezala? Sortu exekutatzen ari gara denbora aurka. Beraz, ez nago ziur goaz ezartzeko denbora izan Benetan azkarra da ezean. Garen onak? MIKE Rizzo: Anything you guys nahi benetan, bezala, azkar ikusteko bi minutu edo gutxiago? TOMAS Reimers: Ezer argitu ahal izango dugu? Nola idazten - IKUSLEEN: [INAUDIBLE]? MIKE Rizzo: Bai, hain that - TOMAS Reimers: besterik ez duzu hit ahal Kontrol-U web orrian. MIKE Rizzo: Oh, ez nuen ezagutzen. TOMAS Reimers: Uste dut, bai. Kontrol-U. Bai. MIKE Rizzo: Oh, beraz, hori da Webgune kodea. Baina, egia esan dizu deskargatu nahi izanez gero, gure fitxategiak eta dena, anfitrioi da on github.com TOMAS Reimers: slash nire izena - Tomas Reimers - barrarik CS50 gidoi mintegia. MIKE Rizzo: Eta ahal duzun guztia aurkitu. TOMAS Reimers: Hau da, zer GitHub dirudienez, bide batez. Beraz, berriro ere, iturri irekia ikusten duzu proiektua, normalean, irakurritako bat egingo dute niri ez dagoela irakurri ahal izango duzu. Eta atzera egin baduzu, nabarituko duzu duten deskargatu zip duzu, egingo den iturburua jaisteko aukera emango gehitzea kodearen Produktu zure gauza propioa. MIKE Rizzo: Bai, eta egin klik badugu index.html benetan azkar on - TOMAS Reimers: ikusiko duzu hemen iturri gure web kodea. MIKE Rizzo: Era berean, eskuineko bultza ahaztu dut mahai handi ekin aurretik barne, baina ez da bat ere mahai baten barne dugu chmods of bakarrik zure argitasuna. Baina joan gara modu guztiak behera bada behean, ez benetan egiten dugu oso JavaScript batera askoz stuff at honekin guztiak. Esklusiboki guztia bertatik bestela izan dugun. Beraz, eskerrik asko guys datozen eta entzutea. Hau izan zen benetan lagungarria izatea espero dugu. Erlazionatutako edozein JavaScript badaukazu galdera edo, besterik gabe, hitz egin nahi zer gehiago zer beste cool gauza bezala Ikusteko Javascript-a egin dezakezu, love genuke Zurekin hitz egin. TOMAS Reimers: Galdera bat baduzu Zure proiektuaren inguruko edo bada hau izan daiteke garrantzitsuak, seguruenik dugu inguruan makila pixka bat honen ostean. Baina hori baino, izan asteburu ona izan. MIKE Rizzo: Bai, gozatu. Ikusten duzu guys. TOMAS Reimers: Ikusi ya.