🔇 🎅🏿 👸🏿 HTML / CSS / JS + Node.js + नोड-वेबकिट = क्रॉसऑर्किटेक्चर अनुप्रयोग 👭 ™️ 🤖

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

1. यदि आप एक त्वरित शुरुआत की जरूरत है, एक्सप्रेस डाल दिया

npm install express

2. निम्नलिखित सामग्री के साथ एक server.js फ़ाइल बनाएँ:

  var express = require('express'); var http = require('http'); var index = require('./routes/index.js'); var app = express(); //    express` app.get('/', index.index); http.createServer(app).listen(app.get('port'), function(){ console.log('Express server listening on port ' + app.get('port')); });

3. एक index.js फ़ाइल बनाएँ और इसे रूट फ़ोल्डर में डालें

 exports.index = function(req, res){ res.render('index', {}); };

4. Index.ejs बनाएं (मैं टेम्पलेट इंजन के रूप में ईजेएस का उपयोग करता हूं) और इसे दृश्य फ़ोल्डर में डाल दिया

 <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>Hello world</title> </head> <body> <h1>Hello world!</> </body> </html>

देखा!

हम लॉन्च करते हैं

 node server.js

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

नोड-वेबकिट परियोजना, जिसकी घोषणा हेब्रा पर उपलब्ध है , एक समान निर्माण के लिए उपयोगी है।
तकनीक का सार यह है कि आप क्लाइंट नोड कोड में एपी नोड नोड्स को एम्बेड कर सकते हैं। यानी आप बिचौलियों के बिना, सीधे क्लाइंट कोड से डेटाबेस और फाइल सिस्टम से जुड़ सकते हैं। यह आकर्षक लगता है, और वैसे भी यह काम करता है, लेकिन मैं वास्तव में इस तरह के मिश्रण को पसंद नहीं करता। यह विशेष रूप से डेस्कटॉप एप्लिकेशन को बदल देता है। मुझे एक और विकल्प पसंद है।
एप्लिकेशन को वेब एप्लिकेशन के लिए क्लासिक शैली में बनाया गया है: क्लाइंट कोड और सर्वर। और मुझे सर्वर पर इसे चलाने में सक्षम होना चाहिए, बहु-उपयोगकर्ता पहुंच प्रदान करना और एक स्थानीय (एकल-उपयोगकर्ता) अनुप्रयोग के रूप में।

यहाँ नुस्खा है:
1. नोड-वेबकिट को शुरू किए गए html पृष्ठ के बारे में पता होना चाहिए कि यह पहले प्रदर्शित होगा।
package.json में निम्नलिखित जोड़ें

 "main": "nw-start.html"

2. nw-start.html इस प्रकार होगा

 <!DOCTYPE html> <html> <head> <script> function bodyOnLoad(){ require('./server.js'); window.location.assign('http://localhost:3000/'); } </script> </head> <body onload="bodyOnLoad()"> <h1> Loading... </h1> </body> </html>

3. सभी server.js कोड एक तत्काल कार्य किया जाएगा।

 (function startServer(){ var express = require('express'); var app = express(); .... http.createServer(app).listen(app.get('port'), function(){ console.log('Express server listening on port ' + app.get('port')); }); })();

4. हम पूरे प्रोजेक्ट को जिप-आर्काइव nw-project.zip में पैक करते हैं
5. लॉन्च

 nw nw-project.zip

एक छोटे विराम के दौरान जिसके दौरान "सर्वर" भाग लोड होता है

जो हो रहा है उसका सार काफी सरल है। नोड-वेबकिट प्रारंभ पृष्ठ को लोड करता है। उसके बाद, क्लाइंट फ़ंक्शन बॉडीऑनलोड को निष्पादित किया जाता है। bodyOnLoad server.js मॉड्यूल को लोड करता है (कॉल नोड। जेएस की आवश्यकता होती है)। कॉल server.js में कोड के निष्पादन की ओर जाता है और, परिणामस्वरूप, http-server का प्रक्षेपण। यह केवल पृष्ठ का URL बदलने के लिए बना हुआ है, जो कि window.location.assign ('http: // localhost: 3000 /') करता है।

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

एक अच्छा सप्ताहांत है ...

HTML / CSS / JS + Node.js + नोड-वेबकिट = क्रॉसऑर्किटेक्चर अनुप्रयोग

More articles: