फ्रंट-एंड डेवलपर साक्षात्कार प्रश्न

फ्रंट-एंड डेवलपर साक्षात्कार प्रश्न

विषय-सूची

  1. सामान्य सवाल
  2. एच.टी.एम्.एल के प्रश्न
  3. सीएसएस के प्रश्न
  4. जेएस के प्रश्न
  5. परीक्षण के प्रश्न
  6. प्रदर्शन के प्रश्न
  7. नेटवर्क के प्रश्न
  8. कोडिंग के प्रश्न
  9. मजेदार सवाल

अपना योगदान कैसे दे?

  1. योगदानकर्ता
  2. योगदान कैसे दें?
  3. अनुज्ञाप‍त्र

[⬆] सामान्य सवाल:

  • क्या आपने कल/इस हफ्ते कुछ सीखा?
  • कौन सी चीजें आपको कोडिंग में आकर्षित करती हैं?
  • क्या आपने हाल ही में एक तकनीकी चुनौती का सामना किया है और आपने उसे कैसे हल किया?
  • एक नई वेबसाइट बनाते समय या पुरानी वेबसाइट को बनाए रखने के दौरान, क्या आपने प्रदर्शन को बढ़ाने के लिए कुछ तकनीकों का उपयोग किया है? कैसे?
  • क्या आप कुछ SEO की सर्वश्रेष्ठ प्रथाओं या तकनीकों की व्याख्या कर सकते हैं, जो आपने हाल ही में उपयोग की हैं?
  • फ्रंट-एंड सुरक्षा के संदर्भ में सामान्य तकनीकों या हाल के मुद्दों के समाधान के बारे में क्या व्याख्या कर सकते हैं?
  • आपने अपने कोड की अनुरक्षणयोग्यता बढ़ाने के लिए हाल के परियोजनाओं में क्या कदम उठाए हैं?
  • अपने पसंदीदा विकास वातावरण के बारे में बात करें।
  • आप किस संस्करण नियंत्रण प्रणालियों को जानते हैं?
  • जब आप एक वेब पेज बनाते हैं, तो आप किस प्रकार की वर्कफ़्लो का पालन करते हैं?
  • यदि आपके पास 5 विभिन्न स्टाइलशीट्स हैं, तो आप उन्हें साइट में कैसे सर्वश्रेष्ठ रूप से एकत्र करेंगे?
  • प्रगति वृद्धि और सौशीलता के बीच अंतर का वर्णन कैसे करेंगे?
  • वेबसाइट के संपत्ति/संसाधनों को आप कैसे अनुकूलित करेंगे?
  • दिए गए डोमेन से ब्राउज़र कितने संसाधन एक समय में डाउनलोड करेगा?
    • इसके अपवाद क्या हैं?
  • पृष्ठ लोड कम (प्राप्त या वास्तविक लोड समय) कैसे कम करेंगे? या कम करने के लिए कितने संसाधन उपयोग करेंगे?
  • यदि आप किसी परियोजना पर जुड़ जाते हैं और वह टैब्स का उपयोग करते हैं और आप अंतर्णितियों का उपयोग करते हैं, तो आप क्या करेंगे?
  • सामान्य स्लाइडशो पेज कैसे बनाएंगे? इसका विवरण दें।
  • अगर आप इस साल एक प्रौद्योगिकी को मास्टर कर सकते हैं, तो वह कौन सी होगी?
  • मानकों और मानकों के निकायों का महत्व समझाएं।
  • FOUC क्या है? FOUC से कैसे बचा जा सकता है?
  • ARIA और स्क्रीन रीडर क्या हैं, और एक वेबसाइट को पहुंचनीय बनाने के लिए कैसे इस्तेमाल करें?
  • CSS एनीमेशन और जावास्क्रिप्ट एनीमेशन के बीच कुछ फायदे और नुकसान समझाएं।
  • CORS का क्या मतलब है और यह किस समस्या का समाधान करता है?
  • आपने अपने बॉस या सहयोगी के साथ मतभिन्नता का सम्मुख कैसे किया?
  • आपने नवीनतम फ्रंट एंड विकास और डिज़ाइन के बारे में जानने के लिए कौन-कौन से संसाधनों का उपयोग किया है?
  • एक अच्छे फ्रंट-एंड डेवलपर बनने के लिए कौन-कौन सी कौशल जरूरी हैं?
  • आप खुद को किस भूमिका में देखते हैं?
  • कुकी, सत्र संग्रहण और स्थानीय संग्रहण के बीच का अंतर समझाएं?
  • जब आप ब्राउज़र में URL दर्ज करते हैं, तो क्या होता है?
  • SSR और CSR के बीच अंतर बताएं। पक्ष-विपक्ष पर चर्चा करें.
    • क्या आप स्थैतिक प्रतिपादन से परिचित हैं?
    • पुनर्जलीकरण?

[⬆] एच.टी.एम्.एल के प्रश्न:

  • doctype क्या काम करता है?
  • किस प्रकार से एक पेज को कई भाषाओं में सामग्री के साथ सेव किया जा सकता है?
  • बहुभाषिक साइटों के डिज़ाइन या विकसित करते समय आपको किस प्रकार की चीजों से सावधान रहना चाहिए?
  • data- आवश्यकताओं के लिए अच्छे हैं?
  • HTML5 को एक खुले वेब प्लेटफ़ॉर्म के रूप में कैसे देखा जा सकता है। HTML5 के निर्माण तत्व क्या हैं?
  • cookie, sessionStorage, और localStorage के बीच का अंतर कैसे समझाएं?
  • <script>, <script async> और <script defer> के बीच का अंतर क्या है?
  • सामान्यत: <head></head> और JS <script> के बीच CSS <link> को स्थित करने का उद्देश्य है?
    • क्या आपको किसी अपवाद का पता है?
  • प्रगतिशील प्रदर्शन क्या है?
  • आप एक छवि टैग में srcset आवश्यकता होती है, इस आवश्यकता की अनुमानित सामग्री का मूल्यांकन करते समय ब्राउज़र का काम कैसे करता है?
  • क्या आपने पहले कभी विभिन्न HTML प्रारूपन भाषाओं का उपयोग किया है?
  • canvas और svg के बीच का अंतर समझाएं?
  • HTML में खाली तत्व क्या होते हैं?

[⬆] CSS प्रश्न:

  • CSS चयनक्रम (selector specificity) क्या है और यह कैसे काम करता है?
  • “रिसेटिंग” और “नॉर्मलाइजिंग” CSS के बीच क्या अंतर है? आप किसे चुनेंगे, और क्यों?
  • Floats का वर्णन करें और ये कैसे काम करते हैं.
  • z-index का वर्णन करें और स्टैकिंग संदर्भ (stacking context) कैसे बनता है?
  • BFC (Block Formatting Context) का वर्णन करें और यह कैसे काम करता है?
  • विभिन्न क्लियरिंग (clearing) तकनीकों का वर्णन करें और कौनसे संदर्भ में कौनसा उपयुक्त है?
  • ब्राउज़र-विशिष्ट स्टाइलिंग समस्याओं को ठीक करने के लिए आप कैसे उपाय करेंगे?
  • विशेषत: ब्राउज़र-सीमित सुविधाओं वाले ब्राउज़रों के लिए अपने पेज को कैसे प्रस्तुत करेंगे?
  • आप कौनसे तकनीक/प्रक्रिया का उपयोग करते हैं?
  • सामग्री (content) को दृश्यमान तरीके से छिपाने और उसे केवल स्क्रीन रीडर्स के लिए ही उपलब्ध कैसे कर सकते हैं?
  • क्या आपने कभी ग्रिड सिस्टम का उपयोग किया है, और ऐसा करते समय आपकी पसंद क्या है?
  • क्या आपने मीडिया क्वेरीज़ या मोबाइल विशिष्ट लेआउट/CSS का अनुमान लगाया या अमल किया है?
  • क्या आप SVG को स्टाइल देने में परिचित हैं?
  • क्या आप एक @media गुण का उदाहरण दे सकते हैं, screen के अलावा?
  • लेखन एफिशिएंट CSS लिखने के लिए कुछ “गॉच्या” क्या हैं?
  • CSS प्रीप्रोसेसर का उपयोग करने और न करने के फायदे/नुकसान क्या हैं?
  • आपने जो CSS प्रीप्रोसेसर्स का उपयोग किया है, उन्हें आप क्या पसंद और नापसंद करते हैं?
  • एक वेब डिज़ाइन कॉम्प में गैर-मानक फॉन्ट्स का उपयोग कैसे करेंगे?
  • ब्राउज़र कैसे तय करता है कि कौन-कौन से तत्व CSS चयनक्रम से मेल खाते हैं?
  • जाल प्रतितत्वों (pseudo-elements) का वर्णन करें और उन्हें किस तरह का उपयोग किया जाता है.
  • बॉक्स मॉडल के बारे में आपकी समझ क्या है और आप ब्राउज़र को CSS में अपने लेआउट को विभिन्न बॉक्स मॉडल में दिखाने के लिए कैसे कहेंगे?
  • { box-sizing: border-box; } क्या काम करता है? इसके क्या फायदे हैं?
  • CSS display गुण क्या होता है और आप इसका उपयोग करने का कुछ उदाहरण दे सकते हैं?
  • इनलाइन और इनलाइन-ब्लॉक के बीच अंतर क्या है?
  • “nth-of-type()” और “nth-child()” चयनकर्ताओं के बीच अंतर क्या है?
  • एक सापेक्ष, स्थायी, अब्सोल्यूट और स्थितिगत रूप से पोज़ीशन किए गए तत्वों के बीच अंतर क्या है?
  • क्या किसी क्षेत्र-सीमित ब्राउज़र के लिए अपने पेज को प्रस्तुत करने के लिए आप कैसे सेव करते हैं?
  • क्या आपने कभी रेटिना ग्राफ़िक्स के साथ काम किया है? अगर हां, तो कब और कौन सी तकनीक का उपयोग किया गया था?
  • क्या कोई कारण है कि आप अब्सोल्यूट पोज़िशनिंग के बजाय translate() का उपयोग करना चाहेंगे, या उम्र-विपणी, और क्यों?
  • क्लियरफिक्स CSS गुण का उपयोग कैसे किया जाता है?
  • कैसे px, em और rem के बीच फॉन्ट आकार से संबंधित है, उनके अनुसार उदाहरण दे सकते हैं?
  • क्या आप किसी pseudo class का उदाहरण दे सकते हैं? क्या आप एक pseudo class का उपयोग का किसी उदाहरण का स्थान दे सकते हैं?
  • एक ब्लॉक स्तरीय तत्व और इनलाइन स्तरीय तत्व के बीच अंतर क्या है. क्या आप हर प्रकार के तत्वों के उदाहरण दे सकते हैं?
  • CSS ग्रिड और फ्लेक्सबॉक्स (Flexbox) के बीच अंतर को समझाएं? आप कब किसे प्राथमिकता देंगे?

[⬆] JS प्रश्न:

  • घटना अवलेपन (event delegation) को समझाएं।
  • JavaScript में this कैसे काम करता है, इसका विवरण करें।
  • क्या आप एक ऐसे तरीके का उदाहरण दे सकते हैं जिसमें ES6 में this का उपयोग करने का तरीका बदल गया है?
  • प्रोटोटाइपल इनहेरिटेंस (prototypal inheritance) कैसे काम करता है, इसका विवरण करें।
  • ‘null’, ‘undefined’ या undeclared ऐसी एक चर (variable) के बीच क्या अंतर है?
  • आप इन स्थितियों की जांच कैसे करेंगे?
  • एक क्लोज़र क्या है, और आप इसका उपयोग कैसे/क्यों करेंगे?
  • आप ऑब्जेक्ट की प्रॉपर्टीज़ और एरे आइटम्स को इटरेट करने के लिए कौन-कौन सी भाषा निर्माण का उपयोग करते हैं?
  • ‘Array.forEach()’ लूप और ‘Array.map()’ में मुख्य अंतर को कैसे वर्णित करें और आप इनमें से किसे और क्यों चुनेंगे?
  • एनोनिमस फ़ंक्शन्स के लिए एक सामान्य उपयोग केस क्या हो सकता है?
  • ‘होस्ट ऑब्जेक्ट्स’ और ‘नेटिव ऑब्जेक्ट्स’ के बीच क्या अंतर है?
  • ‘function Person() {}’, ‘var person = Person()’, और ‘var person = new Person()’ के उपयोग के बारे में विवाद क्या है?
  • ‘function foo() {}’ और ‘var foo = function() {}’ के बीच ‘foo’ के उपयोग के विभिन्नताओं का विवरण करें
  • ‘Function.call’ और ‘Function.apply’ क्या काम करते हैं? इन दोनों के बीच क्या महत्वपूर्ण अंतर है?
  • ‘Function.prototype.bind’ का विवरण करें।
  • फीचर डिटेक्शन (feature detection), फीचर इनफरेंस (feature inference), और UA स्ट्रिंग का उपयोग करने के बीच क्या अंतर है?
  • ‘होइस्टिंग’ का विवरण करें।
  • टाइप कोएर्शन क्या है? JavaScript कोड में टाइप कोएर्शन पर भरपूर निर्भरता की सामान्य चूकें क्या होती हैं?
  • घटना बबलिंग (event bubbling) को समझाएं।
  • घटना कैप्चरिंग (event capturing) को समझाएं।
  • ‘एट्रिब्यूट’ और ‘प्रॉपर्टी’ के बीच क्या अंतर है?
  • बिल्ट-इन JavaScript ऑब्जेक्ट्स को विस्तारित करने के फायदे और नुकसान क्या हैं?
  • ‘==’ और ‘===’ के बीच क्या अंतर है?
  • JavaScript के संदर्भ में सेम-आरिजिन पॉलिसी (same-origin policy) को समझाएं।
  • इसे ‘टर्नरी ऑपरेटर’ क्यों कहा जाता है, ‘टर्नरी’ शब्द का क्या मतलब है?
  • स्ट्रिक्ट मोड क्या है? इसके प्रयोग करने के कुछ फायदे/हानियां क्या हैं?
  • JavaScript कोड को JavaScript में कंपाइल करने वाली भाषा में लिखने के कुछ फायदे/हानियां क्या हैं?
  • JavaScript कोड को डिबग करने के लिए आप कौन-कौन से उपकरण और तकनीकों का उपयोग करते हैं?
  • परिवर्तनशील और अपरिवर्तनशील ऑब्जेक्ट्स के बीच क्या अंतर है?
  • JavaScript में एक अपरिवर्तनशील ऑब्जेक्ट का एक उदाहरण क्या है?
  • अपरिवर्तनशीलता के फायदे और नुकसान क्या हैं?
  • आप अपने कोड में अपरिवर्तनशीलता कैसे प्राप्त कर सकते हैं?
  • सिंक्रोनस और एसिंक्रोनस फ़ंक्शन्स के बीच क्या अंतर है?
  • घटना लूप (event loop) क्या है?
  • कॉल स्टैक और टास्क क्यू के बीच क्या अंतर है?
  • ‘let’, ‘var’, या ‘const’ का उपयोग करके बनाई गई चरों (variables) के बीच क्या अंतर है?
  • ES6 क्लास और ES5 फ़ंक्शन कंस्ट्रक्टर्स के बीच क्या अंतर है?
  • नए ऐरो => फ़ंक्शन सिंटैक्स के एक उपयोग केस प्रदान कर सकते हैं? इस नए सिंटैक्स का विभिन्नता अन्य फ़ंक्शन्स से क्या है?
  • एक कंस्ट्रक्टर में एक मेथड के लिए ऐरो सिंटैक्स का उपयोग करने के क्या फायदे हैं?
  • उच्च-क्रम फ़ंक्शन (higher-order function) की परिभाषा क्या है?
  • कृपया एक ऑब्जेक्ट या एक एरे को डिस्ट्रक्चर (destructuring) करने का एक उदाहरण दे सकते हैं?
  • क्या आप ES6 टेम्पलेट लिटरल्स का उपयोग करके एक स्ट्रिंग उत्पन्न करने का एक उदाहरण दे सकते हैं?
  • क्या आप करी फ़ंक्शन का एक उदाहरण और इस सिंटैक्स के फ़ायदे के बारे में बता सकते हैं?
  • ‘spread सिंटैक्स’ का उपयोग करने के फ़ायदे क्या हैं और यह ‘rest सिंटैक्स’ से कैसे अलग है?
  • फ़ाइलों के बीच कोड साझा कैसे किया जा सकता है?
  • आपको स्टेटिक क्लास सदस्य (static class members) बनाने की क्या आवश्यकता हो सकती है?
  • ‘while’ और ‘do-while’ लूप्स के बीच क्या अंतर है?
  • एक प्रॉमिस (promise) क्या होता है? कहाँ और कैसे आप प्रॉमिस का उपयोग करेंगे?
  • JavaScript के साथ कोडिंग करते समय ऑब्जेक्ट ओरिएंटेड प्रोग्रामिंग (Object Oriented Programming) के सिद्धांतों का उपयोग करने की बात करें।

