React ऐप में कस्टम डोमेन जोड़ें: सरल लॉन्च चेकलिस्ट

अगर आपने add a custom domain to a React app खोजा है, तो आपको काम करते हुए कोड से सार्वजनिक URL तक का सबसे छोटा, भरोसेमंद रास्ता चाहिए — बिना सर्वर सेट अप किए, विशाल क्लाउड डैशबोर्ड सीखे, या एक भी यूज़र होने से पहले क्रेडिट कार्ड डाले। यह गाइड बताती है कि jsdeck से यह कैसे करें, ट्रेड-ऑफ़ क्या हैं, और कब कोई दूसरा टूल वाकई बेहतर विकल्प है। हम इसे व्यावहारिक रखेंगे: असली कदम, असली कमांड, और ईमानदार चेतावनियाँ।
पूर्वापेक्षाएँ
- Node.js इंस्टॉल हो (या आपके फ्रेमवर्क के लिए संबंधित SDK)
- ऐसा प्रोजेक्ट जो स्टैटिक फ़ाइलों में बिल्ड हो (
dist/,build/, याout/आमतौर पर) - मुफ़्त jsdeck अकाउंट — क्रेडिट कार्ड की ज़रूरत नहीं
अगर आपका प्रोजेक्ट पहले से लोकल पर चलता है और बिल्ड फ़ोल्डर बनाता है, तो आपके पास ज़रूरी सब कुछ है।
स्टैटिक बंडल बनाएँ
React ऐप में कस्टम डोमेन जोड़ने का मूल विचार यह है कि आपका फ्रेमवर्क सादे HTML, CSS और JavaScript में कंपाइल हो जाता है। प्रोडक्शन बिल्ड चलाएँ (npm run build ज़्यादातर सेटअप में) और पुष्टि करें कि आउटपुट फ़ोल्डर बन गया। अपलोड से पहले npx serve dist (फ़ोल्डर नाम बदलें) से लोकल पर जाँच लें।
चार कदमों में डिप्लॉय करें
- बिल्ड:
npm run build - साइन अप: मुफ़्त अकाउंट बनाएँ
- अपलोड: jsdeck डैशबोर्ड में आउटपुट फ़ोल्डर खींचकर छोड़ें, या
jsdeck deployचलाएँ - सत्यापन: अपना
*.jsdeck.comURL खोलें और नेविगेशन, डीप लिंक और रिफ़्रेश टेस्ट करें
स्टैटिक होस्ट पर क्लाइंट-साइड रूटिंग
अगर ऐप क्लाइंट-साइड राउटर इस्तेमाल करता है, तो अज्ञात पथों को index.html पर रीराइट करना होगा, नहीं तो डीप लिंक पर रिफ़्रेश से 404 मिलेगा। jsdeck होस्टेड ऐप्स के लिए SPA fallback अपने आप लगाता है, इसलिए React Router, Vue Router आदि तुरंत काम करते हैं। (अंतर्निहित तरीके के लिए हमारे रूटिंग फ़िक्स गाइड हब में देखें।)
कस्टम डोमेन, HTTPS और पर्सिस्टेंस
jsdeck सबडोमेन के लिए HTTPS अपने आप प्रोविज़न हो जाता है। प्रोडक्शन के लिए तैयार हों तो ऐप डैशबोर्ड से कस्टम डोमेन जोड़ें। अगर ऐप को कुछ स्टोर करना है, तो ब्राउज़र-केवल स्टोरेज के बजाय datastore चालू करें ताकि डेटा डिवाइस और सेशन में बना रहे।
स्टैटिक डिप्लॉय में समस्या निवारण
ज़्यादातर पहली डिप्लॉय समस्याएँ कुछ ही कारणों से आती हैं। क्रम से इन्हें जाँचें:
- डिप्लॉय के बाद खाली पेज: आमतौर पर asset-path समस्या। अगर बंडलर पूर्ण पथ (
/assets/...) देता है लेकिन sub-path चाहिए, तो बिल्ड कॉन्फ़िग में सहीbaseसेट करके दोबारा बिल्ड करें। - डीप लिंक पर रिफ़्रेश से 404: ऊपर वाला SPA-fallback मामला — राउटर history mode में है यह पुष्टि करें और jsdeck की अपनी रीराइट पर भरोसा करें।
- पुराना वर्ज़न अभी भी दिख रहा: कैश्ड asset। बंडलर फ़ाइल नामों में content hash जोड़ते हैं, इसलिए नया बिल्ड और hard refresh से ठीक हो जाता है।
- Mixed-content चेतावनियाँ: हर अनुरोध HTTPS पर करें; jsdeck ऐप HTTPS पर सर्व करता है, इसलिए कोई भी
http://संसाधन ब्राउज़र ब्लॉक कर देगा।
अपलोड से पहले npm run preview से लोकल जाँच लगभग हर बार एक राउंड-ट्रिप बचाती है।
यह किसके लिए है, और jsdeck कब नहीं
अच्छा विकल्प: स्टैटिक फ्रंटएंड, सिंगल-पेज ऐप्स, डेमो, पोर्टफ़ोलियो, MVP, AI-जनित एक्सपोर्ट, और थोड़ी JSON पर्सिस्टेंस या हल्का visitor login चाहने वाले ऐप।
उपयुक्त नहीं: लंबे समय तक चलने वाला Node सर्वर, रिक्वेस्ट समय पर server-side rendering, WebSocket बैकएंड, निजी server-side secrets, बैकग्राउंड जॉब, या पूर्ण relational डेटाबेस चाहने वाले ऐप। उनके लिए हमारे तुलना हब में चर्चित विकल्प बेहतर होंगे — और जानबूझकर चुनना यही सही है, समझौता नहीं।
अक्सर पूछे जाने वाले प्रश्न
क्या React ऐप में कस्टम डोमेन जोड़ना वाकई मुफ़्त है?
हाँ। jsdeck इस तरह के प्रोजेक्ट्स के लिए HTTPS सहित मुफ़्त स्टैटिक होस्टिंग देता है, शुरू करने के लिए क्रेडिट कार्ड की ज़रूरत नहीं। datastore और visitor auth जैसी वैकल्पिक सुविधाएँ ज़रूरत पड़ने पर उपलब्ध हैं।
क्या Git रिपॉज़िटरी कनेक्ट करनी होगी?
नहीं। डैशबोर्ड में सीधे बिल्ड फ़ोल्डर अपलोड कर सकते हैं, या jsdeck deploy से CLI से डिप्लॉय कर सकते हैं। Git वैकल्पिक है।
क्या क्लाइंट-साइड रूट रिफ़्रेश पर टूट जाएँगे?
नहीं। jsdeck SPA fallback लगाता है, इसलिए डीप लिंक और रिफ़्रेश 404 के बजाय आपके ऐप पर पहुँचाते हैं।
अगले कदम
- React होस्टिंग हब में और गाइड देखें
- पहला ऐप डिप्लॉय करने के लिए शुरुआत गाइड अनुसरण करें
- datastore, सुरक्षित अकाउंट (auth API), और CLI डिप्लॉय विवरण के लिए डेवलपर दस्तावेज़ पढ़ें