Transcript for:
Complete JavaScript Series: Final Chapter - Fetch API

हाय एवरीवन एंड वेलकम टू द कंप्लीट जावास्क्रिप्ट सीरीज जिसके अंदर आज हमारा फाइनल चैप्टर है जिसमें हम कवर करेंगे अपनी फेच एपीआई को यानी हम जानेंगे कि किस तरीके से जावास्क्रिप्ट से हम अपने एपीआई एंड पॉइंट्स पर कॉल लगा सकते हैं डाटा को रिसीव कर सकते हैं और इस डाटा को यूज़ करके काफ़ी सारी इंटरेस्टिंग चीज़ें हैं जो की जा सकती हैं एंड फिर फाइनली इसी चैप्टर के एंड में हम एक छोटा सा मिनी प्रोजेक्ट बिल्ड कर रहे होंगे यूजिंग द फच एपीआई जिसके अंदर हम एक करेंसी कन्वर्टर को बिल्ड करेंगे हमारी आज तक की जावास्क्रिप्ट की जितनी नॉलेज है जिसको हमने पूरी सीरीज के अंदर कलेक्ट किया है उस नॉलेज को अप्लाई करते हुए हम डॉम को यूज करेंगे हम एपीआई को यूज करेंगे हम स्ट्रिंग्स एरे जैसी बेसिक चीजों को भी यूज कर रहे होंगे अपने प्रोजेक्ट को बिल्ड करते टाइम अब आज के जो लेक्चर का कोड है वह आपको नीचे डिस्क्रिप्शन बॉक्स के अंदर मिल जाएगा साथ के साथ अगर आपको जावास्क्रिप्ट के अंदर कोई और कांसेप्ट ही पढ़ना है तो वह सारा इसी चैनल के ऊपर इस प्लेलिस्ट के अंदर अवेलेबल है वहां से जाकर हम उसे पढ़ सकते हैं तो शुरुआत करते हैं अपने चैप्टर के साथ हाय एवरीवन तो अब हम शुरुआत करने वाले हैं जावास्क्रिप्ट की सीरीज के अंदर अपने फाइनल चैप्टर के साथ जिसके अंदर हम बात करेंगे एपीआई की हम डिस्कस करेंगे कि किस तरीके से हम एपीआई कॉल्स जो हैं उनको इनिशिएटिव भेज सकते हैं और कुछ डाटा रिसीव कर सकते हैं अभी तक हमने प्रॉमिस के कांसेप्ट को पढ़ा है और वो कांसेप्ट हमें थोड़ा सा थोरेट्स रहे होंगे कि किस तरीके से प्रॉमिस डे टू डे लाइफ में जावास्क्रिप्ट के अंदर हमें देखने को मिलते हैं और प्रैक्टिकली हम उनको यूज कर रहे होते हैं साथ के साथ अपनी जो एपीआई की नॉलेज है उसको यूज करके हम अपने लिए एक प्रोजेक्ट भी बिल्ड कर रहे होंगे एट दी एंड ऑफ दिस चैप्टर तो शुरुआत करते हैं सबसे पहले हम एक बेसिक सा अपना रिवीजन कर लेते हैं लास्ट क्लास में जो हमने सीखा था रिगार्डिंग एपीआई एपीआई के बारे में बात की थी कि एपीआई हमारा एक ऐसा सिस्टम होता है बेसिकली इसको हम ऐसे समझ सकते हैं कि किसी दूसरे व्यक्ति ने अपनी एक दूसरी वेबसाइट बनाई हुई है अपना एक सिस्टम बनाया हुआ है एक सर्वर बनाया हुआ है जिसके ऊपर हम कोई रिक्वेस्ट भेज सकते हैं रिक्वेस्ट में हो सकता है ये जो एपीआई है इसका काम हो सकता है बहुत सारी डिशेस की रेसिपी स्टोर करती है कि कि खीर कैसे बनती है या हलवा कैसे बनता है इस तरीके से बहुत सारे डिफरेंट डिफरेंट फूड आइटम्स है बर्गर कैसे बनता है पिज़्ज़ा कैसे बनता है इन सबके यह रेसिपी स्टोर करती है तो हमने रिक्वेस्ट भेजी कि हमें एक पिज़्ज़ा की रेसिपी चाहिए कि उसको किस तरीके से बनाना है तो एपीआई क्या करेगा हमें कुछ रिस्पांस भेजेगा और रिस्पांस के अंदर कुछ एक्यूरेट डाटा होगा कि किस तरीके से हम वो फूड आइटम है उसको प्रिपेयर कर सकते हैं उसको कुक कर सकते हैं इस तरीके का कुछ रिस्पांस आ रहा होगा तो एपीआई बेसिकली रिक्वेस्ट रिस्पांस साइकिल के ऊपर चलते हैं कि हम उन्हें कुछ रिक्वेस्ट भेजते हैं वो हमें रिस्पांस की फॉर्म में कुछ डेटा रिटर्न करके देते हैं और ये डेटा क्या होगा वो डिपेंड करता है कि हम किस तरीके की एपीआई को यूज़ कर रहे हैं तो फाइनली हम एपीआई कॉल्स को करना सीख रहे होंगे आज के अपने सेशन के अंदर एंड एपीआई कॉल्स करने के लिए हम यूज़ करेंगे अपने लिए फेच एपीआई का और फेच एपीआई मैं आपको पहले ही बता देती हूं बहुत इजी लगेगा हमें यूज़ करने में यानी अभी तक हमने प्रॉमिस देख लिए कॉल बैक्स देख लिए वो सारा का सारा सिंटेक्स बहुत कॉम्प्लेक्टेड हमें देखने को मिल रहा होगा व्हिच विल बी रियली इजी टू अंडरस्टैंड अब जब भी हम फेच एपीआई की बात करते हैं किसी भी एपीआई की बात करते हैं एपीआई की फुल फॉर्म मैं आपको बता देती हूं एपीआई स्टैंड्स फॉर एप्लीकेशन प्रोग्रामिंग इंटरफेस और जनरली जो हमारी डे टू डे बेसिस पर हम एपीआई के साथ डील करते हैं वो बेसिकली ऐसा इंटरफेस होते हैं जो हमें कुछ डाटा रिटर्न करते हैं जैसे फॉर एग्जांपल हम किसी रेस्टोरेंट के अंदर गए रेस्टोरेंट के अंदर जो हमारा वेटर होता है वेटर को हम कुछ भी रिक्वेस्ट दे देते हैं कि हमें ये फूड आइटम्स ऑर्डर करने हैं तो वेटर क्या करता है किचन के अंदर जाता है और वहां से हमारे लिए खाना लेकर आ जाता है अब किचन के अंदर किस तरीके से खाना प्रिपेयर हुआ किसने खाना प्रिपेयर किया क्या-क्या इंग्रेडिएंट्स डले वो सारी चीजें हमें नहीं पता चलती हमें क्या पता चलता है हमें फाइनल आउटपुट यानी फाइनल रिजल्ट देखने को मिलता है वैसा ही कुछ इंटरफेस वैसा ही कुछ सिस्टम एपीआई होते हैं कि हम उन्हें रिक्वेस्ट भेज देते हैं वो अब डाटा कहां से एपीआई लेकर आई वो डेटा कितना एक्यूरेट है कितना नहीं है कैसे उस डेटा को प्रिपेयर किया गया है इन सारी चीजों से हमें कोई मतलब नहीं होता हमें बस फाइनल जो आउटपुट वाला डाटा है वो हमारी एपीआई हमें रिटर्न कर देती है अब एपीआई को कॉल करने से पहले हम एपीआई के कुछ-कुछ एग्जांपल्स को देखने वाले हैं सबसे पहले यहां पर हम जा सकते हैं यानी वी कैन लिटरली गो एंड सर्च फॉर फ्री एपीआई फ्री एपीआई पर हम जाएंगे तो बहुत सारे लिंक हमारे पास आते हैं जहां पर हमें काफी सारी फ्री पब्लिक एपीआई मिल जाती हैं हम किसी भी रैंडम लिंक पर जा सकते हैं अब जैसे यहां पर हमें एक लिस्ट मिल जाएगी ऑफ अ लॉट ऑफ फ्री एपीआई जैसे फॉर एग्जांपल हमें बुक से रिलेटेड एपीआई सर्च करनी है तो यहां पर बुक्स से रिलेटेड हमारे पास बहुत सारी डिफरेंट डिफरेंट एपीआई आ जाएंगी बिजनेस से रिलेटेड एपीआई आ जाएंगी कैलेंडर से रिलेटेड एपीआई आ जाएंगी इसी तरीके से आप किसी दूसरे लिंक पर जाएंगे तो हमें वहां पर काफी सारी डिफरेंट एपीआई मिल जाएंगी जैसे फूड एपीआई फॉर एग्जांपल फूड एपीआई हमारे पास है अगर हम इस लिंक पर गए तो जनरली जो भी एपीआई होती है उनकी अपनी एक डॉक्यूमेंटेशन होती है डॉक्यूमेंटेशन के अंदर लिखा होता है कि किस तरीके से हम उस एपीआई को यूज कर सकते हैं और इस तरीके से एपीआई हमें किसी एक ऑब्जेक्ट फॉर्मेट के अंदर डाटा रिटर्न करके देती है तो जैसे यहां पर हमें ये ऑब्जेक्ट जैसा कुछ डाटा दिख रहा है इसी तरीके का डाटा हमें एपीआई रिटर्न करके देती है कब देती है जब हम इस तरीके के एक यूआरएल यानी एक लिंक के ऊपर रिक्वेस्ट भेज रहे होते हैं तो एपीआई आर नथिंग बट एंड पॉइंट्स जो हमारे यूआरएल एंड पॉइंट्स होते हैं यानी जैसे कोई लिंक होता है उसके ऊपर हमने रिक्वेस्ट भेज दी जैसे फॉर एग्जांपल हम google.com पर जाना चाहते हैं तो जैसे ही हमने google.com लिखा हम इस पेज पर आ गए तो हमारे ब्राउजर ने क्या किया हमारे ब्राउजर ने google.com को रिक्वेस्ट भेजी तो एंड पॉइंट को और एंड पॉइंट यानी वो जो लिंक है वो फिर हमें कुछ डाटा रिटर्न बैक करके देगा अब एग्जांपल के लिए हमारे पास बहुत सारी एपीआई होती हैं मैंने एक लिंक आपके लिए ऑलरेडी सेव करके रख रहा है सो दिस इज अ पेज जहां पे काफी सारी एपीआई हमारे पास अवेलेबल हैं जैसे एमे से रिलेटेड हो गई एंटी मैलवेयर कंप्यूटर्स फाइनेंस बहुत सारी डिफरेंट डिफरेंट एपीआई यहां पर अवेलेबल है हम कोई भी एक रैंडम एपीआई चूज कर सकते हैं तो लेट अस गो विद दिस कैट फैक्ट्स एपीआई जो हमें कैट से रिलेटेड फैक्ट्स जो हैं वो रिटर्न करके देगी अब ये जो एपीआई है इसका हम गिट हब का पेज भी देख सकते हैं डॉक्यूमेंटेशन भी देख सकते हैं एपीआई डॉक्यूमेंटेशन स्टार्ट डेवलपिंग इस पेज पर हम आ गए तो बेसिकली डॉक्यूमेंटेशन के अंदर लिखा हुआ है बेस यूआरएल फॉर ऑल एंड पॉइंट्स यानी सारे के सारे जो लिंक हैं इससे शुरू होंगे तो हिरोक पर ये होस्टेड है और एंड पॉइंट में हम स्लैश फैक्ट्स जब लगाएंगे तो हमारे पास कैट से रिलेटेड कोई रैंडम फैक्ट आएगा बेस यूआरएल यानी शुरू वाला लिंक तो ये हमने शुरू वाला लिंक लिखा और स्लश फैक्ट्स जैसे ही हम एंटर करेंगे वैसे ही क्या होगा कुछ डाटा हमारे पास रिटर्न होकर आया अब ये डेटा किस फॉर्म में है हम अगर थोड़ा सा ज़ूम इन करें सो दिस इज बेसिकली इन एरे ये एरे फॉर्म में है क्योंकि बाहर स्क्वायर ब्रैकेट्स लगे हुए हैं और अंदर कुछ ऑब्जेक्ट्स हैं पर अभी इस डेटा के अंदर क्या है उससे हमें ज्यादा मतलब नहीं रखना हमें एक चीज नोटिस करनी है कि हां कुछ डाटा हमारे पास रिटर्न होके आ रहा है जब हम किसको रिक्वेस्ट भेज रहे हैं जब हम इस लिंक को रिक्वेस्ट भेज रहे हैं तो ये बेसिकली हमारा एपीआई एंड पॉइंट है यानी हमारा यूआरएल है जिसको हमें रिक्वेस्ट भेजनी पड़ेगी अपनी एपीआई से डाटा वापस लाने के लिए अब ये तो है ब्राउजर से डायरेक्टली रिक्वेस्ट भेजना जब भी हम अपने ब्राउजर के ऊपर कोई भी लिंक पेस्ट करते हैं जैसे हम google.com लिखते हैं amazon.com लिखते हैं तो हमारा ब्राउजर ऑटोमेटिक रिक्वेस्ट भेज देता है उस लिंक के पास उस सर्वर के पास अब हम सीख रहे होंगे कि वह काम जो ब्राउजर हमारे लिए करता आ रहा था आज तक वह हम अपने जावास्क्रिप्ट के कोड से कैसे कर सकते हैं तो उसके लिए जो लिंक है इसे कॉपी कर लेते हैं लेट्स गो टू आवर कोड कोड के अंदर हमने index.htm ऑलरेडी बनाई हुई है हमारे पास बॉयलर प्लेट कोड है जिसको हमने app.js से कनेक्ट किया है ये हमारी app.js है इसके अंदर एक वेरिएबल बना लेते हैं रए कस्ट रए के अंदर हमारा ये जो लिंक था जिसके ऊपर रिक्वेस्ट भेजने से ब्राउजर को डेटा मिल रहा था उससे हम भी अपने जावास्क्रिप्ट के कोड के थ्रू डेटा पाना चाहते हैं तो इस लिंक को हम सेव कर लेते हैं और बेसिकली जो हमें एपीआई कॉल करनी है वो इस लिंक को हमें कॉल करनी है और वहां से हमारे पास डाटा आएगा अपने पेज पर हम आ जाते हैं अब जब भी हम एपीआई कॉल करना चाहते हैं यूजिंग फेच एपीआई तो फेच एपीआई क्या होता है फेच एपीआई इज बेसिकली इट प्रोवाइड्स एन इंटरफेस फॉर फेचिंग फेचिंग का मतलब किसी चीज को लेकर आना तो जब भी हम कुछ रिसोर्सेस भेजना चाहते हैं या रिसीव करना ना चाहते हैं उसको हम कहते हैं फेच करना तो जब भी हमारे पास कोई एंड पॉइंट है यानी कोई यूआरएल है जिसे हम कोई रिक्वेस्ट भेजना चाहते हैं तो रिक्वेस्ट के अंदर हो सकता है हम कुछ एक्स्ट्रा डटा भी सेंड कर रहे हो या जब इसका रिस्पांस हमारे पास आएगा यानी जब हम डाटा को रिसीव करेंगे यानी रिसोर्सेस को रिसीव करेंगे तो ये दोनों काम करने के लिए ही हम अपनी फेच एपीआई को यूज कर सकते हैं और फेच एपीआई इंटरनली एक रिक्वेस्ट एंड रिस्पांस ऑब्जेक्ट को यूज करती है अब इतना डिटेल में अभी हम नहीं जाएंगे पहले धीरे-धीरे समझेंगे पर ये हमें समझ में आ गया कि हमें फेच एपीआई नाम की एक चीज यूज़ करनी है डाटा भेजने एंड रिसीव करने के लिए अब फेच एपीआई को यूज़ करने का मतलब होता है फेच मेथड को यूज़ करना फेच मेथड हमारे पास जावास्क्रिप्ट के अंदर ऑलरेडी होता है व्हिच इज यूज्ड टू फेच अ रिसोर्स यानी जो डटा फेच करने के काम आता है और इसको लिखने का सिंटेक्स ये होता है कि हम फेच मेथड लिखते हैं और उसके अंदर अपना यूआरएल लिखते हैं यूआरएल यानी अपना लिंक और इतना लिखने से ऑटोमेटिक हमारा कोड इस लिंक के ऊपर एक रिक्वेस्ट भेज देता है रिक्वेस्ट भेजेगा तो कुछ डाटा रिटर्न होकर आएगा पर फेच में क्या रिटर्न होकर आता है फेच में हमारे पास एक प्रॉमिस रिटर्न होकर आता है जो इवेंचर से इवेंचर या तो फुलफिल्ड हो जाएगा रिजेक्ट हो जाएगा बट यह क्या रिटर्न करता है यह हमें एक प्रॉमिस रिटर्न करता है तो यहां पे प्रैक्टिकल यूज़ केस हमारे पास आता है प्रॉमिस का जिनको हमने थोरेट्स अब बात कर रहे होंगे कि कैसे वो प्रॉमिस एक्चुअल एपीआई हमें रिटर्न कर रही होती है यूआरएल के साथ फेच मेथड के अंदर कुछ-कुछ ऑप्शंस भी होते हैं जिनको हम यूज़ कर सकते हैं पर अभी के लिए ऑप्शंस के डिटेल में नहीं जाएंगे अभी के लिए सिर्फ फेच मेथड को एक बार देखते हैं फेच मेथड को यूज़ करने के लिए बेसिकली हम लिख सकते हैं फेच और उसके के अंदर हम पास कर देंगे अपना यूआरएल इस तरीके से और फेच हमें कुछ वैल्यू रिटर्न करेगा ये जो वैल्यू है दिस वैल्यू इज गोइंग टू बी अ प्रॉमिस और इस प्रॉमिस को हम चाहे तो प्रिंट करवा सकते हैं देखते हैं प्रॉमिस प्रिंट होगा तो हमें इवेंचर कि एक प्रॉमिस है देखते हैं किस तरीके से पता चलेगा इसको सेव कर लेते हैं इतने कोड को एंड यहां पे आके इसे करते हैं रिफ्रेश रिफ्रेश किया तो क्या प्रिंट हुआ हमारे लिए प्रॉमिस प्रिंट हुआ प्रॉमिस में शुरुआत में जब प्रॉमिस प्रिंट हुआ तब तक पेंडिंग था पर डाटा आ गया तो मतलब प्रॉमिस हमारा फुलफिल हो गया और रिस्पांस में हमारे पास क्या है रिस्पांस में हमारे पास यह सारी चीजें आई यानी हमारे पास रिस्पांस की कुछ बॉडी आई है कुछ हेडर्स आए हैं जिनके अंदर और इंफॉर्मेशन हमारे पास होगी स्टेटस आया है 200 स्टेटस 200 का मतलब होता है सक्सेसफुल रिक्वेस्ट यानी जो डाटा आप चाहते थे वो आपको रिटर्न करके मिल गया है स्टेटस टेक्स्ट में आया है ओके एंड इस यूआरएल पर बेसिकली हमने रिक्वेस्ट भेजी थी इसके अंदर भी हमारे पास रिस्पांस है यानी कुछ ठीक रिस्पांस हमारे पास प्रिंट होकर आया है अब अगर हमें पता है कि जब भी हम प्रॉमिस को यूज करते हैं हमारे पास मल्टीपल तरीके होते हैं प्रॉमिस से रिजल्ट निकालने के एक तरीका होता है प्रॉमिस चेनिंग जिसमें हम डॉट देन डॉट कैच इन सब को यूज कर रहे होते हैं पर उससे भी एक और बेटर तरीका हमने निकाला था व्हिच वाज यूजिंग अस सिंक अवेट तो हम अस सिंक अवेट से अपनी एपीआई कॉल को एग्जीक्यूट कर रहे होंगे अब अंक अवेट को यूज करने के लिए हमें एक एसिंक्रोनस फंक्शन बनाना पड़ेगा इस फंक्शन को कह देते हैं गेट फैक्ट्स क्योंकि हम कैट फैक्ट्स गेट करने की कोशिश कर रहे हैं और इसी के अंदर हम अपना पूरा यह काम करने वाले हैं और बेसिकली क्योंकि हम यहां प्रॉमिस के साथ डील कर रहे हैं तो हमें सिंक बनाना पड़ेगा अपने इस फंक्शन को तो एरो फंक्शन को असं बनाने के लिए आगे हम सिंक लिख देते हैं और क्योंकि ये हमारा एसिंक्रोनस काम है किसी भी एपीआई को कॉल करके उससे डाटा मंगवाना एसिंक्रोनस काम है क्योंकि हो सकता है एपीआई कुछ टाइम ले डाटा लाने में तो इसके सामने हम लिख देंगे अवेट क्योंकि इस काम को टाइम लग सकता है और जब एक बार प्रॉमिस हमारा रिजॉल्व हो जाएगा तभी हम हम जो भी डाटा इसने रिटर्न किया होगा उस डाटा को प्रिंट करवा रहे होंगे अब यहां से जो भी चीज रिटर्न होती है उसे जनरली हम क्या कहते हैं प्रोग्रामिंग के अंदर उसे हम अपना रिस्पांस कहते हैं कि हमने एपीआई को कॉल लगाई और एपीआई ने हमें क्या भेजा एपीआई ने हमें हमारा रिस्पांस भेजा और उस रिस्पांस को हम प्रिंट करवा सकते हैं इन फैक्ट यहां कसोल डलॉग भी करवा सकते हैं गेटिंग डाटा डॉट डॉट डॉट इसको कर लेते हैं सेव रिफ्रेश अब हमें गेट फैक्ट्स को कॉल करना पड़ेगा जैसे ही कॉल करेंगे पहले आया है गेटिंग डाटा एंड एक चीज नोटिस की होगी आपने हमारे लिए प्रॉमिस प्रिंट हो गया पर ये फाइनल डाटा हमारे लिए प्रिंट होने में थोड़ा सा थोड़ा सा डिले आया यही डिले होता है जो एसिंक्रोनस प्रोग्रामिंग चल रही है उसको दिखाता है रिफ्रेश करेंगे लेट्स कॉल गेट फैक्ट्स अगेन थोड़ा सा डिले आया और फिर हमारे पास ये चीज आकर प्रिंट हुई तो इस चीज के अंदर ये हमारा प्रॉपर रिस्पांस है जो हमारी एपीआई से हमारे पास आए है एंड एक और इंटरेस्टिंग चीज आपने नोटिस की होगी कि इवन दो हम अपनी एपीआई को रिक्वेस्ट भेज रहे हैं पर डाटा हमारे पास जो रिटर्न होकर आ रहा है उसकी वजह से हमारा पेज रीलोड नहीं हो रहा जनरली नई जो इंफॉर्मेशन आती है पेज के ऊपर वो पेज के रीलोड होने के बाद आ है पर जब भी हम एपीआई कॉल्स कर रहे होते हैं इंटरनली तो हमारा पेज बिल्कुल भी रीलोड नहीं हो रहा एंड रन टाइम पे सारी की सारी इंफॉर्मेशन अपडेट हो रही है ये जो रिस्पांस है ये रन टाइम पे अपडेट हो रहा है तो कुछ-कुछ चीजों को समरा इज करते हैं बेसिकली हमने यह देखा कि फेच एपीआई से कैसे हम रिक्वेस्ट भेज रहे हैं और हमें कुछ डाटा रिसीव हो रहा है और इसके अंदर रिक्वेस्ट एंड रिस्पांस ऑब्जेक्ट्स को हम यूज़ करते हैं तो ये जो चीज यहां पर प्रिंट हो रही है ये जो रिस्पांस है जब हम इसे प्रिंट कर रहे हैं ये रिस्पांस एगजैक्टली क्या है दिस इज एन ऑब्जेक्ट क्योंकि इसके अंदर प्रोटोटाइप भी हमें दिखाई दे रहा है ये रिस्पांस प्रोटोटाइप के ऊपर बेस्ड एक ऑब्जेक्ट पजेट है जिसके अंदर काफी सारी डिफरेंट डिफरेंट वैल्यूज हैं हम चाहे तो अपनी यह जो रिस्पांस है इसका स्टेटस प्रिंट करवा सकते हैं इसको सेव कर लेते हैं रिफ्रेश करते हैं दोबारा से गेट फैक्ट्स को कॉल करेंगे इस बार सिर्फ रिस्पांस का स्टेटस प्रिंट होगा व्हिच इज 200 यानी सारी चीजें ओके चली गई इसी तरीके से हम दूसरी वैल्यूज को भी प्रिंट करवा सकते हैं सो रिस्पांस इज एन ऑब्जेक्ट तो हमारी जो एपीआई कॉल्स है वो रिक्वेस्ट रिस्पांस ऑब्जेक्ट के ऊपर वर्क करती है फेच मेथड इज यूज्ड टू फेच अ रिसोर्स और डटा और फेच मेथड को हम इस तरीके से यूज़ कर रहे होते हैं अब जब भी फेच मेथड को हम यूज़ करते हैं और हम कोई भी ऑप्शंस उसे नहीं भेजते तो फेच मेथड एक पर्टिकुलर टाइप की रिक्वेस्ट क्रिएट करता है और इस रिक्वेस्ट को हम कहते हैं हमारी गेट रिक्वेस्ट हमारे पास रिक्वेस्ट की टर्म्स में जब भी हम नेटवर्क रिक्वेस्ट की बात करते हैं यानी इंटरनेट के ऊपर जो भी हम रिक्वेस्ट भेज रहे होते हैं उसके अंदर हमारे पास डिफरेंट डिफरेंट टाइप्स होते हैं गेट रिक्वेस्ट डिलीट रिक्वेस्ट पुट रिक्वेस्ट बहुत सारे डिफरेंट डिफरेंट टाइप्स होते हैं वो रिक्वेस्ट जो सिर्फ डाटा लाने का काम करती हैं जिनका काम होता है बस कुछ डाटा हमारे पास कहीं से रिटर्न होके आ जाए किसी सर्वर से रिटर्न होके आ जाए किसी एपीआई से रिटर्न होकर आ जाए उन रिक्वेस्ट को हम गेट रिक्वेस्ट कहते हैं वैसे ही अब यहां पर जो हमने रिक्वेस्ट भेजी है दैट इज अ गेट रिक्वेस्ट बाय डिफॉल्ट या मैक्सिमम टाइम जब हम फेच एपीआई को यूज करते हैं हम गेट रिक्वेस्ट के लिए यूज कर रहे होते हैं अब यहां पर क्योंकि एपीआई को हमें कुछ डेटा नहीं भेजना हमें सिंपली क्या करना है सिर्फ डाटा रिसीव करना है इसीलिए यह रिक्वेस्ट हमारी गेट रिक्वेस्ट की कैटेगरी में आती है एंड एक और इंटरेस्टिंग चीज यहां पे नोट करने वाली है कि जब हम रिस्पांस को प्रिंट करवा रहे हैं इफ वी लुक एट दिस रिस्पांस दिस इज नॉट एन एक्यूरेट रिस्पांस हमारे पास रिस्पांस में हम एक्सपेक्ट क्या कर रहे थे हम एक्सपेक्ट कर रहे थे कि इस तरीके का कुछ हमारे पास आएगा यानी जब हमारा ब्राउजर रिक्वेस्ट भेज रहा है ब्राउजर भी गेट रिक्वेस्ट ही भेज रहा है यहां पर जब हम नॉर्मली कोई भी लिंक पेस्ट करते हैं ब्राउजर के अंदर तो बाय डिफॉल्ट गेट रिक्वेस्ट जाती है तो ब्राउजर जब गेट रिक्वेस्ट भेज रहा है उसके पासस ये सब आ रहा है हां ब्राउजर के पास भी स्टेटस है ब्राउजर के पास भी दूसरी चीजें हैं पर ये ये प्रिंट करवा रहा है पर हमें जो रिस्पांस मिल रहा है दैट इज समथिंग लाइक दिस अब इसमें से कैट फैक्ट्स यानी जो डाटा हमें एक्चुअली चाहिए था वो हमें दिखाई नहीं दे रहा रहा तो बेसिकली यह डाटा इसलिए नहीं दिखाई दे रहा क्योंकि यह डाटा एक अलग फॉर्मेट में है जिसको अभी हम रीड नहीं कर पा रहे अब इस चीज को समझने के लिए हमें कुछ टर्म्स को समझना पड़ेगा सबसे पहली टर्म जिसको हम समझने वाले हैं आई अंडरस्टैंड कि ये टर्म्स एजेक्स हो गया जेसन हो गया ये टर्म्स बहुत डिफिकल्ट लगती हैं शुरुआत में देखने में पर इनके मतलब बहुत आसान है एक बार हमने देख लिया कि हां इस टर्म का यह मतलब है तो बहुत इजी होगा हमारे लिए रिमेंबर करना कुछ टर्म्स को हम समझेंगे और फिर जानेंगे कि हम जो रिस्पांस प्रिंट करवा रहे हैं वो सही क्यों नहीं प्रिंट हो कर आ रहा है सबसे पहली टर्म है हमारे पास एजेक्स एजेक्स का मतलब होता है एजेक्स इज एसिंक्रोनस जावास्क्रिप्ट एंड एक्सएमए पहले जमाने में यानी पहले जब हमारे पास मॉडर्न जावास्क्रिप्ट नहीं होती थी काफी सारे कांसेप्ट नहीं होते थे तो पहले नेटवर्क रिक्वेस्ट कैसे जाती थी नेटवर्क रिक्वेस्ट यानी जैसे अभी हमने अपनी एपीआई को रिक्वेस्ट भेजिए है पहले हमारे पास अगर कोई डाटा आना होता था तो वो एक्सएमएल फाइल्स की फॉर्म में हमारे पास आ रहा होता था यानी पहले अगर हम किसी एपीआई को रिक्वेस्ट भेजते तो जो डेटा का फॉर्मेट होता वो एक्सएमए होता था पर आज की डेट में एक्स एमल बहुत कम होता है डेटा का फॉर्मेट जनरली जो हमारा डाटा आता है वो जेसन फॉर्मेट में आता है अब यहां डटा फॉर्मेट कहने का क्या मतलब है जैसे फॉर एग्जांपल आपका एक दोस्त है आप अपने दोस्त को कुछ भी मनी सेंड करना चाहते हो तो मनी को आप डिफरेंट डिफरेंट फॉर्मेट के अंदर सेंड कर सकते हो आप चाहो तो अपने दोस्त को कैश भी दे सकते हो उसे आप चाहो तो डायरेक्टली नेट बैंकिंग से पैसे ट्रांसफर कर सकते हैं नहीं तो हम चाहे तो यूपीआई भी कर सकते हैं तो एट दी एंड जा तो वही डेटा रहा है जा तो मनी ही रहा है बट वो डिफरेंट डिफरेंट फॉर्मेट के अंदर जा रहा है तो फॉर्मेट अलग हो गए तो उस डाटा के साथ डील करने की टेक्नीक भी अलग हो जाएगी अगर डायरेक्टली कैश दिया है तो उसे वो डायरेक्टली यूज़ कर पाएंगे अगर यूपीआई दिया है और दोस्त को कैश चाहिए तो उन्हें जाकर कहीं से एटीएम से उस चीज को विथड्रावल है पहले डेटा जाता था एक्सएमए फॉर्मेट में आजकल डाटा जाता है जेसन फॉर्मेट में अब जेसन फॉर्मेट का क्या मतलब है जेसन इज जावास्क्रिप्ट ऑब्जेक्ट नोटेशन यानी जो डाटा जा रहा होगा वो जावास्क्रिप्ट ऑब्जेक्ट्स जैसा हमें दिखाई देगा इसीलिए इसका नाम जेसन होता है तो हमारे कोड में जो रिस्पांस हमारे पास आ रहा है यह किस फॉर्मेट में है यह जेसन फॉर्मेट में है जेसन फॉर्मेट जावास्क्रिप्ट ऑब्जेक्ट जैसा फॉर्मेट होता है यानी यह जो चीज यहां पे प्रिंट होके आ रही है ये हमारी जावास्क्रिप्ट ऑब्जेक्ट जैसा फॉर्मेट है बट दिस इज नॉट जावास्क्रिप्ट ऑब्जेक्ट बस ये उस जैसा दिखाई देता है अब एज अ जावास्क्रिप्ट डेवलपर क्योंकि हम जावास्क्रिप्ट के साथ ऑलरेडी डील कर रहे थे हमें ऑलरेडी जावास्क्रिप्ट आती है तो हमारे लिए जेसन डाटा को पास करना उसके साथ डील करना काफी आसान होता है एज कंपेयर टू एक्सएमएल डाटा नहीं तो हमें एक्सएमए भी अलग से जाके सीखनी पड़ती पर आज की डेट में जेसन के अंदर ही होता है तो एक्सएमए को हमें सीखने की जरूरत नहीं पड़ती तो आजकल जो मैक्सिमम एपीआई हम यूज़ कर रहे होते हैं वो क्योंकि जेसन फॉर्मेट के अंदर डाटा रिटर्न करती हैं तो उन एपीआई को हम एजज भी कह सकते हैं तो एजज कहने का बेसिक मतलब होगा एसिंक्रोनस जावास्क्रिप्ट एंड जेसन क्योंकि एक्सएमए को जेसन ने रिप्लेस कर लिया है बट एजज क्योंकि सुनने में बहुत वियर्ड लगता है तो इट इज नॉट रियली अ वेरी पॉपुलर टर्म हम आज भी जो हमारा एक्सचेंज होता है नेटवर्क रिक्वेस्ट जाती है रिस्पांस आ आता है उसे आज भी हम एजेक्स ही कहते हैं इवन दो एक्सएमए की जगह हमारे पास जेसन आ गया है पर अगर आप वर्ड सुनते हैं एजेक्स तो उसका मतलब यही है कि हम एपीआई कॉल्स जो हमने करके देखा अभी फेच एपीआई से इसी की हम बात कर रहे हैं हम नेटवर्क पे कुछ रिक्वेस्ट भेज रहे हैं और हमारे पास कहीं से कुछ रिस्पांस आ रहा है एंड दैट इज यूजिंग एजेक्स अब हमारा एपीआई को कॉल करने का प्रोसेस कैसे वर्क करता है सबसे पहले हमारी एपीआई को जैसे ही हमने रिक्वेस्ट भेजी हमारे पास कुछ रिस्पांस आता है और ये जो रिस्पांस होता है यह जेसन फॉर्मेट के अंदर होता है हमें इसे जेसन फॉर्मेट से जावास्क्रिप्ट ऑब्जेक्ट के अंदर कन्वर्ट करना पड़ता है तो ये हमारा सेकंड स्टेप होता है जब हम इस रिस्पांस को एक यूजलर के अंदर कन्वर्ट करेंगे अब वो कन्वर्ट करने के लिए हम एक स्पेशल मेथड यूज़ करते हैं व्हिच इज कॉल्ड जेसन मेथड अब ये जो जेसन मेथड है ये भी एक एसिंक्रोनस मेथड होता है जैसे फेच एपीआई का जब हम फेच मेथड यूज़ करें फेच मेथड एसिंक्रोनस होता है प्रॉमिस रिटर्न करता है वैसे ही जेसन मेथड भी एसिंक्रोनस मेथड होता है प्रॉमिस रिटर्न करता है तो इट रिटर्न्स अ सेकंड प्रॉमिस ऑलरेडी रिस्पांस आ गया फेच से फ फेच ने फर्स्ट प्रॉमिस रिटर्न किया डॉट जेसन क्या करेगा सेकंड प्रॉमिस रिटर्न करेगा दैट रिजॉल्व विद द रिजल्ट ऑफ पार्सिंग द रिस्पांस बॉडी टेक्स्ट एज जेसन यानी हम इस जेसन मेथड को इनपुट में जेसन देते हैं और यह आउटपुट में हमें जावास्क्रिप्ट ऑब्जेक्ट यानी यूजलर करके देता है तो जेसन मेथड से हम अपना एक्चुअल यूब डाटा निकालते हैं रिस्पांस ऑब्जेक्ट के थ्रू तो इसे यूज करने के लिए व्हाट वी कैन डू इज हम अपने जो भी हमारा रिस्पांस होता है उसके ऊपर डॉट जेसन को लगाते हैं और क्योंकि डॉट जेसन हमारे पासस एसिंक्रोनस है तो इसे हम क्या करेंगे इसे भी हम अवेट करेंगे और इससे जो भी डाटा रिटर्न होकर आएगा उसे हम यहां पर सेव करवा लेंगे और अब फाइनली हम कसोल डलॉग करके प्रिंट करवा सकते हैं अपने डाटा को और यह जो डाटा होगा यह हमारा यूज बल डाटा होगा तो . जन जसन क्या करता है सेकंड प्रॉमिस रिटर्न करता है इसीलिए हम यहां पे अवेट को यूज़ करते हैं इसको सेव कर देते हैं रिफ्रेश करते हैं जैसे ही गेट फैक्ट्स को कॉल लगाएंगे सबसे पहले हमारे पास फर्स्ट डाटा आया यह फर्स्ट डाटा क्या है ये हमारा रिस्पांस है इस रिस्पांस से हमने यूज बल डाटा निकाला यह हमारा यूज बल डाटा यूज बल डाटा में क्या है एक एरे है जिसका साइज है इक्वल टू फ यानी लेंथ है इक्वल टू फ और इसके अंदर पर इंडेक्स जाके हम कुछ-कुछ डाटा जो है उसको रिट्रीव कर सकते हैं जैसे अगर हम डटा ऑफ ज जीरो को प्रिंट करवाना चाहे ओके उसके लिए हमें इसे डाटा को ग्लोबल बनाना पड़ेगा तो व्हाट वी कैन डू इज यहीं से हम अपने डाटा ऑफ जीरो को प्रिंट करवा सकते हैं सेव किया रिफ्रेश किया लेट्स कॉल गेट फैक्ट्स गेट फैक्टस से ये हमारा डेटा ऑफ़ ज़ीरो आ गया अब डेटा ऑफ़ ज़ीरो के अंदर बहुत सारी इंफॉर्मेशन है हमें ये टेक्स्ट चाहिए ये टेक्स्ट क्या है यह है कैट्स रिलेटेड फैक्ट तो डॉट टेक्स्ट इफ आई डू रिफ्रेश किया दोबारा से गेट फैक्ट्स ओनिंग अ कैट कैन रिड्यूस द रिस्क ऑफ़ स्ट्रोक तो ये फैक्ट आ गया व्हिच इज़ रिलेटेड टू कैट्स दिस वाज द एक्चुअल डाटा दैट वी रिक्वायर्ड फ्रॉम द एपीआई अब हमने तो एपीआई के अंदर जाके कैट रिलेटेड डॉग रिलेटेड कोई फैक्ट स्टोर नहीं किए ऐसे ही जोक से रिलेटेड बहुत सारी एपीआई होती हैं जो हमें जोक रिटर्न करती है रैंडम जो हम जनरेट करवा सकते हैं तो इस तरीके का डाटा है जो हमारी एपीआई से रिटर्न होकर आता है और अब इस डटा को हम यूज कर सकते हैं हम चाहे तो इसे अपने एचटीएमएल पेज के अंदर प्रिंट करवा सकते हैं फॉर एग्जांपल आई कैन कनेक्ट इट टू सम रैंडम पैराग्राफ इसको आईडी दे देते हैं क्लास की क्लास नहीं इसको फैक्ट की हम आईडी दे देते हैं एंड यहां पर हम लिख सकते हैं कंस्ट फैक्ट पैरा इ इक्वल टू डॉक्यूमेंट डॉट क्वेरी सिलेक्टर और इसके अंदर हम फैक्ट को यूज़ कर लेंगे और जैसे ही हमारे पास यह टेक्स्ट आ जाएगा हम क्या करने वाले हैं फैक्ट पैरा के अंदर डॉट इनर टेक्स्ट इनर टेक्स्ट को सेट कर देंगे टू दिस वैल्यू सेव किया रिफ्रेश किया जैसे ही गेट फैक्ट्स को कॉल लगाएंगे तो हमारे पास क्या आ गया कैट रिलेटेड एक रैंडम फैक्ट हमारे पास प्रिंट होकर आ गया अब हम चाहे तो एक बटन भी यहां पर पर क्रिएट कर सकते हैं जैसे फॉर एग्जांपल इफ आई क्रिएट अ बटन एक बटन क्रिएट कर देते हैं एंड इसे आईडी दे देते हैं लेट्स गिव इट एन आईडी ऑफ बटन गेट अ फैक्ट तो इस बटन को यहां पर एक्सेस कर सकते हैं कॉन्स्ट फंक्शन है यह रन होना चाहिए और जैसे ही गेट फैक्ट्स रन होगा वैसे ही क्या होगा हमारे लिए कुछ डाटा आ जाएगा इसको सेव कर लेते हैं रिफ्रेश किया गेट फैक्ट्स को हमें ऊपर ऐड करना पड़ेगा बेसिकली तो यह जो इवेंट लिसन है इसे नीचे ऐड कर देते हैं रिफ्रेश किया अब अपने एटीएमएल करेंगे वैसे ही इंटरनली गेट फैक्ट हो रहा है वेट कर रहा है वो फैक्ट का और एकदम से जैसे ही एपीआई कॉल सक्सेसफुल हो गई हमारे पेज के ऊपर हमारे पास ये इंफॉर्मेशन प्रिंट होकर आ गई हम चाहते तो डाटा ऑफ वन को भी प्रिंट करवा सकते थे क्योंकि हमारे पास पांच फैक्ट्स आ रहे हैं कैट रिलेटेड रिफ्रेश किया गेट फैक्ट को कॉल लगाया वेट किया एंड फिर हमारे पास कैट से रिलेटेड एक और रैंडम फैक्ट आ गया हम चाहे तो डटा ऑफ टू भी प्रिंट करवा सकते हैं रिफ्रेश किया गेट फैक्ट को क्लिक किया जैसे ही आया हमारे पास फैक्ट तो वो फैक्ट हमारे स्क्रीन के ऊपर प्रिंट होकर आ गया तो इस तरीके से एपीआई को हम कॉल करते हैं यूजिंग फिच एपीआई फच एपीआई क्या करती है हमारे लिए कुछ डाटा लेकर आती है अब यह डाटा रीडेबल फॉर्मेट में नहीं है इसको रीडेबल करने के लिए डॉट मेथड को हम कॉल लगाते हैं वो इसे रीडेबल बनाता है जिसको हम यूज कर सकते हैं यूज करने का मतलब है अपने किसी एचटीएमएल एलिमेंट के ऊपर उसे हम पेस्ट कर सकते हैं यानी इनर टेक्स्ट के अंदर इनर एचटीएमएल के अंदर दिखा सकते हैं वही सेम काम हमने कर लिया तो इस तरीके से हमारी एपीआई कॉल्स काम करती है जावास्क्रिप्ट के अंदर अब यह जो सारा काम जो हमने अस सिंक अवेट से किया इसी सारे काम को हम प्रॉमिस चेनिंग से भी कर सकते थे यानी सिंपली व्ट वी कुड हैव डन इज यहां पर एक और फंक्शन बना लेते हैं लेट्स मेक गेट फैक्ट्स या इसे फंक्शन बना देते हैं गेट फैक्ट्स और इस वाले को कमेंट आउट कर देते हैं यही सेम काम प्रॉमिस चेंज से करते तो क्या होता सबसे पहले हमें फेच एपीआई को कॉल करनी होती यूजिंग यूआरएल अब यह फेच एपीआई हमें कुछ रिस्पांस रिटर्न करके देती तो डॉट देन इसके ऊपर हम लगा रहे होते और डॉट देन में हमारे पास कुछ रिजल्ट आता लेट्स कॉल इट रिजल्ट और वी कैन कॉल इट रिस्पांस यह जो हमारे पास रिस्पांस आता अब इस रिस्पांस के ऊपर हमें क्या करना पड़ता इस रिस्पांस को हमें दोबारा से पार्स करना पड़ता पार्स करने का मतलब है डाटा का फॉर्मेट चेंज करना जैसे यूपीआई से कैश में कन्वर्ट कर सकते हैं कैश से डेबिट के अंदर कन्वर्ट कर सकते हैं वैसे ही हम यहां डटा का फॉर्मेट चेंज करते हैं ये जो हमारा रिस्पांस है क्योंकि ये जेसन फॉर्मेट में है तो ये जो डॉट देन है चेनिंग के लिए ये रिटर्न करेगा ड जसन को और जैसे ही ड जन रिटर्न होगा यहां पे एक और डॉट देन लगाया जाएगा जिसके अंदर फाइनल डाटा हमारे पास रिटर्न होकर आएगा और फिर हम क्या करेंगे कसोल डलॉ ल कर देंगे अपने डाटा को इसको एक बार कर लेते हैं सेव तो यह क्या हो गई यह प्रॉमिस चेनिंग हो गई कसोल डॉट लॉग करने के साथ-साथ हम यह चीज जो है इसे प्रिंट करवा सकते हैं सेव किया रिफ्रेश किया गेट फैक्ट किया गेट फैक्ट किया तो हमारे पास यह चीज प्रिंट हो कर आ गई यानी काम वही सेम हो रहा है इस तरीके से भी काम किया जा सकता है बट यहां पे आपको खुद ही समझ में आ गया होगा कि यह कोड जो हमने लिखा था एज कंपेयर्ड टू दिस कोड आवर प्रीवियस कोड वाज मच सिंपलर एंड मच इजियर टू रीड काफी जगह आपको देख देखने को मिलेगा कि फेच एपीआई के अंदर या डिफरेंट डिफरेंट जगह जहां से भी प्रॉमिस रिटर्न हो रहा है वहां पे इस तरीके से डॉट देन करके चेनिंग ही होगी उसमें एज सच कोई प्रॉब्लम नहीं है एज सच कोई गलत बात नहीं है ये भी कोड बिल्कुल सही रन करेगा हमारे लिए बट एक बेटर तरीका होगा अपने कोड को अस सिंक अवेट को यूज करके लिखने का क्योंकि दिस इज जस्ट सिंपलर टू अंडरस्टैंड हमें पता है यहां अवेट हो रही हैं चीजें यहां भी अवेट हो रही हैं चीजें तो ये ज्यादा रीडेबल कोड हमारे लिए होता है तो इसीलिए हमने पहले प्रॉमिस चेंज पढ़ी थी फिर हमने असिंबो पढ़ा था तो ये तो हो गया एवरीथिंग रिलेटेड टू ए एपीआई कॉल्स अब एपीआई कॉल्स के अंदर काफी सारी चीजें हैं जिनको हम जाकर और डिटेल में पढ़ सकते हैं इनमें से एक टॉपिक हमारे पास होता है रिगार्डिंग रिक्वेस्ट एंड रिस्पांस सबसे पहली चीज जो हमें पता होनी चाहिए जब भी कोई एपीआई कॉल जाती है जब भी हम किसी सर्वर को रिक्वेस्ट भेजते हैं कि रिक्वेस्ट जो है उसके अंदर कुछ कुछ एचटीटीपी वर्ब्स होते हैं आई होप एचटीटीपी की फुल फॉर्म बचपन से हम सबने पढ़ी होती है कंप्यूटर साइंस के अंदर स्कूल के अंदर कंप्यूटर साइंस नाम का सब्जेक्ट होता है एचटीटीपी स्टैंड्स फॉर हाइपर टेक्स्ट ट्रांसफर प्रोटो प्रल प्रोटोकॉल प्रोटोकॉल कहने का मतलब है कुछ रूल्स यानी इंटरनेट के ऊपर जो हम रिक्वेस्ट भेज रहे होते हैं वो जनरली हम एचटीटीपी पर भेजते हैं तो यह कुछ रूल्स होते हैं रिक्वेस्ट रिस्पांस भेजने के अब क्या-क्या रूल्स होते हैं इंटरनली उसमें हमें नहीं जाना है बेसिकली एचटीटीपी के अंदर वर्ब्स नाम की एक चीज होती है जो हमें बताती है कि हम किस तरीके की रिक्वेस्ट भेज रहे हैं वी कैन गो टू दिस एमडीएन पेज एंड रीड अबाउट मोर एचटीटीपी वर्ब्स यहां पर अगर हम जाएंगे तो एचटीटीपी रिक्वेस्ट के अंदर कुछ मेथड्स होते हैं या इनको हम कुछ वर्ब्स बोल सकते हैं मतलब किस तरीके की रिक्वेस्ट हमने भेजी इसमें से सबसे पॉपुलर जो हम जनरली फैच एपीआई में यूज़ करते हैं हमारी गेट रिक्वेस्ट होती है गेट रिक्वेस्ट का काम होता है टू गेट सम डाटा यानी इट शुड ओनली बी यूज्ड टू रिट्रीव सम डाटा कुछ डटा अगर हमें कहीं से लेकर आना है उसके लिए हम गेट रिक्वेस्ट भेजते हैं इसके अलावा हमारे पास पोस्ट रिक्वेस्ट भी होती है पोस्ट रिक्वेस्ट बेसिकली हम भेजते हैं टू सेंड सम डाटा हमें जब कुछ डेटा स्पेसिफिक डेटा सेंड करना होता है उसके पहले पोस्ट रिक्वेस्ट अगर हमें कुछ डाटा डिलीट करना है तो उसके लिए हम डिलीट रिक्वेस्ट भेजते हैं फॉर एग्जांपल आप अपने [संगीत] instagram2 रिक्वेस्ट जाए पैच रिक्वेस्ट यानी ऑलरेडी हमारा पूरा डाटा स्टोर्ड होगा instagram2 एंड यहां पर जब हमारे पास रिस्पांस आ रहा है तो रिस्पांस के अंदर वी हैव समथिंग कॉल्ड स्टेटस स्टेटस के अंदर हमने बात की कि 200 स्टेटस का मतलब होता है एवरीथिंग वाज ओके अगर कुछ एरर आ जाता है तो हो सकता है कुछ 500 स्टेटस हमारे पास आ जाए 404 आ जाए इस तरीके के बहुत सारे डिफरेंट स्टेटस होते हैं अब ये स्टेटस कोड का क्या मतलब होता है उसके लिए हम एमडीएन के इस पेज पर जा सकते हैं तो एचटीटीपी के अंदर बहुत सारे रिस्पांस स्टेटस कोड्स होते हैं जो रिस्पांस के अंदर बताते हैं कि रिक्वेस्ट का क्या रिस्पांस रहा जनरली 200 का मतलब होता है सक्सेसफुल रिस्पांस यानी सारी चीजें सही वर्क कर गई अगर क्लाइंट साइड प कुछ एरर आता है यानी अगर हमने गलत तरीके से रिक्वेस्ट भेजी या हम जिस पेज को जिस एपीआई को रिक्वेस्ट भेज रहे हैं वो एपीआई एजिस्ट ही नहीं करती तो हमारे पास 404 एरर आएगा फॉर एग्जांपल यहां यह लिंक इस लिंक के ऊपर हम रिक्वेस्ट भेज रहे थे यहां मैं फैक्ट्स स्ल श्रद्धा कर दूं यह कोई वैलिड लिंक नहीं है ऐसा कोई लिंक उन्होंने नहीं बनाया हुआ तो अब रिफ्रेश करके व्हेन आई विल क्लिक ऑन गेट फैक्ट्स तो यहां पे एरर आएगी क्या एरर आ रहा है द स्टेटस कोड ऑफ़ 400 यहां देखेंगे हम स्टेटस में आ रहा है 400 400 स्टेटस कोड कहता है बैड रिक्वेस्ट यानी हमने जो रिक्वेस्ट करने की कोशिश की वो गलत रिक्वेस्ट है वो हमें नहीं करनी चाहिए थी इसी तरीके से आपने एक फेमस कोड सुना होगा 404 404 का मतलब होता है पेज नॉट फाउंड और अगर मान लो एपीआई के अंदर ही कुछ एरर आ रहा है हमने तो सब कुछ सही किया पर एपीआई में कुछ एरर आ गया फेल हो गई सर्वर फेल हो गया तो उस टाइम पे 500 रिलेटेड एरर्स आते हैं जो सर्वर एरर के लिए एरर्स होते हैं जैसे अगर दैट विल स्टार्ट विद फाइव जो दिखाता है कि हमने कुछ गलत नहीं किया सर्वर की तरफ से या एपीआई की तरफ से कुछ गलत हुआ है तो ये अलग-अलग स्टेटस कोड्स होते हैं पर इसमें जनरली हमारे पास 200 ही आ रहा होता है सक्सेसफुल के लिए तो दैट इज गुड अगर इन चीजों को आपको डिटेल में पढ़ना है मैंने दोनों एमडीएन के पेजेस आपको दिखा दिए हम जाकर एमडीएन के ऊपर डिटेल में इन्हें पढ़ सकते हैं कोई एज सच बहुत मुश्किल चीज नहीं है बहुत आसान चीज है पढ़ने के लिए एंड इनफैक्ट आई थिंक यू शुड गो एंड रीड इट एक और चीज इंपॉर्टेंट होती है कि जब भी हम रिक्वेस्ट या रिस्पांस की बात करते हैं जब भी हम कोई रिक्वेस्ट भेजते हैं या हमारे पास कोई रिस्पांस आ रहा होता है तो उसके अंदर एक हेडर्स नाम की चीज होती है हेडर्स के अंदर हम अपनी एक्स्ट्रा इंफॉर्मेशन भेजते हैं तो एचटीटीपी रिस्पांस हेडर्स के अंदर यानी जब हमारे पास रिस्पांस आता है रिस्पांस का हेडर होता है या हम कोई रिक्वेस्ट भेजते हैं रिक्वेस्ट का भी हेडर होता है तो रिस्पांस में जब हेडर आ रहा है उसके अंदर हमारा क्या कंटेंट का टाइप है क्या स्टेटस कोड है इस तरीके से अलग-अलग इंफॉर्मेशन स्टोर होती है जैसे फॉर एग्जांपल हम ने यहां पर एक बैड रिक्वेस्ट क्रिएट की तो यहां पर हेडर्स के अंदर कई सारी डिफरेंट डिफरेंट इंफॉर्मेशन होगी इसके अलावा अगर हम सही रिक्वेस्ट भी भेजते हैं लेट्स रिमूव दिस सेव रिफ्रेश गेट अ फैक्ट तो यह हमारे हेडर्स होते हैं जिनके अंदर एडिशनल इंफॉर्मेशन होती है तो जब भी आप हेडर वर्ड सुनो एपीआई के अंदर उसका मतलब होता है कुछ एडिशनल इंफॉर्मेशन है जो शायद रिस्पांस के साथ आ रही है जो शायद हम रिक्वेस्ट के साथ भेज रहे हैं तो दिस वाज ऑल अबाउट द बेसिक्स ऑफ एपीआई कॉलिंग इसमें एक छोटा सा होमवर्क प्रॉब्लम है टास्क है जो मैं आपको देना चाहूंगी व्हिच इज टू लर्न हाउ टू सेंड अ पोस्ट रिक्वेस्ट यूजिंग फेच एपीआई फेच एपीआई ही आपको यूज़ करनी पड़ेगी मैं बता भी देती हूं थोड़ा सा फच एपीआई के अंदर हम अपना यूआरएल उसी तरीके से लिखेंगे प्लस हम कुछ एडिशनल ऑप्शंस को यूज़ कर रहे होंगे तो आप चाहो तो इस होमवर्क टास्क को सॉल्व करने के लिए बेसिकली वीी हैव टू सर्च फॉर फेच एपीआई एमडीएन फेच एपीआई एमडीएन पर हम जाएंगे और यहां पर मेथड्स के अंदर हम फैच के अंदर जाएंगे फैच के अंदर जाएंगे तो यहां पर ऑप्शंस नाम की चीज है ऑप्शंस के अंदर हमारे पास मेथड नाम की चीज होती है तो ऑप्शन के अंदर जब हम रिक्वेस्ट के मेथड को पोस्ट में चेंज कर देते हैं तो हमारे पास क्या होता है पोस्ट रिक्वेस्ट चली जाती है तो इस चैप्टर के अंदर जब हम अपना प्रोजेक्ट एक बार बिल्ड कर लेंगे तो उसके बाद हमें जाके अपने इस होमवर्क टास्क को कंप्लीट करना है जिसमें हम आइडेंटिफिकेशन कन्वर्टर अब एक करेंसी कन्वर्टर क्या होता है जैसे फॉर एग्जांपल हमें जानना है कि $1 की रुपीज में क्या वैल्यू होगी तो उसके लिए हमें एक्सचेंज रेट पता होना चाहिए डॉलर यानी यूएसडी एंड इंडियन रुपी यानी आईआर का तो इसी तरीके से एक करेंसी से दूसरी करेंसी में अगर हम कन्वर्ट करते हैं तो कितनी वैल्यू निकल कर आएगी उस चीज़ को उस एक ऐप को हम बिल्ड करने वाले हैं यूजिंग html5 के अंदर एंड इस फाइल को हमने टाइटल दिया है करेंसी कन्वर्टर एंड इसके साथ हमने लिंक कर रखी है एक style.css फाइल अगर हम अपने ब्राउजर के अंदर जाएंगे तो हमारा पेज अभी कुछ इस तरीके से हमें दिखाई देगा जिसमें हमने अपनी कंसोल विंडो को ऑलरेडी ओपन कर रखा है अब शुरुआत करते हैं सबसे पहले बेसिक एचटीएमएल कोड के साथ इसमें सबसे पहले तो हम एक डिव अपने लिए क्रिएट करेंगे जिसको हम नाम देने वाले हैं कंटेनर कंटेनर के ऊपर ही हमारे पास एक h2 हेडिंग हम रख सकते हैं इसे हम कह देंगे करेंसी कन्वर्टर सेव एंड रिफ्रेश सो दिस इज बेसिकली आवर करेंसी कन्वर्टर अभी हमने थोड़ा सा जूम इन कर रखा है तो एक्चुअल साइज जो होगा वो कुछ इस साइज का हमारे पास कन्वर्टर निकल कर आएगा अब करेंसी कन्वर्टर के लिए एक फॉर्म है जिसे हम क्रिएट करने वाले हैं फॉर्म के अंदर सबसे पहले एक डिव क्रिएट करते हैं जिसे हम कहेंगे अपनी अमाउंट वाला डिव अमाउंट डिव के अंदर हम अपनी कुछ अमाउंट एंटर करवाएंगे यूजर से तो हम यहां लिख सकते हैं एंटर अमाउंट एंड इसके अंदर हमारे पास एक इनपुट बॉक्स होगा जिसकी वैल्यू शुरुआत में हम रख सकते हैं एज 100 इसके टाइप में हम ऐड करने वाले हैं टेक्स्ट रिफ्रेश कर दिया तो यहां पर हम चाहे तो अपनी वैल्यू को 500 भी रख सकते हैं बेसिकली अगर मुझे $1000 को कन्वर्ट करना है टू इंडियन रुपी तो उसके लिए क्या वैल्यू होगी वो हम यहां पर आकर टाइप कर रहे होंगे यह हो गया हमारा अमाउंट का डिव इसके अलावा हम अपने लिए कुछ ड्रॉपडाउंस क्रिएट कर सकते हैं तो लेट्स क्रिएट अ डिव कॉल्ड ड्रॉप डाउन ड्रॉप डाउन के अंदर हमारे पास दो ड्रॉप डाउंस होंगे एक जिसके अंदर हम फ्रॉम वाली करेंसी लिखेंगे एक जिसके अंदर हम टू वाली करेंसी लिखेंगे फॉर एग्जांपल हम डॉलर से इंडियन रुपी के अंदर कन्वर्ट कर रहे हैं तो फ्रॉम में डॉलर आ जाएगा यानी यूएसडी और टू में इंडियन रुपी आ जाएगा यानी आईएनआर तो इस तरीके से ड्रॉप डाउन में हमारे पास दो ड्रॉप डाउंस होंगे एक होगा हमारा फ्रॉम वाला ड्रॉप डाउन एंड एक होगा हमारा टू वाला ड्रॉपडाउन फर्स्ट ड्रॉप डाउन को सबसे पहले क्रिएट करते हैं इसे एक पैराग्राफ दे देते हैं फ्रॉम साथ में एक और डिव हम क्रिएट करने वाले हैं वी विल कॉल इट सिलेक्ट कंटेनर क्योंकि इसके अंदर ड्रॉप डाउन है तो ड्रॉप डाउन को क्रिएट करने के लिए एचटीएमएल के अंदर हम सिलेक्ट एलिमेंट को यूज करते हैं तो यहां पर हमारे पास एक सिलेक्ट एलिमेंट होगा सिलेक्ट का नेम हम अपने लिए रख सकते हैं फ्रॉम एंड सिलेक्ट के अंदर हम कई सारे डिफरेंट ऑप्शंस हैं जिनको क्रिएट कर सकते हैं फॉर एग्जांपल हमारा फर्स्ट ऑप्शन हो सकता है या इसे कह देते हैं यडी सेकंड ऑप्शन हमारे लिए हो सकता है आईआर तो यहां वैल्यू हम रख देंगे एज आईआर यहां पर भी अपनी वैल्यू को हम रख देंगे एज यूएसडी सेव किया रिफ्रेश किया तो इस तरीके से फ्रॉम एंड फिर हमारे पास एक ड्रॉप डाउन आ जाएगा जिसमें से हम अपने ऑप्शंस को सेलेक्ट कर सकते हैं हम चाहे तो दो और ऑप्शंस यहां पर ऐड कर सकते हैं एक हम यूरो के लिए ऐड कर देते हैं यू आर एक हम यूडी के लिए ऐड कर सकते हैं यूडी इज बेसिकली ऑस्ट्रेलियन डॉलर साथ के साथ जो भी कंट्री होगी यानी जो भी करेंसी हम सिलेक्ट करेंगे हम उस करेंसी किसी की इमेज को भी दिखाना चाहते हैं तो उसके लिए हम अपना इमेज टैग यूज कर सकते हैं जिसके अंदर हम कुछ लिंक ऐड करेंगे अब हमारे पास बहुत सारी कंट्रीज अवेलेबल होंगे अभी तो हमने सिर्फ चार कंट्रीज के यहां पे एग्जांपल दिखाए हैं अपने ड्रॉपडाउन के अंदर पर एक्चुअली आपके पास ये एक फाइल होगी जो डाउनलोड करने के लिए नीचे आपको लिंक दिया होगा डिस्क्रिप्शन बॉक्स के अंदर हमारे पास पूरी कंट्रीज की एक लिस्ट होगी इस लिस्ट के अंदर हमारे पास हर कंट्री की करेंसी का कोड है एंड हर कंट्री का कोड है तो हमारे पास बहुत सारी डिफरेंट डिफरेंट कंट्रीज हैं इसके अंदर टोटल 160 कंट्रीज की इंफॉर्मेशन है 100 एंड आई थिंक 59 कंट्रीज की इंफॉर्मेशन है जिसको यूज़ करके हम अपने करेंसी कन्वर्टर को क्रिएट करने वाले हैं अब हर कंट्री का अलग एक फ्लैग होगा तो उसके लिए जरूरी तो नहीं है कि हम हर एक कंट्री के फ्लैग की इमेज डाउनलोड करके रखें तो वो डाटा देने के लिए भी हमारे पास डिफरेंट डिफरेंट एपीआई होती हैं जिनको हम यूज़ कर सकते हैं तो फ्लैग्स के लिए वी विल यूज दिस पर्टिकुलर l फग किसी भी कंट्री का फ्लैग लेकर आ सकते हैं तो बेसिकली सोर्स में इमेज की सोर्स में हम इस लिंक को यूज करेंगे ये हमारे पास लिंक होगा इसको एंटर किया तो हमारे पास ये इमेज आ जाएगी व्हिच इज सम कंट्रीज फ्लैग अब यहीं पर अगर हम आई एन लिख दें आई एन यानी इंडिया का फ्लैग तो हमारे पास इंडिया का फ्लैग आ जाएगा अगर हम यहां पर यूएस लिख दें आई ए की जगह तो हमारे पास यूएस का फ्लैग आ जाएगा इफ आई राइट ए पी प्रोबेबली तो हमारे पास नेपाल का फ्लैग आ जाएगा तो इस तरीके से बहुत सारे डिफरेंट डिफरेंट कंट्रीज के फ्लैग्स हमारे पास आ सकते तो वी विल स्टार्ट विद दिस फ्लैग सोर्स के अंदर हम इस लिंक को पेस्ट कर सकते हैं शुरुआत में हम कन्वर्टर को यूएसडी टू आई एनआर कन्वर्टर बनाएंगे तो हम यूएस का फ्लैग है इसे दिखा सकते हैं तोय बेसिकली हमारा फर्स्ट सिलेक्ट कंटेनर बन जाएगा एंड इसी सिलेक्ट कंटेनर को हम प्रॉपर्ली यहां पर कॉपी कर सकते हैं एंड वी कैन पेस्ट इट हेयर यहां पर हम टू वाली इंफॉर्मेशन लिखेंगे या इतने पार्ट को कॉपी कर लेते हैं एंड यहां पर पेस्ट कर देते हैं बेसिकली यहां पर हम पैराग्राफ में लिखेंगे टू यह भी हमारा सिलेक्ट कंटेनर बन जाएगा यहां पर हम इंडिया का फ्लैग दिखा रहे होंगे सेव करेंगे रिफ्रेश करेंगे तो यह हमारे पास फ्लैग आ गया यूएसडी यह हमारे पास फ्लैग आ गया इंडिया इसके अंदर ऑप्शन में भी इंडिया दिखाने के लिए यह जो आईएनआर है यहां पर हम सिलेक्टेड लिख सकते हैं सेव एंड रिफ्रेश तो अभी हमारा क्या कन्वर्टर दिख रहा है कन्वर्टर कुछ ऐसा दिख रहा है जिसमें ऊपर हम अमाउंट एंटर करेंगे यहां पर हमारे पास फ्लैग होगा अपनी कंट्री का अभी फ्लैग डायनेमिक चेंज नहीं हो रहा वो सारा लॉजिक हम जावास्क्रिप्ट फाइल के अंदर लिखेंगे पर बेसिकली शुरुआत में हम यूएसडी टू आईएनआर इस तरीके का कन्वर्टर बनाएंगे कि कैसे डॉलर को हम रुपी में इंडियन रुपी में कन्वर्ट कर सकते हैं तो यह हमारे पास प्रॉपर हमारे दो ड्रॉप डाउन हो गए एक ड्रॉप डाउन है हमारा फ्रॉम वाला एक ड्रॉप डाउन है हमारा टू वाला नेक्स्ट हम चाहे तो अपने लिए एक और डिव बना सकते हैं लेट्स कॉल दिस डिव डिव को हम लिख सकते हैं अपना फाइनल मैसेज जिसके अंदर वी विल बेसिकली राइट समथिंग लाइक वन यडी इज इक्वल टू 80 आईआर इस तरीके की कुछ इंफॉर्मेशन बेसिक इंफॉर्मेशन होगी जिसको हम दिखा रहे होंगे साथ के साथ हम अपने लिए एक बटन क्रिएट कर सकते हैं लेट्स क्रिएट अ बटन जिसमें होगा गेट एक्सचेंज रेट तो गेट एक्सचेंज रेट को जैसे ही क्लिक करेंगे वैसे ही क्या होगा हमारा फॉर्म एक तरीके से अभी सबमिट हो रहा है जैसे ही हम फ सबमिट करते हैं फॉर्म के अंदर कोई भी बटन होता है वो अपने आप में एक सबमिट बटन की तरह एक्ट करता है जैसे इसको क्लिक कर रहे हैं फॉर्म हमारा सबमिट हो रहा है फॉर्म सबमिट हो रहा है तो आपको दिख रहा होगा कि ऊपर उसके आर्गुमेंट दिखाई दे रहे हैं तो ये फॉर्म का डिफॉल्ट बिहेवियर होता है और जैसे ही इसको क्लिक कर रहे हैं पेज हमारा दोबारा बार-बार बारबार रीलोड हो रहा है अभी के लिए उस चीज को कंप्लीट इग्नोर करना है पर बेसिकली ये हमारा बेसिक लेआउट है अपने फॉर्म का अब बेसिक लेआउट हमने क्रिएट कर लिया साथ के साथ एक और चीज जो हम कर सकते हैं वी कैन ऐड सम आइकन इन बिटवीन यानी ये फ्रॉम और टू के बीच में हम कोई आइकन ड ऐड कर सकते हैं आइकन के लिए वी कैन गो टू फंट ऑसम फंट ऑसम के अंदर य हमारे पास काफी सारे आइकंस होते हैं प्लस वी आल्सो हैव फंट ऑसम सीडीए हम इस लिंक पर जा सकते हैं व्हिच इज हमारी फंट ऑसम की वेबसाइट होती है जहां से हम अपने फ्री एंड ओपन सोर्स आइकंस को यूज करेंगे तो बेसिकली वी कैन सर्च फॉर एक्सचेंज यह वाला फ्री आइकन है जिसे हम यूज करने वाले हैं लेट्स पेस्ट इट यहां पर फ्रॉम एंड टू के बीच में तो इसे क्रॉस कर देते हैं एंड यहां पर रिफ्रेश करेंगे तो हमारे पास ये आइकन आ गया फ्रॉम एंड टू के बीच में एरोज की फॉर्म में अब इस पूरे लेआउट को हमें अच्छे से कन्वर्ट करना है टू आवर करेंसी कन्वर्टर तो अपनी स्टाइल डॉट सीएसएस को हम खोल लेते हैं स्टाइल डॉट सीएसएस के अंदर सबसे पहले तो अपनी मार्जिन पडि को हम रिसेट कर देंगे टू जीरो सेव रिफ्रेश हमारी जो बॉडी है बॉडी को हम कर देंगे डिस्प्ले फ्लेक्स बिकॉज वी आर यूजिंग अ लॉट ऑफ डिव टू बी नेस्ट यह सारे के सारे हमारे पास डिव आ जाएंगे जस्टिफाई कंटेंट कर देंगे टू सेंटर फ्रेश किया सारा कंटेंट हमारा सेंटर में आ गया आल्सो हम इसे टेक्स्ट अला या अलाइन आइटम्स भी कर देते हैं टू सेंटर जैसे किया सारे आइटम्स हमारे सेंटर में अलाइन हो गए प्लस हम इसे एक मिनिमम हाइट दे देते हैं व्हिच इज गोइंग टू बी 100 व्यूपोर्ट हाइट तो सारे आइटम्स अब पेज के सेंटर में आ जाएंगे एंड लेट्स आल्सो गिव इट अ बैकग्राउंड कलर अब हम चाहे तो कोई भी बैकग्राउंड कलर दे सकते हैं फॉर एग्जांपल मैंने यहां पर कोरल कलर दे दिया हम कोई भी कलर दे सकते हैं तो बेसिकली हम क्या कर सकते हैं कूलर्स जैसी किसी भी वेबसाइट पर जाकर अपने लिए एक पैलेट जनरेट कर सकते हैं तो काफी सारी डिफरेंट कलर्स के कॉमिनेशन हमें मिल जाएंगे तो ऐसा ही एक कॉमिनेशन मैंने जनरेट किया है इसमें f4 e4 बी यह कलर को हम अपने बैकग्राउंड कलर की तरह सेट करने वाले हैं अब आ जाते हैं फाइनली अपने कंटेनर पर तो हमारा जो कंटेनर है उसके लिए वी आर गोइंग टू सेट अप बैकग्राउंड कलर ऑफ वाइट ट्रिपल एफ इसे कर लेते हैं रिफ्रेश किया तो यह हमारा कंटेनर है जिसके अंदर हमारा पूरी की पूरी प वर्क कर रही होगी दिस इज बेसिकली द मेन सेक्शन ऑफ आवर पप अब इसे थोड़ी सी हम पैडिट देने वाले हैं टू रेम्स की सेव रिफ्रेश तो थोड़ी सी हमारे पास पैडिट रेडियस दे सकते हैं लेट्स गिव इट अ बॉर्डर रेडियस ऑफ वन रेम तो यह हमारे पास बॉर्डर रेडियस आ गई व कैन आल्सो गिव इट सम हाइट लेट्स से 45 ऑफ व्यू पोर्ट हाइट या इसे हम मिनिमम हाइट भी कर सकते हैं प्लस वी कैन आल्सो सो गिव इट सम विड्थ 40 ऑफ व्यू पोर्ट हाइट ये हमारे पास प्रॉपर विड्थ आ गई अब हमारा जो कंटेनर है कंटेनर के अंदर फॉर्म पर आ जाते हैं फॉर्म को हम कुछ-कुछ मार्जिन देना चाहते हैं बेसिकली इतना पार्ट जो है ये हमारा फॉर्म है तो इसे टॉप से एंड बॉटम से हम कुछ मार्जिन देना चाहते हैं टॉप से हम इसे मार्जिन दे देते हैं टू रेम्स जीरो एंड बॉटम से भी टू रेम्स रो रिफ्रेश तो ये हमारे पास थोड़ी सी स्पेस क्रिएट हुई है बॉटम से वी कैन आल्सो डिक्रीज मार्जिन टू बी वन रेम एंड अब अपने फॉर्म के अंदर यानी फॉर्म के अंदर जो हमारे पास सिलेक्ट है हम तीन चीजों को चेंज करना चाहते हैं बेसिकली यह जो हमारे सिलेक्ट हैं दोनों के दोनों द सिलेक्ट्स हमारा जो इनपुट है एंड हमारा जो बटन है तो फॉर्म के अंदर जो सिलेक्ट है जो बटन है एंड जो इनपुट है उन तीनों को हम विड्थ देना चाहते हैं 100% की जितनी भी फॉर्म की विड्थ है पूरी विड्थ इन पर अप्लाई होगी तो ये हमारी अमाउंट आ जाएगी यह हमारा सिलेक्ट आ जाएगा इस तरीके से ये हमारा सेकंड सिलेक्ट आ जाएगा एंड यह हमारा बटन आ जाएगा साथ के साथ हम इनके बॉर्डर को सेट करना चाहते हैं टू नन रिफ्रेश किया तो बॉर्डर यहां से गायब हो गया मतलब जो डिफॉल्ट बॉर्डर इनके पास आ रहा था आउटलाइन आ रही थी यहां पर लेट्स आल्सो गिव देम ऑल अ बॉर्डर रेडियस ऑफ 0.75 रेम वो बॉर्डर रेडियस अभी हमें दिखाई नहीं देगी क्योंकि हमने बॉर्डर सेट नहीं किया पर धीरे-धीरे एक-एक करके बॉर्डर सेट करेंगे तो हमें बॉर्डर रेडियस दिखाई देगी अब फॉर्म के टॉप एलिमेंट के साथ स्टार्ट करते हैं लेट्स स्टार्ट विद आवर इनपुट बॉक्स तो फॉर्म के अंदर जो हमारा इनपुट है उसके लिए लेट्स गिव इट अ बॉर्डर ऑफ वन पिक्सेल सॉलिड एंड इसे हम लाइट ग्रे कलर देने वाले हैं लेट्स गिव इट लाइट ग्रे सेव एंड रिफ्रेश तो ये हमारे पास क्या आ गया हमारे पास अपना लाइट ग्रे कलर का एक बॉर्डर आ गया साथ के साथ इसे एक बेटर फॉन्ट साइज देते हैं वन रेम का सेव किया रिफ्रेश किया तो हमारे पास वन रेम का फॉन्ट साइज क्रिएट होकर आ गया वी कैन आल्सो गिव इट सम हाइट लेट्स गिव इट अ हाइट ऑफ थ्री रेम्स मे बी सेव रिफ्रेश तो ये हमारे पास अमाउंट के लिए हाइट आ गई है प्लस हम इसे कुछ पैडिट भी दे सकते हैं पैडिट के अंदर हम इसे लेफ्ट एंड राइट से या सिर्फ लेफ्ट से भी पैटन दे सकते हैं लेट्स गिव इट अ पैडिट ऑफ 0.5 रेम सेव रिफ्रेश तो यह हमारे पास हमारी अमाउंट एंटर करने का बॉक्स आ गया है इसमें हम 500 या वी कैन कन्वर्ट $1000 टू इंडियन रुपी सो दिस इज आवर अमाउंट बॉक्स अब हम फोकस करने वाले हैं अपने सिलेक्ट पर अब सिलेक्ट के लिए हम चाहते हैं यह जो हमारा फर्स्ट ड्रॉप डाउन है और यह जो जो हमारा सेकंड ड्रॉप डाउन है दोनों सेम लाइन के अंदर आ जाए तो इनका जो कंटेनर है इंडेक्स ड एचटीएमएल के अंदर दोनों के दोनों ये जो हमारे ड्रॉप डाउन है इनको हमने ऐड किया है अपने इस ड्रॉप डाउन क्लास के अंदर तो अपनी जो ड्रॉप डाउन क्लास है उसे हम करेंगे डिस्प्ले फ्लेक्स दोनों सेम लाइन पर आ जाएंगे एंड अब इन्हें कर देंगे जस्टिफाई कंटेंट स्पेस बिटवीन करने वाले हैं सेव रिफ्रेश तो दोनों एंड्स पर चले जाएंगे वी कैन आल्सो अलाइन आइटम्स टू द सेंटर सेव एंड रिफ्रेश अलाइन आइटम सेंटर हमारे लिए होकर आ गया प्लस वी कैन आल्सो गिव इट सम मार्जिन फ्रॉम द टॉप वन रेम की अगर हम मार्जिन दे दें तो यह कुछ डिस्टेंस हमारे पास आ जाएगा या फिर वी कैन आल्सो मेक द मार्जिन टू बी टू रेम्स रिफ्रेश ये फ्रॉम आ जाएगा ये टू आ जाएगा तो यहां से हमें चीजें क्लियर हो रही है थोड़ी सी कि इस करेंसी को हम कन्वर्ट करना चाहते हैं और इस वैल्यू से इस वैल्यू के अंदर हम कन्वर्ट करना चाहते हैं अब कैसे कन्वर्ट करेंगे पहले तो अपनी इमेज को ही ठीक कर लेते हैं अपना जो सिलेक्ट कंटेनर है कहां है हमारा सिलेक्ट कंटेनर हमारे पास दो सिलेक्ट कंटेनर्स हैं एक हमारे पास यह सिलेक्ट कंटेनर है जिसके अंदर फ्रॉम है और यह सिलेक्ट कंटेनर है जिसके अंदर टू है बेसिकली सिलेक्ट कंटेनर के अंदर जो भी इमेज है हमारे पास उस इमेज को एक फॉन्ट साइज हम दे सकते हैं 1.75 रेम्स ताकि इमेज थोड़ी सी छोटी हो जाए इस इमेज को हम एक मैक्सिमम विड्थ दे सकते हैं ऑफ 1.75 रेम्स सेव रिफ्रेश ताकि इमेज हमारे पास थोड़ी सी छोटी होकर आए इन फैक्ट वी कैन आल्सो मेक इट टू रेम्स इफ वी वांट सेव रिफ्रेश तो ये टू रम की हमारे पास इमेज आ जाएगी एंड अब अपने सिलेक्ट कंटेनर पर आ जाते हैं सिलेक्ट कंटेनर कहने का मतलब है बेसिकली ये ड्रॉप डाउन एंड इस ड्रॉप डाउन की हम यहां पर बात कर रहे हैं सबसे पहले इन्हें हम कर देंगे डिस्प्ले फ्लेक्स ताकि हमारी इमेज एंड ड्रॉप डाउन सेम लाइन में आ जाए तो ये हमारी इमेज हो गई वयी कैन आल्सो जूम इन अ लिटिल बिट ये हमारी इमेज हो गई ये हमारा ड्रॉप डाउन हो गया दिस इज माय इमेज दिस इज माय ड्रॉप डाउन साथ के साथ इन्हें हम कुछ विड्थ दे सकते हैं लेट्स मेक द विड्थ टू बी सिक्स रेम्स हमने कुछ विड्थ दे दी है इन्हें एक चाहे तो बैकग्राउंड कलर हम दे सकते हैं ताकि आईडेंटिफाई कर सके लेट्स गिव इट अ बैकग्राउंड कलर ऑफ रेड ताकि हमें पता रहे ये हमारा फर्स्ट बॉक्स है एंड अभी ये जो सेकंड बॉक्स है जो रेड से हाइलाइटेड है दिस इज आवर सेकंड बॉक्स डिस्प्ले फ्लेक्स के साथ वी कैन आल्सो जस्टिफाई कंटेंट टू सेंटर एंड वी कैन आल्सो अलाइन आवर आइटम्स टू सेंटर साथ के साथ इन्हें एक बॉर्डर रेडियस दे देते हैं या बॉर्डर रेडियस ऑलरेडी गिवन है कहां से गिवन है बॉर्डर रेडियस अच्छा सिलेक्ट कंटेनर के पास बॉर्डर रेडियस नहीं है तो सेलेक्ट कंटेनर को बॉर्डर रेडियस हम दे सकते हैं 0.5 रेम्स की सेव किया रिफ्रेश किया तो इसके पास क्या आ गया बॉर्डर रेडियस आ गई है एंड बॉर्डर को हम कुछ कलर भी दे सकते हैं वन पिक्सेल सॉलिड ये सेम बॉर्डर हम कॉपी करने वाले हैं जो हमने अपने इनपुट को दिया था सेव रिफ्रेश हम चाहे तो अब अपने बैकग्राउंड कलर को हटा सकते हैं सेव किया रिफ्रेश किया सो दिस इज माय फ्रॉम एंड दिस इज माय टू विड्थ इनकी थोड़ी सी या इफ आई रिवर्ट बैक टू माय ओरिजिनल साइज अभी ओरिजिनल क्या है ओरिजिनल कुछ इस तरीके का हमें दिखाई दे रहा है हमारे जो ड्रॉप डाउन का आइकन है इसे भी हम ठीक तरीके से प्लेस कर सकते हैं तो अपने ड्रॉप डाउन आइकन के अंदर आ जाते हैं लेट्स गिव इट अ फंट साइज ऑफ 1 प 5 रेम्स प्रोबेबली लेट्स इंक्रीज इट अ लिटिल बिट एंड आल्सो इसे हम मार्जिन दे सकते हैं फ्रॉम टॉप इक्वल टू वन रम थोड़ा सा ही सेंटर की तरफ आ जाएगा अपने सिलेक्ट का हम चाहे तो साइज इंक्रीज कर सकते हैं तो हमारे सिलेक्ट कंटेनर के अंदर जो सिलेक्ट है उसे हम फंट साइज दे सकते हैं इक्वल टू 1 रेम सेव रिफ्रेश सो दिस इज आवर इंक्रीजड फंट साइज से विड्थ हम रख सकते हैं टू ऑटो सेव रिफ्रेश अब आ जाते हैं अपने मैसेज पर अपनी मैसेज हमने आईडी दि है या क्लास दिया है हमने क्लास दी है मैसेज को तो मैसेज क्लास के लिए वी कैन गिव इट सम मार्जिन फ्रॉम टॉप एंड बॉटम तो इसे टू रेम्स की मार्जिन दे देते हैं टॉप से भी बॉटम से भी सेव रिफ्रेश तो यह हमारे पास हमारा मैसेज आ गया कि 1 यूएसडी इ 80 आईआर एंड अब अपने बटन के ऊपर ध्यान देते हैं हमारे सिलेक्ट कंटेनर के अंदर जो हमारे पास बटन है इट्स नॉट इन द सिलेक्ट कंटेनर इट इज इन द फॉर्म फॉर्म का जो बटन है इसे कुछ हाइट दे देते हैं थ्री रेम्स व्हिच इज इक्वल टू माय इनपुट साइज रिफ्रेश किया ये हमारे पास बटन आ गया बटन को एक हम बैकग्राउंड कलर देने वाले हैं जो हमने पैलेट से जनरेट किया है ए 4d 98 सेव एंड रिफ्रेश तो यह हमारे पास कुछ कलर आ गया साथ के साथ इसे टेक्स्ट कलर दे देते हैं वाइट सेव रिफ्रेश य हमारे पास टेक्स्ट कलर वाइट आ गया वी कैन आल्सो इंक्रीज द फंट साइज टू बी वन रिम रिफ्रेश ये वन या इसे 1.5 अगर दे दें रिफ्रेश ओके 1.5 इज टू लार्ज लेट्स गिव इट 1.15 फ्रेम्स यह हमारे पास हमारा गेट एक्सचेंज रेट वाला बटन आ गया जिसके अंदर चीजें जो है वो रिफ्रेश करती हुई हमें दिखाई दे रही है व्हेन एवर वी आर क्लिकिट द बटन एक और चीज हम कर सकते हैं इसे एक कर्सर भी दे देते हैं साथ में लेट्स गिव इट अ कर्सर पॉइंटर ताकि जब भी हम अपने बटन के ऊपर जाएं हर करें हमारा कर्सर क्या हो चेंज हो तो हमें पता चले कुछ ना कुछ एक्शन तो परफॉर्म होगा ही इस तरीके से हमारा एक करेंसी कन्वर्टर है जिसका बेसिक लेआउट हमने प्रिपेयर कर लिया है हम चाहे तो यूरो से अपने ऑस्ट्रेलियन डॉलर में कन्वर्ट कर सकते हैं वी कैन कन्वर्ट टू आईआर हम कोई भी ऑप्शन है जिसे चूज कर सकते हैं अब हमें दो काम करने हैं अपने जावास्क्रिप्ट के अंदर सबसे पहला यहां पर हमें सिर्फ चार कंट्रीज नहीं दिखानी हमें सारी की सारी कंट्रीज दिखानी है जैसे हम कंट्री चेंज करें हमारा फ्लैट चेंज होना चाहिए और जैसे इस बटन को क्लिक किया जाए वैसे ही पूरा कन्वर्जन हो और वह चीज हमें यहां पे आके दिखाई दे तो इस तरीके का प्रॉपर जो फुली फंक्शनल ऐप है उसको हम प्रिपेयर करना चाहते हैं तो उसके लिए हमने ऑलरेडी दो जावास्क्रिप्ट फाइल बनाई हुई है एक जावास्क्रिप्ट फाइल है कोड्स . जए के नाम से जिसके अंदर हमने सारी की कंट्रीज की लिस्ट प्रिपेयर की हुई है जिसमें कंट्री का कोड है प्लस हमारी कंट्री की करेंसी है यह वाली फाइल आपको ऑलरेडी नीचे डिस्क्रिप्शन बॉक्स के अंदर मिल रही होगी तो इसे जाकर हम क्रिएट कर सकते हैं नहीं तो आप चाहते हैं कि आपको चार पांच कंट्रीज के साथ ही स्टार्ट करना है तो यू कैन आल्सो कॉपी द कंट्रीज डायरेक्टली आप डायरेक्टली भी अपनी खुद की फाइल बना सकते हैं इस फाइल के अंदर हम एस सच कोई काम नहीं करेंगे सारा काम हम अपनी app.js इस फाइल के अंदर कर रहे होंगे अब दोनों फाइल्स को index.htm से पहले कनेक्ट भी कर लेते हैं बॉडी टैग से जस्ट पहले वी विल राइट अ स्क्रिप्ट जिसके अंदर सोर्स में पहले हम कोड्स ड जए को इंक्लूड करेंगे उसके बाद स्क्रिप्ट में सोर्स में हम अपनी पड जस को इंक्लूड करेंगे अब यहां आ जाते हैं अपनी पड जए के अंदर अब फाइनली हम अपने पड जए के अंदर जावास्क्रिप्ट के लॉजिक को लिखना स्टार्ट करेंगे अब अपने जावास्क्रिप्ट के कोड में सबसे पहले अपनी एपीआई जिसे हम यूज करने वाले हैं उसे देख लेते हैं वी आर गोइंग टू यूज दिस करेंसी एपीआई जो हमें इस लिंक पर यहां पर गिट हब के ऊपर इस पेज पर अवेलेबल मिल जाएगी एंड यह रहा इसका लिंक एपीआई के रीड म में बेसिकली वी विल हैव आवर एंड पॉइंट्स तो हमारे पास डिफरेंट डिफरेंट एंड पॉइंट्स हैं बेसिक फॉर्मेट ये रहेगा हमारे एपीआई के यूआरएल का हम इस एपीआई के अंदर काफी सारी डिफरेंट सर्विसेस हैं हम इस सर्विस को यूज करना चाहते हैं बेसिकली जब हमें एक करेंसी से दूसरी करेंसी के अंदर कन्वर्ट करना है तो इस लिंक को एक बार कॉपी कर लेते हैं यहां पर क्या हो रहा है हम यूरो से आई थिंक दिस इज जापानीज न जेपी वाई करेंसी दिस इज वन जापानीज न जिसके अंदर कन्वर्ट करने की कोशिश की जा रही है तो इस लिंक पर हम जा सकते हैं और यह हमें डेट रिटर्न करेगा लास्ट अपडेटेड डेट फॉर द एक्सचेंज रेट एंड साथ के साथ क्या एक्सचेंज रेट है यूरो से जपनीज न का वो हमें दिखा रहा है अगर हमें फॉर एग्जांपल अगर हमें चाहिए कि हम यूएसडी से यानी डॉलर से इंडियन रुपी के अंदर कन्वर्ट करना चाहते हैं तो ये हमारे पास आ गया एक्सचेंज रेट ये 14th दिसंबर को अपडेट हुआ है एक्सचेंज रेट इज 83 तो इस तरीके से यह जो हमारा लिंक है इसे हम कॉपी कर सकते हैं एंड वी कैन क्रिएट अ वेरिएबल कॉल्ड बेस यूआरएल बेस यूआरएल के अंदर हम यह लिंक पेस्ट कर लेंगे अब इस लिंक के अंदर करेंसीज के बाद यहां पर वैसे तो यूएसडी है यहां पर आईएनआर है पर यह यहां पर बाद में हम अपने वेरिएबल को लिखने वाले हैं अभी के लिए इसे इतना ही हम छोड़ सकते हैं एंड वी कैन सेव इट सबसे पहले यहां पर आ जाते हैं एंड अपने ऑप्शंस को पॉपलेट करते हैं बेसिकली सारे के सारे ऑप्शंस को हम पॉपलेट करेंगे तो अपनी इंडेक्स ड एटीए से हम सेलेक्ट करने वाले हैं अपना ड्रॉपडाउन तो ड्रॉप डाउन इज इक्वल टू डॉक्यूमेंट डॉट क्वेरी सिलेक्टर एंड वी आर गोइंग टू सिलेक्ट द ड्रॉपडाउन क्लास इनफैक्ट ड्रॉप डाउन के अंदर जो हमारे सिलेक्ट्स हैं ड्रॉप डाउन सिलेक्ट्स या थोड़ा सा बड़ा नाम हो जाएगा इसे हम ड्रॉप डाउन ही कह देते हैं क्वेरी सिलेक्टर ऑल से ड्रॉप डाउन के सारे सिलेक्ट य बेसिकली दो सिलेक्ट्स हैं हमारे पास ड्रॉप डाउंस के अंदर दो ड्रॉप डाउंस हैं उनको हमने सेलेक्ट कर लिया और उन्हीं के ऊपर हम एक लूप चला लेंगे लेट सिलेक्ट ऑफ ड्रॉप डाउंस यह हमारी सिलेक्ट आ गई यह लूप रन करने से पहले एक बार हम अपनी कंट्री लिस्ट को एक्सेस करना चाहते हैं कौन सी कंट्री लिस्ट जो हमारे कोड्स ड जए के अंदर यह कंट्री लिस्ट वेरिएबल है एक बार इसे एक्सेस करके हम प्रिंट करवा के देखना चाहते हैं तो लेट कोड ऑफ कोड इन कंट्री लिस्ट कसोल डलॉग हमारे सारे के सारे कोड हमारे पास प्रिंट होकर आ जाए यह हमारा फॉर इन लूप हम यूज कर सकते हैं तो रिफ्रेश करेंगे एंड इफ वी इंस्पेक्ट इट एंड गो टू आवर कंसोल तो कंसोल के अंदर हमारे पास सारे के सारे कोड्स अवेलेबल है अपने कोड्स के साथ हम कंट्री लिस्ट के अंदर उस कोड का यानी कंट्री का कोड भी प्रिंट करवा सकते हैं यह बेसिकली हमारा करेंसी कोड है यह हमारा कंट्री कोड है रिफ्रेश किया तो यह हमारा करेंसी कोड आ गया हमारा कंट्री कोड आ गया जैसे इसके अंदर अगर हम इंडिया का एग्जांपल ले तो इंडिया के लिए द करेंसी कोड इज आई एनआर बट द कंट्री कोड इज आईन यानी इंडिया तो यह सारी वैल्यूज हमारे पास एक्सेसिबल है इसे हम कट कर लेते हैं एंड यहां पर आकर अपने सिलेक्ट के अंदर हम एक एक कंट्री कोड के लिए अपना ऑप्शन ऐड करेंगे अब ऑप्शन कैसे ऐड करेंगे हम एक नया एलिमेंट क्रिएट करने वाले हैं लेट न्यू ऑप्शन इज इक्वल टू डॉक्यूमेंट डॉट क्रिएट एलिमेंट और हम एक ऑप्शन टाइप का एलिमेंट है जिसे क्रिएट करेंगे इस न्यू ऑप्शन के अंदर सबसे पहले तो हमारा जो इनर टेक्स्ट होगा यहां पर इसे करेंसी कोड कर देते हैं दैट विल बेसिकली बी इक्वल टू करेंसी कोड साथ के साथ जो हमारे न्यू ऑप्शन का वैल्यू होगी दैट विल आल्सो बी इक्वल टू करेंसी कोड एंड इस न्यू ऑप्शन को हम कहां पर ऐड करेंगे इस न्यू ऑप्शन को हम अपने सिलेक्ट के अंदर ऐड करेंगे यानी इस सिलेक्ट के अंदर तो सिलेक्ट के अंदर हम डॉट अपेंड कर देंगे अपनी करेंसी या न्यू ऑप्शन को तो बेसिकली सारी जो हमारी कंट्रीज की लिस्ट थी उन सबको इंडिविजुअल ऑप्शंस के अंदर कन्वर्ट कर रहे हैं और सिलेक्ट के अंदर उन ऑप्शंस को हम ऐड कर रहे हैं इसे सेव कर लिया रिफ्रेश किया नाउ इफ आई लुक एट इट तो इस बार हमारे पास सारी की सारी कंट्रीज हमारे सिलेक्ट के अंदर अवेलेबल है इस दूसरे सिलेक्ट के अंदर भी सारी की सारी कंट्रीज हमारे पास अवेलेबल है तो ये हमारे पास सारी कंट्रीज आ गई अब हम चाहे तो अपने इंडेक्स ड इस पार्ट को रिमूव कर लेते हैं एंड इन ऑप्शंस को हम रिमूव कर लेते हैं तो रिफ्रेश किया तो यह हमारे पास कंट्रीज आ गई ये हमारे पास कंट्रीज आ गई है अब शुरुआत में हम चाहते हैं लेफ्ट में हमारे पास यूएसडी आए और राइट में हमारे पास इंडिया है तो इन दोनों को हम सेलेक्ट करवाना चाहते हैं तो उसके लॉजिक के लिए हम एक वेरिएबल क्रिएट कर सकते हैं i इ 0 हमें पता है दो ही ड्रॉप डाउन है हमारे पास तो यहां पर बेसिकली या इनफैक्ट सिलेक्ट को आई बिलीव हमने कुछ ना कुछ आईडी दी होगी ये जो हमारा फर्स्ट सिलेक्ट है इसको हमने नेम दिया है फ्रॉम अच्छा फर्स्ट सिलेक्ट को नेम देना है फ्रॉम सेकंड सिलेक्ट को हम नेम देंगे टू तो यहां हम एक लॉजिक ऐड कर सकते हैं दैट इफ सिलेक्ट का जो नेम है दैट इज इक्वल टू फ्रॉम एंड अगर हमारा करेंसी का कोड इज इक्वल टू यूएसडी तो हम क्या करेंगे न्यू ऑप्शन के अंदर हम सिलेक्टेड को लिख देंगे एज सिलेक्टेड तो उस केस में अब हमें यूएसडी दिखाई देगा फ्रॉम के अंदर सेव किया रिफ्रेश किया हमारे पास यूएसडी आ गया इसी तरीके से राइट में अगर हम आईएनआर करना चाहते हैं तो एल्स और इस लॉजिक को कॉपी कर लेते हैं अगर सिलेक्ट का नेम टू है और करेंसी का कोड आईआर है तो हम उसे सेलेक्ट कर लेंगे सेव किया रिफ्रेश किया तो शुरुआत में जिसके साथ हम स्टार्ट करेंगे दैट विल बी यूएसडी टू आईआर कन्वर्जन उसके बाद हम चाहे तो कुछ भी चेंज कर सकते हैं आल्सो हम चाहते हैं कि जैसे ही कंट्री का नाम चेंज हो यानी यहां पर अगर हमने आईएनआर किया तो हमारे पास फ्लैग भी चेंज होना चाहिए तो हम एक नया फंक्शन बना लेते हैं कंस्ट इसको हम बोल देंगे अपडेट फ्लैग तो अपडेट फ्लैग के लिए एक फंक्शन बना लेते हैं तो हम चाहते हैं जब भी हमारा सिलेक्ट चेंज हो तो यहां लिख देते हैं सिलेक्ट पर हम एक इवेंट लिनर ऐड कर देंगे कि जब भी हमारा सिलेक्ट चेंज हो उस केस में हमारे पास इवेंट लिनस में इवेंट ऑब्जेक्ट होती है उस केस में हम अपडेट फ्लैग को कॉल लगाएंगे विद आवर इवेंट डॉट टारगेट टारगेट होता है बेसिकली जब भी हमने कुछ भी चेंज किया तो कहां पर चेंज आया वह हम अपडेट फ्लैग को पास कर देंगे तो यहां हमारे पास एलिमेंट आ जाएगा एलिमेंट शुरुआत में क्या करेंगे सिर्फ कसोल डलॉग करवा लेते हैं अपने एलिमेंट को सेव किया रिफ्रेश किया वी आल्सो हैव आवर इंस्पेक्ट विंडो तो कंसोल पे आ जाते हैं लेट्स सपोज हम यूएसडी से आई एनआर में चेंज करते हैं जैसे ही सिलेक्ट किया वैसे ही हमारे पास आ गया सिलेक्ट यानी हमने यहां पर चेंज किया है तो हमारे पास वोह एलिमेंट आ गया अब इस एलिमेंट के बेसिस पर हम कुछ भी चेंजेज कर सकते हैं तो सबसे पहले तो एलिमेंट से हम अपना करेंसी कोड एक्सट्रैक्ट करेंगे करेंसी कोड होगा हमारे एलिमेंट की वैल्यू करेंसी कोड को चाहे तो हम प्रिंट भी करवा सकते हैं सेव रिफ्रेश यहां अगर हम आईआर सिलेक्ट करते हैं तो हमारा करेंसी कोड होगा आईआर यहां अगर हमने यूरो सिलेक्ट किया तो करेंसी कोड विल बी ईआर करेंसी कोड हमारे पास सक्सेसफुली आ रहा है अब करेंसी कोड के बेसिस पर हमें बेसिकली अपनी नई इमेज लेकर आनी है करेंसी कोड से हम कंट्री कोड लेकर आएंगे कंट्री कोड क्या होगा कंट्री कोड होगा कंट्री लिस्ट के अंदर तो आई एनआर के लिए कंट्री कोड विल बी आई ए यूरो के लिए कंट्री कोड विल बी आई बिलीव यू इस तरीके से हमारे पास कंट्री कोड आ जाएगा और हमारा लिंक क्या होगा न्यू सोर्स लिंक हमारे पास होने वाला है इक्सड एटीएमएल लिख देते हैं कंट्री कोड इसे कर लेते हैं सेव एंड अपनी इमेज को कैसे एक्सेस करेंगे अभी एलिमेंट के अंदर हमारे पास क्या है एलिमेंट के अंदर हमारे पास सिलेक्ट है तो सिलेक्ट के अंदर इमेज कहां पर आती है यह हमारा सिलेक्ट है तो बेसिकली हमें सिलेक्ट के पैरेंट में जाना है जो हमारा सिलेक्ट का कंटेनर उसके अंदर हमें इमेज को जाकर सेलेक्ट करना है तो यहां पर जो हमारा एलिमेंट है उसके हम पेरेंट पर जाने वाले हैं यानी पेरेंट एलिमेंट पर जाएंगे एंड फिर पेरेंट एलिमेंट पर हम क्वेरी सिलेक्टर ऐड करने वाले हैं फॉर आवर इमेज तो हमारे पास इमेज आ जाएगी एंड इस इमेज के लिए तो लेट इमेज इज इक्वल टू दिस एंड इस इमेज के अंदर सोर्स को हम चेंज करके कर देंगे अपना न्यू सोर्स इतने पार्ट को कर लेते हैं सेव एंड रिफ्रेश तो एक बार यूएसडी से आईआर में कन्वर्ट कर करते हैं हमारा फ्लैग चेंज हो गया यूरो में कन्वर्ट करते हैं हमारा फ्लैग चेंज हो गया इफ वी कन्वर्टेड टू जपनीज न हमारा फ्लैग चेंज हो गया नेपाल रुपी फ्लैग चेंज हो गया तो इस तरीके से अब हम करेंसी को जैसे ही यहां पे दूसरी करेंसी को ही सिलेक्ट कर रहे हैं लेट्स सपोज आई सिलेक्ट केजीटी तो हमारा फ्लैग चेंज हो गया जीटी क हमारा फ्लैग चेंज हो गया एंड इस तरीके से हमारे पास डिफरेंट डिफरेंट फ्लैग्स अवेलेबल हो रहे हैं अब फ्लैग तो हमने चेंज कर लिया पर बेसिकली अब मुझे चाहिए कि मैं 100 यूएसडी को इफ आई वांट टू कन्वर्ट इट इन टू आईआर तो व किस तरीके से कन्वर्ट करेंगे तो गेट एक्सचेंज रेट पर जैसे ही क्लिक करें तो हमारे पास एक्सचेंज रेट आना चाहिए उस चीज पर हम काम करने वाले हैं तो हमारा जो बटन होगा उसे सेलेक्ट कर लेते हैं कंस्ट बटन इज इक्वल टू डॉक्यूमेंट डॉट क्वेरी सिलेक्टर हमारे पास हमारे फॉर्म का बटन आ जाएगा एंड इस बटन के ऊपर हम अपना इवन लिनर ऐड करेंगे भी काम होगा वो हम करवाएंगे तो अब इसे एक बार रिफ्रेश कर लेते हैं लेट्स रिमूव दिस पार्ट तो अब जैसे ही हम गेट एक्सचेंज रेट पर क्लिक करेंगे अब हमारे पास कोई भी चेंज नहीं हो रहा मतलब कुछ भी काम नहीं हो रहा तो सारे काम जो थे उनको हमने प्रिवेंट कर लिया है अब हमें जो काम करवाना है उसे हम करवाना स्टार्ट करेंगे सबसे पहले तो हमने जो भी अमाउंट एंटर की होगी चाहे वो 100 है वो वन है वो 1000 है उस अमाउंट को हम एक्सेस करने वाले हैं तो लेट अमाउंट इज इक्वल टू डॉक्यूमेंट डॉट क्वेरी सिलेक्टर अपने फॉर्म के अंदर से अपने इनपुट को हम चाहे तो एक्सेस कर सकते हैं नहीं तो य अपने डॉट अमाउंट से अपने इनपुट को एक्सेस कर लेंगे यह हमारे पास हमारी अमाउंट आ गई और अमाउंट की वैल्यू को भी हम प्रिंट करवा सकते हैं तो लेट अमाउंट वैल्यू इ इक्वल टू अमाउंट डॉट वैल्यू इसे चाहे तो कसोल डलॉग करवा सकते हैं हम अपनी अमाउंट वैल्यू को सेव किया रिफ्रेश किया जैसे ही फॉर्म सबमिट करेंगे अमाउंट वैल्यू हमारे पास आ गई अगर यहां पर मैंने 760 किया होता तो अमाउंट वैल्यू आ जाती 760 अच्छा यहां पर हम चाहते तो इसे खाली भी छोड़ सकते थे तो हमारे पास एमटी आती अमाउंट या हम चाहते तो -5 इस तरीके का कुछ कर सकते थे तो -5 आता तो उसके लिए हम एक कंडीशन ऐड कर सकते हैं कि अगर इफ माय अमाउंट वैल्यू इज एमटी या फिर हमारी जो अमाउंट वैल्यू है अगर वो लेस दन जीरो है या लेस दन वन लेस दन व कह देते हैं लेस दन वन है तो उस केस में ऑटोमेटिक हम क्या करेंगे अमाउंट वैल्यू को सेट कर देंगे टू वन एंड अमाउंट डॉट वैल्यू को भी सेट कर देंगे टू द स्ट्रिंग वन सेव किया रिफ्रेश किया अब यहां पर इफ आई राइट -5 और जैसे ही एंटर किया वो रिसेट हो जाएगा टूव अगर हमने यहां पर खाली छोड़ दिया तो दोबारा रिसेट हो जाएगा ू व ये एक चेंज हम छोटा सा यहां पर कर सकते हैं इनफैक्ट हम हम नंबर भी बना सकते हैं अपने इनपुट टाइप को अब यहां पर अपने लिए हम एक यूआरएल क्रिएट करेंगे लेट्स क्रिएट अ यूआरएल यूआरएल किससे क्रिएट करेंगे अपने इस बेस यूआरएल से तो हमारे पास हमारा बेस यूआरएल होगा एंड बेस यूआरएल के अंदर बेसिकली यह वाला जो पार्ट है यडी आ आड जसन वाला पार्ट इस पार्ट को हम हटा देते हैं एंड यहां हमें अपनी फ्रॉम वाली करेंसी लिखनी है स्लैश एंड फिर हमें अपनी ट वाली करेंसी लिखनी है डॉट जेसन हमें इस यूआरएल के ऊपर अच्छा यहां बेस यूआरएल भी एक वेरिएबल है तो बेसिकली हमें इस यूआरएल के ऊपर रिक्वेस्ट भेजनी है फेच जो एपीआई हम यूज करेंगे फेच एपीआई वो इस यूआरएल के ऊपर यूज करेंगे यहां पर फ्रॉम करेंसी एंड टू करेंसी को एक्सेस करने के लिए हम ऊपर एक्सेस कर लेते हैं कॉन्स्ट फ्रॉम करेंसी हमारे पास हो जाएगी डॉक्यूमेंट डॉट क्वेरी सिलेक्टर हम अपने फ्रॉम के अंदर से सिलेक्ट को एक्सेस कर रहे हैं एंड सेम चीज हो जाएगी टू करेंसी के लिए तो यहां टू करेंसी के लिए टू के अंदर से हम अपने सेलेक्ट को एक्सेस करेंगे तो ये हमारे पास फ्रॉम करेंसी आ जाएगी ये हमारे पास टू करेंसी आ जाएगी पहले हम चाहे तो कसोल डलॉग करवा सकते हैं अपनी फ्रॉम करेंसी एंड अपनी टू करेंसी की वैल्यू को इसे एक बार कमेंट आउट कर देते हैं सेव किया रिफ्रेश किया फॉर एग्जांपल अभी हमारे पास यूएसडी है यहां पर आईआर है जैसे ही गेट एक्सचेंज रेट किया ये हमारे फ्रॉम की वैल्यू आ गई ये टू की वैल्यू आ गई पर ये क्या है ये पूरा का पूरा एलिमेंट है हमें पूरा एलिमेंट नहीं चाहिए हमें तो इसकी वैल्यू चाहिए तो डॉट वैल्यू हमारे काम की चीज है सेव किया रिफ्रेश किया ये फ्रॉम यूएसडी टू आईआर जैसे ही किया यूएसडी आईआर आ गया अगर यहां पर आई वुड हैव डन एसआरडी तो यह एसआरडी आईआर आ गया तो इस तरीके से हमारी जो वैल्यू है उसे हमें एक्सेस करना है इसे कमेंट आउट कर देते हैं यहां पर आते हैं हम डॉट वैल्यू करेंगे इन फैक्ट शिफ डॉट वैल्यू भी नहीं करना हमारी जो वैल्यू है कैपिटल लेटर्स में आ रही है पर हमारी जो एपीआई है वो कैपिटल लेटर्स में वर्क नहीं करती वो स्मॉल लेटर्स में वर्क करेगी तो इसीलिए हमें इसे टू लोअर केस करना पड़ेगा जो स्ट्रिंग का मेथड हमने पढ़ा हुआ है ऑलरेडी टू लोअर केस एंड यही सेम चीज हम इस स्ट्रिंग के ऊपर करने वाले सेव किया इससे हमारे पास क्या आएगा इस यूआरएल पर जब रिक्वेस्ट भेजेंगे तो हमारे पास हमारा एक्सचेंज रेट आएगा तो लेट या जो भी रिस्पांस हमारे पास आता है रिस्पांस इ इक्वल टू फच को हम कॉल करेंगे विद आवर यूआरएल एंड अवेट यूज करने के लिए हमें क्या करना पड़ेगा इस फंक्शन को हमें सिंक बनाना पड़ेगा फंक्शन को सिंक बनाने के लिए हमें यहां लिखना पड़ेगा एंक सेव कर लेते हैं एंड अपने रिस्पांस को हम प्रिंट करवाएंगे कसोल डलॉग आ रिपस सेव रिफ्रेश गेट एक्सचेंज रेट किया हमारे पास कुछ रिस्पांस आया एपीआई में स्टेटस 200 है मतलब सारी चीजें अच्छे से वर्क कर रही है अब इस रिस्पांस से हमें इससे डटा पास करना पड़ेगा तो लेट डटा इज इक्वल टू अवेट रिंस डॉट जसन और हम क्या करेंगे अपने डाटा को प्रिंट करवाएंगे सेव किया रिफ्रेश किया गेट एक्सचेंज रेट एक्सचेंज रेट आ गया जिसमें डाटा है और हमारे पास हमारा एक्सचेंज रेट है एक्सचेंज रेट इज बेसिकली दिस वैल्यू अब यह वैल्यू कैसे एक्सेस करें जो हमारा रेट होगा लेट रेट विल बी डेटा के अंदर से जो भी हमारा टू वाली करेंसी है यानी टू वाली करेंसी यहां पर आईएनआर है इफ आई मेक इट लेट्स सपोज जपनीज ए तो इस बार टू वाली करेंसी क्या होगी जेपीवाई होगी तो जो भी हमारी टू वाली करेंसी है उसकी वैल्यू है उसे हम टू लोअर केस में अगर कन्वर्ट करें तो इस इंडेक्स पर बेसिकली इस की पर हमारा डाटा हमारा रेट अवेलेबल होगा तो फाइनली हम अपने सिर्फ जो एक्स चेंज रेट है उसे प्रिंट करवा सकते हैं सेव किया रिफ्रेश किया एक्सचेंज रेट क्या है 83 इफ आई डू जपनीज एन एक्सचेंज रेट क्या है 142 इफ आई डू ऑस्ट्रेलियन डॉलर एक्सचेंज रेट क्या है 1.49 तो इस तरीके से हमारे पास एक्सचेंज रेट्स आ जाएंगे जिसे हमें अमाउंट से मल्टीप्लाई करना है तो लेट फाइनल अमाउंट फाइनल अमाउंट क्या होगी इज इक्वल टू अमाउंट से हमें मल्टीप्लाई करना है अपने रेट को एंड दिस विल बी आवर फाइनल अमाउंट एंड इस फाइनल अमाउंट को हम कहां पर सेव करना चाहते हैं अपने मैसेज के अंदर उस मैसेज को ऊपर एक्सेस कर लेते हैं कंस्ट मैसेज इ इक्वल टू डॉक्यूमेंट डॉट क्वेरी सिलेक्टर यहां पर अपनी मैसेज क्लास से अपने डिव को हम एक्सेस कर सकते हैं दिस इज आर मैसेज और यहां पर मैसेज से या इन फैक्ट वी कैन क्रिएट अनदर फंक्शन वील कॉल इट कंस्ट अपडेट मैसेज या इनफैक्ट इस काम को यही कर लेते हैं क्योंकि हमारे पास बहुत सारे पैरामीटर्स होंगे जो हमें पास करने पड़ेंगे तो अपडेट मैसेज की जगह हम क्या करेंगे मैसेज का जो इनर टेक्स्ट है उसे अपडेट करके कर देंगे हम लिखना चाहते हैं न यूएसडी इ इक्वल टू 80 आई आर इस तरीके का हम कुछ मैसेज लिखना चाहते हैं तो उसमें वन की जगह हमारे पास अमाउंट आनी चाहिए तो यहां पर अमाउंट की वैल्यू आ जाएगी यूएसडी की जगह हमारे पास क्या आना चाहिए हमारे पास फ्रॉम करेंसी आनी चाहिए तो फ्रॉम करेंसी की वैल्यू हम यहां पर लिख देंगे 80 की जगह हमारे पास एक्सचेंज रेट आना चाहिए तो यहां एक्सचेंज रेट नहीं हमारी फाइनल अमाउंट आनी चाहिए फाइनल अमाउंट आ जाएगी एंड यहां पर हम लिख देंगे अपनी टू करेंसी टू करेंसी की वैल्यू इसे सेव कर लेते हैं एंड लेट्स रिफ्रेश इट अब एक बार चीजों को करना स्टार्ट करते हैं मुझे न यूएसडी को आईआर में कन्वर्ट करना है नॉट अ नंबर इट सेइंग फाइनल अमाउंट इज नॉट अ नंबर एक बार हमारे पास रेट क्या आया उसे एक बार प्रिंट करवा के देखते हैं व्हाट इज द रेट गोइंग टू बी एंड कंसोल डॉट लॉग करके व्हाट इज द अमाउंट गोइंग टू बी सेव रिफ्रेश अच्छा अमाउंट हमारे पास एलिमेंट आ रहा है तो यहां अमाउंट नहीं हमें अमाउंट की वैल्यू चाहिए सेव रिफ्रेश आई वांट टू कन्वर्ट वन यूएसडी टू आई गेट एक्सचेंज रेट अमाउंट वैल्यू इज नॉट डिफाइंड दिस इज एमटी आई बिलीव से एमटी वैल्यू हमने रखा है सेव किया रिफ्रेश किया दोबारा से न यूएसडी को आईआर में कन्वर्ट करना है दिस इज द एक्सचेंज रेट हमारे पास कन्वर्ट होके आ गया मुझे $ को आईएनआर में कन्वर्ट करना है तो इट इज 832 मुझे 1000 डॉलर्स को आईआर में कन्वर्ट करना है वह हमारे पास आ गया अगर हम लेट्स सपोज 1000 रुपी को यूरो में कन्वर्ट करना चाहते हैं तो 000 इ इक्व ट 10.9 यूरोज दिखा रहा है हम चाहे तो इंटरनेट पे सर्च कर सकते हैं 1000 आ2 यूरो कितना होता है इट इज 11 प समथिंग तो यहां दिखा रहा है 10 प समथिंग तो बेसिकली हमारी एपीआई में बिल्कुल लेटेस्ट अपडेटेड डाटा हमारे पास नहीं है बट नियर अबाउट मतलब सिमिलर डाटा है एपीआई का जो डाटा है हम डिफरेंट एपीआई यूज कर सकते हैं पर हमारी ऐप ऑलमोस्ट फंक्शनल है मतलब इफ आई कन्वर्ट इट इन टू ऑस्ट्रेलियन डॉलर तो 1000 आईआर इज 17.9 यूडी दिखा रहा है एंड इंटरनेट पे इट इज आल्सो 1.97 तो इट इज नियर अबाउट एक्यूरेट नॉट वेरी एक्यूरेट बट हां नियर अबाउट हमें मिल रहा है अपना एक्सचेंज रेट तो चीजें हमारे लिए सारी की सारी यहां पर वर्क कर रही है हमारी जो डिफॉल्ट अमाउंट है उसे हम 100 की जगह कैन आल्सो मेक इट इक्वल टू वन सो दैट इट बिकम सिंपलर आल्सो हम एक और चीज ऐड कर देते हैं कि जब फर्स्ट टाइम हमारा डॉक्यूमेंट लोड होगा तो हम अपने जो डॉक्यूमेंट है उस पर एक इवेंट लेसनर ऐड कर सकते हैं कि जब फर्स्ट टाइम हमारा डॉक्यूमेंट लोड होगा तो उस केस में हमें क्या चाहिए उस केस में हम अपने यह सारे काम बेसिकली करना चाहते हैं कि हम शुरुआत में ही एक जो हमारा डिफॉल्ट है यूएसडी टू आईआर कन्वर्जन उसके लिए चीजें दिखा चाहते हैं तो इतने पार्ट को कट करके वी कैन क्रिएट अनदर फंक्शन वी कैन कॉल इट अपडेट एक्सचेंज रेट एंड कंस्ट अपडेट एक्सचेंज रेट इज इक्वल टू दिस वैल्यू ी कैन मेक दिस फंक्शन ए सिंक एंड अब हमें इसको ए सिंक बनाने की जरूरत नहीं है तो बेसिकली यहां पर हम कॉल करेंगे अपने अपडेट एक्सचेंज रेट को इसको सेव कर लेते हैं तो जैसे ही हम हमारा पेज लोड हो वैसे ही हम अपने अपडेट एक्सचेंज रेट को कॉल करना चाहते हैं सेव किया रिफ्रेश किया तो शुरुआत में यह वैल्यू हमारे पास अपडेट होके आनी चाहिए थी अपडेट एक्सचेंज रेट व्हाट इज दिस एरर वी आर गेटिंग इंडिकेट वेदर टू य सारी चीजें हम रिमूव कर देते हैं एंड वी कैन आल्सो पुट दिस अपडेट एक्सचेंज रेट एट द टॉप ऑफ द पेज प्रोबेबली हियर एंड इवेंट लिसन को हम लास्ट में ऐड कर देते हैं सेव कर लिया रिफ्रेश किया ओके यह इवेंट लिसन इसलिए नहीं चल रहा क्योंकि हमें विंडो पर ऐड करना है अपना रिफ्रेश किया तो इस बार शुरुआत में ही हमारे पास अपडेट होके आ रही है वैल्यूज अब कुछ कुछ एग्जांपल्स है जिन पर हम रन कर सकते हैं अपने कोड को फॉर एग्जांपल आई वांट टू कन्वर्ट ₹ इंडियन रुपीज इनटू नेपाली रुपी तो यह हमारे पास कन्वर्जन होकर आ गया 100 इंडियन र पी को इफ आई वांट टू कन्वर्ट इट इन टू जपनीज न तो हमारे पास कन्वर्जन आ गया इफ आई वांट टू कन्वर्ट 100 यूएस डॉल टू जपनीज एन या ऑस्ट्रेलियन डॉलर तो ये हमारे पास कन्वर्जन आ गया तो हमारा जो करेंसी कन्वर्टर है वो हमारे लिए कंप्लीट काम कर रहा है हम चाहे तो एक दो स्टाइल के अंदर इसको और ज्यादा बेटर स्टाइलिश बना सकते हैं और इसके अंदर कुछ चेंजेज कर सकते हैं टू मेक इट इंप्रूव्ड टू मेक इट बेटर बट जो हमारा बेसिक कोड था बेसिक लेआउट था उसको हमने प्रिपेयर कर लिया एंड इस तरीके से हमने एक मिनी प्रोजेक्ट बना लिया है यूजिंग आवर एपीआई एंड यूजिंग ऑल द थिंग्स रिलेटेड टू डोम रिलेटेड टू स्ट्रिंग्स रिलेटेड टू अरेज जिनको हमने अपने जावास्क्रिप्ट की सीरीज के अंदर सीखा है तो आई होप कि इस पूरी सीरीज को फॉलो करने में हमें बहुत सारा मजा आया होगा हमने काफी सारी इंटरेस्टिंग और नई चीजें सीखी होंगी जावास्क्रिप्ट के अंदर मेजर जो कॉन्सेप्ट्स होते हैं हमारे फ्रंट एंड के उनको हमने कवर कर लिया है उसके बाद हम चाहें तो अब जाकर जावास्क्रिप्ट के अंदर नोट जेस को एक्सप्लोर कर सकते हैं बैक एंड को एक्सप्लोर कर सकते हैं रिएक्ट जेस को सीख सकते हैं बहुत सारी इनफैक्ट अनलिमिटेड चीजें हैं जावास्क्रिप्ट के अंदर सीखने के लिए उन्हें जाकर हम चाहे तो एक्सप्लोर कर सकते हैं तो अब फाइनली हमारी जो सीरीज है वह कंप्लीट हो गई है आज के नोट्स या आज का कोड आपको नीचे डिस्क्रिप्शन बॉक्स के अंदर मिल जाएगा कैसा लगा आपको मेरे साथ जावास्क्रिप्ट सीखना उसके बारे में आप मुझे नीचे कमेंट करके बता सकते हैं यू कैन आल्सो टेल मी ऑन लिंकन आज के लिए इतना ही मिलते हैं नेक्स्ट वीडियो में टिल देन कीप लर्निंग एंड कीप कोडिंग