>> 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.