अपने माइंड-रीडिंग म्यूज़िक API में दोस्तों को जोड़ें: रीयल-टाइम सोशल शेयरिंग

क्या आप अपने माइंड-रीडिंग म्यूज़िक API को वाकई सोशल बनाने के लिए तैयार हैं? इस ट्यूटोरियल में, आप एक मज़बूत फ्रेंड सिस्टम और प्लेलिस्ट शेयरिंग जोड़ेंगे जो डेटाबेस में बनी रहेगी, ताकि उपयोगकर्ता अपने दोस्तों की शेयर की गई प्लेलिस्ट तब भी देख सकें जब वे ऑनलाइन न हों। हम वास्तविक समय के अपडेट के लिए Socket.io और स्थायी संग्रहण के लिए MongoDB का उपयोग करेंगे।

आप क्या बनाएंगे

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

पूर्वापेक्षाएँ

आपका पूरा किया गया माइंड-रीडिंग म्यूज़िक API भाग 2 से
MongoDB, Node.js, और npm इंस्टॉल किया हुआ
Spotify API क्रेडेंशियल (क्लाइंट आईडी और सीक्रेट)
30-45 मिनट का कोडिंग समय

भाग 2 में, आपने मूड हिस्ट्री और स्मार्ट प्राथमिकताओं वाले यूज़र अकाउंट बनाए। अब हम इसे सोशल बनाने जा रहे हैं! आप सीखेंगे कि उपयोगकर्ताओं से कैसे जुड़ें, वास्तविक समय में और लगातार प्लेलिस्ट कैसे साझा करें, और देखें कि आपके मित्र अपने मूड के आधार पर क्या सुन रहे हैं।

मुख्य अवधारणाओं को समझना

कोड में गोता लगाने से पहले, आइए समझते हैं कि हम क्या बना रहे हैं:

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

चरण 1: आवश्यक निर्भरताएँ स्थापित करें

अपनी परियोजना निर्देशिका में अपना टर्मिनल खोलें और रीयल-टाइम सुविधाओं के लिए Socket.io स्थापित करें:

npm install socket.io

यह क्या करता है: यह कमांड आपके प्रोजेक्ट में Socket.io लाइब्रेरी को डाउनलोड और इंस्टॉल करता है। npm install कमांड, npm रजिस्ट्री (JavaScript कोड की एक विशाल लाइब्रेरी) से पैकेज लाता है और उन्हें आपके node_modules फ़ोल्डर में जोड़ देता है।

अन्य निर्भरताएँ (sentiment, spotify-web-api-node, bcryptjs, jsonwebtoken, mongoose, express, dotenv) भाग 2 से पहले ही इंस्टॉल हो जानी चाहिए।

चरण 2: सामाजिक सुविधाओं के साथ अपने उपयोगकर्ता मॉडल को अपडेट करें

चूँकि आपने भाग 2 में पहले ही एक उपयोगकर्ता मॉडल बना लिया है, इसलिए हम इसमें सामाजिक सुविधाएँ जोड़ने के लिए इसे अपडेट करेंगे। उपयोगकर्ता मॉडल एक टेम्पलेट की तरह होता है जो यह निर्धारित करता है कि हम अपने डेटाबेस में प्रत्येक उपयोगकर्ता के बारे में कौन सी जानकारी संग्रहीत करते हैं।

हम क्या जोड़ रहे हैं:

friends array – अन्य उपयोगकर्ताओं के ObjectId संदर्भों की एक सूची। संपूर्ण उपयोगकर्ता जानकारी संग्रहीत करने के बजाय, हम केवल उन आईडी को संग्रहीत करते हैं जो डेटाबेस में अन्य उपयोगकर्ता दस्तावेज़ों की ओर इशारा करते हैं।
sharedWith और isShared फ़ील्ड – ये ट्रैक करते हैं कि कौन सी मूड प्रविष्टियाँ साझा की गई हैं और उन्हें किसके साथ साझा किया गया था।
sharedPlaylistSchema – एक नया स्कीमा (ब्लूप्रिंट) जो परिभाषित करता है कि एक साझा प्लेलिस्ट कैसी दिखती है: इसे किसने साझा किया, यह किस मूड के लिए था, ट्रैक और इसे कब साझा किया गया था।
sharedPlaylists array – एक सूची जो आपके दोस्तों द्वारा आपके साथ साझा की गई सभी प्लेलिस्ट संग्रहीत करती है।

अपने models/User.js को इसके साथ बदलें:

const नेवला = आवश्यकता('नेवला'); const bcrypt = आवश्यकता('bcryptjs'); // व्यक्तिगत मूड प्रविष्टियों के लिए स्कीमा (प्रत्येक बार जब उपयोगकर्ता एक प्लेलिस्ट बनाता है) const moodEntrySchema = new mongoose.Schema({ text: String, // उपयोगकर्ता ने क्या टाइप किया (उदाहरण के लिए, "आज खुश महसूस कर रहा हूँ") detectedMood: String, // हमारे विश्लेषक ने जो मूड का पता लगाया (उदाहरण के लिए, "खुश") confidence: Number, // हम कितने आश्वस्त हैं (0-10) playlistGenerated: [{ // हमारे द्वारा सुझाए गए ट्रैक की सरणी trackName: String, artist: String, spotifyId: String, liked: { type: Boolean, default: null } // null = not rated, true = liked, false = disliked }], sharedWith: {[ type: mongoose.Schema.Types.ObjectId, ref: 'User' }], // हमने इसे किसके साथ साझा किया? isShared: { type: Boolean, default: false }, // क्या इसे साझा किया गया था? timestamp: { type: Date, डिफ़ॉल्ट: Date.now } // यह कब बनाया गया था? }); // उपयोगकर्ता प्राथमिकताओं के लिए स्कीमा (पसंदीदा शैलियां, आदि) const userPreferencesSchema = new mongoose.Schema({ favoriteGenres: [String], preferredEnergyLevel: { type: Number, min: 0, max: 1 }, dislikedArtists: [String], moodMusicMapping: { खुश: [String], उदास: [String], ऊर्जावान: [String], सर्द: [String], गुस्सा: [String], रोमांटिक: [String], उदासीन: [String] } }); // नया: दोस्तों द्वारा आपके साथ साझा की जाने वाली प्लेलिस्ट के लिए स्कीमा const sharedPlaylistSchema = new mongoose.Schema({ sharedBy: { type: mongoose.Schema.Types.ObjectId, ref: 'User' }, // साझा करने वाले दोस्त के लिए ObjectId संदर्भ sharedByUsername: स्ट्रिंग, // आसान प्रदर्शन के लिए उपयोगकर्ता नाम (प्रदर्शन के लिए असामान्य) मूड: स्ट्रिंग, // यह प्लेलिस्ट किस मूड के लिए थी? playlist: [{ // वास्तविक ट्रैक का नाम: स्ट्रिंग, कलाकार: स्ट्रिंग, एल्बम_इमेज: स्ट्रिंग, आईडी: स्ट्रिंग }], टाइमस्टैम्प: { type: दिनांक, डिफ़ॉल्ट: Date.now } // यह कब साझा किया गया था? }); // मुख्य उपयोगकर्ता स्कीमा - एक उपयोगकर्ता दस्तावेज़ की संरचना को परिभाषित करता है const userSchema = new mongoose.Schema({ username: { type: String, required: true, unique: true, trim: true, minlength: 3 }, email: { type: String, required: true, unique: true, lowercase: true }, password: { type: String, required: true, minlength: 6 }, friends: {[ type: mongoose.Schema.Types.ObjectId, ref: 'User' }], // ObjectId संदर्भों की सरणी friends moodHistory: [moodEntrySchema], // इस उपयोगकर्ता द्वारा जेनरेट की गई सभी प्लेलिस्ट sharedPlaylists: [sharedPlaylistSchema], // प्लेलिस्ट जो दोस्तों ने इस उपयोगकर्ता के साथ साझा की हैं preferences: { type: userPreferencesSchema, default: () => ({}) }, stats: { totalPlaylists: { type: संख्या, डिफ़ॉल्ट: 0 }, favoriteTime: स्ट्रिंग, mostCommonMood: स्ट्रिंग, joinDate: { प्रकार: दिनांक, डिफ़ॉल्ट: Date.now } } }, { timestamps: true }); // createdAt और updatedAt फ़ील्ड को स्वचालित रूप से जोड़ें // मिडिलवेयर: किसी उपयोगकर्ता को सहेजने से पहले इस फ़ंक्शन को चलाएं (उनके पासवर्ड को हैश करने के लिए) userSchema.pre('save', async function(next) { if (!this.isModified('password')) return next(); // केवल हैश अगर पासवर्ड बदल दिया गया था this.password = await bcrypt.hash(this.password, 12); // 12 राउंड नमक के साथ हैश next(); }); // विधि: जांचें कि क्या पासवर्ड हैश किए गए पासवर्ड से मेल खाता है userSchema.methods.comparePassword = function(p) { return bcrypt.compare(p, this.password); }; // विधि: उपयोगकर्ता के मूड इतिहास के आधार पर उसके आंकड़े अपडेट करें userSchema.methods.updateStats = function() { const moods = this.moodHistory.map(e => e.detectedMood).filter(Boolean); // सभी गैर-रिक्त मूड प्राप्त करें this.stats.totalPlaylists = moods.length; if (moods.length > 0) { // गणना करें कि प्रत्येक मूड कितनी बार प्रकट होता है const counts = moods.reduce((a, m) => { a[m] = (a[m] || 0) + 1; return a; }, {}); // सबसे अधिक गिनती वाला मूड ढूंढें this.stats.mostCommonMood = Object.keys(counts).reduce((a, b) => counts[a] > counts[b] ? a : b, 'neutral'); } else { this.stats.mostCommonMood = 'neutral'; } // प्लेलिस्ट बनाने के समय के आधार पर दिन का पसंदीदा समय गणना करें const hours = this.moodHistory.map(e => e.timestamp.getHours()).filter(h => !isNaN(h)); if (hours.length) { const avg = hours.reduce((a, b) => a + b, 0) / hours.length; this.stats.favoriteTime = avg < 6 ? 'night' : avg < 12 ? 'morning' : avg < 18 ? 'afternoon' : 'evening'; } }; // मॉडल को निर्यात करें ताकि हम इसे अन्य फ़ाइलों में उपयोग कर सकें module.exports = mongoose.model('User', userSchema);

मुख्य अवधारणाओं की व्याख्या:

ऑब्जेक्टआईडी संदर्भ – मित्र सरणी संपूर्ण उपयोगकर्ता ऑब्जेक्ट संग्रहीत नहीं करती है। इसके बजाय, यह ऑब्जेक्टआईडी (अद्वितीय पहचानकर्ता) संग्रहीत करती है जो अन्य उपयोगकर्ताओं की ओर इंगित करते हैं। यह कुशल है क्योंकि यदि कोई मित्र अपना उपयोगकर्ता नाम बदलता है, तो हमें इसे हर जगह अपडेट करने की आवश्यकता नहीं होती है – हम केवल संदर्भ का पालन करते हैं।
डिनॉर्मलाइज़ेशन – ध्यान दें कि हम sharedBy (ऑब्जेक्टआईडी) और sharedByUsername (स्ट्रिंग) दोनों संग्रहीत करते हैं। इसे डिनॉर्मलाइज़ेशन कहा जाता है – प्रदर्शन के लिए एक ही डेटा को कई स्थानों पर संग्रहीत करना। हम यूज़रनेम स्टोर करते हैं ताकि हमें शेयर की गई प्लेलिस्ट दिखाते समय हर बार यूज़र को ढूँढ़ना न पड़े।
मिडलवेयर (.pre()) – यह कुछ खास ऑपरेशन से पहले अपने आप चलता है। यहाँ, यह सुरक्षा के लिए डेटाबेस में सेव करने से पहले पासवर्ड को हैश करता है।
इंस्टेंस मेथड्स (.methods) – ये ऐसे फ़ंक्शन हैं जिन्हें आप अलग-अलग यूज़र डॉक्यूमेंट्स पर कॉल कर सकते हैं, जैसे user.comparePassword() या user.updateStats()।

चरण 3: अपने HTML फ़्रंटएंड को सोशल फ़ीचर्स से अपडेट करें

अब यूज़र इंटरफ़ेस को अपडेट करते हैं ताकि उसमें फ्रेंड मैनेजमेंट और एक्टिविटी फ़ीड शामिल हो। HTML आपके वेब पेज की संरचना को परिभाषित करता है – कौन से तत्व दिखाई देते हैं और वे कहाँ स्थित हैं।

हम UI में क्या जोड़ रहे हैं:

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

अपने public/index.html को इससे बदलें:

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"/> <meta name="viewport" content="width=device-width, initial-scale=1.0"/> <title>माइंड-रीडिंग म्यूजिक API - सोशल</title> <style> /* डिफ़ॉल्ट ब्राउज़र शैलियों को रीसेट करें */ * { margin: 0; padding: 0; box-sizing: border-box; } /* ग्रेडिएंट पृष्ठभूमि के साथ मुख्य बॉडी स्टाइलिंग */ body { font-family: 'Segoe UI', sans-serif; background: linear-gradient(135deg, #667eea, #764ba2); min-height: 100vh; color: #333; } /* संपूर्ण डैशबोर्ड के लिए कंटेनर */ .dashboard { max-width: 1000px; margin: 0 auto; padding: 20px; } /* स्वागत संदेश के साथ हेडर अनुभाग */ .header { background: rgba(255,255,255,0.95); backdrop-filter: blur(10px); /* ग्लासमॉर्फिज्म के लिए धुंधला प्रभाव */ border-radius: 20px; padding: 30px; margin-bottom: 30px; text-align: center; box-shadow: 0 8px 32px rgba(0,0,0,0.1); } /* दो-स्तंभ ग्रिड लेआउट: प्लेलिस्ट अनुभाग (बड़ा) और मित्र अनुभाग (छोटा) */ .main-content { display: grid; grid-template-columns: 2fr 1fr; gap: 30px; } /* दोनों अनुभागों के लिए कार्ड स्टाइलिंग */ .playlist-section, .friends-section { background: rgba(255,255,255,0.95); border-radius: 20px; padding: 30px; box-shadow: 0 8px 32px rgba(0,0,0,0.1); } /* फ़ॉर्म तत्वों की स्टाइलिंग */ input, textarea, button { width: 100%; padding: 12px; margin: 10px 0; border: 2px solid #e1e5e9; border-radius: 8px; font-size: 16px; } /* ग्रेडिएंट पृष्ठभूमि के साथ बटन विशिष्ट स्टाइलिंग */ button { background: linear-gradient(135deg, #667eea, #764ba2); color: #fff; border: none; cursor: pointer; font-weight: 600; } /* बटनों पर सूक्ष्म होवर प्रभाव */ button:hover { transform: translateY(-2px); } /* व्यक्तिगत मित्र आइटम स्टाइलिंग */ .friend-item { background: #f8f9fa; padding: 10px; margin: 5px 0; border-radius: 8px; border-left: 4px solid #667eea; /* बाईं ओर एक्सेंट रंग */ } /* अधिसूचना पॉपअप स्टाइलिंग (डिफ़ॉल्ट रूप से छिपा हुआ, दाईं ओर से स्लाइड करता है) */ .notification { position: fixed; top: 20px; right: 20px; background: rgba(102,126,234,0.95); color: #fff; padding: 15px 20px; border-radius: 8px; box-shadow: 0 4px 15px rgba(0,0,0,0.1); transform: translateX(400px); /* ऑफ-स्क्रीन शुरू करें */ transition: transform .3s ease; z-index: 1000; max-width: 300px; } /* अधिसूचना दिखाएं (स्लाइड इन) */ .notification.show { transform: translateX(0); } /* लॉगिन और पंजीकरण फ़ॉर्म */ .login-section, .register-section { background: rgba(255,255,255,0.95); border-radius: 20px; padding: 30px; max-width: 400px; margin: 50px auto; } /* साझा करने के लिए चेकबॉक्स नियंत्रण */ .share-controls { display: flex; gap: 10px; margin: 10px 0; } .share-controls input[type=checkbox] { width: auto; margin-right: 5px; } </style> </head> <body> <div class="dashboard"> <!-- प्रमाणीकरण अनुभाग (लॉगिन/रजिस्टर फ़ॉर्म) --> <div id="authSection"> <!-- लॉगिन फ़ॉर्म --> <div class="login-section"> <h2>🧠🎵 आपका स्वागत है!</h2> <input type="text" id="loginUsername" placeholder="Username"/> <input type="password" id="loginPassword" placeholder="Password"/> <button onclick="login()">लॉगिन</button> <p><a href="#" onclick="showRegister()">क्या आपके पास खाता नहीं है? साइन अप करें</a></p> </div> <!-- पंजीकरण फ़ॉर्म (डिफ़ॉल्ट रूप से छिपा हुआ) --> <div id="registerSection" class="register-section" style="display:none"> <h2>🎵 अपनी संगीत प्रोफ़ाइल बनाएँ</h2> <input type="text" id="regUsername" placeholder="Username"/> <input type="email" id="regEmail" placeholder="Email"/> <input type="password" id="regPassword" placeholder="Password"/> <button onclick="register()">खाता बनाएँ</button> <p><a href="#" onclick="showLogin()">क्या आपके पास पहले से खाता है? लॉगिन करें</a></p> </div> </div> <!-- मुख्य डैशबोर्ड अनुभाग (लॉगिन के बाद दिखाया गया) --> <div id="dashboardSection" style="display:none"> <!-- उपयोगकर्ता नाम और लॉगआउट बटन के साथ हेडर --> <div class="header"> <h1>🧠🎵 आपका व्यक्तिगत संगीत माइंड रीडर</h1> <p>स्वागत है, <span id="username"></span>!</p> <button onclick="logout()" style="width:auto; margin-top:10px">Logout</button> </div> <!-- दो-स्तंभ लेआउट: बाईं ओर प्लेलिस्ट अनुभाग, दाईं ओर मित्र अनुभाग --> <div class="main-content"> <!-- बायां स्तंभ: प्लेलिस्ट निर्माण --> <div class="playlist-section"> <h2>💭 आप कैसा महसूस कर रहे हैं?</h2> <textarea id="moodText" placeholder="अपना मूड बताएं..."></textarea> <div class="share-controls"> <label><input type="checkbox" id="shareWithFriends"/>दोस्तों के साथ साझा करें</label> </div> <button onclick="generatePlaylist()">🎧 प्लेलिस्ट जनरेट करें</button> <!-- प्लेलिस्ट जनरेट करने के बाद परिणाम यहां दिखाई देते हैं --> <div id="result" style="display:none"></div> </div> <!-- दायां कॉलम: मित्र और गतिविधि --> <div class="friends-section"> <h3>👥 मेरे मित्र</h3> <div id="friendsList"></div> <h4> एक मित्र जोड़ें</h4> <input type="text" id="friendUsername" placeholder="मित्र का उपयोगकर्ता नाम"/> <button onclick="addFriend()">मित्र जोड़ें</button> <h4>हाल की गतिविधि</h4> <!-- मित्रों की साझा की गई प्लेलिस्ट यहां दिखाई देती हैं --> <div id="friendActivity">मित्र गतिविधि यहां दिखाई देगी...</div> </div> </div> </div> </div> <!-- अधिसूचना पॉपअप के लिए कंटेनर --> <div id="notificationArea"></div> <!-- Socket.io लाइब्रेरी शामिल करें (हमारे सर्वर द्वारा स्वचालित रूप से प्रदान की गई) --> <script src="/socket.io/socket.io.js"></script> <!-- हमारे कस्टम JavaScript को शामिल करें --> <script src="./js/app.js"></script> </body> </html>

HTML संरचना को समझना:

दो मुख्य अनुभाग: authSection (लॉगिन/रजिस्टर) और dashboardSection (मुख्य ऐप)। एक समय में केवल एक ही दिखाई देता है।
ग्रिड लेआउट: .main-content दो कॉलम बनाने के लिए CSS ग्रिड का उपयोग करता है (प्लेलिस्ट के लिए 2fr, दोस्तों के लिए 1fr)। इसका मतलब है कि प्लेलिस्ट अनुभाग दोगुना चौड़ा है।
ईवेंट हैंडलर: onclick="functionName()" ब्राउज़र को बताता है कि जब तत्व पर क्लिक किया जाता है, तो वह JavaScript फ़ंक्शन को कॉल करे।
IDs: तत्वों की विशिष्ट ID होती हैं (जैसे id="friendsList") ताकि हमारा JavaScript उन्हें बाद में ढूंढ सके और संशोधित कर सके।

चरण 4: Socket.io, Friend Endpoints, और Persistent Sharing के साथ server.js को अपडेट करें

अब हम मित्र अनुरोध, प्लेलिस्ट शेयरिंग, और रीयल-टाइम संचार को संभालने के लिए अपने सर्वर को अपडेट करेंगे। सर्वर आपके ऐप का "दिमाग" है - यह अनुरोधों को संसाधित करता है, डेटाबेस से बात करता है, और उपयोगकर्ताओं को प्रतिक्रियाएँ भेजता है।

हम सर्वर में क्या जोड़ रहे हैं:

Socket.io सर्वर – सर्वर और क्लाइंट के बीच वास्तविक समय, द्विदिश संचार सक्षम करता है
/api/add-friend एंडपॉइंट – मित्र अनुरोधों (पारस्परिक मित्रता) को संभालता है
/api/shared-playlists एंडपॉइंट – आपके साथ मित्रों द्वारा साझा की गई प्लेलिस्ट लौटाता है
उन्नत /api/personalized-playlist – अब साझा की गई प्लेलिस्ट को मित्रों के डेटाबेस में सहेजता है
सॉकेट ईवेंट हैंडलर्स – वास्तविक समय की घटनाओं (प्रमाणीकरण, साझाकरण) को सुनें और उत्सर्जित करें

अपने server.js को इसके साथ बदलें:

// .env फ़ाइल से पर्यावरण चर लोड करें require('dotenv').config(); // आवश्यक मॉड्यूल आयात करें const path = require('path'); const express = require('express'); const http = require('http'); const socketIo = require('socket.io'); const mongoose = require('mongoose'); const jwt = require('jsonwebtoken'); const auth = require('./middleware/auth'); const User = require('./models/User'); const moodAnalyzer = require('./moodAnalyzer'); const PlaylistGenerator = require('./playlistGenerator'); // प्लेलिस्ट जनरेटर प्रारंभ करें const playlistGen = new PlaylistGenerator(); const PORT = process.env.PORT || 3000; // MongoDB डेटाबेस से कनेक्ट करें async function connectDB() { try { console.log('🔗 MongoDB से कनेक्ट हो रहा है…'); await mongoose.connect(process.env.MONGODB_URI, { useNewUrlParser: true, useUnifiedTopology: true }); console.log('✅ MongoDB सफलतापूर्वक कनेक्ट हुआ!'); } catch (err) { console.error('❌ MongoDB कनेक्शन विफल:', err.message); process.exit(1); // डेटाबेस कनेक्शन विफल होने पर बाहर निकलें } } connectDB(); // Express ऐप और HTTP सर्वर बनाएं const app = express(); const server = http.createServer(app); // HTTP सर्वर के शीर्ष पर Socket.io को प्रारंभ करें const io = socketIo(server); // ऑनलाइन उपयोगकर्ताओं को ट्रैक करने के लिए मैप करें: userId => socketId // इससे हम उन विशिष्ट उपयोगकर्ताओं को संदेश भेज सकते हैं जो वर्तमान में कनेक्टेड हैं const connectedUsers = new Map(); // सॉकेट.io कनेक्शन हैंडलर - जब कोई क्लाइंट कनेक्ट होता है तब चलता है io.on('connection', socket => { console.log('🔗 सॉकेट कनेक्टेड:', socket.id); // 'प्रमाणीकरण' इवेंट को संभालें - क्लाइंट हमें बताता है कि वे कौन हैं socket.on('प्रमाणीकरण', ({ userId, उपयोगकर्ता नाम }) => { // इस उपयोगकर्ता की सॉकेट आईडी संग्रहीत करें ताकि हम उन्हें बाद में संदेश भेज सकें connectedUsers.set(userId, socket.id); socket.userId = userId; // इस सॉकेट में userId संलग्न करें socket.username = उपयोगकर्ता नाम; // इस सॉकेट में उपयोगकर्ता नाम संलग्न करें console.log(`✅ प्रमाणीकृत उपयोगकर्ता: ${उपयोगकर्ता नाम}`); }); // 'share_playlist' इवेंट को संभालें - उपयोगकर्ता दोस्तों के साथ साझा करना चाहता है socket.on('share_playlist', async ({ friendName, mood, playlist, friendIds }) => { try { // सभी मित्र आईडी के माध्यम से लूप करें for (let friendId of friendIds) { // इस मित्र के लिए सॉकेट आईडी प्राप्त करें (यदि वे ऑनलाइन हैं) const sid = connectedUsers.get(friendId.toString()); if (sid) { // मित्र ऑनलाइन है! उन्हें एक वास्तविक समय अधिसूचना भेजें io.to(sid).emit('friend_shared_playlist', { friendName, mood, playlist }); } // यदि मित्र ऑफ़लाइन है, तो वे लॉगिन करते समय अपनी गतिविधि फ़ीड में प्लेलिस्ट देखेंगे } } catch (err) { console.error('प्लेलिस्ट साझा करने में त्रुटि:', err); } }); // डिस्कनेक्ट को संभालें - उपयोगकर्ता को ऑनलाइन मैप से हटा दें socket.on('disconnect', () => { if (socket.userId) { connectedUsers.delete(socket.userId); console.log(`👋 Disconnected: ${socket.username}`); } }); }); // JSON अनुरोध निकायों को पार्स करने के लिए मिडलवेयर app.use(express.json()); // 'पब्लिक' फ़ोल्डर (HTML, CSS, इमेज) से स्थिर फ़ाइलें प्रदान करें app.use(express.static(path.join(__dirname, 'public'))); // ===== एपीआई एंडपॉइंट्स ===== // POST /api/register - एक नया उपयोगकर्ता खाता बनाएं app.post('/api/register', async (req, res) => { try { const { उपयोगकर्ता नाम, ईमेल, पासवर्ड } = req.body; // इनपुट मान्य करें यदि (! उपयोगकर्ता नाम || ! ईमेल || ! पासवर्ड) { return res.status(400).json({ त्रुटि: 'सभी फ़ील्ड आवश्यक हैं' }); } यदि (पासवर्ड.length < 6) { return res.status(400).json({ त्रुटि: 'पासवर्ड कम से कम 6 अक्षर का होना चाहिए' }); } // जांचें कि क्या उपयोगकर्ता नाम या ईमेल पहले से मौजूद है const exists = await User.findOne({ $or: [{ उपयोगकर्ता नाम }, { ईमेल }] }); यदि (मौजूद है) { return res.status(400).json({ त्रुटि: 'उपयोगकर्ता नाम या ईमेल पहले से मौजूद है' }); } // नया उपयोगकर्ता बनाएं और सहेजें (पासवर्ड हमारे प्री-सेव मिडलवेयर द्वारा स्वचालित रूप से हैश किया जाएगा) const user = new User({ उपयोगकर्ता नाम, ईमेल, पासवर्ड }); await user.save(); res.status(201).json({ संदेश: 'उपयोगकर्ता सफलतापूर्वक बनाया गया' }); } catch (err) { console.error('पंजीकरण त्रुटि:', err); res.status(500).json({ त्रुटि: 'पंजीकरण विफल' }); } }); // POST /api/login - उपयोगकर्ता को प्रमाणित करें और JWT टोकन लौटाएं app.post('/api/login', async (req, res) => { try { const { username, password } = req.body; // उपयोगकर्ता नाम या ईमेल द्वारा उपयोगकर्ता खोजें const user = await User.findOne({ $or: {[ username }, { email: username }] }); // जांचें कि उपयोगकर्ता मौजूद है और पासवर्ड सही है if (!user || !(await user.comparePassword(password))) { return res.status(401).json({ error: 'Invalid credentials' }); } // JWT टोकन बनाएं (एक अस्थायी आईडी कार्ड की तरह) const token = jwt.sign( { userId: user._id }, // पेलोड (हम क्या एन्कोड कर रहे हैं) process.env.JWT_SECRET, // गुप्त कुंजी (इसे सुरक्षित रखता है) { expiresIn: '7d' } // टोकन 7 दिनों में समाप्त हो रहा है ); // टोकन को क्लाइंट को वापस भेजें res.json({ token, user: { username: user.username, email: user.email, friends: user.friends } }); } catch (err) { console.error('लॉगिन त्रुटि:', err); res.status(500).json({ error: 'लॉगिन विफल' }); } }); // GET /api/profile - वर्तमान उपयोगकर्ता की प्रोफ़ाइल प्राप्त करें // 'auth' मिडलवेयर JWT टोकन की पुष्टि करता है और उपयोगकर्ता को req.user से जोड़ता है app.get('/api/profile', auth, async (req, res) => { try { // उपयोगकर्ता आँकड़े अपडेट करें req.user.updateStats(); await req.user.save(); // दोस्तों की सरणी भरें (ऑब्जेक्ट आईडी को वास्तविक उपयोगकर्ता ऑब्जेक्ट से बदलें) await req.user.populate('friends', 'username _id'); const { username, email, friends } = req.user; res.json({ _id: req.user._id, username, email, friends: friends.map(f => ({ username: f.username, _id: f._id })) }); } catch (err) { console.error('प्रोफ़ाइल त्रुटि:', err); res.status(500).json({ त्रुटि: 'प्रोफ़ाइल लोड करने में विफल' }); } }); // GET /api/shared-playlists - दोस्तों द्वारा आपके साथ साझा की गई प्लेलिस्ट प्राप्त करें app.get('/api/shared-playlists', auth, async (req, res) => { try { // अंतिम 10 साझा प्लेलिस्ट प्राप्त करें, सबसे हाल की पहले से क्रमबद्ध const sharedPlaylists = req.user.sharedPlaylists .sort((a, b) => b.timestamp - a.timestamp) // टाइमस्टैम्प द्वारा अवरोही क्रमबद्ध करें .slice(0, 10); // पहले 10 लें res.json({ sharedPlaylists }); } catch (err) { console.error('साझा प्लेलिस्ट त्रुटि:', err); res.status(500).json({ error: 'साझा प्लेलिस्ट लोड करने में विफल' }); } }); // POST /api/add-friend - एक मित्र जोड़ें (आपसी मित्रता) app.post('/api/add-friend', auth, async (req, res) => { try { const { friendUsername } = req.body; // उपयोगकर्ता नाम से मित्र को ढूंढें const friend = await User.findOne({ username: friendUsername }); if (!friend) { return res.status(404).json({ error: 'उपयोगकर्ता नहीं मिला' }); } // जांचें कि क्या पहले से ही मित्र हैं if (req.user.friends.some(friendId => friendId.toString() === friend._id.toString())) { return res.status(400).json({ error: 'इस उपयोगकर्ता के साथ पहले से ही मित्र हैं' }); } // प्रत्येक उपयोगकर्ता को दूसरे की मित्र सूची में जोड़ें (आपसी मित्रता) req.user.friends.push(friend._id); friend.friends.push(req.user._id); // दोनों उपयोगकर्ताओं को सहेजें await req.user.save(); await friend.save(); res.json({ message: 'मित्र सफलतापूर्वक जोड़ा गया', friendId: friend._id }); } catch (err) { console.error('मित्र जोड़ने में त्रुटि:', err); console.error('त्रुटि स्टैक:', err.stack); res.status(500).json({ त्रुटि: 'मित्र जोड़ने में विफल' }); } }); // POST /api/personalized-playlist - मूड-आधारित प्लेलिस्ट बनाएं app.post('/api/personalized-playlist', auth, async (req, res) => { try { const { text, shareWithFriends = false, playlistSize = 15 } = req.body; if (!text) { return res.status(400).json({ error: 'कृपया मुझे बताएं कि आप कैसा महसूस कर रहे हैं!' }); } // 1. उपयोगकर्ता के टेक्स्ट से मूड का विश्लेषण करें const moodAnalysis = moodAnalyzer.analyzeMood(text); // 2. मूड के आधार पर प्लेलिस्ट बनाएं const playlist = await playlistGen.generatePlaylist( moodAnalysis.mood, moodAnalysis.intensity, playlistSize ); // 3. उपयोगकर्ता के मूड इतिहास में सहेजें const entry = { text, detectedMood: moodAnalysis.mood, confidence: moodAnalysis.confidence, isShared: shareWithFriends, sharedWith: shareWithFriends ? req.user.friends : [], playlistGenerated: playlist.map(t => ({ trackName: t.name, artist: t.artist, spotifyId: t.id })) }; req.user.moodHistory.push(entry); req.user.updateStats(); await req.user.save(); // 4. यदि साझाकरण सक्षम है, तो प्रत्येक मित्र के sharedPlaylists सरणी में सहेजें यदि (shareWithFriends && req.user.friends.length > 0) { const sharedPlaylistData = { sharedBy: req.user._id, sharedByUsername: req.user.username, mood: moodAnalysis.mood, playlist: playlist.slice(0, 5).map(t => ({ // पहले 5 ट्रैक साझा करें नाम: t.name, artist: t.artist, album_image: t.album_image, id: t.id })) }; // सभी दोस्तों के माध्यम से लूप करें और इस प्लेलिस्ट को उनके साझा किए गए प्लेलिस्ट में जोड़ें for (let friendId of req.user.friends) { const friend = await User.findById(friendId); if (friend) { friend.sharedPlaylists.push(sharedPlaylistData); await friend.save(); } } } // 5. क्लाइंट को प्रतिक्रिया भेजें res.json({ moodAnalysis, playlist, personallyMessage: `आपके इतिहास के आधार पर, यहां आपकी सही ${moodAnalysis.mood} प्लेलिस्ट है!` }); } catch (err) { console.error('व्यक्तिगत प्लेलिस्ट त्रुटि:', err); console.error('त्रुटि स्टैक:', err.stack); res.status(500).json({ error: 'विफल वैयक्तिकृत प्लेलिस्ट बनाने के लिए। कृपया पुन: प्रयास करें।' }); } }); // फ़ॉलबैक: किसी भी गैर-एपीआई रूट (एसपीए रूटिंग के लिए) के लिए index.html परोसें app.use((req, res, next) => { if (req.method === 'GET' && !req.path.startsWith('/api/')) { res.sendFile(path.join(__dirname, 'public', 'index.html')); } else { next(); } }); // वैश्विक त्रुटि हैंडलर app.use((err, req, res, next) => { console.error('वैश्विक त्रुटि:', err); res.status(500).json({ error: 'आंतरिक सर्वर त्रुटि', details: err.message }); }); // सर्वर प्रारंभ करें server.listen(PORT, () => { console.log(`🚀 Server running on http://localhost:${PORT}`); });

मुख्य सर्वर अवधारणाओं की व्याख्या:

मिडलवेयर - फ़ंक्शन जो आपके रूट हैंडलर तक पहुंचने से पहले अनुरोधों को संसाधित करते हैं। express.json() अनुरोध निकायों से JSON को पार्स करता है, auth JWT टोकन को सत्यापित करता है।
async/await - अतुल्यकालिक संचालन (जैसे डेटाबेस क्वेरी) को संभालने के लिए आधुनिक जावास्क्रिप्ट सिंटैक्स। await वादा पूरा होने तक निष्पादन को रोक देता है।
HTTP स्थिति कोड – परिणाम दर्शाने वाली संख्याएँ: 200 = सफलता, 201 = बनाया गया, 400 = गलत अनुरोध, 401 = अनधिकृत, 404 = नहीं मिला, 500 = सर्वर त्रुटि।
Socket.io ईवेंट – नामित संदेश जो क्लाइंट और सर्वर के बीच आते-जाते रहते हैं। socket.on() ईवेंट सुनता है, socket.emit() ईवेंट भेजता है।
JWT (JSON वेब टोकन) – उपयोगकर्ताओं की पहचान करने का एक सुरक्षित तरीका। जब वे लॉगिन करते हैं, तो हम उन्हें एक टोकन देते हैं। वे यह टोकन प्रत्येक अनुरोध के साथ भेजते हैं ताकि यह साबित हो सके कि वे कौन हैं।

चरण 5: फ्रंटएंड जावास्क्रिप्ट अपडेट करें (public/js/app.js)

अंत में, आइए जावास्क्रिप्ट जोड़ें जो हमारे फ्रंटएंड को इंटरैक्टिव बनाता है। यह कोड उपयोगकर्ता के ब्राउज़र में चलता है और बटन क्लिक, API अनुरोध और रीयल-टाइम अपडेट जैसी चीज़ों को संभालता है।

यह JavaScript क्या करता है:

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

अपना बदलें public/js/app.js ट्यूटोरियल में दिखाए गए पूरे कोड के साथ...

(app.js कोड ब्लॉक बिल्कुल पहले जैसा ही है, जिसमें लॉगिन, रजिस्टर, loadSharedPlaylists आदि के सभी फ़ंक्शन मौजूद हैं।)

चरण 6: अपने सोशल म्यूज़िक API का परीक्षण करें

अब सब कुछ परीक्षण करने का समय आ गया है! इन चरणों का ध्यानपूर्वक पालन करें:

अपना सर्वर शुरू करें: अपने टर्मिनल में, npm start चलाएँ। आपको "MongoDB कनेक्टेड!" और "सर्वर http://localhost:3000 पर चल रहा है" जैसे संदेश दिखाई देने चाहिए।
दो ब्राउज़र विंडो खोलें: http://localhost:3000 को दो अलग-अलग ब्राउज़र विंडो (या एक नियमित विंडो और एक गुप्त विंडो) में खोलें। यह दो अलग-अलग उपयोगकर्ताओं का अनुकरण करता है।
उपयोगकर्ता 1 पंजीकृत करें: पहली विंडो में, "साइन अप" पर क्लिक करें और एक उपयोगकर्ता बनाएँ (उदाहरण के लिए, उपयोगकर्ता नाम: "alice")।
उपयोगकर्ता 2 पंजीकृत करें: दूसरी विंडो में, एक और उपयोगकर्ता बनाएँ (उदाहरण के लिए, उपयोगकर्ता नाम: "bob")।
एक-दूसरे को मित्र के रूप में जोड़ें: ऐलिस की विंडो में, "मित्र जोड़ें" फ़ील्ड में "bob" टाइप करें और मित्र जोड़ें पर क्लिक करें। बॉब की विंडो में भी यही करें (टाइप करें "alice")। आपको एक-दूसरे को अपनी मित्र सूची में देखना चाहिए!
प्लेलिस्ट साझा करें: ऐलिस की विंडो में, मूड टेक्स्ट बॉक्स में "मैं आज बहुत खुश महसूस कर रही हूँ!" जैसा कुछ लिखें। "दोस्तों के साथ साझा करें" चेकबॉक्स को चेक करें, फिर "प्लेलिस्ट बनाएं" पर क्लिक करें।
जादू होते हुए देखें:
- यदि बॉब ऑनलाइन है (विंडो अभी भी खुली है), तो उसे दाईं ओर से एक सूचना स्लाइड दिखाई देगी!
- बॉब को ऐलिस की साझा प्लेलिस्ट भी उसके "हाल की गतिविधि" अनुभाग में दिखाई देगी।
- बॉब गानों की पूरी सूची देखने के लिए साझा प्लेलिस्ट पर क्लिक कर सकता है।
- यदि बॉब लॉग आउट करता है और बाद में वापस लॉग इन करता है, तो साझा प्लेलिस्ट अभी भी वहां मौजूद रहेगी!

यह समझना कि यह सब एक साथ कैसे काम करता है

आइए देखें कि क्या होता है जब ऐलिस बॉब के साथ एक प्लेलिस्ट साझा करती है:

ऐलिस "दोस्तों के साथ साझा करें" चेक करती है और "प्लेलिस्ट जनरेट करें" पर क्लिक करती है
फ्रंटेंड /api/personalized-playlist को shareWithFriends: true के साथ एक POST अनुरोध भेजता है
सर्वर ऐलिस के मूड का विश्लेषण करता है और Spotify API का उपयोग करके एक प्लेलिस्ट बनाता है
सर्वर प्लेलिस्ट को ऐलिस के moodHistory ऐरे में सेव करता है
सर्वर ऐलिस के दोस्तों (बॉब सहित) के माध्यम से लूप करता है और प्लेलिस्ट को प्रत्येक दोस्त की प्लेलिस्ट में जोड़ता है MongoDB में sharedPlaylists सरणी
फ़्रंटेंड ऑनलाइन मित्रों को सूचित करने के लिए एक share_playlist Socket.io ईवेंट उत्सर्जित करता है
सर्वर ईवेंट प्राप्त करता है और जाँचता है कि बॉब ऑनलाइन है या नहीं (connectedUsers मानचित्र में देखता है)
यदि बॉब ऑनलाइन है, तो सर्वर उसे प्लेलिस्ट पूर्वावलोकन के साथ एक friend_shared_playlist ईवेंट भेजता है
बॉब का ब्राउज़र ईवेंट प्राप्त करता है और पॉपअप प्रदर्शित करने के लिए showNotification() को कॉल करता है
बॉब का ब्राउज़र गतिविधि फ़ीड को रीफ़्रेश करने के लिए loadSharedPlaylists() को भी कॉल करता है
अगर बॉब ऑफ़लाइन है, तो अगली बार लॉग इन करने पर उसे अपनी गतिविधि फ़ीड में प्लेलिस्ट दिखाई देगी (क्योंकि यह उसकी sharedPlaylists सरणी में सहेजी गई है)

आपने क्या बनाया

बधाई हो! आपने सफलतापूर्वक एक पूर्ण-विशेषताओं वाला सोशल म्यूज़िक ऐप बना लिया है! आपने यह हासिल किया:

🤝 मित्र प्रणाली – उपयोगकर्ता उपयोगकर्ता नाम से मित्रों को जोड़ सकते हैं। मित्रता पारस्परिक होती है (दोनों उपयोगकर्ता एक-दूसरे के मित्र बन जाते हैं) और MongoDB में ObjectId संदर्भों के रूप में संग्रहीत होती हैं।
💾 स्थायी प्लेलिस्ट साझाकरण – साझा प्लेलिस्ट प्रत्येक मित्र की sharedPlaylists सरणी में डेटाबेस में सहेजी जाती हैं। इसका मतलब है कि उपयोगकर्ताओं के लॉग आउट करने के बाद भी डेटा बना रहता है।
📡 रीयल-टाइम सूचनाएँ - Socket.io का उपयोग करके, ऑनलाइन उपयोगकर्ताओं को मित्रों द्वारा प्लेलिस्ट साझा करने पर तुरंत सूचनाएँ मिलती हैं। पृष्ठ रीफ्रेश करने की आवश्यकता नहीं!
📰 गतिविधि फ़ीड - उपयोगकर्ता अपने सभी मित्रों की हाल ही में साझा की गई प्लेलिस्ट देख सकते हैं, जो सबसे नई के अनुसार पहले क्रमबद्ध होती हैं। किसी प्लेलिस्ट पर क्लिक करने से पूरी ट्रैक सूची दिखाई देती है।
🔐 सुरक्षित प्रमाणीकरण - पासवर्ड bcrypt के साथ हैश किए जाते हैं (कभी भी सादे पाठ के रूप में संग्रहीत नहीं), और API अनुरोधों को प्रमाणित करने के लिए JWT टोकन का उपयोग किया जाता है।
⏱️ ऑफ़लाइन-अनुकूल - मित्र साझा की गई प्लेलिस्ट देख सकते हैं, भले ही वे प्लेलिस्ट साझा किए जाने के समय ऑनलाइन न हों। सब कुछ डेटाबेस में सहेजा गया है!

आपके द्वारा सीखी गई प्रमुख अवधारणाएँ

Socket.io (WebSockets) के साथ वास्तविक समय संचार
डेटाबेस संबंध MongoDB ObjectId संदर्भों का उपयोग करते हुए
प्रदर्शन के लिए डीनॉर्मलाइज़ेशन (ObjectId और उपयोगकर्ता नाम दोनों को संग्रहीत करना)
RESTful API डिज़ाइन (उचित HTTP स्थिति कोड के साथ GET, POST एंडपॉइंट)
प्रमाणीकरण और अनुरोध प्रसंस्करण के लिए मिडलवेयर पैटर्न
एसिंक्रोनस संचालन को संभालने के लिए Async/await
DOM हेरफेर UI को गतिशील रूप से अपडेट करने के लिए
Socket.io इवेंट्स के साथ इवेंट-संचालित आर्किटेक्चर

सामान्य समस्याओं का निवारण

"MongoDB से कनेक्ट नहीं हो पा रहा है" – सुनिश्चित करें कि आपका MongoDB सर्वर चल रहा है और .env में आपका MONGODB_URI सही है।
लॉग इन करते समय "अमान्य क्रेडेंशियल्स" – अपने उपयोगकर्ता नाम और पासवर्ड की दोबारा जाँच करें। याद रखें, वे केस-सेंसिटिव हैं!
मित्र जोड़ते समय "उपयोगकर्ता नहीं मिला" – सुनिश्चित करें कि आप सटीक उपयोगकर्ता नाम (केस-सेंसिटिव) टाइप कर रहे हैं। उन्हें पहले पंजीकृत होना चाहिए।
साझा प्लेलिस्ट दिखाई नहीं दे रही हैं – त्रुटियों के लिए अपने ब्राउज़र के कंसोल (F12) की जाँच करें। सुनिश्चित करें कि दोनों उपयोगकर्ता मित्र हैं और "मित्रों के साथ साझा करें" चेकबॉक्स चेक किया गया है।
वास्तविक समय सूचनाएं काम नहीं कर रही हैं - सुनिश्चित करें कि Socket.io कनेक्ट है। ब्राउज़र कंसोल में "🔗 सर्वर से कनेक्टेड" देखें।

अगले चरण और विस्तार के विचार

अब जब आपके पास एक कार्यशील सोशल म्यूज़िक ऐप है, तो इसे आगे बढ़ाने के लिए यहां कुछ विचार दिए गए हैं:

मित्र अनुरोध – तुरंत दोस्ती करने के बजाय, उपयोगकर्ताओं से ऐसे अनुरोध भेजने की अपेक्षा करें जिन्हें स्वीकार या अस्वीकार किया जा सके
निजी संदेश – Socket.io का उपयोग करके एक चैट सिस्टम जोड़ें ताकि मित्र एक-दूसरे को संदेश भेज सकें
प्लेलिस्ट टिप्पणियाँ – उपयोगकर्ताओं को साझा प्लेलिस्ट पर टिप्पणी करने दें
ट्रैक पसंद/नापसंद करें – प्लेलिस्ट में प्रत्येक ट्रैक में थंब्स अप/डाउन बटन जोड़ें
संगीत स्वाद अनुकूलता – दो उपयोगकर्ताओं की संगीत प्राथमिकताएँ कितनी समान हैं, इसके आधार पर प्रतिशत की गणना करें
उपयोगकर्ताओं को खोजें – उपयोगकर्ता नाम से उपयोगकर्ताओं को खोजने के लिए एक खोज सुविधा जोड़ें
हटाएँ/अनफ्रेंड करें – दोस्तों को हटाने या शेयर की गई प्लेलिस्ट हटाने की सुविधा जोड़ें
प्रोफ़ाइल पेज – उपयोगकर्ता के आँकड़े, पसंदीदा मूड और हाल की प्लेलिस्ट दिखाएँ
सहयोगी प्लेलिस्ट – कई दोस्तों को शेयर की गई प्लेलिस्ट में ट्रैक जोड़ने दें
प्लेलिस्ट इतिहास – अपनी सभी पहले से बनाई गई प्लेलिस्ट देखें

आपने रीयल-टाइम सुविधाओं और स्थायी डेटा स्टोरेज के साथ एक पूर्ण-स्टैक सोशल म्यूज़िक ऐप बनाया है! यह आधुनिक वेब डेवलपमेंट को समझने के लिए एक ठोस आधार है। प्रयोग करते रहें और आगे बढ़ते रहें!🎵✨