टॉमस REIMERS: हाय, सब लोग. मेरा नाम टॉमस Reimers. 

माइक Rizzo: और मैं माइक Rizzo हूँ. 

टॉमस REIMERS: हम CS50s टीएस के दो हैं. और आज हम पर संगोष्ठी अग्रणी रहे हैं जावास्क्रिप्ट और वेब Apps के लिए सीएसएस. आप के साथ पालन करना चाहते हैं, लिंक सही वहाँ पर है. और आप इसे डाल करना चाहते हैं कंप्यूटर संक्षिप्त पर? 

कड़ी है. यह करने के लिए संपर्क किया है, जो एक छोटी सी साइट है, हम हो जा रहे सभी संसाधनों आज भी आप ओर इशारा करते हुए और का एक बहुत है हमारे द्वारा लिखित उपयोगी जानकारी तुम वापस जाने के लिए जब गहराई में अधिक पढ़ा, और तुम याद करने की कोशिश कर रहे हैं वास्तव में हम आप क्या थे, क्या कहना वगैरह, के बारे में बात कर. 

माइक Rizzo: सब ठीक है. तो चलो शुरू करें. 

टॉमस REIMERS: तो आप शुरू करना चाहते हैं? ठीक है. 

माइक Rizzo: हाँ. इसलिए हम पहले एक व्यापक साथ शुरू करना चाहता था इंटरनेट के बारे में अवलोकन और वेबसाइट डिजाइन जब फ़ाइल प्रकार. इस प्रस्तुति में हम करना चाहते हैं, जबकि जावास्क्रिप्ट में एक बहुत ज्यादा में मिलता है बाद में, हम साथ शुरू करना चाहता था बस, एक तरह से, जैसे एक विहंगम दृश्य क्या एक वेबसाइट है और कैसे की एक डिजाइन के बारे में सोचने के लिए शुरुआत के लिए वेबसाइट. 

इस बिंदु पर तो तुम लोग, - यह साथ शुक्रवार की रात जा रहा है - होना चाहिए अपने CS50 वित्त प्रस्तुत समस्या खेलें. उम्मीद है, कि एक अच्छा स्वाद था क्या की वेब प्रोग्रामिंग किया जा सकता है. लेकिन यहां हम एक तरह से देना चाहता हूँ आप एक और स्वाद के रूप में अच्छी तरह से. 

टॉमस REIMERS: तो बस क्या संक्षिप्त करने के लिए आप अपने यूआरएल के लिए में टाइप करते हैं, तो क्या होता कृपया अपने वेब ब्राउजर, कि यूआरएल हो जाता है कंप्यूटर में देखा. और आपके कंप्यूटर का जुड़ाव किसी अन्य कंप्यूटर पर, जो कि वेबसाइट मेजबान. आप google.com जब जाना ठीक है, तो आप कर रहे हैं गूगल के एक से जुड़ा जो है कंप्यूटर, google.com के लिए फ़ाइलें. 

यह तो एक विशिष्ट फ़ाइल के लिए पूछता है. तो अगर आप के लिए जाने - मैं नहीं जानता कि - example.com / index.html या / test.html, आप के लिए पूछने के लिए जा रहे हैं कि विशिष्ट फ़ाइल. और वेब सर्वर की जा रही यह आप पर लौटने के लिए. 

फिर, आप उस फ़ाइल के माध्यम से जाने के एक बार - आप कर रहे हैं एक बार कंप्यूटर हो जाता है कि फ़ाइल - यह शुरू हो रहा है एक वेब पेज बनाने के लिए. तो अब यह HTML फ़ाइल है, तरह की तरह है जो वेब पेज की संरचना. एचटीएमएल फाइल भी संदर्भ सकता है जो परिभाषित सीएसएस फ़ाइलें, वेब पेज की शैली. 

जावास्क्रिप्ट फाइलें, जो परिभाषित करता है वेब पेज के साथ बातचीत. सिर्फ तस्वीरें हैं जो छवि फ़ाइलें,. और संभवत: अन्य एचटीएमएल फाइल करने के लिए लिंक जो तुम तो यात्रा कर सकते हैं. 

माइक Rizzo: ठीक है, महान. तो तुम लोग, शायद, सब है बड़ी मेहनत से अपने स्थानीय होस्ट की स्थापना अपने वर्चुअल मशीन पर. और कहा कि अभी की तरह, स्थानीय है आपके कंप्यूटर केवल कि मेजबान डोमेन अपने स्वयं के आईपी पते पर आप के लिए. 

इसलिए कि भीतर, तो आप जोड़ सकते हैं यह करने के लिए अपने स्वयं के वेब पन्नों. मेरा मतलब है, CS50 वित्त में, आपके पास होना चाहिए जो कर रहे हैं जोड़ा कुछ HTML पृष्ठों,, एक तरह से, पीएचपी आवरण में लिपटे. लेकिन अंततः, क्या आपके PHP पृष्ठों outputting गया एचटीएमएल था. 

लेकिन बहुत शुरुआत में वापस सोच PSET की, हम स्थापित करने के लिए था सब कुछ के लिए अनुमतियाँ, है ना? तो यह सिर्फ मूल रूप से हमें पता देता है जो संभवतः पढ़ने, लिखने, और कर सकते हैं फ़ाइलों में से प्रत्येक को अंजाम. एचएम - तो हम एक त्वरित करने के लिए जा रहे हैं? 

टॉमस REIMERS: तो हम जा रहे हैं एक त्वरित प्रदर्शन करना है. तो जब आप बस, आप को याद दिलाना गूगल के कंप्यूटर से कनेक्ट - जो कोई भी - और सबसे पहले, एक फ़ाइल के लिए कंप्यूटर पूछना सुनिश्चित करें कि आप अधिकृत कर रहे हैं बनाने की जरूरत वास्तव में करने के लिए कि फ़ाइल को देखने या पढ़ा है कि आप बस पूछ नहीं सकते क्योंकि इस उस कंप्यूटर पर किसी भी फ़ाइल के लिए, सही है? यह एक सुरक्षा खतरा हो जाएगा. 

जैसे हम उपयोग प्रणाली, इसलिए फाइलें इस CS50 उपकरण, तीन है हो सकता है, जो सामान्य लोग कुछ करने के लिए अनुमतियाँ. पहली वास्तविक है कहा फ़ाइल का मालिक. दूसरा समूह है कि फाइल के अंतर्गत आता है. हम ध्यान केंद्रित करने के लिए नहीं जा रहे हैं उस पर बहुत अधिक. और आखिरी बात की तरह है, की तरह है, दुनिया या है, जो हर किसी की तरह उस फ़ाइल के लिए विशिष्ट नहीं है और नहीं इस पर किसी भी मालिकाना हक है. 

इसलिए हम स्वामी हैं, समूह, और फिर दुनिया. और फिर, आप इन समूहों में से प्रत्येक के लिए तीन अनुमतियों में से एक हो सकता है, ठीक है, या उनमें से कई. आप पढ़ अनुमतियाँ हो सकता है. आप की अनुमति कर सकते हैं. और आप अनुमतियाँ निष्पादित कर सकते हैं. 

इसलिए वास्तविक फ़ाइल प्रकारों के मामले में पढ़ा अनुमति वास्तव में पढ़ने की तरह है फाइल की सामग्री. एक सही अनुमति लिख रही है फाइल करने के लिए कहा. एक निष्पादित अनुमति चल रहा है आप में से एक को चलाने जब आप कर जैसे फ़ाइल अपने CS50 परियोजनाओं. 

हम फाइलों के बारे में सोच रहे हैं तो जब जैसे हम एक HTML पढ़ने की जरूरत है जब दुनिया किए जाने की आवश्यकता है कि फाइल, पठनीय, सही? मुमकिन है, भी मालिक चाहता है उस फ़ाइल को संपादित करने में सक्षम हो. तो मालिक की जरूरत जा रहा है पढ़ने के लिए और अनुमतियाँ लिखें. वे वास्तव में अमल की जरूरत नहीं है. 

समूह, हम इलाज के लिए जा रहे हैं अब के लिए दुनिया के रूप में ही. तो वे पठन अनुमतियाँ की जरूरत है. लेकिन वे लिखने की जरूरत नहीं है या अनुमतियाँ निष्पादित. और अब, हम पूर्व वापस करने के लिए अगर आपको लगता है PSETs, क्या हमें पता है कि इन प्रकार है द्विआधारी की तरह लग रही है, है ना? 1 हां के लिए खड़ा है. 0 कोई लिए. और हम वास्तव में अनुवाद कर सकते हैं इस बाइनरी. 

तो द्विआधारी में 110 6 होगा. 100 4 होगा. दुनिया के साथ भी. तो नंबर पर आप के लिए मिल जाएगा इस के लिए अनुमतियों 644 होगा. 

आप के लिए वापस लगता है और अगर माइक Rizzo आप कुछ chmoded जब, मेरा मानना ​​है कि वे सेट समस्या में दे दी आप कर सकते हैं, जहां का उदाहरण chmod 644 की तरह कुछ और फिर फ़ाइल का नाम. 644 तो, अब आप सीधे देख सकते हैं कि कहाँ से आता है. तो उम्मीद है कि बनाता है कि एक छोटे से अधिक स्पष्ट. 

और फिर तुम लड़के की स्पष्टता के लिए - अरे हाँ, यहाँ यह फिर से है. तो 600 तो सिर्फ उदाहरण होगा हम मालिक है जहां यहां छोड़ दिया पढ़ने के लिए और सही अनुमतियों जबकि समूह और दुनिया के किसी भी अनुमति नहीं है फ़ाइल का उपयोग करने के लिए. 

टॉमस REIMERS: और फिर हम एक त्वरित है आम अनुमतियों की सूची. तो निर्देशिकाओं, आप चाहते हैं वास्तव में 711 chmod करने के लिए. एक तरफ त्वरित - पास के लिए एक निर्देशिका के लिए निष्पादन योग्य अनुमति सक्षम होने का मतलब निर्देशिका को खोलने के लिए. छवियाँ, सीएसएस, जावास्क्रिप्ट, एचटीएमएल आवश्यकताओं 644, बुनियादी तौर पर, दुनिया, क्योंकि आवश्यकताओं अनुमतियाँ पढ़ा. 

और तुम लोगों को देखा है जो पीएचपी, हम इसके बारे में बात नहीं की जाएगी, हालांकि सख्ती से आम तौर पर साथ chmoded है अनुमति 600 इसके साथ चलाते है क्योंकि स्वामी की अनुमति. उपकरण पर कम से कम. 

माइक Rizzo: तो अगर आप ऐसा नहीं विशेष रूप से निर्दिष्ट किस प्रकार की फ़ाइल आप वास्तव में स्थापित करने में चाहते हैं इस प्रस्तुति - हम इस के साथ एक समस्या थी क्योंकि सब कुछ सही ढंग से chmoded नहीं किया गया था - आप किस तरह की, एक पाने के लिए जा रहे हैं मना त्रुटि है कि वेबसाइट वास्तव में अनुमति नहीं है जो भी फाइल का उपयोग करने के लिए आप इसे उपयोग करना चाहते हैं. और जाहिर है, कि तय किया जा सकता है - समस्या में सेट के रूप में - बदलकर अनुमतियाँ उचित. 

