[MÜZİK OYUN] ALLISON BUCHHOLTZ-AU: Pekala, herkes. Bölümüne hoş geldiniz. Yani bugün bizim gündem oluyor çok daha fazla web dev şeyler üzerinde. Ben kaç bilmiyorum Eğer psets gördük yayımlandıktan beri Bu sabah. Ben kaç olarak olur İnsanlar spec okudum, ancak tüm yaşadığınız nasıl olarak gören bir, gibi, yedi saat ona bakmak ve bu kadar Pazartesi ve muhtemelen, sınıf yaşadım Ben varsaymak gidiyorum Size en değil. Eğer fazladan şeref varsa. Siz temelde yardım ediyoruz Basit bir web uygulaması yepyeni bir pset olan C sunucu, böylece siz Gine domuzları olmak olsun. Bu eğlenceli olacak, vahşi hafta, ama çok eğlenceli olacak düşünüyorum ve gerçekten olacak Aslında iyi bir deneyim. Yani için hazırlamak Bu bölüm bugün, Biz chmod, TCP / IP gidecek ve konum Sonra HTML ve CSS biraz. Sonunda biz kod aslında edeceğiz Basit bir web sayfası kadar birlikte Size yardım etmek için adamlar tür almak daha o aşina. Ve sonra kaldırdı değil varsa senin sınavlar, onlar, ön konum ama ben çok emin değilim herkes Burada onların sınav vardır. Ve ayrıca o notta, çözümler, henüz değil ama en kısa sürede biz gibi finish-- gibi onların quizzes-- alarak son birkaç kişi onlar olacak. Herhangi bir sorunuz varsa bu arada, şahsen bana e-posta çekinmeyin. Ben senin birey ile cevap verecektir sorular, hep yaptığı gibi. Yani chmod o notta, üzerinde. Yani temelde tüm size chmod hakkında bilmeniz gereken o değiştirmek için kullanılan olduğunu dosya izinleri, değil mi? Yani sadece bazı sistemler bir çağrı var Burada diyor, izinlerini değiştirin. Ve hiç görmek istiyorsanız ne sahip bir dosyayı izinlere, yerine yapıyor ls, sen ls -l yapabilirdi. l uzun duruyor. Peki uzun listeler yapacağız her şeyi, ve size çok daha detaylı verecek dosyalarınızın her biri hakkında bilgi. Ve ben şey-- görürsünüz Bir saniye için önde atlamak için gidiyoruz ama benzer bir şey görürsünüz Her dosya için oradaki üst çizgi. Ve bunun ne demek olduğunu aracılığıyla gidersiniz. Yani temelde, değiştirmek için Dosya izinleri, Sadece chmod kullanmak istiyorum. Başka şekilde düşünmek olabilir UNIX ls veya cd veya etajer gibi diyoruz. Başka bir benzeri çağrı sadece tür. Peki chmod yapmak ve daha sonra yaparız tipik olarak üç basamak vardır. Yapmak için bir kaç yolu vardır o, biri biz tekrar gidersiniz. Ama genellikle, sen üç olacak 0'dan 7'ye her zaman değişen rakam. Yani bir şey vardır ki Üç farklı izinler her dosyayı verebilir. Ve o, hangi okunabilir mantıklı olan, r tarafından temsil Biraz içinde; olan w, yazılabilir; ve x hangi çalıştırılabilir. Ben biliyorum, e bir, çalıştırılabilir, belki değil en duygusu, ama biz x ile temsil etmektedir. Ve sonra ne olur bu her biri Ayrıca sayı temsil var. Yani biz 1, 2, ve 4 var. Ve temelde ne olur ise Bu üç sayı her Burada karşılık gelen kullanıcıların farklı seti Bu izinler ilgilendirmeyen söyledi. Yani ilk aklınıza gelebilecek numara gerçek kullanıcıya karşılık veya dosyanın sahibi, ikinci numarası gruba karşılık gelir ve sonuncusu eder Dünyaya, tamam mı? Peki ne olur hatırlıyorum olduğunu 2 w bu Numaraları R, 4 x sağ, 1? Bu Özetle eğer Bu--, Bu sana ilk sayısını verir Bu bizim chmod giriş olabilir. Bu durumda Peki Bu sayı olur? Bu 4 artı 2 artı olurdu 1, hangi doğru, bir 7? Bu durumda, bu bir şey yok, bu nedenle bu burada olur Tamam, 700'den chmod çevirmek? Ve ne yapar tüm hibe olduğunu senin kullanıcıya bu izinlerin. Yani bu bizim kullanıcı anlamına gelir Onlar istediğimizi yapabiliriz. Onlar bu dosyayı okuyabilir. Onlar bu dosyayı yürütebilirsiniz. Onlar bu dosyaya yazabilirsiniz. Grup ve dünya, hayır ama olursa olsun izinleri, tamam mı? Yani başka bir yolu olduğunu yazmak, biz üç basamak olan her chmod yapın ne olursa olsun toplamı veya buna tekabül Belirli bir grup özel alt kümesi vardır. Ya da aslında başka bir şey yapabilirim. Tut. Biz burada bu bir şey yapabilirsiniz. Size kaç örnek gördüm nerede bir artı x chmod gibiydi? Eğer derste, bence gördün mü? Yani bir bütün için duruyor. Tüm kullanıcılara vermek anlamına gelir, Hangi Burada koymak unuttum. Ama bir artı x biz eğer biz yaparsak, burada fark Biz konum ne grup chmod-- için hakkında artı izinleri konuşuyor biz onları vermek istiyorum. Yani bu bir artı veya eksi olabilir. Artı izni ekler. Eksi izni alıp götürür. Oldukça sezgisel, sanırım. Yani artı X chmod anlamına gelir. Yani tüm insanların izinleri değiştirmek Bu bir problemimiz eklenti izinleri ise. Ve bu ne demektir izni x-- Biz herkesi vermiş olursunuz. Okumak, yazmak ya da idam? İZLEYİCİ: yürütün. ALLISON BUCHHOLTZ-AU: yürütün. Bu yüzden tüm kullanıcıları veriyoruz izni Tamam, bu dosyayı çalıştırmak için? Biz yapmak istedim Yani ne sayısal formda o? Yani sayısal hatırlıyorum, Biz üç sayı istiyoruz. İZLEYİCİ: 4 arasındadır. ALLISON BUCHHOLTZ-AU: Ne oldu? İZLEYİCİ: 4 arasındadır. ALLISON BUCHHOLTZ-AU: Değil 4. İZLEYİCİ: 0, 0, 4. ALLISON BUCHHOLTZ-AU: Peki, biz istiyoruz Doğru, tüm kullanıcılara vermek? Yani biz gidiyoruz Her yuvada bir numara. Bu olacak Her yuvaya aynı sayıda Biz sadece vermek istiyorum çünkü Herkes çalıştırılabilir izinleri. Yani çalıştırılabilir 1, ama doğru yolda. Biz 111 chmod eğer Yani olur chmod bir artı x eşdeğer. Bu herkese mantıklı mı? Biz aracılığıyla gidiyoruz örnek bir çift. Peki büyük paket Burada bir burada değil ise, ama adil tüm kullanıcılara vermek anlamına gelir. Sadece istiyorsanız u vermek veya götürmek Belirli bir izin kullanıcı veya sahibi. g grup olduğu böylece orta haneli. Ve sonra diğerleri aklınıza gelebilecek Dünyadaki bu son rakam olarak. Biz bir örnek gidersiniz ki So, Ben hep örnekler gibi hissediyorum çünkü anlamak için bu işleri kolaylaştırmıyor. Biz bu-- geçti Yani rwx-- Ayrıca 700 olarak temsil olabilir. İşte biz baktı örnek Resmin daha az. Yani bazı dosya üzerinde 444 chmod ne izinleri verecek? Gerçekten yakın. HEDEF KİTLE: tüm okunabilir. ALLISON BUCHHOLTZ-AU: Okunabilir. Herkese Yani okunabilir, değil mi? Ve sonra bunu başka bir yolu nedir? Biz chmod yapmak istiyorsanız ya r adlı veya w en, artı ve eksileri, ne bu çağrı gibi görünecektir? Bu ne chmod olurdu? İZLEYİCİ: Bir artı r. ALLISON BUCHHOLTZ-AU: 5 bir artı r. Tamam, bu, bu aynı Sadece iki farklı çevirileri Aynı şey. Bununla Yani, bu var. Yani siz denemek ve yazmak istiyorum onların zıt bir şekilde bu tür. Chmod 555 ile Böylece, bu ne olurdu? Bir artı veya u artı veya etajer olurdu? U artı x, bana üç numaralarını vermek. Ve sonra ne izinleri hakkında söyle biz aslında ve kime verilmesi mi? Peki sana vereceğim adamlar iki dakika bunun üzerinde çalışmak için. Birbirleriyle konuşmak için çekinmeyin. Biraz geldi olanlarınız için Geç, şeker ve gömlek var. Biz üç gömlek sol ve var Biz Kiti Kats ve starbursts sahiptir. Yani kapmak gelmek çekinmeyin Bu küçük interlude bazı. Ayrıca, sonuncusu zor. Bu sonuncusu için iki chmodlarını var. Aslında, ben o kapıyı kapatalım Siz bu konuda çalışırken. Candy her zaman gerekli Pazartesi öğleden sonra. Tamam, bu yüzden 555 chmod. Biz yazabiliriz başka yolu nedir? Herhangi bir fikir? Evet. İZLEYİCİ: Bir artı rx. ALLISON BUCHHOLTZ-AU: r artı rx. Eğer rx olurdu açıklamak istiyor musunuz? İZLEYİCİ: Eğer Çünkü 5, bu 4 artı 1 yüzden, böylece okumuş artı çalıştırılabilir ve tüm için. ALLISON BUCHHOLTZ-AU: Sağ. Yani sadece burada, 5 yinelemek için biz 4 ve 1 toplamı olarak biliyorum Bizim üçlü her sayı için Bu alt kümesi için izinlerin toplamı, değil mi? Kullanıcı Ya, grup, ya da dünya. Bu durumda Yani, biz biliyoruz 5 4 ve 1 ile oluşturulabilir zorundadır. Ve 4 ile 1 'e karşılık okunabilir ve çalıştırılabilir. Biz, herkese veriyoruz bu yüzden bir artı rx chmod yapabilirsiniz. Ve tabii ki, biz sadece gitti Orada soruları, şimdi bu dosya çalıştırılabilir ve herkese okunabilir. Peki ikinci biri hakkında? Bu bir numarası ne olabilir? Herhangi bir fikir? Devam et. İZLEYİCİ: 100 [duyulamaz]. ALLISON BUCHHOLTZ-AU: 100. Kesinlikle. Peki neden 100 açıklamak istiyorsun? HEDEF KİTLE: ne için Çünkü Kullanıcı, bu nedenle, ilk konumda bulunmaktadır. Sonra yürütülebilir x 1'dir. ALLISON BUCHHOLTZ-AU: Kesinlikle. Bu yüzden çalıştırılabilir vermiş olursunuz Sadece kullanıcıya izinleri. Bu durumda Yani, 100 olacaktır. Ve ben bütün cevapları Davanın bir sonraki slaytta kadar Eğer çok şeyler aşağı yazıyoruz. Tamam, bu yüzden bu bir sonraki aslında yapılır İki chmodlarını ile, bunu yapabilirdi. Yani herkes var Herhangi bir fikir nasıl olabilir chmod 640 yazılabilir olsun başka bir şekilde? Önce ve sonra kullanıcıyı değiştirebilir grup benim ipucu değiştirebilirsiniz. Yani eğer biz sadece değişen edildi Burada bu ilki kullanıcı, çağrı ne olabilir? Yani kullanıcı u, değil mi? Yani chmod u artı ne? Mmhmm? İZLEYİCİ: rw. ALLISON BUCHHOLTZ-AU: rw. Doğru, okumak ve yazmak, okumak, çünkü Bu toplamı 6 olarak birlikte, 2 w, 4. Yani biz chmod olsun u artı rw, ve orada bizim ilk 6 olsun. Öyleyse 4, şimdi istediğiniz almak için Bizim grup ayarlarını değiştirmek için. Bu yüzden chmod g artı ne yapacağız? 4 nedir? İZLEYİCİ: r. ALLISON BUCHHOLTZ-AU: r. Kesinlikle. Bu yüzden sahibi veriyoruz okuma ve yazma izinleri ve biz grup okuma veriyoruz Burada tüm kadar var izinleri. Mmhmm? İZLEYİCİ: Eğer bir şey yazabilirsiniz, Eğer çalıştırmak ima ediyor? ALLISON BUCHHOLTZ-AU: Sen şey-- yazabilirsiniz Ben inanmıyorum bunu yürütebilirsiniz ima eder. Serin. Yani biz sadece geçti hepsi bu. Yani bu bir sonraki, bir var sadece tür ortak vakaları Eğer tutmak istiyorum senin sorunun set için akla. Bunlar genellikle izinleri bizim gibi bu kullanmak. Böylece 711 için, bu verir Bizi, tabii ki, kullanıcı Tüm izinler, hangi mantıklı eğilimindedir. Ve sonra tarafından çalıştırılabilir mantıklı dünyada grubu, Bazı dizin varsa, içine hareket edebilmek istiyorum. İnsanlar erişim gerekir. Olmayan herhangi bir PHP dosyası için, gidiyoruz ne yapacağını, hangi 644 kullanılır? Ne ima, ya da ne yok izinler veriyor? Peki sahibi ne olabilir? HEDEF KİTLE: okuma ve yazma. ALLISON BUCHHOLTZ-AU: okuma ve yazma. Ve sonra grup ve diğerleri sadece sağ, okuyabilir? Sonra herhangi chmod 600 Kullandığınız PHP dosyaları, senin sahibi, yine can okumak ve ona yazma ama başka herkes sadece tür kapalı engelledi. Yani bu aslında olacak zaman daha yararlı olabilir Eğer sorun olsun ayarlanan bir sonraki hafta nerede aslında bir web sitesi inşa ediyoruz. Hiç haline çalıştırırsanız Yani Herhangi bir garip sorunlar nereye yükleme değil düzgün, belki size Bir yürütülebilir eklemeniz gerekir izin, ya da belki bir okuma ihtiyacınız veya yazma izni. Insanları gezi eğilimi Küçük şeyler yukarı, ama bu tür go-gibi ne zaman gelecek haftaki pset başlar. Ve ben size daha vermek istiyorum Bu haftaki pset ilgili ipuçları ama ben beri ona bakmak henüz Bu sabah serbest bırakıldı. Ama ben baktım olacak, bana e-posta ona zaman yarın cevap. Peki şimdi, herkes chmod ile iyi? Herhangi kalan sorular? Oldukça basit. Sadece biraz takip ederek ne okuma, yazma, ve sayılar yürütmek muhtemelen en zor kısmıdır. TCP / IP, tüm bu protokollerle Yani, tür veri yapıları gibi Geçen hafta, çok daha bulunuyor tür almak için önemli Bunlardan daha yüksek bir seviyede sezgi. Nereye gidiyoruz Bu CS143 değil Bir ağ uygulamak için size sormak, böylece eğer iyi olacak anlamıyorsun tüm protokolleri işin cesur. Asıl önemli olan anlamak için tür temsil ettikleriyle gibi ve neden önemlidir konum. Böylece TCP / IP, tabii ki, bunun İletim Denetimi Protokolü veya Internet Protokolü, hangi temelde yasalar temelde sadece bir dizi veya standartlar verileri söyle nasıl ele alınmalıdır, o packetized nasıl olması gerektiğini, iletilen ve alınan. Temelde Yani, sadece gibi Burada diyor ki, şansını artırır veri nerede olur Eğer almak istiyorum. Ben siz gitti eğer eminim ders veya çevrimiçi izledim O bilmiyorum has-- bu yıl yaptım eğer, ama ben geçen sene biliyorum, o vardı, bir O Rob bir resim vardı demo ve o bölünmüş Dört ve zarf koydu ve Sanders genelinde bunu almaya çalıştı. Ve ne tür can Bunun bu şekilde düşünüyorum. Bu kurallar sadece bir dizi olduğunu nasıl bir yere almak için verileri söyle ve eğer bilmenizi sağlar Eğer, verileri eksik Aynı şekilde sen eğer notlar birden çok sayfa alarak ve sayfa 104, sayfa ile etiketlemek 204, ve daha sonra çalışmak için geri gitmek ve şey-- eksik Eğer sayfayı bulamıyor 304-- biliyorsun şey yanlış, bu yüzden size notlarınızı üzerinden bakabilirsiniz Tekrar veya sizinle yeniden birine sormak ders o günden notlar. internet üzerinden veri ile aynı şekilde. Ben soruyorum varsa Bazı sunucudan şey ve göndermek gerekiyor çoklu paketler halinde, Muhtemelen numaraya gidiyor o bir şekilde, let beni almış kaç biliyor, ve bu 10 biri, ah, söyle veya 10000 biridir. Ben yenilemek gitmek yolu Birlikte tüm parçaları, Bir şey eksik olursa ben biliyorum ve ben tekrar isteyebilirsiniz. Mantıklı mı? Kurallar sadece bir dizi. Temelinde, tamam, kurallar kümesi? Yani biz de konuştuk bir Bağlantı noktaları hakkında biraz. Bu gerçekten sadece bir standart olduğunu veri ne tür bilmenizi sağlar Bu paketler halinde iletiliyor. Biz gidersek bizim zarf örnek, biz yapmak bunun bir resim olduğunu biliyoruz Orada Rob biz yazmak sürece Bizim zarfın dışında. Yani limanlar temelde aynı şeydir. Bu anlamaya sadece bir yolu nedir veri türü iletiliyor. Yani biz tüm var Burada en yaygın olanları. Yani 21-- bunlar tür de iyi şeyler gibi bilmek. Bu kolay bir sınav soru türüdür. Port 80 ne yapar gibi ol? Ya da, liman 443 ne yapar? Yani iyi şeyler bilmek. Yani biz burada var, 21 dosya aktarım protokolü, sadece bu yüzden Dosya transferi yöneten kurallar. 25, bir şey ki hepimiz kullanmak çok fazla, e-posta olduğunu. 53 alan adı Temel olarak, sistem, bir arama sadece tür Bir etki alanı adı, IP adresi. Yani öyleydi eminim , konferansta söz eğer gibi bir şey gidin google.com, bir IP adresi vardır Bu onunla ilişkili oluyor. Aslında google.com değil. Ve böylece 53 bağlantı noktası aslında alır çevirisini tür bakımı Sizin için bu IP adresine. Ve sonra 80 ve 443 derece yaygındır. Ya web sayfası var ya Eğer güvenli bir web sayfası var, hangi web sayfalarının bir yeri vardır Şimdi aktarmaktadır. Yani bu tür yüksek seviyesi bulunuyor transfer protokolü genel bakış. Ben derinlemesine çok daha görmüyorum. Serin şeyler tür Eğer ilgileniyorsanız. Kaynakların bol var. Vikipedi aslında oldukça iyi bir sayfa. Yani ona bakıyordu Sadece bir süre önce, bu yüzden son derece tavsiye ederim Eğer ilgileniyorsanız ona bakarak ya da iki yıl çünkü 143 almak Ben her yıl olduğunu düşünüyorum. Peki bu ucunda, biz konum web sayfaları ve HTTP bahsediyoruz, hangi aslında bizim bir sonraki konu bugün HTML ve CSS içine gitmeden önce ve aslında bir web sayfası kodu olabilir. Bu eğlenceli olacak. Biz resimlerini olacak tavşanlar ve büyük olacak. Peki HTTP, burada gördüğünüz gibi, Güzel kısaltmalar biridir Bu hafta, hangi Köprü Metni Aktarım protokolü. Yani yine, bu sadece kurallar başka bir set ki Hypertext'ten yönetir Bu durumda, transfer. Yani en iyi yolu öğrenmek için hakkında bu sadece tür olduğunu içine yıkmak için Bu bireysel kelime Bir yeri vardır, çünkü Orada ekranda kelimeler. Bu yüzden hipermetnin başlamak için gidiyoruz. Yani "hiper" Aklınıza gelebilecek "Yukarıda," gibi süper-türü bir şey. Yani gerçekten sadece alınan metne var Bir sonraki seviye, süper metin gibi yani, Bir sonraki metin gibi. Yani sadece temelde var Bizi verir metin daha fazla bilgi Normal metin tamam, değil mi? Yani burada bu durumda, bu köprü olduğunu. Bu biz söyler biz gidiyoruz bazı bağlantı, bu cs50.net, olduğu Şimdi cs50.harvard.edu olduğunu. Bu slaytlar biraz eski. Ve görüntülemek için gidiyor Bu gibi bir köprü olarak, ve sonra gerçekten harika bir web sitesi. Biraz Yani bu metin, Orada gerçekten harika şeyler biraz. Şeyleri bağlantı ve böylece can görüntüleri eklemek ve bir şeyler stil yapabilirsiniz. Ve senin o en tanıdık şey adamlar muhtemelen Hipermetinde ile var Köprü Metni Biçimlendirme Dili, HTML, bir Elbette ağ-yapının her hangi Çevremizde gördüğümüz, verilen atılmış bazı CSS stili ile. Ama kimse ise MySpace ile gerçekten büyük, Ben bütün el HTML eminim her zaman oluşturmak için Bu mükemmel profilleri, değil mi? Bu bir olabilir gibi hissediyorum eski artık referans, ama ne olursa olsun. Sadece bir küçük-- siz o kadar genç değil. Bazılarınız benden daha yaşlı. MySpace'de hala oldu şey ben gençtim. Ben o eski ben değilim. Neyse, HTML hipermetnin sadece bir form. Yani köprü sadece bir eklenen özellikleri ile metin. Yani aktarım protokolü muhtemelen daha şüpheli bir şey açıklamak. Açıktır ki, transfer-- Sadece veri transferi. Yani ya müşteri arasında gibi web kardeşi ve bir sunucu. Yani temelde sadece yolu internet çalışır. Bir Yani tam isteği nasıl bu iş, biz konum aslında bir bakmak için gidiyor örnek istek ve tepki. Ama biz nasıl talep bir sunucudan bilgi Sunucu bize nasıl cevap ve bir Bu aktarım protokolü yönetir ne. Yani istek ve tepki var kurallar bu özel set izleyin. Bu standardize oluyor olursa olsun, böylece nereye internet kullanıyorsanız, o zaman tamam, aynı şekilde çalışır? Yine, protokol, kurallar kümesi. Sadece bir normal aynı şekilde etkileşim Profesör Malan bahsettiği Birisi elini uzatır eğer, Eğer ortak nezaket olduğunu biliyorum senin ulaşmak ve onların elini sallamak. Bu doğru, bir protokol? Yani, bazı standart isteği vermek ki ben senin elini sıkmak istiyoruz olduğunu, ve bazı standart vermek Hayır, teşekkürler, ya bir tepki, veya denemek ve sallamak olabilir benim el ya da belki denemek için gidiyoruz ve yumruk bana çarpmak. Ve biz bunun için bir protokol yok. Bu ayırır. Ama herkes takip eğer Aynı protokol, tabii ki, çok daha sorunsuz gider. İnsanlar birbirlerini tanımak. Herkes mutlu. Web dünyasında Yani, herkes aynı rules-- izler sosyal standartlara göre biraz daha iyi. Ama bu, biz bakacağız Burada bir örnek isteği. Yani bu küçük var alt burada anahtar Bu size farklı renkler söyler, ne zannediyorsunuz demek. Yani beyaz sadece yönteme gibi istek ve protokol version-- böylece yöntem isteği, sürüm. Sonra bu bir alan adı ve değeri bu alanda, hangi we will Çok, çok kısa bir süre içine gidin. Yani bu bir örnek isteği. Bu, beni dışarı uzanan gibi Kendimi tanıtmak isteyen. Bu ne istemci ya da ne web tarayıcısı senin sunucusuna göndererek olacaktır. Yani bu bir get isteği, bu yüzden var sunucudan şey soruyorum. Ve HTTP, tabii ki, bu ve sürüm 1.1 bulunuyor. Yani bu burada kalan dediğimiz budur başlık ve onun ekstra bilgiler Bu bize daha iyi bir fikir verir Ne biz aslında için soruyorsun, ya da biz istiyoruz bilgi vermek için formüller verilmiştir olabilir sunucusu. Yani User-Agent biraz daha verir Örneğin on-- açıklama, burada, kıvırmak / 7.24.0 aslında anlatacak Biz Google'ı kullanıyorsanız sunucu Bizim tarayıcı olarak Chrome. Hiç duymak Yani eğer konuşmak hakkında insanlar Bir uygulama duyarlı yapma konusunda Birden tarayıcılara, Bu bir şey olduğunu onlar eğer nedeniyle kullanırsınız Ne tarayıcı bilmiyorum istek, geliyor Eğer bu veri terzi olamaz. Bu durumda, kullanıcı o sadece bu tür veriyor tanımlama bilgileri ne tarayıcı hakkında Kullanıcı şu anda tamam, kullanıyor? Öyleyse biz de olan ev sahibi olması Nerede biz aslında gitmek isteyen ediyoruz. Bu durumda, biz gitmek istiyoruz apple.com, bazı serin yeni iPad'ler satın ya da bir şey, belki sevimli Bizim yurt odalarında ışıklar. Ve sonunda ad değeri sadece bir Bir dolgu, sadece genel bir şey Siz görmek için. Aslında değil Burada bir şey gelir. Peki sizin kadar ya da olabilir Her durumda istediğiniz kadar az. Çoğu zaman, bunlar isteğe bağlıdır. Sadece ne bağlıdır Eğer tarayıcı ihtiyaç senin kullanıcıdan sipariş den düzgün isteği verir. Ya da ne kullanıcı bağlıdır Aslında sunucuya kadar vermek istiyor. Yani birçok, birçok olabilir Bu başlık alan adları ya da sadece bir çift var olabilir. Çok şey gibi Bu bölümde söylediğim, gerçekten bağlamda bağlıdır ve nasıl bu kullanıyorsunuz. Böylece herkes için mantıklı yapar? Bu sadece bir örnektir Bir istek, başlıklar, etajer. Bununla böylece Tamam, bazı tepki var. Yine, bizim durum kodu, protokolü var sürüm ve ardından alan adı ve alan her zaman olduğu gibi değer. Bizim protokol sürümü Yani ve bizim durum kodu 200. Bunun anlamı, OK evet, her şey iyi gitti. Burada ne istediğinizi. Sunucu türü, içerik o bize type--, tamam, sen Bazı metin HTML alacağım. İşte bunun uzunluğu ve burada Eğer bağlantı ile ne yapmalıyım. Tamam, bu yüzden daha bağlı sen verilere , soran bağlı ne Sunucu size dönmek istiyor, Bu alan daha fazla olabilir isimler, daha az olabilir. Tamamen bağlam bağımlı. Ve bildiğim kadarıyla bu durum Burada kod, tabii ki, 200 tek değil Eğer doğru, olabilir? Biz durum kodları çok var. Herkes herhangi hatırlıyor mu Biz derste belirtilen diğerleri? Birçoğu 4 ile başlar. İZLEYİCİ: 404. ALLISON BUCHHOLTZ-AU: 404, hangi? İZLEYİCİ: Dosya bulunamadı? ALLISON BUCHHOLTZ-AU: Dosya bulunamadı. Kesinlikle. Peki 403 hakkında? HEDEF KİTLE: Yasak. ALLISON BUCHHOLTZ-AU: Yasak. Peki siz ne düşünüyorsunuz Bu chmodlarını ile gelir? İZLEYİCİ: Bunun anlamı sen misin Okumak için izniniz yok. ALLISON BUCHHOLTZ-AU: Kesinlikle. Bir şekilde, sahip değilsiniz izin hakkı, erişmek için? Yani 404, 403. Gerçekten komik var Bir bu her zaman Her yıl tanıtmak Ben, buraya koymak gerekirdi 413 gibi, ki ben bir çaydanlık olduğum. Bunu google. O kodu gibi komik 413 ve ben bir çaydanlık olduğumu var. Hangi Ben yapacağınız neden bilmiyorum Hiç internette buna ihtiyacım, ama konuyu dağıtmak. HEDEF KİTLE: Belki bir çay potu konum. ALLISON BUCHHOLTZ-AU: Belki Sunucu bir çay pot. Kim bilir? Pekala, bu yüzden üzereyiz Gerçek kodlama içine geçiş. Sizlerin gidiyor gibi hissediyorum oldukça hızlı buradan. İZLEYİCİ: Neden yapar İki kez: sunucu "diyorsunuz? ALLISON BUCHHOLTZ-AU: Hımm? Sunucu iki kez? Bu iyi bir soru. Emin değilim. Ben dışarı bulacaksınız ve Hepinizi e-posta göndereceğiz. Tamam, bunun yanı sıra başka sorunuz var mı? İyi mi? Serin. HTML ve CSS, ve şimdi biz tüm eğlenceli parçalar olsun. HTML, ben daha önce de belirttiğim gibi Muhtemelen şeylerden biridir Siz en tanıdık. Bu yüzden HyperText Markup Language var. En iyi yolu paha öğrenmek için I do not Herhangi hazırlanan slaytlar ya da bir şey var HTML ile siz için. Bu sözdizimi öğrenme konusunda gerçekten. Ve MySpace olsaydı gün, bu aşağı olurdu. Yani gerçekten, büyük şey Sadece uygulama ve deney için. Büyük kaynaklardan biri I would Çok kullanmanızı öneririz W3Schools olduğunu. Yani sadece W, 3, ve sonra Okulları. Onlar çok bir var HTML kaynaklar, CSS, ve aslında bir var şey bölünmüş ekran tür nerede onlar size örnek kod vereceğim. Sen onunla keman olabilir, değiştirmek, ve Update basın, ve size göstereceğim ne o aslında web sayfasına yapar. Ben çok bu kullanmanızı tavsiye ederim. Oldukça serin. Sen seg hataları almazsınız Burada işler ters gittiğinde. Almak için yönetmek HTML ile bir seg arıza, Ben çünkü bana bildirin yok gidiş gerçek ilgisini edilecek. Ama Çünkü gerçekten harika şeyleri değiştirebilir, Onları canlı güncellenen görebilirsiniz. Ve ben bir daha alırsınız düşünüyorum HTML daha sezgisel kavramak Aslında sadece bazı harcamak durumunda Zaman onunla deneme. Dedim yüzden işte, uygulama ve deney. Google, buradan itibaren dışarı, muhtemelen olacak En iyi kaynakları ve arkadaşlarından biri. Veya Bing-- Ben, Microsoft çalışıyorum belki ben Bing demeliyim. Ama hoş çok şey Sadece sözdizimi olacak, böylece etiketleri ne anlama, En az CSS-- ile understanding-- nasıl belli niteliklerini değiştirmek için. Süper yararlı olacak. Biz değil Yani olsa Herhangi hazırlanmış şeyler var, bazı iyi uygulamaların tür var Biz siz deneyin ve uymak istiyorum by-- ya da daha doğrusu, sen-meli bir sonraki duyuruya kadar uymak. Yani tüm etiketleri kapatın. Umarım herkes ne biliyor has--, Bu şu anda mantıklı değilse, Ben mantıklı söz veriyorum Biz sayfa yukarı kodlama yaparken. Ama bütün etiketleri kapatın. Yani hiç bazı varsa dirsek var başlık, H1, dirsek, emin olun ne zaman ki ile bitti, O başlık kapatın. W3 Validator ile sayfanızı doğrulayın. Eğer etiketleri kapatmak yoksa, Eğer beklenmeyen bir davranış alabilirsiniz. Bu sayfa geçersiz olduğunu söylerim Eğer bu denetleyici üzerinden çalıştırmak durumunda. Peki ne zaman doubt-- ve özellikle Bu haftaki ve önümüzdeki haftanın biz sormak aynı şekilde pset-- Eğer kontrol kullanmak için 50 ve stil 50, Eğer bu düşünebildiğim senin çek biri olarak, tamam mı? Bu W3 Validator geçmez Yani eğer. Yani seni rıhtım şeydir. Ya da ben doğru söylüyorum Şimdi, ben seni gelinir. Yani doğrular emin olun. Bu zor değil. Sen sadece kodu yapıştırın ve iyi bir iş söyleyeceğim ya veya eksik Aynı şekilde bir şey Bu tarz 50 söyler nereye kadar karışıklık ediyoruz. Ve sonra son bir şey Eğer ayırmak istediğim Tüm bu HTML sizin biçimlendirme, veya metin, ve stil. Bu yüzden bir örnek yapacağız Bundan sonra bu hakkın. Yani HTML ve CSS ayrı olmalıdır. Ve biz hakkında konuşmak için gidiyoruz Model View Controller olan MVC, gelecek hafta. Siz muhtemelen gerektiğini derste bu konuda bilgi edinmek yarın olsaydı Zaten bugün öğrendim. Ve bu tür sadece var Biz eğilimindedir bir paradigma web oluştururken kullanmak için sayfaları şeyleri ayırmak için. Aynı şekilde düşünmek olabilir Biz C ayrı işlevlere eğiliminde olduğunu nerede şeyler bulmak için hash. Bu sadece bir yol var hayatınızı kolaylaştıracak. Bu özelliklerini veya kodunu ayıran Eğer tekrar tekrar kullanıyor ve olacaktır Ancak bu durumda, bu tür ve o güzel ve temiz tutar. Ve değiştirmek istiyorsanız bir şey, bir kez değiştirmek ve her yerde başka değişti. Yani daha var senin kolaylaştırmak ve esneklik. CSS ile Dolayısıyla, çok benzer HTML, ancak bunun yerine, etiketler Ben şimdi sadece bahsettiğim, biz seçicileri ne denir kullanın. Ve onlar temelde sadece tür belirli bir etiket ilişkilendirmek Farklı özelliklere sahip HTML. Ben özelliklerini derken, demek yazı tipi rengi gibi şeyler, yazı tipi stili, arka plan rengi metnin rengi. Şeylerin o sıralar. O merkezli eğer gibi, sağa kapalı ise, her inverted-- ise bu serin şeyler. Herhangi bir üslup şeyler Eğer metin yapmak, Bu Ben özellikleri ile ne demek olduğunu. Ve sonra iki ana şey bilmek olduğunu Ana factors-- iki selectors-- eşsiz İD vardır. Sadece bir şey için kullanabiliriz. Aksi takdirde, sen bağırma olacak. Ve biz bunu tanımladığınızda Bir CSS dosyasında, o olacak Daha sonra karma kimliği ve olmayacak ne istiyoruz bağlıyor. Ben biz gidiyoruz söz Bir örnek üzerinden gitmek. Bu çok daha mantıklı olacak. Sınıf birden çok blok başvurabilirsiniz. Yani sahip edebilirsiniz Birinci ve üçüncü fıkra niteliklerin eğer aynı tür var Aynı sınıfta bunları ilişkilendirmek. Ve biz onları tanımlamak ne zaman CSS, biz bir nokta sınıf yapmak, sınıf olmak ne olursa olsun Eğer ismini vermek istiyorum. Yani bu doğru olduğunu biliyorum Şimdi çok soyut. Biz kod gidiyoruz bu yüzden. Ben siz sevdiğini biliyorum Bu ve hepsi Çünkü bana yardım edecek Bu web sayfasıdır. Bu, adamlar bizim bölümün web sayfası. Yani ben daha önce orada herhangi bir soru vardır PowerPoint kapatmak, ya da bir şey Eğer bana geri kaydırma istiyorum Biz kodlama başlamadan önce mi? İZLEYİCİ: Eğer söylemek maç etiketleri, Eğer seçicileri veya etiketleri demek istiyorsun? ALLISON BUCHHOLTZ-AU: You can Aynı şey gibi onları düşünüyorum. Sadece farklı kelimeler var. Ben seçiciler gibi, demek. Ama seçiciler de etiketleri haritası. Yani siz onları düşünüyorum edebilirsiniz etkili aynı şey. Ben bunu yapmak için gidiyor veriyorum Biz kod daha mantıklı. Gelen şey PowerPoint veya herhangi bir sorunuz Şu anda biz önce aslında Bizim bölümün sayfası oluşturmak? Herkes hazır mı? Serin. Yani bir başlamıştır. Bana çocuklar için yazı artırmak edelim. Tamam, bu yüzden şu anda, biz sadece var bir Burada çıplak kemikleri web sayfası. Biz bazı HTML var. Biz bazı başlık, sahip olduğu biz örnek web sayfası olarak burada görüyorum. Bazı başlık, bazı yazı tipi. Bunlar tamam, etiketleri? Yani demek ne zaman görüyoruz, sizin etiketleri kapatmak Burada bu braket kafası sizin açılış etiketi, ve bu dirsek / Kafa Tamam, bunu kapatıyor? Peki bu düşünebildiğim senin durumunda koşullarda parantezi ya senin döngüler için. Eğer başında biri varsa, Eğer sonunda bir tane istiyorum. Hala çoğu zaman çalışacak Eğer kapalı bir etiketi yoksa, ama en iyi uygulama sizin etiketleri kapatmak olduğunu. Peki bu durumda, en bu değiştirelim. Biz bölüm yedi zorunda gidiyoruz. "Bölüm Web sayfası." Yani sadece bu değiştirmek için gidiyorum. Ve biz burada gitmek ve eğer biz reload-- lazım kaydetmek ve reload-- Burada o kadar fark Doğru, değişti? Serin. Yani bu başlığı değiştirir. Bu sekmesinde ne ait. Yani bu tür bir Sıkıcı tür arıyorum. Ben çocuklar hakkında bilmiyorum. Biz burada başka bir şey istiyorum düşünüyorum. Peki ne yapabilirsiniz, başlık sadece orada. Vücudunun çeşit yapalım. Yani biz burada bazı vücut var. Ben her zaman açık yapmak ve başlatmak için benim etiketleri kapatmak, Aynı şekilde ben parantez yapmak. Ah. Bekle, ne? İZLEYİCİ: [duyulamaz]. ALLISON BUCHHOLTZ-AU: Ah. Siz beni. Aferin. Altın yıldız. Tamam, bu yüzden biz burada bazı vücut var. Ve şimdi bazı metin ekleyerek başlayalım. Yani birkaç farklı var Metin eklemek için seçenekler. Biz başlıkları gibi şeyler var. Biz sadece normal metin var. Yani sadece bir başlık ile başlayalım. Aslında, siz isterseniz W3 Okulu HTML yukarı çekin, Eğer tür etrafında bakabilirsiniz ve bir şey varsa Eğer denemek istiyorsanız, özellikle bu Bu web sayfası ile, bunu yapabiliriz. Yani bu durumda, en sadece bazı h1 yapalım. Yani h1 yüksek başlığında gibi. Size bir şey verecek Bu çok büyük ve cesur. Ve bu durumda, biz istediğimizi yapmak Bizim web sayfasında ilk metin için? Şey. Siz bu oluşturmak için gidiyoruz. Ben sadece yazın gidiyorum. HEDEF KİTLE: Hoşgeldiniz. ALLISON BUCHHOLTZ-AU: Hoşgeldiniz. Tamam, böylece biz onu kurtarmak ve yeniden eğer, Biz kocaman bir karşılama var. Yani sadece bu yüzden görebilirsiniz farklılıklar, en H6 şey yapalım. Ne biz burada istiyorsun? Doğru? Tamam, bu yüzden sadece, böylece farkı görmek. Evet, Yüce. Yani fark ederseniz, h1, çok, çok büyük. h6, kalın gibi, ama çok daha küçük, ve arasında her şey var. Yani h2, H3, H4 olabilir. Ve bunlar sadece başlıkları vardır, böylece çalışıyorsanız Bir web sayfası oluşturmak için , farklı bölümler vardır Belki kullanmak istediğiniz Orada bir yerde başlıkları. Serin. Bu yüzden biraz daha ekleyeceğiz Vücudumuzda şeyler. Ben bu tür olacağını görmek Biz resmi olsaydı serin. Herkes belki kullanabilirsiniz gibi hissediyorum sevimli tavşan resmi şu anda yaklaşık, bu yüzden bulmak için gidiyoruz Önce bir tavşan resmi. Siz herhangi varsa bilmiyorum tercihleri ​​hangisinin biz istiyoruz. Eğer herhangi bir tercihleri ​​var mı? Burada bu? Aşağı. TAMAM MI. Bu bir o. İyi seçimler. Tamam, bu yüzden bizim resmi görebilmek için gidiyoruz. Şuna bak. Bu sevimli şeye bak. Nasıl üzgün olabilir Bu bir Pazartesi günü? Yani biz sadece gidiyoruz Görüntü URL'yi kopyalayın. Ve ne biz yapmak istiyorum, şimdi sadece Biz paragraf için bazı p söylüyorlar. Biz "Bak demek için gidiyoruz sevimli tavşan bakmak. awwww d'. " Ben tavşanlar seviyorum. Ben evde bir tavşan var. Ben tavşan özledim. Peki ne sanıyor- için gidiyoruz Siz isterseniz ben bilmiyorum bu-- ancak HTML ile google, nasıl bir görüntü içerebilir? Kelimenin tam anlamıyla, sen google eğer "Görüntü HTML dahil" neden siz söyle yapmak Bu etiket ne olmalıdır? İZLEYİCİ: img source-- ALLISON BUCHHOLTZ-AU: img source-- İZLEYİCİ: --equals-- ALLISON BUCHHOLTZ-AU: --equals-- HEDEF KİTLE: evet --quote--. ALLISON BUCHHOLTZ-AU: Mükemmel. Güzel. MySpace nesil, sağ, görüyor musun? HEDEF KİTLE: Neopets. ALLISON BUCHHOLTZ-AU: Neopets. Tamam, evet. Vaov. Bu deli oldu. TAMAM MI. Yani bu hakkı almak emin olun. Serin. Yani bu burada olmalı. Biz yeniden eğer Ve sonra, bizim var Bu sevimli değil mi sayfada tavşan? Bu çok şirin. Sen büyük, büyük bir fotoğraf seçti. Ben kazıyorum. Tamam, bu yüzden şimdi bu sevimli tavşan var. Biz eklemek başardık Görüntü, sadece böyle. Yani temelde herhangi bir görüntü varsa Eğer, web sayfanıza eklemek istiyorum Eğer sadece bu gibi ekleyebilirsiniz. Başka bir şey varsa olurdu Eğer görüntü depolanmış Aynı klasörde olarak Bu dosya, sadece can Bu görüntünün ne olursa olsun adını yazın yerine bir web bağlantısını sahip olduğunu. Hala tırnak içinde olacaktır. Bu gibi olurdu Biz bu-- adını olsaydı Bu resim kaydedildi olsaydı Bu HTML dosyası ile klasörde Ben ve düzenleme ediyorum bunny.jpg olarak adlandırıldı. Biz de yapabiliriz ve o kadar gösterir. Ancak, bu kaydedilen yok Dosya ve ben, tavşan tutmak istiyorum bu yüzden bağlantıyı tutmak için gidiyoruz. İZLEYİCİ: rabbit.org nedir? ALLISON BUCHHOLTZ-AU: rabbit.org. Bir appropriate-- var: Bunu kabul edebilir, bak. Evlat edinme. bunny.jpg. Ben bu tavşan benimsemek istiyorum. Tanrım, o kadar sevimli. Tamam, bu yüzden başlıklarını ekledik. Biz bir resim ekledim. Açıkçası, biz ekledi Burada bazı metin, değil mi? Diğer eklemek istedim metinler, böyle gitmek istiyorum. Yani bu başka bir paragraf. Ve biz "bu başka bir paragraf." Deyin Ayrıca, ben korkunç bir yazım değilim, bu yüzden bir şeyler yanlış yazarlar olabilir. Bilginize. Yani başka var Burada paragraf, değil mi? Yani belki bir şey yapmak istiyorum Biraz daha ilginç sadece fazla Sağ hizalanmış gibi tüm metin, var. Belki, tamam metni ortalamak istiyor? Birisi bu kullanmak istiyorsa önünüzde kullanışlı bilgisayarlar ve sen nasıl söyle Bu metni ortalamak için gidiyor, İZLEYİCİ: p align. ALLISON BUCHHOLTZ-AU: Yani p align "merkezi." eşittir O, çocuklar öldürüyor. Hepiniz hızlandırmaya ihtiyaç. Ve biz, "Bu merkezli." Var Ve şimdi bir şey merkezli var. Aynı şekilde, eğer o sola hizalanmış istiyorum, align eşittir yapabileceği Sol, sağ hizalama eşittir. Tamamen size kalmış. Ben burada olsaydı, o zaman bu should-- şimdi doğru hizalanmış oluyor. İZLEYİCİ: Allison? Görüntü kaynağı olarak, neden değil, Orada img kaynağının yakın? ALLISON BUCHHOLTZ-AU: Üzgünüm. Bu biri olmalıdır Şimdi iyi ordasın. Şimdi iyiyiz. HEDEF KİTLE: Eğer yok mu Orada kapatın, ya da değil mi? ALLISON BUCHHOLTZ-AU: Peki, bu yüzden img Kaynak, bu bir görüntü ile sadece- olan sadece, oysa bir unsur olarak görmüş Bu geri kalanı için fark ederseniz, Biz bilgi daha sonra bazı etiketi var Bir kapanış etiketi ve sonra ilgilidir. Ama görüntü ile, her şey sadece sıralama kendine yeten. Serin. Yani siz bir oluşturmak için biliyorum başlık, nasıl giriş metin bilmek, Eğer bir resim koymak nasıl biliyorum Şimdi, sen bir şeyler hale getirebilirsiniz. Başka bir şey olduğunu yapabilmek için isteyebilirsiniz Bir liste oluşturmak için CS-- biz konum tür gelecek haftaki pset girecek. şeyler biz genellikle bu hafta öğretmek gerçekten iyi gider Bir sonraki hafta pset, bu yüzden konum Burada bir şeyler örtüşen, karıştırma tür. Ama önümüzdeki hafta için yararlı olacak. Bazı yaratmak istedik Yani eğer Liste, bunu nasıl yapabilir? Bu sefer cevap veremez. Başkası için vardır. Sert, çocuklar, söz değil. Google "sırasız liste HTML." Neydi o? İZLEYİCİ: [duyulamaz]. ALLISON BUCHHOLTZ-AU: Sağ. Bu yüzden düzenli veya düzensiz istediğiniz mı? En sırasız yapalım. Bu yüzden bazı ul, var olan Düzensiz listesi için duruyor. Ve biz her eleman için ne var? Kendi etiketini ihtiyacı mu? Biz sadece bir şeyler yazmaya başlayabilir miyim? İZLEYİCİ: li. ALLISON BUCHHOLTZ-AU: li. Yani olacak bizim liste nedir? Burada ne istiyorsun? Biz sadece isimleri yok. Sadece Jacob do. İZLEYİCİ: Tavşan gıdalar. ALLISON BUCHHOLTZ-AU: Tavşan gıdalar. Tamam ben böyle. Tavşan gıdalar. Tamam, bu yüzden havuç var. Ben bu tavşan tema seviyorum. Ben bunu çok kazıyorum. HEDEF KİTLE: Aslında, ben düşündüm Yakup okunaklı olacağını. ALLISON BUCHHOLTZ-AU: Jacob? Yakup tavşan besindir. Eğer görseydim Jacob Mesai saatleri fotoğraf, Eğer o var düşünebilirdi Bir katil tavşan tarafından saldırıya. İZLEYİCİ: Ben şimdi bir tavşan var. Ben şimdi bir katil tavşan var. ALLISON BUCHHOLTZ-AU: Benimle dalga mı geçiyorsun? İZLEYİCİ: Ben Bir sonraki bölümde getireceğim. Ben o var. ALLISON BUCHHOLTZ-AU: Bu çok saçma. Neyse. İZLEYİCİ: [Duyulmaz] İZLEYİCİ: Evet, benim gözetmen yanı sıra bir tavşan vardır. ALLISON BUCHHOLTZ-AU: Ben bir tavşan istiyorum. Tamam, kim gerçek bir tavşan getiriyor Bir sonraki bölümde, toplam kek noktaları. HEDEF KİTLE: [Duyulmaz] HEDEF KİTLE: Oh, gerçek değil. Bu doldurulmuş tavşan var. ALLISON BUCHHOLTZ-AU: Oh evet, bu kapatabilirsiniz. Rad görünüyor. HEDEF KİTLE: aslında önemli mi? ALLISON BUCHHOLTZ-AU: It does not. Bu şeylerin çoğu, Eğer, etiketi kapatmayın Kötü bir zaman hiçbir şey% 99 gidiyor ne, ama çok iyi tarzı için. Jacob Yani. Ve biz marul var. HEDEF KİTLE: bağlantılar için, Gerçekten önemli. ALLISON BUCHHOLTZ-AU: Hımm? HEDEF KİTLE: köprüler için. ALLISON BUCHHOLTZ-AU: köprüler için. Evet, köprüler buna ihtiyacım var. Tamam, bu yüzden burada görelim. Ve bizim listesinin yakın var. Ve biz o bakmak. Biz orada, Jacob Bay Kane var. Tavşan yiyecek. Bunnicula hatırlatıyor. İZLEYİCİ: [Duyulmaz] ALLISON BUCHHOLTZ-AU: Ben geri götürüyorum tüm eski okul başvuruları bugün Ben değil mi? Sadece tüm eski okul referanslar. Gibi getirmiş Gogurts veya aperatifler için bir şey. İZLEYİCİ: Ya Gushers. ALLISON BUCHHOLTZ-AU: Oh. TAMAM MI. Ben izleyebilirsiniz eğer görürsünüz Gelecek hafta için Gushers aşağı. Bunu yapabilirim sanırım. Sanırım olabilir düşünüyorum ofiste bazı. Tamam, bu yüzden farklı bir sürü kapalı ettik şeyleri doğru, HTML ile yapabilirim? Muhtemelen görebileceğiniz gibi, bu kadar nothing-- umarım, çok intim-- Eğer öyleyse, ben demek istemiyorum herkes küçümsemek. Eğer sorun yaşıyorsanız, Bana konuşma gel lütfen. Ama çoğu sadece bir sözdizimi bakarak, değil mi? Eğer bir sırasız liste istiyorsanız, Listenin çeşit isterseniz, Eğer bir şey hizalamak istiyorsanız veya biçim şey, sadece tüm hakkında tür bakıyor HTML sözdizimi, değil mi? Ve bir şey olduğunu oldukça serin aslında Eğer bakalım Şeye gitmek durumunda olduğunu, bizim gibi güzel bir web sitesi nedir? Herkes herhangi bir favori web siteleri var Online getirmek için Tamam mı? Sen Sadece CS50 yapalım, ne biliyorsun. Bu doğru, güzel ve güvenli? Tamam, burada CS50 böylece. Ah bir bölüm şu anda var, bak. Eğer yol isterseniz görünüyor. İZLEYİCİ: [duyulamaz]. ALLISON BUCHHOLTZ-AU: Biz değil çocuklar meta bölümü yapacağız. Bu olmuyor. Serin olurdu ama biz bunu yapmak için gitmiyoruz. Peki ne olabilir Eğer yolu isterseniz yapın çalışan bu doğru, her zaman yapabilirsiniz İstediğiniz herhangi bir web sayfasında tıklayın ve Sayfa Kaynağını yapabilirsiniz. Tüm HTML getirecektir. Ve bu aslında gerçekten iyi Kendi web sayfası tarzı yolu. Bir web sayfasına gidin size Gerçekten seviyorum ve HTML bakmak ve bunu nasıl yaptığını anlamaya. Ve tam anlamıyla, sürece şeyleri alıntı gibi, sürece sadece değilsin gibi insanlardan çalmak, sorun değil. Özellikle CS50 için [? finanse?], biz tür sizi bekliyor almak için Diğer web sitesinden ilham. Yani çekinmeyin. Web siteleri aracılığıyla bakmak Eğer gerçekten güzel olduğunu düşünüyorum ve kullandıkları anlamaya HTML ve CSS bunları yapmak. Burada gördüğünüz gibi, tabii ki var Yani ve bağlantıları gibi biz burada bir sınıf var. Biz burada bir bağlantı var. Biz bir listesi var. Biz muhtemelen bazı var Burada bir yerde resimler. Biz burada biraz serin stil var. Bu bir sonraki şey biz yapacağız. Yani tarzı, bu zaman görmek tarzı parantez, CSS temelde. Ben, bir soru var mıydı? İZLEYİCİ: div nedir? ALLISON BUCHHOLTZ-AU: div sadece div nedir A- nedir? HEDEF KİTLE: Division. ALLISON BUCHHOLTZ-AU: Bölümü. Evet, sadece gibi farklı elementlerin ayrıştırılması. Tamam, işte biz konum ne Bir sonraki içine gidecek. Yani bu iyi olmayabilir stil fark varsa, çünkü biz aynı sayfada HTML ve tarzı var ve biz aslında bu ayırmak istiyorum, TAMAM MI? Ve aslında, bana izin Benim doğru olanı açmak Bu olması gerekiyordu çünkü PDF, bu yüzden style.css var. Peki burada yapabileceğimiz bu olduğunu Bazı solmaya gibi serin şeyler ve biz denemek ve bunu, ama hissediyordu Ben karışıklık yaptığınız gibi anında o kadar, bu yüzden sana guys teşvik kendi üzerinde deneyin gitmek, ama şimdi bunu yapmak için gitmiyorum. Yani siz, hatırlıyorum, Hiç sorun kümesi vurmak, bir şey taraftan saldırıya geçer. Bu fade ile ilgisi yoktur ve geçiş ve etajer. İZLEYİCİ: Ve bu tüm CSS ve HTML var? ALLISON BUCHHOLTZ-AU: Tüm CSS ve HTML. Evet. Yani gerçekten bir çok şey yapabilirsiniz CSS ve HTML ile serin şeyler. Bizim müthiş So Burada tavşan web sayfası, biz Biraz yapacağız onunla CSS stil biraz. Yani hiç bir stil varsa Burada var sac, Sadece style.css arayabilirsiniz. Sen ne istersen diyebilirsin. Ne önemli gidiyoruz olduğunu Burada bizim web.html içinde başvurmak için. Peki ne yapacağız olduğunu biz-- yüzden değil karışıklık bu up-- yapmak Biz link gidiyoruz Birlikte bu iki dosya. Aynı yol-- ben gidiyorum Yani Burada C bir benzetme çizmek için. Aynı şekilde varsa o Bazı library-- ve biz cs50.h-- Bizim derleyici onu bağlar. Bu sadece bir açık olduğunu bizim bölümünde bağlantı. Yaptığımız aynı şekilde Yani karma bazı dosya dahil, ne Ben hakkında yazmak için sadece bir kulüpler Bu HTML / CSS eşdeğer. Biz sadece, tamam, bu web sayfasını söyleyerek Tamam, bu stil kullanmak için gidiyor? Bu yüzden biçembente eşit bağlantı rel var. Ve sonra tipi, css var. Sonra href eşittir. Tamam. Peki tüm bu burada yaptım yapabilirsiniz olduğunu Aynı şey gibi bu düşünüyorum Bir karma olarak yer alır. Açıkçası biraz daha görünüyor karışık, ama her durumda, etkin, aynı şey. Yani bu bir sadece bazı bağlantı olduğunu stil sayfası, bu tip text / css arasında bulunuyor, ve bunun adı style.css olduğunu. Bilmek önemlidir neler var web sayfası olduğunu Ben doğru çalışıyorum ki şimdi-- web.html ve aynı klasörde style.css-- vardır. Çünkü farklı klasörlerde, Eğer gerçek kök vermek gerekir o ya da buna yol için. Ancak bu durumda, biz bunu tutuyorsun süper basit ve burada olacak. Biz bunu eğer öyleyse, ben biraz var şeyler zaten burada sıraya. Bu yüzden bazı bedeni, gidiyor var Bizim arka plan rengini, var olan Şu anda açık mavi. Biz isterseniz bunu değiştirebilirsiniz, ancak Ben doğru bu hatırlamıyorsam, sadece açık mavi bunu değiştirmeniz gerekir. Ve şimdi biz açık mavi arka plan var. Ve biz ötürü-- herkes hatırlıyorum vardı karma kimliği veya sınıf hangisi? İZLEYİCİ: Kimlik. ALLISON BUCHHOLTZ-AU: kimliği. Serin. Yani biz yapmak istediğimiz olan bu yazı hangi ya da biz bak "istiyorsun hususların sevimli tavşan "mor olmak? Ben o mor olmak istiyorum düşünüyorum. Ben oldukça aşağı o mor olmak değilim. Peki ne yapmanız olduğunu = Bu durumda equals-- Ben ne güzel renk burada, dedi. Biz yeniden. Birdenbire, o mor. Tamam, ID ile çok hatırlıyorum benzersiz olması gerekir, bu yüzden kullanıyor olmamalıdır başka bir yerde bu kimliği. Ama sınıf, biz gibi Burada güzel bir yazı ile, Ben kullanmak gerekir her yerde ben istiyorum. Yani burada bunu yapalım. Bu yüzden sınıf tatlı yazı eşittir söyleyebiliriz. Şimdi bakarsanız, biz var Burada bu serin güzel yazı. Yani belki ben de yapmak istiyorum. Bu ise Tamam, ben aslında bilmiyorum işe gidiyordu ama bunu denemek istiyorum. Ve bu CSS ve HTML öğrenmek nasıl. Sen biliyorsun, gibisin Ne, ben bu denemek istiyorum. Ben işe gidiyor emin değilim. Eğer çalışırsa Bakalım. Ve şuna bak. Şimdi mor var ve bu güzel yazı var. Tamam, bu yüzden tüm bu var Yapabileceğiniz farklı şeyler. Bir sorunuz mu var? İZLEYİCİ: Evet. Peki, sadece renkleri gibi Eğer kullandığınız kelimeler. Renkleri yapmak için bir yolu var mı onaltılık RGB ile? ALLISON BUCHHOLTZ-AU: Ayrıca yapabilirsiniz onaltılık ile bunu, ben inanıyorum. Evet. Ama eğer tür güzel Onları aramak istemiyorum. Sadece mor ya da mavi gibi olabilir. HEDEF KİTLE: en onlar umalım Bu ne demek biliyor. ALLISON BUCHHOLTZ-AU: Sağ. Yani bu okuma veya Chartreuse yapalım. Neden hiç Chartreuse seçsin? Bu ilginç bir renk. Tamam, çok açıktır ki biz biz görebilirsiniz İstediğimiz ancak şeyleri değiştirebilirsiniz. Eğer create-- istedim diyelim biz başka bir sınıf oluşturmak istedik. Siz ne değiştirmek isteyebilirsiniz? Eğer yukarı çekin W3Schools ' CSS belgeleri, Ben size çocuklar zemin bırakın. Biz denemek ve serin bir şeyler yapabiliriz dakika son birkaç bu. Ben tür size verdim, çünkü bir Serin şeyler bir sürü kursu çökmesine Eğer bunu yapabilir. Ama sonunda, ben, dedi eğer sadece deneme, bir çok şey öğreneceksiniz. İZLEYİCİ: o yazı bakmak mı? ALLISON BUCHHOLTZ-AU: Evet, O yazı baktım. Ben, tam anlamıyla gibi Yani Ben ne yaptım amaçlara yönelik gitti? CSS font listesini yaptım, ve sonra yazı yığını yaptım, ve sonra ben burada, bak, gibi oldu Yapabileceğiniz tüm serin yazı tipleri vardır. Ve böylece, bu kimse yoktu Benim panoya kopyalanan. Ve sonra ben, böyle oldu Tamam, serin, oraya gidiyoruz. Tüm yapılır. İZLEYİCİ: emin olmak zorunda Yani CSS o yazı ne olduğunu bilir. ALLISON BUCHHOLTZ-AU: Evet. İZLEYİCİ: o sonunda ne diyor? Cursive? ALLISON BUCHHOLTZ-AU: Cursive. Evet. İZLEYİCİ: Arka plan görüntüsü. ALLISON BUCHHOLTZ-AU: Arka plan görüntüsü. TAMAM MI. Peki bunu nasıl bana söylemeni istiyorum. Ben sana bırakıyoruz. Ben şimdi burada yazarak kulüpler. tekerlek sizin elinizde. İZLEYİCİ: Tamam ALLISON BUCHHOLTZ-AU: Tamam. Ben ne yapıyorum? İZLEYİCİ: Doing-- biliyorum ne küme ayracı sonra gelir. ALLISON BUCHHOLTZ-AU: Tamam. Yani muhtemelen vücutta, ben Biz çünkü, varsayılabilir arka plan görüntüsü ile yapıyor. İZLEYİCİ: Evet, hadi yapalım. ALLISON BUCHHOLTZ-AU: Tamam. HEDEF KİTLE: Tamam, böylece arka plan Kolon, sonra Bu görüntünün bir URL adresi gerekir. Belki pseudo-code şimdilik, belki. ALLISON BUCHHOLTZ-AU: Ne Beni amaçlara yönelik istiyorum HEDEF KİTLE: Ben bir GIF gibi düşünüyorum. ALLISON BUCHHOLTZ-AU: Bir GIF? Bu ilginç olacak. Tamam, ben burada ne Googling ben? İZLEYİCİ: Hayır, bu sizin seçiminiz. ALLISON BUCHHOLTZ-AU: Neden Bir tavşan ise Biz-- değil, Biz olması gereken gibi hissediyorum güzel otsu çim falan. İZLEYİCİ: Meadow. Bir çayır. ALLISON BUCHHOLTZ-AU: Bir çayır? TAMAM MI. HEDEF KİTLE: Ya Rachel Maddow. ALLISON BUCHHOLTZ-AU: Bu bir güzel görünüyor. Ah, bu olsa, küçücük. Biz iyi bir boy gerekir. Görelim. Ah, bak. Bu güzel bir çayır var. Ben bunu ne gibi biliyorum. Şimdi bu bir kopyalama edelim. İZLEYİCİ: Tamam, bu yüzden düşünüyorum URL, açık parantez. ALLISON BUCHHOLTZ-AU: Tamam, URL. İZLEYİCİ: Sonra adresi. ALLISON BUCHHOLTZ-AU: Tamam. Tüm ihtiyacımız mı? İZLEYİCİ: Kapat parantez, noktalı virgül ve daha sonra uzay, arka plan tire eki kolon sabit ve kaşlı ayraç. ALLISON BUCHHOLTZ-AU: Tamam. İşe yarayıp yaramadığını görelim. O yaparsa oldukça serin olacak. Ben burada gerçek heyecanlıyım. İşe yaramadı. Ben merak ediyorum. HEDEF KİTLE: Belki URL tırnak içinde olmak zorundadır. ALLISON BUCHHOLTZ-AU: Belki. Ve bu, biz öğrenmek nasıl adamlar olduğunu. İZLEYİCİ: Biz altyapıya sahip miyiz renk ve arka plan görüntüsü? İZLEYİCİ: Hayır Bir başka geçer. ALLISON BUCHHOLTZ-AU: Bilmiyorum. Görelim. Bunu kontrol ve görelim. İZLEYİCİ: Ah, belki, evet. [SESLER interposing] ALLISON BUCHHOLTZ-AU: Tamam, bu obviously-- Ben [duyulamaz] burada. Yani Tamam. HEDEF KİTLE: Arka plan eki. ALLISON BUCHHOLTZ-AU: Ah. İZLEYİCİ: Tamam, ben bilmiyorum. ALLISON BUCHHOLTZ-AU: Bu çalışması gerekir gibi görünüyor. Eğer URL sonra kolon emin misiniz? İZLEYİCİ: Hayır, noktalı virgül var. ALLISON BUCHHOLTZ-AU: Bu noktalı virgül var. HEDEF KİTLE: Ben kolon dedin? ALLISON BUCHHOLTZ-AU: Bir kolon dedi. HEDEF KİTLE: Oh hayır. ALLISON BUCHHOLTZ-AU: Orada gitmek. HEDEF KİTLE: Oh, şimdi, bekle Biz metni okuyamıyor. ALLISON BUCHHOLTZ-AU: Şimdi Eğer, metni okuyamaz ama biz arka plan görüntüsü var. Mmhmm? İZLEYİCİ: HTML mu dinamik içerik destekliyor? Gibi, bu resmi yeniden boyutlandırmak olabilir pencere boyutuna bağlı olarak, veya CSS-- olmasıdır ALLISON BUCHHOLTZ-AU: Yani CSS bunu vardır. Böylece siz ilginizi çekiyorsa Gelişmiş CSS öğrenme, Ben bir co-öğretim am 7'sinde CSS seminer. Ve ben o olacak söz veriyorum derinliğinde çok fazla olması ve çok daha serin yapmak Bu bölümdeki şeyler. Ve benim co-öğretmen gibi Toplam ön uç web dev ustası. Yani isterseniz oldukça serin olacak hakkında tüm serin şeyler öğrenmek için CSS yapabilirsiniz. Ama biz burada birlikte ne Onun arka plan eki fixed-- nedenle bazı sabit size-- var: ama aslında dynamically-- olabilir Hiç web sayfaları olarak görürseniz En iyi web sayfaları, yapacak ayarlamak zaman Tarayıcınızın büyüklüğü, bu arka plan ya da ne kadar ayarlar Doğru gösteren veya şeyleri yeniden biçimlendirir edilir? Yani biz diyoruz göreceli konumlandırma. Ve CSS aslında ne kadar büyük kapmak edebilirsiniz tarayıcı genişliği veya ne kadar uzun olduğunu, ve pozisyon şeyler yapabilirsiniz göreli boyutlarına göre mutlak ölçülerde karşı. Ve tabii ki daha gelişmiş var CSS, ama bu yapabileceği bir şeydir. Eğer öğrenmek istiyorsanız daha benim seminer gel. Yani yapabileceğiniz bir şeydir. Ve CSS aslında can , CSS ve JavaScript sanıyor- Bir sonraki hafta-- içine alırsınız hangi dinamik değiştirmek için izin verebilir zorunda kalmadan sayfalar Onlara her zaman yeniden. Ve bazı yapmak olsun oldukça serin şeyler. Yani başka bir şey var Size adamlar yapmak isteyebilirsiniz veya istediğiniz bir şey keşfetmek için? Biz sol 10 dakikamız var. Biz de erken ayrılmak, ama eğer olabilir Eğer biraz daha web şeyler yapmak istiyorum biz, ama ben değilim sizi zorlamak için gidiyor. Ama biz de sadece şeker yiyebilirsiniz. HEDEF KİTLE: metni vurgulayın beyaz böylece okuyabilirsiniz. ALLISON BUCHHOLTZ-AU: Tamam. Yani bu durumda, bazı p istiyoruz. HEDEF KİTLE: biz bunu yapmalıyım Vücut bu yüzden bütün sayfa için geçerlidir? ALLISON BUCHHOLTZ-AU: Evet, biz aslında yapamam. Bu iyi bir fikir. Bu yüzden do you have-- Biz ne olması gerektiğini biliyor musunuz? Biz yazı rengini yapabilirim bilmiyorum. Ben denemek için gidiyordu ve Burada başka bir sınıf oluşturmak. İZLEYİCİ: Bunu nasıl alabilirim bu önerileri vardır? ALLISON BUCHHOLTZ-AU: Yani Siz ilginizi çekiyorsa, Bu başka bir metin editör Sublime çağırdı. Sen gerekir Cihazınızın yükleyin. Bazen biraz zor olur. Eğer bu konuda yardım istiyorsanız, Sana yardım etmek süper mutluyum onunla, gedit büyük olduğu için ve bunu derlemek, çünkü bu harika alt, ama gerçekten Sublime gibi oldukça çünkü ve şeyler yok gibi otomatik tamamlama. Yani kesinlikle çekinmeyin olabilir Bunu yapmak istiyorsanız bana bildirin. Sadece google "Eğer Yüce Metin, "tipik yükleme talimatları vardır Çeşitli işletim sistemlerinde. Ben, gerçekten harika Benim görüşüme göre, bence. Yani s. Ben sadece bunu düşünüyorum text-- veya biz sadece renk yapabilirsiniz "beyaz." Orada. Peki ben burada yaptım I Tüm metni değişmedi. Ama burada p sadece bir olduğunu Elimizdeki etiketi, değil mi? Bu paragraf etiketi. Yani sadece bir CSS elemanı yarattı Tamam, dedi, bu etiketiyle şey p, beyaz renk yapmak. Eğer fark varsa Yani, yapılan Bu beyaz ve bu beyaz. Çünkü bizim liste beyaz vermedi o ile ilişkili değil. Sen aracılığıyla gidebiliriz ve say-- olabilir İZLEYİCİ: Arka plan rengini yapın. ALLISON BUCHHOLTZ-AU: Arka plan rengi? İZLEYİCİ: boru Arka Plan olarak Eğer p etiketi koymak renk. ALLISON BUCHHOLTZ-AU: Tamam. Sen beyaz istiyorsun? HEDEF KİTLE: Mmhmm. ALLISON BUCHHOLTZ-AU: Tamam. Orada gitmek. HEDEF KİTLE: Bu çok garip. ALLISON BUCHHOLTZ-AU: Oldukça serin, değil mi? Yani sadece karışıklık etrafında eğer, Eğer bir şey öğrenmek için gidiyoruz. Ve oldukça serin olabilir. Ben kesinlikle daha fazla olduğunu düşünüyorum sevindirici bazen daha Eğer beklemek zorunda değilsiniz, çünkü Program derlemek için. Sadece Yenile vurabilir ve oh, bak, gibisin, işe yaradı ya oh, ben değilim Muhtemelen bir şey eksik. Ve bu gerçekten bir şey sınıf bu bir sonraki bölümü hakkında serin, Ben, kesinlikle var olduğunu , kolay kontrol etmek için düşünüyorum Eğer yol karşı birlikte gitmek gibi Bu uzun programlar yazmak zorunda ve isteyen ve dua o sonunda çalışır. Yani, ben düşünüyorum Siz tüm iyi görünüyor. Eğer her zaman olduğu gibi herhangi bir sorunuz varsa, Bana konuşma gel, bana bildirin gel. Ben hemen dışında olacak sonraki 15 dakika için hakkında sohbet etmek isterseniz şey ve her şey. Bu yüzden guys-- umut Bu pset ile iyi şanslar. son öğle saatlerinde Cuma Geç serbest bırakıldı çünkü. Yani muhtemelen göreceğiz Perşembe günü Eğer çocuklar bir sürü, ama umarım. Belki o zaman tarafından yapılan gerekecek. Ben süper gurur duyarım. Ama eğer, ben Perşembe göreceğim. Ayrıca geç tarih, kullanabileceğiniz öğle saatlerinde Cumartesi için uzanır. Ama ha Sakın? İZLEYİCİ: Cadılar Bayramı. ALLISON BUCHHOLTZ-AU: Bu Halloween, bir, ve b var, Ben orada olacak sanmıyorum Cuma günü çalışma saatleri olacak. Yani gerçekten denemek ve onun tarafından halletmek Cuma hepimizin kutlamak böylece Hallow hafta sonu. Pekala, ben önümüzdeki hafta sizi görürsünüz.