Vue.js हे प्रामुख्याने ऍप्लिकेशनच्या व्हिज्युअलायझेशन भागावर लक्ष केंद्रित करते, ज्याला फ्रंट-एंड डेव्हलपमेंट देखील म्हणतात. Vue.js दिवसेंदिवस लोकप्रिय होत आहे कारण ते इतर प्रकल्प आणि लायब्ररीसह एकत्रित करणे खूप सोपे आहे. हे स्थापित करणे आणि वापरणे खूप सोपे आहे.
Vue.js एक प्रगतीशील JavaScript फ्रेमवर्क आहे मुक्त स्रोत इंटरएक्टिव्ह वेब यूजर इंटरफेस आणि सिंगल पेज अॅप्लिकेशन्स (एसपीए) विकसित करण्यासाठी वापरले जाते. Vue.js चा सामान्यतः Vue म्हणून उल्लेख केला जातो आणि "view.js" किंवा "दृश्य" म्हणून उच्चारला जातो.
सिंगल पेज अॅप्लिकेशन किंवा एसपीए हे एक वेब अॅप्लिकेशन किंवा वेबसाइट आहे जे वापरकर्त्यांना डेस्कटॉप अॅप्लिकेशन प्रमाणेच अतिशय गुळगुळीत, प्रतिसाद देणारा आणि वेगवान अनुभव प्रदान करते. सिंगल पेज अॅप्लिकेशनमध्ये एका पेजवर मेनू, बटणे आणि ब्लॉक्स असतात. जेव्हा वापरकर्ता त्यापैकी एकावर क्लिक करतो, तेव्हा ते सर्व्हरवरून संपूर्ण नवीन पृष्ठे लोड करण्याऐवजी गतिशीलपणे वर्तमान पृष्ठाचे पुनर्लेखन करते. हे त्याच्या प्रतिसादात्मक गतीमागील कारण आहे.
Vue हे मुळात फ्रंटएंड डेव्हलपमेंटसाठी विकसित केले गेले आहे, म्हणून त्यास बर्याच HTML, JavaScript आणि CSS फाईल्स हाताळाव्या लागतात. Vue.js वापरकर्त्यांना डायरेक्टिव्ह नावाच्या HTML विशेषतांसह HTML विस्तारित करणे सोपे करते. Vue.js अंगभूत निर्देश आणि अनेक निर्देश प्रदान करते defiHTML ऍप्लिकेशन्सची कार्यक्षमता सुधारण्यासाठी वापरकर्त्याद्वारे nite.
खाली Vue.js च्या सर्वात महत्वाच्या वैशिष्ट्यांची यादी आहे:
Vue.js घटक हे या फ्रेमवर्कचे एक महत्त्वाचे वैशिष्ट्य आहे. ते पुन्हा वापरता येण्याजोगे कोड एन्कॅप्स्युलेट करण्यासाठी मूलभूत HTML घटकांचा विस्तार करण्यासाठी वापरले जातात. तुम्ही Vue.js ऍप्लिकेशन्समध्ये पुन्हा वापरता येण्याजोगे सानुकूल घटक तयार करू शकता जे नंतर HTML मध्ये पुन्हा वापरले जाऊ शकतात.
Vue.js HTML-आधारित टेम्पलेट प्रदान करते ज्याचा वापर Vue उदाहरण डेटासह प्रस्तुत DOM संबद्ध करण्यासाठी केला जाऊ शकतो. सर्व Vue टेम्पलेट वैध HTML आहेत जे विशिष्ट-अनुरूप ब्राउझर आणि HTML विश्लेषकांद्वारे पार्स केले जाऊ शकतात. Vue.js व्हर्च्युअल DOM रेंडरिंग फंक्शन्समध्ये मॉडेल्स संकलित करते. ब्राउझर रिफ्रेश करण्यापूर्वी Vue घटकांना आभासी DOM मेमरीमध्ये रेंडर करते. Vue री-रेंडर करण्यासाठी घटकांची किमान संख्या देखील मोजू शकते आणि अॅप्लिकेशनची स्थिती बदलताना DOM मॅनिपुलेशनची किमान रक्कम लागू करू शकते.
Vue एक प्रतिसाद प्रणाली प्रदान करते जी साध्या JavaScript ऑब्जेक्ट्स वापरते आणि री-रेंडरिंग ऑप्टिमाइझ करते. या प्रक्रियेत, प्रत्येक घटक त्याच्या प्रतिक्रियाशील अवलंबनांचा मागोवा ठेवतो, त्यामुळे सिस्टीमला नक्की कळते की कधी आणि कोणते घटक पुन्हा रेंडर करायचे.
पृष्ठ नेव्हिगेशन व्ह्यू-राउटरच्या मदतीने केले जाते. तुम्ही तुमच्या सिंगल पेज अॅप्लिकेशनसाठी अधिकृतपणे समर्थित व्ह्यू-राउटर लायब्ररी वापरू शकता.
DOM मधून घटक समाविष्ट केले जातात, अद्यतनित केले जातात किंवा काढले जातात तेव्हा Vue तुम्हाला भिन्न संक्रमण प्रभाव वापरण्याची परवानगी देते.
Vue.js वापरण्याच्या अनेक पद्धती आहेत. तुम्ही त्याच्या अधिकृत साइटवर जाऊन ते इन्स्टॉल करू शकता किंवा तुम्ही CDN लायब्ररीतील Vue.js फाइल वापरणे सुरू करू शकता. तुमच्या प्रोजेक्टमध्ये Vue.js वापरण्याचे काही मार्ग येथे आहेत.
टॅग वापरायचा असेल तर <script> Vue.js ची थेट तुमच्या HTML फाइलमध्ये, तुम्हाला ती अधिकृत वेबसाइटवरून डाउनलोड करावी लागेल.
<html>
<head>
<script type = "text/javascript" src = "vue.min.js"></script>
</head>
<body>
</body>
</html> चला Vue.js अधिकृत वेबसाइटवर जाऊ या https://vuejs.org/v2/guide/installation.html तुमच्या गरजेनुसार vue.js डाउनलोड करण्यासाठी.
तुम्ही तुमच्या अर्जामध्ये CDN वरून Vue.js फाइल देखील वापरू शकता. घटकामध्ये https://unpkg.com/vue@3/dist/vue.global.js लिंक वापरा <script>, खालीलप्रमाणे:
<script src="https://unpkg.com/vue@3/dist/vue.global.js"></script>Vue.js हे वेब डेव्हलपमेंट आणि सिंगल पेज अॅप्लिकेशन्स (SPA) तयार करण्यासाठी मोठ्या प्रमाणावर वापरल्या जाणार्‍या नवीनतम सॉफ्टवेअर तंत्रज्ञानांपैकी एक आहे. तुम्ही नावावरून अंदाज लावू शकता, हे मुख्यतः UI किंवा प्रोजेक्टच्या डिस्प्ले साइडसाठी वापरले जाते.
तुमच्या प्रोजेक्टमध्ये Vue.js वापरण्याचे फायदे पाहू:
Vue.js चा सर्वात मोठा फायदा म्हणजे तो आकाराने खूपच लहान आहे. JavaScript फ्रेमवर्कचे यश त्याच्या आकारावर बरेच अवलंबून असते आणि हे रोमांचक JavaScript प्लगइन फक्त 18-21KB आहे, त्यामुळे तुम्ही ते अगदी सहजपणे डाउनलोड करू शकता आणि ते अगदी वेळेत वापरू शकता.
Vue.js फ्रेमवर्कची रचना अतिशय सोपी आहे आणि समजण्यास अतिशय सोपी आहे. या फ्रेमवर्कच्या लोकप्रियतेचे हे एक कारण आहे. तुम्हाला HTML आणि JavaScript माहीत असल्यास, तुम्ही Vue.js मध्ये सहज कोड करू शकता. वापरकर्ते त्यांच्या वेब प्रोजेक्टमध्ये त्यांच्या सोप्या रचनेमुळे Vue.js सहज जोडू शकतात आणि अनुप्रयोग विकसित करू शकतात.
Vue.js मध्ये प्रत्येक गोष्टीसाठी अनेक घटक आहेत आणि विद्यमान ऍप्लिकेशन्ससह खूप लवकर एकत्रित केले जाऊ शकतात. तुम्ही ते JavaScript मध्ये लिहिलेल्या कोणत्याही ऍप्लिकेशनसह समाकलित करू शकता.
Vue.js चे लवचिक स्वरूप देखील React.js, Angular.js आणि इतर कोणत्याही नवीन JavaScript फ्रेमवर्कच्या विकसकांना समजणे सोपे करते. हे HTML फाइल्स, JavaScript फाइल्स आणि शुद्ध JavaScript फाइल्स लिहिण्यासाठी व्हर्च्युअल नोड्स वापरण्यासाठी भरपूर लवचिकता प्रदान करते.
तुम्ही सानुकूल घटक तयार करू शकता जे Vue.js ऍप्लिकेशन्समध्ये पुन्हा वापरण्यायोग्य आहेत.
Vue.js अतिशय साधे, पूर्ण आणि तपशीलवार दस्तऐवजीकरण प्रदान करते, त्यामुळे ज्या विकासकांना HTML आणि JavaScript बद्दल फारशी कल्पना नाही ते प्रोग्रामसाठी याचा वापर करू शकतात.
Vue.js व्हर्च्युअल DOM वापरते जसे की इतर विद्यमान फ्रेमवर्क जसे की ReactJS, Ember इ. व्हर्च्युअल DOM हे मूळ HTML DOM चे लाइटवेट इन-मेमरी ट्री प्रतिनिधित्व आहे आणि प्रारंभिक DOM ला प्रभावित न करता अपडेट केले जाते.
Vue.js त्याच्या मॉडेल व्ह्यू व्ह्यू मॉडेल (MVVM) आर्किटेक्चरसह द्वि-मार्गी संप्रेषण प्रदान करते जे एचटीएमएल ब्लॉक्सची हाताळणी सुलभ करते.
फ्रेमवर्क एका सिस्टीमसह येते जी आम्हाला सोप्या आणि सरळ मॉडेल सिंटॅक्सचा वापर करून डीओएमला डेटा घोषित करण्यास अनुमती देते.
येथे एक उदाहरण आहे:
<body>
<div id="app">
{{ message }}
</div>
<script>
var app = new Vue({
el: '#app',
data: {
message: 'This is a simple Vue.js Declarative Rendering example!'
}
})
</script>
</body>Vue.js फ्रेमवर्क आम्हाला याची अनुमती देते definire HTML विशेषता ज्यांना निर्देश म्हणतात, जे HTML ऍप्लिकेशन्सना कार्यक्षमता प्रदान करण्यासाठी वापरले जातात.
Vue.js मध्ये दोन प्रकारचे निर्देश आहेत:
Vue.js डेटासाठी प्लेसहोल्डर म्हणून दुहेरी ब्रेसेस {{}} वापरते आणि Vue.js निर्देश हे HTML विशेषता आहेत जे v- उपसर्ग वापरतात.
Vue अॅप एकाच DOM घटकाशी कनेक्ट होते आणि ते पूर्णपणे नियंत्रित करते. वरील उदाहरणात, ते #app आहे.
Vue सह आपण HTML ला एंट्री पॉइंट मानू शकतो आणि बाकी सर्व काही Vue इंस्टन्समध्ये घडते.
चला एक उदाहरण पाहू जेथे आपण घटक आणि विशेषता बंधनकारक करण्याचा प्रयत्न करतो:
<html>
<head>
<link rel="stylesheet" href="index.css">
<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
</head>
<body>
<div id="app-2">
<span v-bind:title="message">
Hover mouse over me for a few seconds
and see a dynamically bound title which I have set!
</span>
</div>
<script>
var app2 = new Vue({
el: '#app-2',
data: {
message: 'You loaded this page on ' + new Date().toLocaleString()
}
})
</script>
</body>
</html> या प्रकरणात, नवीन v-bind विशेषता निर्देश आहे. Vue द्वारे प्रदान केलेले अद्वितीय गुणधर्म आहेत हे दर्शवण्यासाठी v- उपसर्गासह निर्देश वापरले जातात आणि प्रस्तुत DOM वर विशेष प्रतिसादात्मक वर्तन लागू करण्यासाठी वापरले जातात.
उदाहरणाचा परिणाम खालीलप्रमाणे आहे
Ercole Palmeri
नौदल क्षेत्र ही एक खरी जागतिक आर्थिक शक्ती आहे, ज्याने 150 अब्जांच्या बाजारपेठेकडे नेव्हिगेट केले आहे...
गेल्या सोमवारी, फायनान्शिअल टाईम्सने OpenAI सह करार जाहीर केला. FT ने त्याच्या जागतिक दर्जाच्या पत्रकारितेचा परवाना…
लाखो लोक स्ट्रीमिंग सेवांसाठी पैसे देतात, मासिक सदस्यता शुल्क भरतात. असे सामान्य मत आहे की आपण…
Veeam द्वारे Coveware सायबर खंडणी घटना प्रतिसाद सेवा प्रदान करणे सुरू ठेवेल. Coveware फॉरेन्सिक आणि उपाय क्षमता प्रदान करेल…