टॉमस REIMERS: और के लिए अंतिम टिप्पणी जल्दी स्थानीय विकास है - हम इस लाया, लेकिन हम सिर्फ चाहते थे यह फिर से ऊपर लाने के लिए - आप एक सर्वर के लिए पूछना अगर - तो स्थानीय होस्ट, उदाहरण के लिए, एससी या जो भी हो. - और आप एक विशिष्ट फ़ाइल निर्दिष्ट नहीं करते हैं, अपने कंप्यूटर जा रहा है कि फाइल index.html कहा जाता है के लिए पूछने के लिए. या कि अस्तित्व में नहीं है, तो index.php. 

कूल. तो यह है कि अभी सब कुछ का एक संक्षिप्त है, उम्मीद है, हम में शामिल किया गया है कि खंड, और व्याख्यान, और अब तक CS50 में. और अब हम बात कर शुरू करने जा रहे हैं के बारे में विशेष रूप से पुस्तकालयों. जावास्क्रिप्ट और सीएसएस पुस्तकालयों वेब Apps के लिए. 

तो हम क्यों एक त्वरित कारण पुस्तकालयों प्रोग्रामिंग है - समस्याओं में से एक बहुत कुछ है popping रखने जो प्रोग्रामिंग, फिर से, और फिर, और फिर से. आप देख सकते हैं कि वेबसाइटों की एक बहुत ड्रॉप डाउन करने की क्षमता की जरूरत मेनू, उदाहरण के लिए, या क्षमता की जरूरत एक बहुत मानक बटन है नहीं हो सकता जो शैली, आसान बात. अब आप, एचटीएमएल में पाने के लिए शुरू कि एहसास है कि बटन कर सकते हैं वास्तव में वास्तव में बदसूरत देखो तुम अगर कुछ भी नहीं है. 

तो बहुत से लोगों को लिखा है पुस्तकालयों कहा जाता है. और इस संदर्भ में, वे कर रहे हैं भी व्यवस्थाएं कहा जाता है. हम प्रयोग करने जा रहे हैं दूसरे के स्थान पर दो. और क्या वे कर रहे हैं कि वे मूल रूप से कर रहे है कोड की premade टुकड़े - सीएसएस या जावास्क्रिप्ट या तो - इस बात का एक बहुत दूर ले आप कोडिंग में है टीम. 

इसलिए वे एक कक्षाओं का गुच्छा या पूर्व परिभाषित के लिए कार्य का एक गुच्छा पूर्व परिभाषित जावास्क्रिप्ट का मामला है, जो आप बाद में कॉल कर सकते हैं. और फिर तुम, की तरह, प्राप्त कर सकते हैं बिना इस कोड का उपयोग कुछ भी करने के लिए कर रही है. पुस्तकालय का एक उदाहरण CS50.H. था यही कारण है कि हम तुम्हें वापस करने के लिए दिया एक पुस्तकालय था एक सप्ताह में, जो आपको ऐसा करने की अनुमति कि GetInt और GetString की तरह बातें लिखने के बिना किसी भी कोड अपने आप को. 

माइक Rizzo: सब ठीक है. तो यहाँ, बस जैसे हम शामिल करने के लिए किया था हमारे ग में अलग अलग फ़ाइलों पुस्तकालयों, हम भी में शामिल होना चाहिए हमारे HTML विभिन्न पुस्तकालयों फ़ाइलें. उदाहरण के लिए, हम में शामिल करना चाहता था यहाँ एक विशिष्ट जावास्क्रिप्ट पुस्तकालय, शायद, एक हम लिखा है कि खुद यह स्थानीय स्तर पर होस्ट के रूप में कहा जाता script.js, हम बस इस संकेतन का उपयोग करें. 

इसलिए हम स्क्रिप्ट प्रकार के बराबर होती है जावास्क्रिप्ट स्रोत के बराबर होती है JavaScript.js. और अगर आप अपने CS50 के लिए वापस अगर आपको लगता है आप में देखा अगर वित्त समस्या, सेट टेम्पलेट फ़ोल्डर में header.php, आपको देखना चाहिए था इनमें से कुछ शामिल है. तो यह पहली बार एक - लिपियों - एक जावास्क्रिप्ट पुस्तकालय सहित है. एक सीएसएस पुस्तकालय भी शामिल है अलग एक छोटा सा. 

इधर, बजाय स्क्रिप्ट की आप लिंक टैग की जरूरत है टैग. और फिर, पाठ सीएसएस प्रकार एक छोटे से अलग है. तुम हमेशा शामिल करने के लिए नहीं है रिलायंस एनर्जी शैली पत्रक. लेकिन मुझे लगता है कि यह आम तौर पर, लगता है अच्छा अभ्यास. 

और फिर अंत में, href, जो आप शायद जोड़ने के लिए अपने ATAGs में देखा अलग लिंक अभी यह निर्दिष्ट में खोजने के लिए कि जहां की कड़ी. उदाहरण के लिए, हम चाहते थे कि अगर एक लिंक करने के लिए अलग पुस्तकालय - चलो बस कहना है - कि styles.css में रहते थे. और हम है कि में उस लिंक करना चाहता था वेब पर होस्ट, हम उस की नकल होगा. और फिर जो कुछ में पेस्ट हम बजाय यहीं है. 

टॉमस REIMERS: ठीक है, उम्मीद है कि आप लोग पहले से ही परिचित हैं सीएसएस लिंक करने के लिए कैसे साथ. तुम उस पर करना था अपने पिछले ब्राउन सेट. जावास्क्रिप्ट, आप में से कुछ शायद साथ कुछ अनुभव है. आप में से कुछ नहीं हो सकता. 

तो अब के लिए, पता है कि एक जावास्क्रिप्ट फ़ाइल बहुत ज्यादा में एक सीएसएस फ़ाइल की तरह है आप इसे लिंक कर सकते हैं या उस भावना आप आंतरिक रूप से इसे शामिल कर सकते हैं. और यह स्क्रिप्ट बातें करने के लिए आप की अनुमति देता है. और हम एक के माध्यम से चलना जा रहे हैं बाद में जावास्क्रिप्ट का थोड़ा सा. 

इसलिए एक पुस्तकालय का उपयोग कर - आप इसे शामिल करने के बाद, यह रूप है सचमुच बुला के रूप में सरल कार्यों या जोड़ने वर्ग के नाम यह करने के लिए. हम बात करना चाहते पिछले बात पुस्तकालय के मामले में के बारे में - और यह एक तकनीकी नोट की अधिक है - खुला स्रोत लाइसेंस है. तो आप इन वास्तविक पुस्तकालयों मिल जाए, आप की सोच हो सकती है सवाल यह है कि मैं अभी कर रहा हूँ कि ठीक है पसंद किसी और के कोड का उपयोग कर, विशेष रूप से कि हम बहुत ज्यादा कुछ है क्योंकि इस पाठ्यक्रम में ऐसा नहीं करने के लिए कहा था. 

, खुला स्रोत लाइसेंस के मामले में तो डेवलपर्स के एक बहुत - वे एक पुस्तकालय लिखा है एक बार, वे हो सकता है जो अन्य लोगों के लिए उपयोगी - वेब पर प्रकाशित करेंगे और यह एक लाइसेंस दे. और एक लाइसेंस मूल रूप से मैं इसके द्वारा यह कहते हैं अन्य को देने की अनुमति लोग सॉफ्टवेयर के इस टुकड़े का उपयोग करने के लिए निम्नलिखित प्रकार के साथ शर्तों. 

हम एक अच्छा साइट के लिए एक लिंक शामिल किया है आप में लाइसेंस को समझने में मदद आप उन्हें में भाग मामला. आम शर्तों की तरह बातें कर रहे हैं आप मेरे पुस्तकालय का उपयोग करने के लिए स्वागत कर रहे हैं तो आप मुझे ऋण देने के लिए लंबे समय के रूप में. तुम मेरे पुस्तकालय का उपयोग करने के लिए आपका स्वागत है यह टूट जाता है जब इतनी के रूप में लंबे समय तक आप मुझे दोष नहीं है. आप इतने लंबे समय मेरे पुस्तकालय का उपयोग करने के लिए आपका स्वागत है आप पैसे बनाने के लिए इसका इस्तेमाल नहीं करते खुद के लिए. ये आम प्रकार के होते हैं शर्तों. 

इस CS50 अंतिम परियोजना के लिए, वे सुपर प्रासंगिक नहीं होना चाहिए, क्योंकि तुम लोग का उपयोग करने वाले परियोजनाएं हैं शायद बल्कि, की तरह जाना जाता है. लेकिन आप वास्तव में बाहर जाने के लिए जब दुनिया और पुस्तकालयों, का उपयोग शुरू जो या के रूप में अच्छी तरह से लागू किया जा सकता है और नहीं हम कर रहे हैं और अधिक लोकप्रिय लोगों में से कुछ के माध्यम से जा रहा जा रहा है. यह समझने में सक्षम होना अच्छा है इन लाइसेंसों और को वे क्या मतलब समझते हैं. और वापस जा रहा. 

माइक Rizzo: ठीक है. तो अब उदाहरणों पर चलती वास्तविक सीएसएस की. इस बिंदु पर अब तक, तुम हो सकता है इस सामना करना पड़ा है नहीं. लेकिन आप में यह सामना करना पड़ा है हो सकता है अपनी रोजमर्रा की जिंदगी में जहां कुछ कि एक ब्राउज़र पर एक तरह दिखता है एक ही नहीं लग सकता है अन्य ब्राउज़र में जिस तरह से. 

यह ब्राउज़र ब्राउज़र कहा जाता है संगतता. और तेजी से यह अधिक से होता जा रहा है खासकर के रूप में, एक समस्या के और अधिक ब्राउज़रों अधिक से अधिक स्वतंत्रता लेना वे चाहते हैं कि चीजों के रूप में लागू करने के लिए. तो उस पर काबू पाने के लिए, वहाँ वास्तव में है Normalize.CSS नामक एक महान पुस्तकालय. 

टॉमस REIMERS: हम कड़ी शामिल थे. इस बिंदु पर, यह उपयोगी है अगर तुम वहाँ में अपने लैपटॉप है साइट पर देख रहे हैं. और हम सही करने के लिए आप इस दे रहे हैं अब सिर्फ इसलिए कि CS50 अंतिम परियोजना वास्तव में जा रहा है इसे लागू करने के लिए आप से पूछना इसी प्रकार और ब्राउज़र के माध्यम से. 

तो बस अपने की पीठ में रखने के लिए सिर, यह एक अद्भुत पुस्तकालय है यह होगा क्योंकि, की तरह, बातें प्रमाण के. Firefox में, कुछ दिखा सकते हैं बाईं ओर एक पिक्सेल के रूप में. और फिर क्रोम है कि वास्तव में फैसला कर सकते हैं क्या आप का मतलब 10 पिक्सल था बाईं ओर. और तुम इस मानकीकरण करना चाहते हैं. मानक के अनुसार वास्तव में एक बहुत अच्छा नहीं होगा यकीन है कि बनाने के काम आपकी साइट ब्राउज़रों में एक ही लग रहा है. 

हम चाहते थे इसलिए अगर सिर्फ माइक Rizzo वास्तव में जल्दी और शो लिंक पर क्लिक करें आपको क्या लगता है कि, आप की तरह लग रहा है का उपयोग कर इसे डाउनलोड कर सकते हैं विशाल डाउनलोड बटन. या मैं इसके बारे में और अधिक पढ़ने के लिए प्रोत्साहित निचले हिस्से में इस लिंक पर क्लिक करके दाएँ हाथ के कोने. 

टॉमस REIMERS: और अगर आप वास्तव में अधिक सही पढ़ा क्लिक करें - GitHub पर स्रोत पर क्लिक करें - आप वास्तव में खुला स्रोत देखेंगे सही वहाँ LICENSE.md पर लाइसेंस. और आप देखेंगे है बहुत लोकप्रिय एमआईटी लाइसेंस. फिर, आप पाठ के माध्यम से पढ़ा है, आप साइट पर इसे खोजने के लिए सक्षम हो जाएगा हम पहले संदर्भित और करने में सक्षम हो पढ़ने के लिए बिना इसे समझने कानूनी शब्दजाल के माध्यम से. 

माइक Rizzo: ठीक है, महान. इसलिए कि सामान्यकरें है. हम आपको देना चाहता था कि वास्तव में जल्दी. ओह, आप एक सवाल है? 

दर्शक: तो आप इसे डाउनलोड करते हैं, तो आप बस है कि वे उस कोड का पालन करें डाउनलोड बटन के तहत? 

टॉमस REIMERS: हाँ, तो जब आप डाउनलोड - 

माइक Rizzo: ओह, यह एक बड़ी बात है. तो सवाल यह करते हैं कि कैसे था हम वास्तव में इसे डाउनलोड? हम लिंक पर क्लिक करें यदि हां, तो हम देखते हैं यह वास्तव में है कि ऊपर चबूतरे स्रोत कोड पर. तो यह करने के लिए, क्या हम कर सकते थे बस के रूप में सहेजें क्लिक करना है. इस रूप में सहेजें और कहा कि ऐसा करना चाहिए एक फ़ाइल को ले आओ. और फिर हम बचाने के लिए चुन सकते हैं यह normalize.CSS के रूप में. और फिर आप में लिंक करने के लिए होगा - 

टॉमस REIMERS: एक ही तरीका है कि आप किसी भी अन्य फ़ाइल में लिंक. आप इसे में लिंक और एक बार, महान क्या है सामान्यकरें के बारे में यह वास्तव में होगा सभी को कड़ी का ख्याल रखना स्वयं के द्वारा काम करते हैं. तुम नहीं है जिसका अर्थ है कि किसी भी वर्ग को जोड़ने के लिए. 

आप अजीब कुछ भी करने की जरूरत नहीं है. यह तुम्हारे बिना मानक के अनुसार होगा आगे कुछ भी कर रहे हैं. हाँ, आप इसे शामिल करने के लिए है. गूगल क्रोम जवाब नहीं है. 

एक तरफ सिर्फ एक जल्दी - मुझे लगता है हम इस में कूद पड़ा देखा. इस प्रस्तुति के बाकी है एक त्वरित अवलोकन होने जा रहा. पुस्तकालयों के एक सर्वेक्षण. 

असल में, वे क्या कर रहे हैं. वे क्या करते हैं. वे उपयोगी रहे हैं. आप उन्हें लागू कैसे हो सकता है. आप उन्हें देख शुरू करना चाहते हैं, साथ निम्नलिखित, और के माध्यम से पढ़ उन्हें, मैं अत्यधिक है कि प्रोत्साहित करेगा. 

वैकल्पिक रूप से, आप को भी स्वागत है उन्हें डाउनलोड करने और सहित शुरू एक नजर में उन्हें सिर्फ वे क्या देखने के लिए की तरह लग रहा है या क्या आपके पास अगर वे करते हैं आप के सामने अपना लैपटॉप. यदि नहीं, तो आप को बनाए रखने के लिए स्वागत है हमें सुन बात करते हैं. हम बात कर रखने के लिए जा रहे हैं. और हमें उम्मीद है, अंत में समय है हम वास्तव में आप दिखा में मिल जाएगा क्या इन पुस्तकालयों में से कुछ जैसे दिखते हो. 

माइक Rizzo: कूल. ठीक है, तो अब हम बात करते हैं विस्मयकारी बारे फ़ॉन्ट. 

टॉमस REIMERS: तो फ़ॉन्ट भयानक एक है खासकर उन लोगों के लिए सच में स्वच्छ साइट, कम कलात्मक हैं जो हम में से प्रतिभावान. बहुत बढ़िया नाम फ़ॉन्ट उपेक्षा कर, यह देता है आप जो कर रहे हैं माउस, की एक गुच्छा बहुत उपयोगी. तो कई बार आप एक को लागू करेंगे तुम तो एक अच्छा एक्स की तरह चाहते हो सकता है आइकन आप कुछ बंद कर सकते हैं कि. 

या फिर आप संपादन बटन के कुछ प्रकार चाहते हो सकता है जैसे एक पेंसिल ड्राइंग के साथ हर किसी की है. आपको यह जानकर कि और है कि जब उन माउस ड्राइंग हो सकता है बहुत कठिन और मुश्किल है. फ़ॉन्ट विस्मयकारी - अगर आप वास्तव में साइट पर जाना - नीचे आप माउस की एक बहुत कुछ देता है शीर्ष पर प्रतीक. हाँ, बस ऊपर. यह आपको एक बहुत कुछ दे देंगे मुक्त करने के लिए माउस की. 

यहाँ तो आप हम एक तरह बातें देखना तारांकन, बार, एक बिजली बोल्ट, एक कैलेंडर, एक बग, एक पुस्तक, वगैरह. यह बहुत उपयोगी हो सकता है. आप इस में शामिल हैं जिस तरह से आप में शामिल है सचमुच सीएसएस फ़ाइल. और बाद आप सीएसएस फ़ाइल शामिल किया है क्या आप कर सकते हैं आप बना है एक के लिए मैं यह satands बुलाया टैग वर्ग एफए के साथ आइकन बहुत बढ़िया फ़ॉन्ट के लिए खड़ी है. और फिर, जो कुछ वर्ग में आप चाहते हैं. 

मैं इस प्लस के एक आइकन चाहता था तो अगर यहीं स्क्वायर, मैं देना होगा यह वर्ग एफए. और फिर एफए हाइफ़न प्लस हाइफ़न वर्ग. 

माइक Rizzo: ठीक है, अच्छा है. 

टॉमस REIMERS: और फिर, पिछले सीएसएस पुस्तकालय हम हम कर रहे हैं के माध्यम से प्राप्त करना चाहते हैं सीएसएस पर कम से कम रखने की कोशिश कर पुस्तकालयों में हम महसूस करते हैं क्योंकि इस प्रस्तुति का शीर्षक जावास्क्रिप्ट पुस्तकालयों है. लेकिन हम हम के रूप में अच्छी तरह मई सोचा अन्य पुस्तकालयों से मिलवा हम पुस्तकालयों के बारे में बात कर रहे थे, जबकि. 

यह गूगल वेब फ़ॉन्ट्स है. और क्या गूगल वेब फ़ॉन्ट्स आपको अनुमति देता है ऐसा करने के लिए, अपनी वेबसाइट पर फोंट जोड़ने है इसे बनाने के लिए एक बहुत आसान तरीका है जो सुंदर और अपने सेट भेद करने के लिए अगर यह है कि हर कोई से और का है एक अच्छा फ़ॉन्ट या यह एक अच्छा है अगर फोंट का संग्रह. गूगल वेब फ़ॉन्ट्स दूसरे के विपरीत अच्छा है यह एक है कि समझ में पुस्तकालयों वास्तव में निर्देशित स्थापना. 

आप लिंक का पालन करें तो, अगर यह बात है google.com / फोंट, मुझे विश्वास है. तुम, तुम कि का पालन करें अपने फॉन्ट चुन सकते हैं. आप से बाईं तरफ चुन सकते हैं मोटाई, तिरछा, वगैरह. और फिर, एक बार आप एक चुन लिया आप त्वरित उपयोग क्लिक कर सकते हैं. वहीं पर. बॉक्स के नीचे सही. 

और फिर, नीचे स्क्रॉल. सबसे पहले, वे आप सीएसएस दे कि आप वास्तव में इसे करने के लिए लिंक करने की जरूरत है. यह अभी भी वहीं है. तुम बस कॉपी और अंदर कि पेस्ट कर सकते हैं और इस बारे में एक अच्छी बात है आप वास्तव में भी करने की जरूरत नहीं है फाइल डाउनलोड. 

क्या ऐसा करने जा रहा है कि यह हो रहा है है इसके बारे में गूगल के संस्करण के लिए लिंक करने के लिए. तो वापस करने के लिए इसका क्या मतलब है. जो उपयोगकर्ता जब इसका मतलब अपनी फाइल डाउनलोड - अपने एचटीएमएल पेज डाउनलोड - अपने HTML पेज इस फाइल को संदर्भित करने के लिए जा रहा है. 

तो फिर, अपने कंप्यूटर को देखने के लिए जा रहा है, ओह, यह उससे भी google.com पर होस्ट की theirsite.com पर से. मुझे लगता है कि फाइल के लिए गूगल पूछना चलते हैं. और फिर, यह शामिल करने के लिए जा रहा है यह लगभग एक थे मानो अपनी खुद की साइट का हिस्सा. 

टॉमस REIMERS: कूल. और तुम उस में शामिल हैं, एक बार फिर अपने सीएसएस में यह शामिल है, यह आपको देता है वास्तविक लाइन. तो आप संपत्ति फ़ॉन्ट परिवार सेट अपने फ़ॉन्ट का नाम के बराबर. 

माइक Rizzo: ठीक है. तो हम सिर्फ सीएसएस के साथ समाप्त हो गया. और आप में से कुछ, अच्छी तरह सोच हो सकता है हम CS50 वित्त पर कुछ सीएसएस था. लेकिन सीएसएस पुस्तकालय बूटस्ट्रैप था. हम वास्तव में बूटस्ट्रैप एक छोटी सी शामिल बाद में जावास्क्रिप्ट के तहत साथ क्योंकि बूटस्ट्रैप सीएसएस पुस्तकालय भी आता है जावास्क्रिप्ट इस बात का एक बहुत कुछ के साथ बूटस्ट्रैप या चहचहाना - जो बूटस्ट्रैप दिया - उनके सीएसएस के सभी प्रबंध करने के लिए उपयोग करता है. 

टॉमस REIMERS: किसी को भी किसी भी है अब तक सामान्य रूप में सीएसएस के बारे में सवाल? हम अच्छा कर रहे हैं? बहुत बढ़िया. 

माइक Rizzo: बहुत बढ़िया. 

टॉमस REIMERS: तो आगे बढ़ जावास्क्रिप्ट के लिए पर. 

माइक Rizzo: तो हम बात करना चाहता था jQuery के साथ शुरू करने के बारे में. किसी को भी jQuery के बारे में सुना है पहले या इसे इस्तेमाल किया? हाँ, एक जोड़ी? तो तुम सिर्फ देशी के साथ काम करते हैं जावास्क्रिप्ट, आप अपने आप मिल जाएगा एक बहुत लंबे चयनकर्ताओं का एक बहुत टाइपिंग. तो क्या jQuery करता है यह प्रदान करता है जावास्क्रिप्ट के लिए एक अच्छा आवरण आप आसानी से चयन की सुविधा देता है कि भाषा और विभिन्न तत्वों में हेरफेर के दस्तावेज़ ऑब्जेक्ट मॉडल के भीतर वेब पेज या मुझे लगता है कि जो डोम, आप लोगों में से सुना है इस बिंदु पर व्याख्यान. 