[⬆] < a name = ‘code-questions’ >कोडिंग प्रश्न</ a >

  • इसे काम में लाओ:
  duplicate([1,2,3,4,5]); // [1,2,3,4,5,1,2,3,4,5]
  • 3 के गुणकों पर “fizz”, 5 के गुणकों पर “buzz”, और 3 और 5 के गुणकों पर “fizzbuzz” निकालने के लिए 100 तक चलने वाला एक for लूप बनाओ |
  • निम्नलिखित में से प्रत्येक का क्या उत्पन्न होगा?
console.log("hello" || "world")
console.log("foo" && "bar")
  • तुरंत आवाजित किया जाने वाला फ़ंक्शन एक्सप्रेशन (IIFE) लिखें|

[⬆] परीक्षण के प्रश्न

  • अपने कोड के परीक्षण के कुछ फायदे / नुकसान क्या हैं?
  • आप अपने कोड की कार्यक्षमता का परीक्षण करने के लिए किन उपकरणों का उपयोग करेंगे?
  • एक इकाई परीक्षण और एक कार्यात्मक / एकीकरण परीक्षण के बीच अंतर क्या है?
  • कोड स्टाइल लिंटिंग टूल का उद्देश्य क्या है?
  • कुछ टेस्टिंग सर्वोत्तम प्रथाएँ क्या हैं?

[⬆] प्रदर्शन के प्रश्न

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

[⬆] नेटवर्क के प्रश्न

  • परंपरागत रूप से, कई डोमेन से साइट की संपत्ति की सेवा करना बेहतर क्यों रहा है?
  • जब आप किसी वेबसाइट के यूआरएल टाइप करते हैं, तो उस प्रक्रिया का वर्णन करें (शुरुवात से जब तक वह स्क्रीन पर लोड करती है)|
  • लॉन्ग-पोलिंग, वेबसोकेट और सर्वर-सेंट इवेंट के बीच अंतर क्या हैं?
  • निम्नलिखित अनुरोध और प्रतिक्रिया शीर्षकों की व्याख्या करें:
    • Expires, Date, Age एवं If-Modified- में क्या अंतर है|
    • Do Not Track
    • Cache-Control
    • Transfer-Encoding
    • ETag
    • X-Frame-Options
  • HTTP के क्या तरीके हैं? उन सभी HTTP तरीकों को सूचीबद्ध करें जिन्हें आप जानते हैं, और उन्हें समझाएं।
  • डोमेन प्री-फेचिंग क्या है और यह प्रदर्शन में कैसे मदद करता है?
  • सीडीएन क्या है और इसका उपयोग करने से क्या लाभ है?

[⬆] मजेदार सवाल:

  • आपने हाल ही में किस मज़ेदार परियोजना पर काम किया है?
  • आपके द्वारा उपयोग किए जाने वाले डेवलपर टूल के बारे में अपनी कुछ पसंदीदा बातें बताएं|
  • फ्रंट-एंड समुदाय में आपको कौन प्रेरित करता है?
  • क्या आपने कोई व्यक्तिगत परियोजनाएं बनाई है? अगर हां, तो किस प्रकार की बनाई है उसका वर्णन करें?