Express.js (या "एक्सप्रेस") एक NodeJS वेब ढांचा है जिसका उपयोग वेबसाइटों और वेब अनुप्रयोगों के बैक-एंड (या सर्वर-साइड) पर किया जाता है। एक्सप्रेस लचीला और न्यूनतर है, जिसका अर्थ है कि इसमें अनावश्यक पुस्तकालयों और पैकेजों का व्यापक संग्रह नहीं है, न ही यह निर्धारित करता है कि आपको अपना आवेदन कैसे बनाना चाहिए।
एक्सप्रेस फ्रेमवर्क एपीआई बनाता है जो HTTP अनुरोधों और प्रतिक्रियाओं के माध्यम से संचार की सुविधा प्रदान करता है। एक्सप्रेस के बारे में उल्लेखनीय चीजों में से एक यह है कि यह डेवलपर्स को अपने प्रत्येक ऐप के तरीकों से जुड़े अनुरोधों और प्रतिक्रियाओं पर पूर्ण नियंत्रण देता है।
इस ट्यूटोरियल में, आप सीखेंगे कि आपको अपनी परियोजनाओं में एक्सप्रेस का उपयोग कैसे और क्यों करना चाहिए।
अपने प्रोजेक्ट में एक्सप्रेस इंस्टाल करना
इससे पहले कि आप एक्सप्रेस ढांचे का उपयोग कर सकें, आपको इसे अपनी परियोजना निर्देशिका में स्थापित करना होगा। यह एक सीधी प्रक्रिया है कि NodeJS और npm की आवश्यकता है.
पहली चीज़ जो आपको करने की ज़रूरत है वह है a. बनाना पैकेज.जेसन फ़ाइल (आपकी परियोजना निर्देशिका/फ़ोल्डर के भीतर) निम्न आदेश का उपयोग कर:
npm init
ऊपर दिए गए कमांड को निष्पादित करने से एक प्रक्रिया शुरू होगी जो आपको निम्नलिखित इनपुट के लिए संकेत देगी:
- पैकेज का नाम
- संस्करण
- विवरण
- प्रवेश बिंदु
- टेस्ट कमांड
- कीवर्ड
- लेखक
- लाइसेंस
पैकेज का नाम, संस्करण, प्रवेश बिंदु, और लाइसेंस फ़ील्ड सभी में डिफ़ॉल्ट मान होते हैं जिन्हें आप अपने मान प्रदान करके आसानी से ओवरराइड कर सकते हैं। हालाँकि, यदि आप डिफ़ॉल्ट मान रखना चाहते हैं तो आप इसके बजाय निम्न कमांड का उपयोग कर सकते हैं:
npm init -y
ऊपर दिए गए कमांड को निष्पादित करने से निम्नलिखित उत्पन्न होंगे पैकेज.जेसन अपनी परियोजना निर्देशिका में फ़ाइल करें:
{
"नाम": "मायएप",
"संस्करण": "1.0.0",
"विवरण": "",
"मुख्य": "index.js",
"स्क्रिप्ट": {
"परीक्षण": "गूंज \"त्रुटि: कोई परीक्षण निर्दिष्ट नहीं\" && बाहर निकलें 1"
},
"कीवर्ड": [],
"लेखक": "",
"लाइसेंस": "आईएससी",
}
अब आप निम्न आदेश का उपयोग करके एक्सप्रेस स्थापित कर सकते हैं:
npm एक्सप्रेस स्थापित करें --save
एक्सप्रेस स्थापित करने से a. उत्पन्न होगा पैकेज-lock.json फ़ाइल के साथ-साथ a नोड_मॉड्यूल फ़ोल्डर।
package.json फ़ाइल को समझना
कारण आपको बनाने की आवश्यकता है a पैकेज.जेसन एक्सप्रेस स्थापित करने से पहले फ़ाइल यह है कि पैकेज.जेसन फ़ाइल एक भंडार के रूप में कार्य करती है, आपके बारे में महत्वपूर्ण मेटाडेटा संग्रहीत करती है नोडजेएस प्रोजेक्ट्स।निर्भरता इन मेटाडेटा क्षेत्रों में से एक का नाम है, और एक्सप्रेस है a निर्भरता.
अपनी परियोजना निर्देशिका में एक्सप्रेस को स्थापित करने से स्वचालित रूप से आपका अपडेट हो जाएगा पैकेज.जेसन फ़ाइल।
अपडेट किया गया package.json फ़ाइल
{
"नाम": "मायएप",
"संस्करण": "1.0.0",
"विवरण": "",
"मुख्य": "index.js",
"स्क्रिप्ट": {
"परीक्षण": "गूंज \"त्रुटि: कोई परीक्षण निर्दिष्ट नहीं\" && बाहर निकलें 1"
},
"कीवर्ड": [],
"लेखक": "",
"लाइसेंस": "आईएससी",
"निर्भरता": {
"एक्सप्रेस": "^4.17.1"
}
}
अब आपके पास एक "निर्भरता" फ़ील्ड है जिसमें एक निर्भरता है - एक्सप्रेस। और यह निर्भरता ऑब्जेक्ट सॉफ़्टवेयर को संग्रहीत करता है जिस पर आपका प्रोजेक्ट सही ढंग से कार्य करने के लिए निर्भर करता है, जो इस मामले में एक्सप्रेस फ्रेमवर्क है।
एक्सप्रेस के साथ एक सर्वर बनाना
एक एपीआई होना जो डेटा के भंडारण और आंदोलन को संभालता है, किसी भी पूर्ण-स्टैक एप्लिकेशन के लिए एक आवश्यकता है, और एक्सप्रेस सर्वर निर्माण प्रक्रिया को तेज और आसान बनाता है।
पीछे मुड़कर देखें पैकेज.जेसन ऊपर फ़ाइल करें और आपको "मुख्य" फ़ील्ड दिखाई देगी। यह फ़ील्ड आपके आवेदन के प्रवेश बिंदु को संग्रहीत करती है, जो कि ऊपर दिए गए उदाहरण में "index.js" है। जब आप अपने एप्लिकेशन को निष्पादित करना चाहते हैं (या इस उदाहरण में, सर्वर जिसे आप बनाने जा रहे हैं), तो आपको निष्पादित करना होगा index.js निम्न आदेश का उपयोग कर फ़ाइल:
नोड index.js
हालाँकि, इससे पहले कि आप निष्पादन के चरण में पहुँचें, आपको इसे बनाने की आवश्यकता होगी index.js (या सर्वर ऐप) फ़ाइल को अपनी प्रोजेक्ट निर्देशिका में रखें।
index.js फ़ाइल बनाना
कॉन्स्ट एक्सप्रेस = आवश्यकता ('एक्सप्रेस');कॉन्स्ट ऐप = एक्सप्रेस ();
कास्ट पोर्ट = 5000;app.get('/', (req, res) => {
res.send ('आपका सर्वर चालू है')
})
app.listen (पोर्ट, () => {
कंसोल.लॉग (`सर्वर यहां चल रहा है: http://localhost:${port}`);
})
उपरोक्त फ़ाइल एक्सप्रेस आयात करती है और फिर एक्सप्रेस एप्लिकेशन बनाने के लिए इसका उपयोग करती है। एक्सप्रेस एप्लिकेशन तब तक पहुंच प्रदान करता है प्राप्त तथा सुनना तरीके जो एक्सप्रेस मॉड्यूल का एक हिस्सा हैं। ऐप.सुनो () विधि वह पहली है जिसे आपको सेट अप करने की आवश्यकता है। इसका उद्देश्य होस्ट कंप्यूटर के एक विशिष्ट पोर्ट पर कनेक्शन की सूची बनाना है, जो है पोर्ट 5000 ऊपर के उदाहरण में।
का उद्देश्य ऐप.गेट () विधि एक विशिष्ट संसाधन से डेटा प्राप्त करने के लिए है। इस विधि में दो तर्क हैं: पथ और कॉलबैक फ़ंक्शन। ऊपर के उदाहरण में पथ तर्क में एक फ़ॉरवर्ड स्लैश है जो मूल स्थिति का प्रतिनिधित्व करता है। इसलिए, पर नेविगेट करना http://localhost: 5000 URL (जो आपके आवेदन का मूल है), जबकि ऊपर आपका index.js ऐप चल रहा है, आपके ब्राउज़र में निम्न आउटपुट देगा:
ऐप.गेट () विधि कॉलबैक फ़ंक्शन उपरोक्त आउटपुट उत्पन्न करता है। इस कॉलबैक फ़ंक्शन के दो तर्क हैं- अनुरोध और प्रतिक्रिया। प्रतिक्रिया (जो है रेस ऊपर के उदाहरण में) HTTP ऑब्जेक्ट है जिसे एक एक्सप्रेस ऐप HTTP अनुरोध के बाद भेजता है (जो आप अपने ब्राउज़र में ऊपर URL टाइप करके करते हैं)।
अपने एक्सप्रेस सर्वर के साथ एक स्थिर वेबसाइट की सेवा
सर्वर एपीआई के विकास में एक महत्वपूर्ण भूमिका निभाते हैं जो गतिशील डेटा को स्टोर और ट्रांसफर करने में मदद करते हैं, और यही वह जगह है जहां आप अपनी परियोजनाओं में एक्सप्रेस सर्वर का उपयोग कर सकते हैं।
हालाँकि, एक एक्सप्रेस सर्वर स्थिर फ़ाइलों की सेवा भी कर सकता है। उदाहरण के लिए, यदि आप एक स्थिर वेबसाइट बनाना चाहते हैं (जैसे कि एक व्यक्तिगत ट्रेनर, एक जीवन कोच, या एक स्टाइलिस्ट के लिए), तो आप वेबसाइट को होस्ट करने के लिए अपने एक्सप्रेस सर्वर का उपयोग कर सकते हैं।
एक स्टेटिक HTML वेबसाइट उदाहरण
व्यक्तिगत स्टाइलिस्ट वेबसाइट घर
स्वागत
लोरेम इप्सम डोलर सिट एमेट, कॉन्सेक्टेटूर एडिपिसिसिंग एलीट। पॉसीमस रेरम ऑफ़िसिया क्विबसडैम मोलिटिया डेज़रुंट एनिमी सॉल्यूटा लॉडेंटियम। क्वाम सेपिएंट ए डोलोरम मैग्नम नेसिटाटिबस क्विस टेम्पोर फेसरे टोटम। डोलर, अनुक्रम भेद!
सेवाएं देखें
ऊपर दिया गया HTML कोड निम्नलिखित style.css फ़ाइल से लिंक करके एक व्यक्तिगत स्टाइलिस्ट वेबसाइट का एक सुखद स्थिर होम पेज बनाता है:
*{
मार्जिन: 0;
पैडिंग: 0;
बॉक्स-साइज़िंग: बॉर्डर-बॉक्स;
}तन {
फ़ॉन्ट-फ़ैमिली: 'लाटो', सेन्स-सेरिफ़;
लाइन-ऊंचाई: 1.5;
}ए {
रंग: #333;
पाठ-सजावट: कोई नहीं;
}उल {
सूची-शैली: कोई नहीं;
}पी {
मार्जिन: .5rem 0;
}
एच1{
मार्जिन-बाएं: 2rem;
}/* उपयोगिता */
कंटेनर {
अधिकतम-चौड़ाई: 1100px;
मार्जिन: ऑटो;
पैडिंग: 0 2rem;
ओवर फलो हिडेन;
}.बीटीएन {
प्रदर्शन: इनलाइन-ब्लॉक;
सीमा: कोई नहीं;
पृष्ठभूमि: #910505;
रंग: #fff;
पैडिंग: 0.5rem 1rem;
सीमा-त्रिज्या: 0.5rem;
}.बीटीएन: होवर {
अस्पष्टता: 0.9;
}/*नवबार*/
#नवबार {
पृष्ठभूमि: #fff;
स्थिति: चिपचिपा;
शीर्ष: 0;
जेड-इंडेक्स: 2;
}#नवबार .कंटेनर {
प्रदर्शन: ग्रिड;
ग्रिड-टेम्पलेट-कॉलम: 6fr 3fr 2fr;
गद्दी: 1rem;
संरेखित-आइटम: केंद्र;
}#नवबार एच1 {
रंग: #b30707;
}#नवबार उल {
औचित्य-स्व: अंत;
प्रदर्शन: फ्लेक्स;
मार्जिन-दाएं: 3.5rem;
}#नवबार उल ली ए {
गद्दी: 0.5rem;
फोंट की मोटाई: बोल्ड;
}#नवबार उल ली ए करंट {
पृष्ठभूमि: #b30707;
रंग: #fff;
}#नवबार उल ली ए: होवर {
पृष्ठभूमि: #f3f3f3;
रंग: #333;
}#नवबार .सामाजिक {
औचित्य-स्व: केंद्र;
}#नवबार .सामाजिक मैं {
रंग: #777;
मार्जिन-दाएं: .5rem;
}/* घर */
#घर {
रंग: #fff;
पृष्ठभूमि: #333;
गद्दी: 2rem;
स्थिति: रिश्तेदार;
}#घर: पहले {
विषय: '';
पृष्ठभूमि: यूआरएल ( https://source.unsplash.com/random) नो-रिपीट सेंटर सेंटर/कवर;
स्थिति: निरपेक्ष;
शीर्ष: 0;
बाएं: 0;
चौड़ाई: 100%;
ऊंचाई: 100%;
अस्पष्टता: 0.4;
}#घर .शोकेस-कंटेनर {
प्रदर्शन: ग्रिड;
ग्रिड-टेम्पलेट-कॉलम: दोहराना (2, 1fr);
औचित्य-सामग्री: केंद्र;
संरेखित-आइटम: केंद्र;
ऊंचाई: 100 वीएच;
}#घर .शोकेस-सामग्री {
जेड-इंडेक्स: 1;
}
#होम .शोकेस-कंटेंट p {
मार्जिन-नीचे: 1rem;
}
एक्सप्रेस सर्वर के साथ वेबसाइट की सेवा
कॉन्स्ट एक्सप्रेस = आवश्यकता ('एक्सप्रेस');कॉन्स्ट ऐप = एक्सप्रेस ();
कास्ट पोर्ट = 5000;app.use (एक्सप्रेस.स्टैटिक ('सार्वजनिक'));
app.get('/', (req, res) => {
res.sendFile('index.html')
})
app.listen (पोर्ट, () => {
कंसोल.लॉग (`सर्वर यहां चल रहा है: http://localhost:${port}`);
})
ऊपर दी गई HTML और CSS फ़ाइलें मुख्य प्रोजेक्ट निर्देशिका में एक सार्वजनिक फ़ोल्डर में हैं। HTML फ़ाइल का स्थान इसे एक्सप्रेस सर्वर और उसके कार्यों के लिए सुलभ बनाता है।
ऊपर दिए गए एक्सप्रेस सर्वर में नए कार्यों में से एक है ऐप.यूज () तरीका। यह माउंट करता है एक्सप्रेस.स्टेटिक () मिडलवेयर, जो स्थिर फाइलों को परोसता है। यह का उपयोग करना संभव बनाता है res.sendFile () स्थैतिक की सेवा के लिए कार्य index.html ऊपर फ़ाइल।
पर नेविगेट करना http://localhost: 5000 आपके ब्राउज़र में स्थान निम्न आउटपुट के समान कुछ प्रदर्शित करेगा:
बैकएंड डेवलपमेंट का अन्वेषण करें
एक्सप्रेस फ्रेमवर्क आपको विशिष्ट HTTP अनुरोध करने और पूर्वनिर्धारित विधियों के एक सेट का उपयोग करके उचित प्रतिक्रिया प्राप्त करने की अनुमति देता है। यह आज भी सबसे लोकप्रिय बैकएंड फ्रेमवर्क में से एक है।
एक्सप्रेस ढांचे का उपयोग करना सीखना एक अच्छा कदम है। लेकिन अगर आप वास्तव में एक पेशेवर बैकएंड डेवलपर बनना चाहते हैं, तो आपको और भी बहुत कुछ सीखने की जरूरत है।
यदि आप आईटी में करियर बनाने के लिए तैयार हैं, तो आप बैकएंड डेवलपर बनने के लिए आवश्यक कौशल सीखने से भी बदतर कर सकते हैं।
आगे पढ़िए
- प्रोग्रामिंग
- जावास्क्रिप्ट
- वेब विकास
- प्रोग्रामिंग
कदीशा कीन एक पूर्ण-स्टैक सॉफ़्टवेयर डेवलपर और तकनीकी/प्रौद्योगिकी लेखक हैं। उसके पास कुछ सबसे जटिल तकनीकी अवधारणाओं को सरल बनाने की विशिष्ट क्षमता है; उत्पादन सामग्री जिसे किसी भी तकनीकी नौसिखिए द्वारा आसानी से समझा जा सकता है। उसे लिखने, दिलचस्प सॉफ्टवेयर विकसित करने और दुनिया की यात्रा (वृत्तचित्रों के माध्यम से) करने का शौक है।
हमारे न्यूज़लेटर की सदस्यता लें
तकनीकी युक्तियों, समीक्षाओं, निःशुल्क ई-पुस्तकों और अनन्य सौदों के लिए हमारे न्यूज़लेटर से जुड़ें!
सब्सक्राइब करने के लिए यहां क्लिक करें