टॉमस REIMERS: आप के बारे में सुना नहीं किया है यह या आप देखा नहीं है अगर व्याख्यान अभी तक, दस्तावेज़ ऑब्जेक्ट मॉडल है मूल रूप से चीजों को कैसे प्रतिनिधित्व कर रहे हैं. तो एचटीएमएल तरह का एक पेड़ की तरह दिखता है आप वास्तव में इसे बाहर निकालना है. आप शीर्ष पर HTML तत्व है. आप सिर और शरीर है. 

और फिर, आपको लगता है कि भीतर बाकी सब कुछ है. कि डोम के रूप में भेजा है - दस्तावेज़ ऑब्जेक्ट मॉडल. इतने में वस्तुओं का प्रतिनिधित्व करता है जो एक मॉडल दस्तावेज़ में सोचने के लिए एक आसान तरीका है उस के बारे में. सर्वर के बारे में महान बात में से एक यह वास्तव में traversing बनाता है कि और भीतर से छेड़छाड़ तत्वों वह अविश्वसनीय रूप से सरल. 

तो आसान है, वास्तव में, इस बात का बहुमत जावास्क्रिप्ट पुस्तकालयों या नहीं तो बहुमत, लोगों की भव्य बहुमत आप देखेंगे वास्तव में तो jQuery आवश्यकता वे आसानी से खुद चला सकते हैं क्योंकि तुम, तुम jQuery नहीं था करने की कोशिश कर समय की एक बहुत बेकार होगा कुछ का चयन करने के लिए बाहर निकालने के तत्वों और कैसे अन्य बातें करते हैं. सर्वर के बारे में दूसरी बड़ी बात यह पार ब्राउज़र संगत है कि है. 

हम ने कहा कि इसलिए जब वापस याद सभी ब्राउज़रों लागू नहीं चीजें एक ही तरीका है? यह भी जावास्क्रिप्ट में सच है. सर्वर के बारे में महान चीज़ों में से एक यह पता लगाने जाएगा ब्राउज़र और पता लगाने उपयुक्त विधि. 

तो आप एक तत्व का चयन करने की जरूरत है, इंटरनेट एक्सप्लोरर आप कर रहे हैं कह सकते हैं इस तरह से करना चाहिए. फ़ायरफ़ॉक्स सही कह सकते हैं जिस तरह से इस तरह से है. jQuery परवाह नहीं करता. आप एक का चयन करने के लिए jQuery बताओ तत्व यह है कि यह कैसे पता लगाना होगा ब्राउज़र के भीतर यह करना चाहिए उपयोगकर्ता में वर्तमान में है, और उसके बाद करना यह उस तरह. 

माइक Rizzo: तो चलो के बारे में बात नहीं करते हैं jQuery का उपयोग एक छोटा सा. सिर्फ php की तरह, jQuery के एक खास है डॉलर के हस्ताक्षर के लिए स्नेह. तो आपको लगता है कि किसी भी jQuery मिल जाएगा - खैर, सब नहीं. आप कभी कभी डॉलर की जगह ले सकता शब्द jQuery के साथ साइन इन करें. लेकिन आम तौर पर, यह बस, क्योंकि छोटे, तुम jQuery किया जा रहा देख जब भी यह एक डॉलर के हस्ताक्षर के साथ हो जाएगा इस्तेमाल किया. 

तो यहाँ हम सिर्फ एक शुरुआत दिखा रहे हैं डोम में एक तत्व के लिए चयनकर्ता. यहाँ, हम डॉलर के हस्ताक्षर का पालन किया है फिर खुला कोष्ठक और उद्धरण से. और उद्धरण के भीतर हमारे चयनकर्ताओं जाना विभिन्न तत्वों के लिए. बस सीएसएस में की तरह, हम करने के लिए चयनकर्ताओं की जरूरत विभिन्न तत्वों शैली के लिए सक्षम हो पृष्ठ के भीतर. उन विभिन्न चयनकर्ताओं अनुवाद बिल्कुल में jQuery और जावास्क्रिप्ट, अधिकांश भाग के लिए. 

तो यहाँ हम एक डॉट foo है. आप व्याख्यान से याद करते हैं तो अगर, डॉट बस वर्ग का मतलब है. इसलिए हम तत्व का चयन कर रहे हैं class Foo साथ. तो मैं आगे जाना है और खोल अगर हमारे JavaScript कंसोल यहाँ बहुत जल्दी मैं बस प्रकार अगर सिर्फ यह दिखाना है डॉलर के हस्ताक्षर, हम यह कुछ है कि देखना ऊपर आता है कि समारोह. और यह सिर्फ jQuery के द्वारा परिभाषित है. 

टॉमस REIMERS: आप में से उन लोगों के लिए अपरिचित, कंसोल एक उपकरण है आपको अनुमति देता है जो क्रोम,, भीतर असल में, पर JavaScript चलाने वर्तमान पृष्ठ. यह आपको अविश्वसनीय रूप से उपयोगी मिलेगा जब आप वास्तव में डीबगिंग और आप कर रहे हैं जैसे होने की जरूरत है, वर्तमान में क्या है कुछ वैश्विक चर के मूल्य या क्या कुछ और है? यह अपवाद के साथ GDB की तरह की तरह है आप वास्तव में यह कर सकते हैं कि साथ पृष्ठ पर तत्वों में हेरफेर एक बहुत आसान फैशन में. और यह भी, असल में, जाँच नहीं करता यह कुछ भी करता है इससे पहले कि आप के साथ में. 

तो, जबकि GDB की तरह हो सकता है, आप कर रहे हैं सुनिश्चित करें कि आप अगले कदम चलाना चाहते हैं? सांत्वना वास्तविक में है. वेब पृष्ठ प्रतिपादन और है तो के रूप में यह क्या कर रहा है जो कुछ भी कर परिषद की भी यह साथ चल रहा है. और तुम में मढ़ना कोड डाल सकते हैं कि कंसोल, जो होगा पृष्ठ पर चला जा. 

माइक Rizzo: तो सांत्वना दर्ज करने के लिए, मैं मैं संक्षेप चाहिए लगता है कैसे करना है कि उल्लेख. आप हो सकता है कि पिछले समस्याओं में खेतों में क्रोम के तत्व का निरीक्षण कार्यों या देखें पृष्ठ स्रोत - और उन सिर्फ सही से पहुँच रहे हैं पेज या एक विशिष्ट पर क्लिक तत्व और निरीक्षण या तो कर तत्व या देखें पृष्ठ स्रोत. हम भी जावास्क्रिप्ट का उपयोग कर सकते हैं सांत्वना सीधे द्वारा तत्व का निरीक्षण चुनने. तो फिर तुम सिर्फ हिट सांत्वना अभी तक सही पक्ष पर. 

वैकल्पिक रूप से, आप भी जा सकते थे ऊपरी दाहिने हाथ कोने में, इस स्क्रीन पर काट रहा है, जो जहां यह तीन क्षैतिज सलाखों है. और आप उपकरण के लिए नीचे जाने के लिए और फिर JavaScript कंसोल यहाँ कहाँ देख सकते हैं - कम से कम Windows पर - शॉर्टकट नियंत्रण तो फिर जे पारी है हम एक तत्व का चयन करना चाहता था इस पृष्ठ के भीतर, बस जैसे मैं पता चला इससे पहले, हम डॉलर के हस्ताक्षर खुले parens करना और फिर उद्धरण. 

एक दिलचस्प बात यह है कि आम तौर पर, है एक उद्धरण और दोहरे उद्धरण हैं विनिमेय. तो बहुत से लोगों को अभी भी उपयोग उद्धरण वे टाइप करने के लिए तेजी से कर रहे हैं क्योंकि दोहरे उद्धरण चिह्नों की तुलना में आप नहीं है नीचे शिफ्ट पकड़ है. तो मैं सिर्फ सही है कि अब क्या होगा. 

तो मैं कुछ का चयन करना चाहते हैं वर्ग के साथ. कंटेनर, मुझे पता है कि सिर्फ इसलिए कि है पर कुछ है कि हमारे वेब पेज अभी. और मैं हिट दर्ज करें. और हम यह इसे चयनित देख सकते हैं. तो यह पता चलता है कि यह उस वस्तु लौटे. तो यह है कि एक बुनियादी चयन है. हम वास्तव में यह हेरफेर करना चाहता था, आप कुछ कॉल करना होगा उस चयन पर, जो हम बाद में मिल जाएगा. 

टॉमस REIMERS: तो बस उस पर विचार करने के लिए अधिक गहराई में, यह अलग नहीं है हम सी में बनाया समारोह कॉल की तुलना यहां समारोह के नाम एक है थोड़ा अजीब है. यह डॉलर के हस्ताक्षर है. यह सिर्फ एक समारोह का नाम है. इसके बारे में कुछ खास नहीं है. 

हम खुले कोष्ठकों है. तो, हम हमारे लिए एक तर्क है, जो इस मामले में एक स्ट्रिंग होना होता है, जो इसके लिए एक चयनकर्ता है. और फिर, हमारे पास हमारे बंद कोष्टक. बस. 

ऐसा लगता है कि बेहद अलग नहीं है. हालांकि, यह बहुत अजीब लग रही है. और वह है, की तरह, एक चिपके हुए हो सकते हैं बहुत से लोगों के लिए इशारा करते हैं. 

माइक Rizzo: तो इसी तरह, हम चाहते थे एक आईडी है कि एक तत्व का चयन करने के लिए, अब हम से चयन करना चाहते हैं बजाय वर्ग की आईडी. यह एक ऐसी ही बात होगी, जहां हम बस आईडी के लिए तेज साइन करते हैं. इसलिए हम सब यहाँ का चयन कर रहे हैं आईडी बार है कि तत्वों. 

टॉमस REIMERS: और इस फैली हुई है. यही सीएसएस फैली हुई है. बस सीएसएस में की तरह, आप सभी का चयन कर सकते हैं class Foo है जो लिंक,. यहाँ, यह एक ही बात है. 

आप का चयन करेंगे, जो a.foo कर सकता है class Foo साथ लिंक के सभी. तुम एक तेज बार कर सकता है जो होगा आईडी पट्टी के साथ और तो लिंक का चयन करें पर और आगे. किसी भी सीएसएस चयनकर्ता एक मान्य है jQuery चयनकर्ता. 

माइक Rizzo: हाँ. ठीक है, तो अब चलो थोड़ा सा में मिलता है हम साथ कर सकते हैं कि गड़बड़ी की हमारे jQuery. तो jQuery के एक विशेष प्रकार है हम सिर्फ उपयोग जहां अंकन की अंत में एक डॉट. और आप में इस तरह के बारे में सोच सकते हैं सी हम अलग structs था कि कैसे. और उन structs में जाने के लिए, तुम होगा उन्हें में लाने के लिए एक डॉट का उपयोग करें. 

इस तरह की, एक ऐसी ही बात है. केवल अब हम इस के भीतर कार्य किया है हम उस पर कॉल कर सकते हैं कि चयनकर्ता. यहाँ तो बहुत पहले उदाहरण आप एक सीएसएस चयनकर्ता देख सकते हैं. और असल में, क्या करता है कि यह है इस के लिए सबसे पहले तत्व के लिए सीएसएस लागू होता है आपके द्वारा चयनित बात - आपके द्वारा चयनित इस तत्व - कि मूल्य के साथ. 

टॉमस REIMERS: की तो एक आसान अनुवाद अगर jQuery, मूल रूप से, कि हो जाएगा बस foo लिया. और फिर सीएसएस में कहा, लाल और करीब रंग. यह एक ही विचार है. क्या यह हो चुका है यह चयनित है सभी foo तत्वों. और फिर इसे लागू किया है. सॉर्ट की, संपत्ति का रंग लाल के बराबर है. 

माइक Rizzo: इसी तरह, हम भी बदल सकते हैं क्या है की वास्तविक सामग्री पेज के HTML, पर दिखा जो इसका मतलब है क्योंकि वास्तव में अच्छा है आपके वेब पृष्ठों को अब पूरी तरह से गतिशील हो सकता है और स्थिर होने की जरूरत नहीं है आप PHP का उपयोग कर बाहर प्रिंट कि बहुत शुरुआत की पर पेज लोड किया जा रहा. तो यहाँ, हम बदल करना चाहता था पेज की वास्तविक HTML, हम अब होगा एचटीएमएल समारोह, जो फोन तो बस हम में निर्दिष्ट जो भी सम्मिलित करता है हम चयनित कि उस तत्व. यहाँ तो हम साथ तत्व का चयन कर रहे हैं वर्ग फू और फिर यह HTML कह यह अब नमस्ते दुनिया है. 

टॉमस REIMERS: और जब आपको लगता है के बारे में की उपयोगी अनुप्रयोगों क्या हैं यही नहीं, इस सीएसएस एक, पहली बात यह है कि आप है के बारे में सोचना शुरू कर सकते हैं के मामले में भी ड्रॉप डाउन मेनू. आप की तरह बातें करना शुरू कर सकता है जब एक उपयोगकर्ता शीर्ष भाग पर घूमता एक बूंद नीचे के हैं, तो आप बनाना चाहते दिखाई नीचे हिस्सा. है ना? 

तो सीएसएस में, हम गुण है दिखाई कुछ बनाने के लिए. प्रदर्शन बृहदान्त्र कोई नहीं जैसे हालात यह अदृश्य बनाना होगा. प्रदर्शन ब्लॉक यह दृश्य करना होगा. या फिर आप, आप सरल जाना चाह कर भी दृश्यता बराबरी की तरह बातें है दिखाई, और दृश्यता छिपा बराबर होती है. 

और आप चीजों को लागू करने के लिए शुरू कर सकता है जैसे मेनू सही ड्रॉप डाउन आप कैसे करने के विचार के माध्यम से प्राप्त करने के बाद इस खोलता है जब आप समझ सकते हैं, हम बहुत संक्षेप के माध्यम से मिल जाएगा जो. लेकिन हमें देखना शुरू कर सकते हैं इस के अनुप्रयोगों. इसी तरह की एक अर्थ में, अगर तुम थे कोशिश करने के लिए और एक चैट, लागू करने, हम कहते हैं इंजन और आप एक छोटे से बनाना चाहते आपने जब भी भाषण बुलबुला आ एक नया संदेश मिला है, एक बार आप नया संदेश, आप एक छोटे से बना सकते हैं भाषण बुलबुला बदलकर आने पेज के HTML, है ना? कि अतिरिक्त भाषण बुलबुला जोड़कर वहाँ में अतिरिक्त पाठ के साथ. हाँ? 

दर्शक: तो आप के भीतर इस एम्बेड होगा तरह की तरह में एचटीएमएल कोड एक [सुनाई]? 

माइक Rizzo: ठीक है. हाँ, हम उस के लिए मिल जाएगा एक छोटा सा में. हाँ, यह समान है PHP के लिए थोड़ा सा. बिल्कुल इसी तरह की नहीं. 

बनाने के लिए एक अच्छा भेद है क्या इस वास्तव में हम जब संपादित संपादित कर रहा है यह होने वाला नहीं है क्योंकि पेज जा रहा है कि वास्तविक फाइल संपादन सर्वर पर रखा है क्योंकि दुनिया अनुमति नहीं होना चाहिए आपकी फ़ाइलों को संपादित करने के लिए. यह सिर्फ पृष्ठ पर क्या संपादित कर रहा है और क्या भीतर प्रदर्शित किया जा रहा है ब्राउज़र. तो आप बाद पृष्ठ पुनः लोड करने के लिए गए थे, हम जैसे कुछ को हटाने का कहना है, हम दूर कॉल के साथ क्या कर सकते हैं देखते हैं, बात यह है कि उसके बाद फिर से बाहर निकलना होगा. 

टॉमस REIMERS: तो एक तरह के बारे में सोचने के लिए यह है कि मैं अपने कंप्यूटर हूँ अगर है और माइक, की तरह, सर्वर है. क्या होने जा रहा है मैं जा रहा हूँ अरे, मैं की एक प्रति हासिल कर सकते हैं, माइक पूछना इस वेब पेज? और उसने मुझे इसकी एक प्रति दे दूँगा. 

नहीं, यह मूल बात नहीं है. यह सिर्फ एक प्रति है. और फिर यह, ओह, की तरह होगा जावास्क्रिप्ट यहाँ नहीं है. जाहिर है, मैं संपादित करना चाहिए पेज इस तरह से किया जाना है. और मैं अपनी कॉपी संपादन कर रहा हूँ. 

लेकिन यह है कि प्रभावशाली नहीं है वास्तविक प्रतिलिपि. और अगर मैं थे उसे फिर से पूछने के लिए , पेज को ताज़ा - अरे, मैं एक और स्वच्छ प्रतिलिपि हो सकता है - वह मुझे दे रहा है एक और साफ प्रतिलिपि. और फिर, मैं एक ही बात करने जा रहा हूँ जैसे, ओह, यह कहते हैं कि यहां जेएस इस संपादित करने के लिए. और मुझे लगता है कि कर रखने के लिए जा रहा हूँ. 

माइक Rizzo: तो एक बहुत अच्छी बात jQuery के साथ आप कर सकते हैं कि वास्तव में विभिन्न प्रकार जोड़ अपने पृष्ठ के लिए एनिमेशन की. आप जहां कभी देखा है अगर मैं नहीं जानता आप एक को भरने के लिए बाहर एक फार्म कोशिश कर रहे हैं ऑनलाइन और तुम न भरें चीजें सही ढंग से. तो एक छोटी सी चीज नीचे स्लाइड शीर्ष पर है और आप कहते हैं यह सही ढंग से नहीं किया है. पुन: प्रयास करें. और फिर, यह भी सिर्फ स्लाइड सकता है. 

JQuery के कार्यों में बनाया गया है बाहर वर्षगांठ कि उस के सभी बनाने एनीमेशन वास्तव में, वास्तव में आसान. तो फीका पहला है बाहर समारोह, जो आप कुछ पर कॉल कर सकते हैं. और इसके बारे में सीएसएस बदलने के लिए एक रास्ता है एक एनिमेटेड रास्ते में उस तत्व. तो यह जो कुछ तत्व लेता है आप इस पर बाहर फीका कहते हैं. और फिर, धीरे धीरे यह अस्पष्टता परिवर्तन यह पूरी तरह से पारदर्शी चला जाता है जब तक. 

टॉमस REIMERS: अन्य लोकप्रिय एक जो कर देगा, स्लाइड नीचे है कुछ इसे नीचे फिसलने से दिखाई देते हैं. तो ड्रॉप डाउन मेनू के मामले में, फिर, हम पता लगाने के लिए कैसे सीखा जब इस पर hovered गया है जब, आप सिर्फ यह नीचे बता सकता है हिस्सा अब नीचे स्लाइड. और फिर, यह प्रकट होता है नीचे फिसलने से. 

माइक Rizzo: और फिर, आप बस है अगर मन में एनीमेशन के कुछ प्रकार है कि jQuery जरूरी प्रदान नहीं करता है. उदाहरण के लिए, jQuery हम कहते हैं आप एक स्लाइड के साथ प्रदान करता है नीचे और स्लाइड ऊपर. ठीक है, चलो आप स्लाइड के लिए चाहते थे, हम कहते हैं से छोड़ दिया है या में से कुछ CS50 तरह का सही तरह मुख्य पृष्ठ जब भी करता है आप एक नए पैनल के पास जाओ. तुम तो शायद करना होगा का उपयोग कर यह अपने आप लागू jQuery के भीतर समारोह चेतन. 

तो इसी तरह, आप सिर्फ चेतन. और फिर, यह भीतर यह एक लेता है विभिन्न मूल्यों की शब्दकोश आप पारित करने के लिए चाहिए रहे हैं. तो यहाँ, हम चेतन करना चाहता था तत्व foo ऐसी है कि इसकी चौड़ाई या तो बढ़ती है या 80 पिक्सल के लिए अनुबंध, यह वर्तमान में क्या है पर निर्भर करता है. हम बस के रूप में है कि पारित होगा यह भीतर तर्क. 

कुछ अन्य तर्क भी चेतन उदाहरण के लिए, इसे पारित कर सकता है, एनीमेशन की गति आप इसे देना चाहता हूँ कि. और ऐसा करने के लिए, मैं सिर्फ इतना कहना होगा जल्दी से गूगल jQuery चेतन. और फिर, इस पेज को लाने, आप कर सकते हैं यह अलग की एक गुच्छा मिला है देखना आप इसे पारित कर सकते हैं कि गुण. 

और मैं आपको प्रोत्साहित करते हैं - आप आ गए जब भी तुम नहीं करते कि कुछ भर में पता है या सिर्फ एक के बारे में अधिक जानकारी चाहते हैं आप कह सकते हैं कि विशेष रूप से विधि कुछ पर - बस यह गूगल. jQuery अत्यंत है अच्छी तरह से प्रलेखित. और अक्सर समय की एक बहुत हैं वे आप के लिए उपलब्ध कराने के उदाहरण है कि. हम नीचे स्क्रॉल करें - जिस तरह से नीचे - हम के रूप में अच्छी तरह से उपयोग कर सकते हैं कि. 

फिर, जब एक डेवलपर वास्तव में चला जाता है लेखन एक की मुसीबत के माध्यम से पुस्तकालय, वे आम तौर पर चाहते हैं इसका इस्तेमाल करने के लिए किसी को. तो बगल में जा रहा है एक प्रलेखन हो. और प्रलेखन कि आमतौर पर किया जा सकता है जो परियोजना पृष्ठ पर पाया हम तुम में है कि मूल साइट क्यों दी करने के लिए आप जो लिंक शुरुआत परियोजना पृष्ठों आप कर सकते हैं ताकि दस्तावेज़ों को देखें. 

आमतौर पर, मामले में परियोजना पेज की [सुनाई], यह आपको बताया कक्षाओं के नाम. जावास्क्रिप्ट के मामले में, यह देता है आप कार्यों के नाम पर. वैसे, हम ऊपर तक स्क्रॉल अगर, कार्यों पर एक त्वरित तरफ ध्यान दें है आप कार्यान्वित एक समारोह को देखने के लिए जब भी मेहनत के साथ इस तरह बीच में कोष्ठक मतलब है कि, कि संपत्ति वैकल्पिक है. सिर्फ एक को सिर. मैं सवालों का एक बहुत कुछ देखा है उस के बारे में. 

यहाँ तो हम देख सकते हैं कि चेतन गुण लेता है एक आवश्यक तर्क के रूप में. और सब कुछ वैकल्पिक है. की ओर ध्यान दें - आप प्रकार, इस के बारे में सोच सकते हैं के, मैन पेज की तरह. मैन पेज सी के लिए दस्तावेज हैं और साथ ही अन्य चीजों की एक बहुत कुछ के लिए. 

माइक Rizzo: तो हम सीखा है कि कैसे करने के लिए पृष्ठ पर अलग सीएसएस बदलने, यह चेतन, और HTML जोड़ हटा दें. लेकिन वास्तव में सबसे शक्तिशाली में से एक जावास्क्रिप्ट के बारे में बातें और विशेष रूप से jQuery - क्या यह आपको देता है का जवाब है हो कि विभिन्न तत्वों. उदाहरण के लिए, हम यहाँ है कोई ईवेंट हैंडलर. जब भी यह और है कि बस का मतलब घटना होता है, हम एक में इसे संभाल निश्चित तरीका है. 

तो यहाँ, सामान्य jQuery घटना हैंडलर पर डॉट है. और फिर, पहली बात यह है कि आपके द्वारा प्रदत्त क्या है घटना यह चाहिए के लिए सुन हो. यहाँ तो, इसे क्लिक करें है कि हम इंतजार कर रहे हैं. 

टॉमस REIMERS: वैकल्पिक रूप से, आपके पास मंडराना पर, जो एक बहुत ही लोकप्रिय है. तो वापस मेनू विचार नीचे मेरी ड्रॉप करने के लिए. आप मंडराना पर ऊपर से एक होगा. और फिर आपको लगता है कि बदल सकता है. 

माइक Rizzo: ठीक है. और फिर, जब ऐसा होता है, यह सिर्फ हम यह दे कि इस समारोह में कार्यान्वित एक तर्क के रूप में और कहा कि यह हाय या नमस्ते सचेतक हैं. 

टॉमस REIMERS: तो के मामले में जावास्क्रिप्ट, यह हम की जरूरत है एक जगह है सी. से खुद को दूर हम कर सकते हैं वास्तव में तर्क के रूप में कार्य करता है ले लो. का एक बहुत वास्तव में कर रहे हैं यह करने के लिए जटिल तरीके. हम एक तरह से बढ़ावा देने के लिए जा रहे हैं, आप परिभाषित कर सकते है जो सही वहाँ कार्य करते हैं. 

तो आप एक समारोह के रूप में के लिए पूछ रहे हैं जब एक पैरामीटर, आप मूल रूप से बस रहे हैं समारोह को परिभाषित करने के लिए जा रहा मौके पर. और अगर आप एक समारोह को परिभाषित रास्ता जावास्क्रिप्ट में आप है सचमुच समारोह का कहना है. फिर, आमतौर पर, नाम समारोह की. लेकिन हम संदर्भ के लिए कभी नहीं जा रहे हैं इस समारोह में फिर से. इसलिए हम गुमनाम छोड़ दें. 

तब कोष्ठकों, तो घुंघराले ब्रेसिज़, और फिर उस भीतर कोड. इसलिए हम इस सकता है समझ थोड़ा भ्रमित हो. तो हम आपको सामान्य रूप से दे कोई ईवेंट हैंडलर कैसा लग रहा है नीचे दिए गए, जो घटनाओं पर है. और फिर, कि अंदर अपने कोड. 

माइक Rizzo: कोई हो इस बारे में सवाल? यह थोड़ा भ्रमित हो सकता है आपको यह देखने के लिए पहली बार. 

टॉमस REIMERS: आप वास्तव में करना चाहते हैं एक फ़ाइल को खोलने और उन्हें कुछ दिखाने jQuery अभी? 

माइक Rizzo: हाँ, चलो करते हैं. ठीक है. 

टॉमस REIMERS: तो अब हम कर रहे हैं उपकरण में. और क्या हम किया है कि हम ले लिया है एक index.html दोनों बनाने की स्वतंत्रता लिंक करने के लिए जो फाइल, एक जावास्क्रिप्ट फ़ाइल. और हम खोल सकते हैं - हाँ. खैर, यह दो बातें करता है. 

पहले इसे करने के लिए लिंक JavaScript फ़ाइल. और हम यहाँ कि ऊपर देखेंगे. हम के सिर में देखते हैं कि HTML दस्तावेज़, विशेष रूप से. तो तुम वहाँ देखेंगे कि हम मूल रूप से, एसआरसी का कहना है, जो स्रोत के लिए खड़ा है. और उस यूआरएल है. 

यहाँ तो आप हम है कह सकते हैं jQuery शामिल थे. और हम भी लिपियों को शामिल किया है. जावास्क्रिप्ट शामिल करने के लिए अन्य रास्ता है आप एक इनलाइन स्क्रिप्ट शामिल कर सकते हैं हम नीचे स्थित है टैग के रूप में जहां यह स्क्रिप्ट प्रकार पाठ जावास्क्रिप्ट है कहते हैं. 

तो हम कर रहे हैं, सुनना, कह रहे हैं एक स्क्रिप्ट शामिल करने के बारे में. और उस स्क्रिप्ट के प्रकार है पाठ का एक प्रकार है जो जावास्क्रिप्ट,. बहुत आसान है. 

माइक Rizzo: तो यह एक तरह से, करने के लिए हो जाता है हम में शामिल कैसे के बारे में अपने प्रश्न हमारे फाइलों में जावास्क्रिप्ट क्योंकि जब हम पीएचपी, हम ऐसा कुछ करना था. और फिर, हमारे PHP कार्य किया है - के शेयरों कर हम कहते हैं उस के साथ कुछ - वहाँ में चला जाता है. हालांकि, अब हम स्क्रिप्ट टैग नहीं है हम वास्तव में कर रहे हैं, जो दे कि एचटीएमएल खुद का हिस्सा ऐसा नहीं है, क्योंकि जैसे कि यह एक HTML फ़ाइल जा रहा faking PHP में है कि आप वास्तव में में जाना है क्योंकि और पृष्ठ के स्रोत पर देखो, तुम वहाँ में इन स्क्रिप्ट टैग देखेंगे जावास्क्रिप्ट के साथ जुड़े के साथ उस में उन्हें. 

हम चाहते थे तो फिर, अगर कुछ जावास्क्रिप्ट लिख - चलो बस हम शरीर बदलना चाहते थे, हम कहते हैं अभी मैं नहीं है क्योंकि मैं वास्तव में यह कर सकते हैं कि किसी भी अन्य टैग शरीर के अलावा संपादित करें. चलो बस मैं चाहता था कहते हैं कि इस बात का सीएसएस बदल जाते हैं. तो हम आगे जाना है और बदल देंगे लाल को यह का रंग. 

इसलिए मैं फ़ाइल को बचाने के. चलो वापस हमारे वेब पेज के लिए चलते हैं, ताज़ा, और यह स्वचालित रूप से यह करता है यह इंतजार कर रहे थे जैसे यह नहीं मालूम था क्योंकि हम नहीं सुन रहे थे पर सब क्योंकि एक घटना या ऐसा कुछ के लिए. 

टॉमस REIMERS: तो हम उस के लिए वापस जाओ अगर विशेष रूप से फ़ाइल - एचटीएमएल फाइल - आप जा रहे हैं देखने के लिए हमारे पास है - इस भरी हुई है, याद है कि एक तरह से, कालक्रम के अनुसार. इसलिए हम पहले सिर है. यह उन दो फाइलों को लोड करता है. तो फिर हम शरीर के पास जाओ. और हम नमस्ते दुनिया को देखते हैं. इसलिए हम नमस्ते विश्व प्रस्तुत करना. 

और फिर हमारे पास पिछले बात हम स्क्रिप्ट टैग है. क्योंकि यह तो यह स्क्रिप्ट टैग चलाता कुछ के लिए प्रतीक्षा करने के लिए यह नहीं कह रहा. और कहा कि सबसे बुनियादी है JavaScript चलाने के लिए रास्ता. 

साथ ही कहा, आप स्क्रिप्ट डाल सकते हैं शीर्ष लेख में टैग सिर्फ इस बिंदु को दिखाने के लिए? और वह चला रहे हैं. हम सूचना के लिए जा रहे हैं कि यह रंग नहीं बदला. और इस की समस्याओं में से एक है जावास्क्रिप्ट चीजें भरी हुई हैं कि है एक कालानुक्रमिक क्रम में. 

इसलिए समय पर कि कि कोड चल रहा था, हम चयनित - वापस जाओ - शरीर टैग. शरीर टैग अभी तक अस्तित्व में नहीं है क्योंकि जावास्क्रिप्ट HTML के साथ लाइन में है. तो ब्राउज़र चुनें शरीर की तरह है. अभी तक ऐसी कोई बात नहीं है. इसलिए हम चाहते हैं कि उपेक्षा कर सकते हैं. और हम जाते रहते हैं. 

और फिर हम एक शरीर टैग को परिभाषित. लेकिन उस अद्यतन हो जाता है कभी नहीं. तो क्या आप स्क्रिप्ट को लागू कर रहे हैं जब टैग, यकीन है कि तुम जगह बनाना शरीर टैग के बाद. अगली स्लाइड. 

माइक Rizzo: ठीक है. इसलिए हम कुछ बदल गया. यह करने के लिए प्रतिक्रिया लेकिन ऐसा नहीं लग रही थी हमें यह सब पर बस की तरह है क्योंकि जैसे ही यह पेज लोड के रूप में ऐसा किया था. तो अब, बजाय ऐसा करने का, क्यों हम कोई ईवेंट हैंडलर जोड़ नहीं है. 

तो हम कुछ करते हैं शरीर को फिर से. और हम पर यह कर कहते हैं - क्लिक करें. हम एक समारोह जोड़ देंगे. 

टॉमस REIMERS: चलो परिवर्तन यह फिर से लाल रंग है. क्यों नहीं? 

माइक Rizzo: हाँ, चलो परिवर्तन फिर लाल को अपनी 'रंग. ठीक है. तो चलो पृष्ठ को फिर से लोड करते हैं. ठीक है, हम देखते हैं - उम्मीद के रूप में, यह अभी तक लाल बारी नहीं है. लेकिन फिर हम आगे बढ़ो और इसे क्लिक कर सकते हैं. 

टॉमस REIMERS: और यह लाल बारी है. 

माइक Rizzo: और यह करता है उम्मीद के रूप में लाल बारी. 

टॉमस REIMERS: और हम कैसे देख सकते हैं हम बहुत बुनियादी निर्माण शुरू कर सकते हैं बातचीत. हम क्या करना चाहते हो सकता है अन्य चीजें है हम शरीर बनाने के लिए नहीं करना चाहते लाल रंग, के एचटीएमएल कर देना पृष्ठभूमि रंग लाल. अभी तो यह एक ही सीएसएस है. 

और हम इसे बदलने, जब हम यह देख सकते हैं बदलने की बहुत नाटकीय प्रभाव पूरे पृष्ठ. तो फिर, आप चीजों को लागू कर रहे हैं, आप एक घटक हो सकता है पर क्लिक किया जा करने के लिए होती है. चलो एक बाहर निकलें बटन हम कहते हैं और एक पूरी अन्य घटक, प्रतिक्रिया के लिए होती है. तो आप एक खिड़की को दूर करेगा जब ऐसा होता है. 

माइक Rizzo: ठीक है. बस एक उदाहरण के रूप में - आप यह पहले देखने को मिलता नहीं था - मैं सिर्फ यह क्या लगता है आपको दिखाता हूँ हम कुछ छिपाना जब पसंद है. तो मैं आगे जाना होगा और स्लाइड ऊपर है. 

टॉमस REIMERS: एक में है कि रैप करने के लिए करना चाहते हैं हम ऐसा पैरा प्रकार से पहले? 

माइक Rizzo: ठीक है. हाँ, हम क्यों नहीं करते कि सिर्फ इसलिए हम एक छोटे से अधिक इसका चयन कर सकते हैं. 

टॉमस REIMERS: और चलो यह एक वर्ग दे. 

माइक Rizzo: हाँ. ठीक है, तो चलो देखते हैं. इसके बजाय वास्तविक शरीर के चयन की अब, मैं बस के साथ सब कुछ का चयन करेंगे वर्ग नमस्ते, जो यहां हम बस एक बात है. तो हम करने के लिए नहीं होना चाहिए उस के बारे में चिंता है. 

इसलिए मुझे लगता है कि यह ताज़ा कर देंगे. मुझे आगे जाना है और इसे क्लिक करेंगे. और यह है, की तरह, एक अजीब स्लाइड किया कि नहीं लग रही थी, जो ऊपर बात, आकर्षक. आम तौर पर, वे बहुत अच्छी लग रही है. कुछ के लिए - मैं इस अनुमान कारण - नहीं किया था. मैं सिर्फ इतना फीका बाहर कर देंगे आप भी उस पर विचार कर सकते हैं. बहुत अच्छे. 

और फिर, मैं जावास्क्रिप्ट को खोलने अगर फिर सांत्वना और हम क्या देखना चाहते हैं यह हम इसे अंदर हो पाती है जब की तरह दिखता है अब, मैं सिर्फ इस पर में फीका कहते हैं. और यह अंदर वापस fades 

इसी तरह, हम वास्तव में भी पारित कर सकता है एक बहस में फीका या बाहर फीका करने के लिए, है, जो एक तरह से, यह की गति. तो चलो आगे चलते हैं और हम कहना चाहते हैं यह धीरे धीरे जाने के लिए अंदर फीका इसलिए मुझे लगता है कि यह अभी भी लग रहा था लगता है बहुत जल्दी. लेकिन यह पहले की तुलना में धीमी थी. 

टॉमस REIMERS: और आप खोजना चाहते हैं इन बातों के बारे में अधिक से बाहर, फिर से, बस, प्रलेखन के लिए जाना हम आपको दे दिया, और पढ़ा है जो इन के माध्यम से. वे अपने कार्यों के दस्तावेज अविश्वसनीय रूप से अच्छी तरह से. 

माइक Rizzo: ठीक है. तो मैं वापस आ गया है इस लिए चलते हैं लगता है. और हम अपने अंतिम पृष्ठ के बारे में बात कर सकते हैं. खैर, हम बूटस्ट्रैप साथ समाप्त कर सकते हैं. और फिर हम इसे खोल देता हूँ कुछ सवालों के लिए. और तुम लोग किसी भी विचार है कि आप ऊपर फेंक और देखने की कोशिश करना चाहते हैं हम साथ उन्हें लागू कर सकते हैं जल्दी छोड़ दिया. 

तो सच में जल्दी से बूटस्ट्रैप के बारे में, जो स्वचालित रूप में शामिल किया गया था सीएसएस फ़ोल्डर में सेट अपने पिछले समस्या और वास्तव में करने के लिए जोड़ा अपने header.php. तो आप कक्षाओं जोड़ सकता है कि यह करने के लिए बूटस्ट्रैप भीतर परिभाषित कर रहे हैं. और यह स्वचालित रूप से स्टाइल किया होगा तदनुसार उन चीजों. 

टॉमस REIMERS: तो बूटस्ट्रैप एक बहुत है लोगों द्वारा विकसित जादुई बात चहचहाना पर. और क्या यह करना चाहिए था था - वेबसाइट बनाने के लिए वास्तव में कड़ी मेहनत कर रहे थे पहले हम था, खासकर जब अच्छी लग रही आम घटकों का एक बहुत. इतने पर बटन का एक बहुत वेब ही देखा. 

पाठ क्षेत्रों का एक बहुत कुछ किया जा सकता है मानक पाठ से बेहतर लग क्षेत्र आप शायद सच से पता पुराने वेबसाइटों या वास्तव में खराब कर दिया सिर्फ शाब्दिक की तरह लग रही है, जो वेबसाइटों, पाठ के बिना किसी भी रूप पाठ बक्से छाया या अच्छा रूपरेखा के किसी भी प्रकार. तो क्या बूटस्ट्रैप किया, यह ठीक है, ने कहा था हम एक बहुत ही आम शैली है. क्यों हम सीएसएस का एक आम सेट नहीं कर सकता हूँ और के रूप में जावास्क्रिप्ट का एक आम सेट और जो के रूप में अच्छी तरह से, जो यह शैली कर सकते हैं लोग बूंद की तरह बातें दे सकते हैं मेनू के नीचे, जो लोगों को दे सकते हैं modals तरह बातें. 

मॉडल पृष्ठ के ऊपर चबूतरे क्या है यह सच पूछिये तो जब भी आगे रोकता है जो कुछ, आप जब तक बातचीत इसके साथ बातचीत. कुछ इस तरह, आप सुनिश्चित कर रहे है आप इस बात को हटाना चाहते हैं? आप वास्तव में कुछ भी नहीं कर सकते आप हाँ कहते हैं या नहीं जब तक. 

यह सब इस ले लिया और उसे यह पैक एक साथ और कहा, यहाँ हम चले. लोग अब इस का उपयोग कर सकते हैं. और आप इस पर पा सकते हैं getbootstrap.com पर. यह स्वतः ही भीतर शामिल किया गया था अपने पिछले समस्या निर्धारित किया है. और आप का स्वागत है और अधिक से अधिक कर रहे हैं अपने अंतिम परियोजना पर इसका इस्तेमाल करते हैं. और आप का पालन करना चाहते हैं बूटस्ट्रैप पाने के लिए कड़ी. 

आप यहाँ देखेंगे है सीएसएस साइट bootstrap. आप बूटस्ट्रैप देखेंगे. आप नीचे स्क्रॉल और अगर, आप देखेंगे इसे डाउनलोड करने के लिए कैसे, कैसे करने के लिए इसे स्थापित, वगैरह. 

माइक Rizzo: और तुम, भी कर सकते हैं काफी दिलचस्प है, के लिए अनुकूलित विषयों की तरह जो कुछ भी हो आप चाहते हैं कि. मुझे लगता है कि मैं के लिए कुछ किया है पता मेरी मैं क्लास ली जब अंतिम परियोजना यह अनुकूलित किया गया था. बूटस्ट्रैप का एक अलग संस्करण है कि एक अलग रंग योजना थी और कुछ के विभिन्न आकार अलग अलग चीजें हैं. तो मैं उस के साथ खेलने के लिए प्रोत्साहित करते हैं. ऐसा करने में मज़ा की तरह है. 

टॉमस REIMERS: शीर्ष भर में खोज रहे हैं फिर, यह फ़ॉन्ट के समान है भयानक साइट. दस्तावेज की एक बहुत शुरू होगा आपने जब इसी तरह लग रहे करने के लिए इसके बारे में पर्याप्त देखा. तो यहाँ हम सीएसएस है इस के घटक. और आप देखेंगे कि यह कैसे बातें शैली कर सकते हैं. आप टेबल पर क्लिक करें तो अगर, उदाहरण के लिए, आप तुरंत एक बना सकते हैं तालिका सुंदर बस जोड़कर यह करने के लिए वर्ग तालिका. 

बटन के लिए एक ही बातें. आप केवल वर्ग BTN और BTN जोड़ते हैं डिफ़ॉल्ट या BTN प्राथमिक, आप कर सकते हैं इन बटनों में से किसी एक मिल इन पूर्व बनाया शैलियों के साथ. और फिर, आप के लिए देख रहे हैं बस की तुलना में अधिक जटिल कुछ डब्ल्यू पहले ही खत्म हो गया है, पर क्या किया restyling शीर्ष हम भर जावास्क्रिप्ट टैब घटकों का एक गुच्छा है. 

तो यहाँ हम संक्रमण, modals है, लटकता, टैब्स, और टूलटिप्स. एक टूलटिप अपने अधीन ऊपर चबूतरे क्या है माउस आप कुछ पर मंडराना जब. R आर अलर्ट, बटन, बंधनेवाला accordions है क्या वे आम तौर पर कहा जाता है. Carousels, जो फ्लिप जैसे चित्रों के माध्यम से. 

तो उन घटक हैं बूटस्ट्रैप की. मैं करने के लिए प्रोत्साहित करेगा अत्यधिक उन पर लग जाओ. एक जावास्क्रिप्ट घटक नहीं है और एक सीएसएस घटक. आप करेंगे के रूप में उपयोग करने के लिए स्वतंत्र महसूस करो. हम उन में बहुत अधिक जाने के लिए नहीं जा रहे हैं हम प्रलेखन क्योंकि उन्हें लगता है वास्तव में अच्छी तरह से किया जाता है. और हाँ. आप इस बारे में कोई सवाल है? 

एक बहुत जल्दी कर रहे हैं ताकि के रूप में माइक Rizzo ओर, इस वेब पेज के डिजाइन कि हम जल्दी के लिए एक साथ रखा इस प्रस्तुति है वास्तव में बूटस्ट्रैप का प्रयोग किया. आप देख सकते हैं, हम इन पर क्लिक करने पर अलग टैब, हम वास्तव में कभी नहीं रहे इस वर्तमान index.html पृष्ठ को छोड़कर. तो क्या हमारे पास अलग divs है इस सूचकांक के भीतर. और फिर, हम एक अलग क्लिक करें जब भी टैब, यह सिर्फ बदल रहा है जो एक दिखा. 

इसलिए यह तदनुसार, उन पदों पेज के HTML परिवर्तन इतना है कि वर्तमान टैब सक्रिय रूप में चिह्नित है तो यह अलग और लग रहा है प्रकट होता है वास्तव में अच्छा है. 

टॉमस REIMERS: इतना है कि सब कुछ किया गया था हमें लगभग किसी भी सीएसएस लिखने के बिना. हम भी शीर्ष भर में एक हैडर देखते हैं, जो रंग हमारे द्वारा कर रहे हैं. लेकिन वास्तविक पर डाल पृष्ठ के शीर्ष और बनाने यह पुस्तक बूटस्ट्रैप था. और फिर भी एक और पुस्तकालय के लिए - इस हम के बारे में बात की थी, लेकिन एक नहीं है अगर आप चाहते हैं कि आप Google कर सकते हैं. इस prettify.js कहा जाता है. और यह अपने कोड को उजागर वाक्यविन्यास होगा आप सीएसएस और जावास्क्रिप्ट का उपयोग कर दोनों के लिए. 

हम इस बारे में बात करना चाहते पिछले बात हम में तुम बाहर रिलीज से पहले यह पता लगाने के लिए पुस्तकालयों को देखने के लिए दुनिया कैसे उन का उपयोग करने के लिए और, उम्मीद है, प्रलेखन पढ़ा है और क्या आप पाते हैं जरूरत के पुस्तकालयों को खोजने के लिए है. तो पहले हम सिर्फ रहे है गूगल धक्का जा रहा. गूगल जाओ. 

यही कारण है कि हम क्या कर सचमुच है जब हम कुछ करने की जरूरत है कि हम गूगल है. एक जावास्क्रिप्ट पुस्तकालय है कि मुझे एक में समय में हेरफेर करने की अनुमति देता है उपयोगी तरीका है? मुझे पता है तो अगर उस बनाने कुछ उपयोगकर्ता यहाँ एक खाता है, और यह है वर्तमान समय में, मैं कैसे की गणना कर सकते हैं करने के लिए बिना उस के साथ अंतर यह अपने आप गणना? तो यह वास्तव में एक आम बात है, जावास्क्रिप्ट समय पुस्तकालय. और यहाँ हम Moment.js - सबसे लोकप्रिय एक. 

हम हेरफेर करने के लिए एक पुस्तकालय की जरूरत है रंग करने के लिए सक्षम होने के लिए की तरह कुछ यादृच्छिक रंग का एक गुच्छा उत्पन्न - संभवतः, एक उत्पन्न करने के लिए शैली या कुछ और - हम जैसे कुछ गूगल सकता जावास्क्रिप्ट रंग पुस्तकालय. और मुझे लगता है कि हम साथ पॉप जाएगा यकीन एक हजार और उनमें से एक. आप उन के माध्यम से पढ़ने के लिए स्वागत है. 

तो सबसे बातें - तुम उन्हें जब लगता है - जा रहे हैं में से एक पर होस्ट किया साइटों जो मेजबान कोड. वे कर रहे हैं कुछ लोकप्रिय होते हैं. द्वारा, सबसे लोकप्रिय अब तक, github.com है. आप GitHub के लिए जाना और अगर यह वास्तव में है सामान्यकरें आयोजित किया गया जहां. तो तुम वापस कि एक के लिए जाना चाहते हैं. उन्हें पता चलता है कि. 

माइक Rizzo: और वह वास्तव में है, जहां अगर आप ध्यान यह भी मेजबानी की है. 

टॉमस REIMERS: हाँ. तो आप सामान्य करने के लिए खत्म हो जाना अगर और GitHub के पास जाओ. थे कि है? 

माइक Rizzo: उस छोटी सी बिल्ली बात GitHub प्रतीक है. 

टॉमस REIMERS: ओह. तो GitHub नामक विधि का उपयोग करता है दुकान कोड को Git. आप यह है कि या पता नहीं क्या है यह ठीक है, तुम डर. आप git क्या है पता करने के लिए नहीं है GitHub एक डाउनलोड बटन है क्योंकि नीचे सही पर. 

पता करने के लिए अन्य उपयोगी बात GitHub अधिकांश उत्पादों के बारे में एक मुझे पढ़ा होगा. और वे एक वेबसाइट नहीं है, तो मुझे कैसे आप के बारे में बात करेंगे पढ़ा क्या यह आप इसका इस्तेमाल कैसे, इसे स्थापित करता है, वगैरह, वगैरह, वगैरह. क्या हम मूल रूप से किया गया है आप के माध्यम से चल रहा है. 

माइक Rizzo: इंटरनेट के छोड़ने. 

टॉमस REIMERS: वह ठीक है. हम चाहते थे कि पिछले दो बातें के बारे में बात करने के लिए - हम Git के बारे में बात की है - समस्या निवारण है. और इस एक के लिए भी उतना ही प्रासंगिक नहीं है यह है के रूप में अंतिम उत्पाद आप 50 छोड़ दें. और आप उत्पादों में चलाने जब पुस्तकालयों को लागू करने या लागू करने अपनी खुद की परियोजना, आप जा रहे हैं प्रश्न हैं या आप कर रहे हैं करने के लिए प्रश्नों के लिए देखने के लिए जा. 

फिर, यह गूगल. यह सचमुच हम क्या करते हैं. यह मूर्खतापूर्ण लग रहा है. लेकिन सचमुच, हम यह गूगल. और फिर, एक पहली चीज़ें आप आमतौर पर है में भाग लेंगे एक अद्भुत है जो stackoverflow.com, प्रश्न और उत्तर दृष्टि. 

यह अद्भुत दोनों आप कर सकते हैं क्योंकि प्रश्न पोस्ट और के लिए देखो जवाब बल्कि इसलिए भी कि यह पहले से ही के एक बहुत है वहाँ सामग्री पहले से भरे. तो आम तौर पर आप एक प्रोग्रामिंग गूगल जब पहली भीतर सवाल जोड़े को आप पहले से ही चला सकते हैं हिट आपकी समस्या सेट के दौरान इस बारे में. 

और फिर, पिछले वास्तव में संक्षिप्त बात आज हम है - जो JSFIDDLE है साथ बहुत काम कर रहा जावास्क्रिप्ट HTML सीएसएस. JSFIDDLE एक वेब अनुप्रयोग है, जो मूल रूप से यदि आप अपने HTML लेने के लिए अनुमति देता है आपके जावास्क्रिप्ट नीचे छोड़ दिया, और अपने सीएसएस शीर्ष सही. और फिर यह एक त्वरित प्रस्तुत करना बना सकते हैं इसके बारे में और इसे सूचना का आदान प्रदान कैसे देखते हैं. लोग कोशिश कर रहे हैं जब यह बहुत उपयोगी है जैसे अवधारणा के एक सबूत क्या करना इस है कि तुम कैसे होगा डाउन मेनू एक बूंद नहीं है. हो सकता है कि एक त्वरित को उजागर करने या जो भी हो. 

माइक Rizzo: तो चलो चलते हैं आगे और इस पर क्लिक करें. एक जल्दी ध्यान दें - हम थे पहले, जबकि क्लिक पर कर. JCorey कोरिया भी एक बनाया है बाहर वर्षगांठ क्लिक करें ईवेंट हैंडलर में है कि यह यह आप कर रहे आंकड़े सिर्फ इसलिए का उपयोग करता है चीजों की एक बहुत कुछ करना चाहते हो जा आप कुछ करना चाहते हैं. 

इसी तरह, यह भी एक मंडराना है. लेकिन पूरी गुंजाइश की पाने के लिए उन, jQuery पर देखने के लिए प्रलेखन और इसे करते हैं. मैं यहाँ बेवकूफ कुछ किया था. 

टॉमस REIMERS: तो मैं एक बहुत जल्दी है यहीं कार्यक्रम, जो कहते हैं, क्लिक पर बटन. तो फिर हम पाश के लिए एक है. मैं कम से कम 404 है. यह सिर्फ पॉप अप करने के लिए जा रहा है इन चेतावनी संदेश. 

माइक Rizzo: और क्या था कोड 404 एचटीएमएल में लिए खड़े थे? किसी को भी याद करता है? सही नहीं मिला. क्रोम भी यह साफ गयी बात जहां आप कर सकते हैं - 

टॉमस REIMERS: लोगों की तरह है क्योंकि माइक यह एक बहुत कुछ कर रही शुरू कर दिया और अनुमति देता है जो कष्टप्रद उपयोगकर्ताओं, आप की जानकारी को देखने के लिए. 

माइक Rizzo: हाँ. 

टॉमस REIMERS: हम किसी भी सवाल है इस बारे में, जावास्क्रिप्ट के बारे में पुस्तकालयों, पुस्तकालयों खोजने, या क्या वेब विकास दिखता है असली दुनिया में पसंद है? हम समय के खिलाफ चलाए जा रहे हैं. इसलिए मुझे लगता है कि हम जा रहे हैं यकीन नहीं है लागू करने के लिए समय है यह बहुत जल्दी है, जब तक. हम अच्छा कर रहे हैं? 

माइक Rizzo: कुछ भी आप लोगों की तरह होगा , जैसे, में बहुत जल्दी देखने के लिए दो मिनट या उससे कम? 

टॉमस REIMERS: कुछ भी हम स्पष्ट कर सकते हैं? कैसे में लिखने के लिए - 

दर्शक: [सुनाई]? 

माइक Rizzo: हाँ, इतना that's - 

टॉमस REIMERS: तुम सिर्फ हिट कर सकते हैं वेबसाइट पर नियंत्रण यू. 

माइक Rizzo: ओह, मुझे लगता है कि पता नहीं था. 

टॉमस REIMERS: मैं हाँ, लगता है. नियंत्रण यू. हाँ. 

माइक Rizzo: ओह, तो वह है वेबसाइट के लिए कोड. लेकिन आप वास्तव में डाउनलोड करना चाहते हैं, तो हमारी फ़ाइलें और सब कुछ, यह होस्ट की है github.com पर 

टॉमस REIMERS: मेरा नाम स्लैश - टॉमस Reimers - स्लैश CS50 हाइफ़न संगोष्ठी. 

माइक Rizzo: और आप कर सकते हैं वहाँ सब कुछ मिल. 

टॉमस REIMERS: यह क्या GitHub है वैसे, ऐसा लगता है. तो फिर, आप एक खुला स्रोत देख जब परियोजना, आमतौर पर, वे एक पढ़ा हो जाएगा आप पढ़ सकते हैं कि वहाँ मुझे. तुम वापस जाओ और अगर आप ध्यान देंगे कि आप डाउनलोड ज़िप है, जो होगा आप स्रोत डाउनलोड करने की अनुमति शामिल करने के लिए कोड अपने खुद के काम में उत्पाद. 

माइक Rizzo: हाँ, और अगर हम सिर्फ क्लिक करें वास्तव में जल्दी index.html पर - 

टॉमस REIMERS आप यहाँ देखेंगे है हमारी वेबसाइट के लिए स्रोत कोड. 

माइक Rizzo: इसके अलावा, मैं सही पुश करने के लिए भूल गया बड़ी मेज के साथ इसे पहले शामिल है, लेकिन एक मेज भी नहीं है हम भी शामिल है कि chmods की बस अपनी स्पष्टता के लिए. लेकिन हम सभी तरह से करने के लिए नीचे स्क्रॉल अगर नीचे, हम वास्तव में बहुत से नहीं किया जावास्क्रिप्ट के साथ ज्यादा पर इस सब के साथ सामान. यह सब कुछ से विशेष रूप से है हम था कि बाकी. 

तो आप आने के लिए लोगों को धन्यवाद और सुन रहा है. हम यह वास्तव में मददगार थे उम्मीद है. आप संबंधित किसी भी जावास्क्रिप्ट है, तो प्रश्न या बस के बारे में बात करना चाहता हूँ क्या अन्य ठंडी चीजों की तरह और क्या आप जावास्क्रिप्ट के साथ क्या कर सकते हैं, हम खुशी होगी तुमसे बात करना. 

टॉमस REIMERS: आप एक सवाल है अपनी परियोजना के बारे में या अगर यह हो सकता है प्रासंगिक, हम शायद आसपास रहना होगा इस के बाद एक छोटा सा. लेकिन उस के अलावा, है एक अच्छा सप्ताहांत. 

माइक Rizzo: हाँ, मजा आता है. तुम लोगों को देखने. 

टॉमस REIMERS: बाद में मिलेंगे.