तुमचा फ्रंट एंड अजूनही jQuery, जुन्या क्लास कंपोनंट्स किंवा कालबाह्य Next.js सेटअपवर चालतो आणि प्रत्येक बदलाला जास्त वेळ लागतो. मी ते आधुनिक रिॲक्ट किंवा Next.js मध्ये TypeScript मध्ये एका वेळी एक पेज हलवतो, तर उत्पादन कार्य करत राहते.
मी तुमचा jQuery किंवा लेगसी रिॲक्ट फ्रंट एंड आधुनिक रिॲक्ट किंवा Next.js मध्ये, पेज बाय पेज हलवेन.
तुमच्या फ्रंट एंडसाठी एक स्थलांतर योजना आणि नमुना म्हणून हलवलेले एक छोटे पान.
- योजना आणि एक नमुना पान
- लिखित स्थलांतर योजना
- स्रोत कोड
3पर्यंतची पाने React किंवा Next.js मध्ये हलवली, जुन्या कोडच्या शेजारी चालू आहेत.
- पर्यंतची 3 पाने हलवली
- लिखित स्थलांतर योजना
- स्रोत कोड
8पर्यंतची पाने, सामायिक घटक, TypeScript प्रकार आणि चाचण्या.
- पर्यंतची 8 पाने, घटक, चाचण्या
- लिखित स्थलांतर योजना
- स्रोत कोड
सानुकूल ऑफरची विनंती करा
सानुकूल ऑफरची विनंती करण्यासाठी लॉग इन करा
या Zinner कडून वैयक्तिकृत ऑफरची विनंती करण्यासाठी एक विनामूल्य खाते तयार करा किंवा लॉग इन करा.
लॉग इन / नोंदणी कराविक्रीपूर्व प्रश्न विचारा
प्रश्न विचारण्यासाठी लॉग इन करा
प्लॅटफॉर्मवरील स्पॅम कमी करण्यासाठी, प्री-सेल मेसेजेस फक्त लॉग-इन केलेल्या युजर्सनाच पाठवता येतील.
या Zinner ला थेट संदेश पाठवण्यासाठी एक विनामूल्य खाते तयार करा किंवा लॉग इन करा.
लॉग इन / नोंदणी करालॉगिन आवश्यक आहे
या Zinner ला संदेश पाठवण्यासाठी एक विनामूल्य खाते तयार करा किंवा लॉग इन करा.
लॉग इन / नोंदणी करालॉगिन आवश्यक आहे
वैयक्तिकृत ऑफरची विनंती करण्यासाठी एक विनामूल्य खाते तयार करा किंवा लॉग इन करा.
लॉग इन / नोंदणी कराएका दृष्टीक्षेपात
तुम्हाला निर्णय घेण्यास मदत करण्यासाठी या सेवेबद्दलची प्रमुख माहिती. Zinn Hub द्वारे व्युत्पन्न, विक्रेत्याद्वारे नाही.
मूल्य स्थिती
स्थलांतर दृष्टीकोन
टेक स्टॅक
काय अबाधित राहते
वितरणोत्तर समर्थन
तुम्हाला काय मिळेल
पूर्ण वर्णन
काही उत्पादने काम करतात आणि पैसे कमावतात, परंतु त्यांचा फ्रंट एंड बदलणे कठीण झाले आहे: टेम्पलेट्समध्ये पसरलेले jQuery, काही वर्षांपूर्वीचे React क्लास घटक, किंवा Pages Router वर असलेले Next.js ॲप. पूर्णपणे पुन्हा लिहिण्यामुळे उत्पादन अनेक महिने थांबते. मी दुसरे काम करतो: जुना आणि नवीन कोड शेजारी-शेजारी चालतो, आणि पाने एका वेळी एक-एक करून हलतात, त्यामुळे तुमच्या वापरकर्त्यांसाठी कधीही मोठा स्विच-ओव्हर दिवस नसतो.
मी NDA अंतर्गत एका मागील प्रकल्पात हेच केले: उत्पादन लाइव्ह असताना jQuery फ्रंट एंड React मध्ये पानोपानी हलवले.
स्टार्टर तुम्हाला योजना देतो: मी जुना फ्रंट एंड वाचतो, त्याची पाने आणि सामायिक भाग मॅप करतो, धोके सूचीबद्ध करतो आणि दृष्टिकोनाचा कार्यरत नमुना म्हणून एक छोटे पान स्थलांतरित करतो. स्टँडर्ड तीन पानांपर्यंत किंवा स्क्रीन हलवतो. ॲडव्हान्स्ड आठ पानांपर्यंत हलवतो, त्यांना आवश्यक असलेले सामायिक घटक तयार करतो आणि त्यांच्या डेटासाठी TypeScript प्रकार आणि मुख्य प्रवाहासाठी चाचण्यांनी त्यांना कव्हर करतो.
काय कायम राहते: तुमचे बॅकएंड, तुमचे URL आणि वापरकर्त्यांना माहीत असलेले वर्तन. काय बदलते: कोड कसा आयोजित केला जातो, जेणेकरून पुढील वैशिष्ट्य एकदाच, एकाच ठिकाणी लिहिले जाईल. वितरणाच्या 14 दिवसांनंतर, आम्ही सहमत नसलेली कोणतीही गोष्ट मी विनामूल्य दुरुस्त करतो.
पानांचा क्रम आणि योजना ऑर्डर चॅटमध्ये, कॉलशिवाय मान्य केली जाते. प्रत्येक स्थलांतरित पान स्वतःच पाठवले जाते आणि तुम्हाला प्रत्येक कामाच्या दिवशी एक लिखित स्थिती नोट मिळते.
तुमचा प्रकल्प पूर्ण करण्यासाठी पायऱ्या
1. जुना फ्रंट एंड मॅप करा - मी टेम्पलेट्स, स्क्रिप्ट्स आणि कंपोनंट्समधून जातो आणि पेजेस, शेअर केलेले भाग आणि जागतिक स्थिती किंवा इनलाइन स्क्रिप्ट्ससारख्या कोणत्याही जोखमीच्या गोष्टींची यादी करतो.
2. क्रम निश्चित करा - तुम्हाला एक लिखित योजना मिळते: कोणते पेज आधी येईल, त्याच्यासोबत काय जाईल आणि जुना आणि नवीन कोड दोन्ही अस्तित्वात असताना उत्पादन कसे शेअर करतील.
3. ब्रिज - नवीन React किंवा Next.js कोड जुन्या कोडच्या शेजारी सेट केला जातो, ज्यामध्ये प्रत्येक पेजला त्याच्या मालकीच्या बाजूला पाठवणारे राउटिंग असते.
4. पेजेस एक-एक करून हलवा - प्रत्येक पेज पुन्हा तयार केले जाते, जुन्या आवृत्तीशी तुलना केली जाते आणि स्वतःच स्विच केले जाते, त्यामुळे समस्या एका पेजवर परिणाम करते, उत्पादनावर नाही.
5. हस्तांतरण - स्थलांतरित पेजेस, उर्वरित गोष्टींसाठी अद्ययावित योजना आणि पुढील पेजेससाठी कोणत्या पॅटर्नचे पालन करावे याबद्दल एक छोटी टीप.
Zinner गुणवत्ता हमी
प्रत्येक Zinner ला प्लॅटफॉर्ममध्ये सामील होण्यापूर्वी पुनरावलोकन केले जाते आणि मंजूर केले जाते.
सर्व सेवा आमच्या गुणवत्ता हमी वचनबद्धतेने समर्थित आहेत.
तुम्ही वितरित केलेल्या कामाला मंजुरी देईपर्यंत तुमचे पेमेंट सुरक्षित आहे.
पॅकेजेसची तुलना करा
| कार्य | स्टार्टर | मानक | प्रगत |
|---|---|---|---|
| वितरण वेळ | 4 दिवस | 10 दिवस | 21 दिवस |
| पुनरावृत्ती | 1 | 2 | 3 |
| व्याप्ती | योजना आणि एक नमुना पृष्ठ | 3 पर्यंत पृष्ठे हलवली | 8 पर्यंत पृष्ठे, घटक, चाचण्या |
| लिखित स्थलांतर योजना | ✓ | ✓ | ✓ |
| सोर्स कोड | ✓ | ✓ | ✓ |
पोर्टफोलिओ
या Zinn शी संबंधित विक्रेत्याच्या कामाची उदाहरणे.
फॉर्मलाइन: स्ट्राइपसह नेक्स्ट.जेएस स्टोअर
तुम्ही क्लिक करू शकणारे स्टोअरफ्रंट: 16 संग्रहांमध्ये 4 पोस्टर्स, URL मध्ये राहणारे फिल्टर आणि शोध, एक कार्ट, हलक्या आणि गडद थीम्स, आणि एक चेकआउट जो डेमो ऑर्डरमध्ये किंवा चाचणी मोडमध्ये वास्तविक स्ट्राइप चेकआउट सत्रात संपतो. मी ते नेक्स्ट.जेएस स्टॅटिक एक्सपोर्ट म्हणून टाइपस्क्रिप्टमध्ये टेलविंड सीएसएससह तयार केले. कार्ड पेमेंट्स क्लाउडफ्लेअर वर्करद्वारे जातात जो सर्व्हरवर कार्टची किंमत पुन्हा ठरवतो आणि स्ट्राइपच्या वेबहुक स्वाक्षरीची पडताळणी करतो.
नेक्स्ट.जेएस मध्ये द्विभाषिक वैयक्तिक साइट
इंग्रजी आणि रशियनमध्ये एक-पानांची वैयक्तिक साइट, सेवा विभाग आणि माझ्या डेमो प्रकल्पांच्या लिंक्ससह. मी ती नेक्स्ट.जेएस, रिॲक्ट आणि टाइपस्क्रिप्टसह स्टॅटिक एक्सपोर्ट म्हणून डिझाइन आणि तयार केली, साध्या सीएसएस मॉड्यूल्ससह स्टाइल केली आणि कोणतेही यूआय फ्रेमवर्क नाही. यात हलक्या आणि गडद थीम्स आहेत, आणि प्रत्येक भाषेसाठी एक सामाजिक पूर्वावलोकन प्रतिमा बिल्ड वेळेस तयार केली जाते. गिटहब ॲक्शन्स ती तयार करते आणि बनी सीडीएनवर तैनात करते, जे सुरक्षा हेडर जोडते आणि www आणि साध्या HTTP ला मुख्य HTTPS पत्त्यावर पुनर्निर्देशित करते.
सेवेचे तपशील
वारंवार विचारले जाणारे प्रश्न
कारण उत्पादन अनेक महिने थांबून राहील आणि सर्व धोका एकाच रिलीझच्या दिवशी येईल. पृष्ठानुसार, प्रत्येक पायरी लहान, तपासण्यायोग्य आणि परत फिरवणे सोपे आहे.
पृष्ठे त्यांचे पत्ते कायम ठेवतात. Next.js सह, नवीन पृष्ठे तयार HTML म्हणून ब्राउझरमध्ये पोहोचतात, सर्व्हरवर किंवा बिल्ड वेळेस रेंडर केली जातात, त्यामुळे शोध इंजिन सामग्री पूर्वीप्रमाणेच पाहतात. Vite सह React ब्राउझरमध्ये रेंडर होते, त्यामुळे शोध रहदारी आणणाऱ्या पृष्ठांसाठी मी Next.js ची शिफारस करतो.
होय. स्थलांतरित पृष्ठे TypeScript मध्ये लिहिलेली आहेत आणि जुना कोड त्याची पाळी येईपर्यंत JavaScript म्हणून चालू राहतो.
नाही. स्थलांतर फक्त फ्रंट एंडला स्पर्श करते. तुमच्या बॅकएंडमध्ये पृष्ठाला आवश्यक असलेल्या डेटासाठी आधीच एंडपॉइंट्स असल्यास, नवीन पृष्ठ त्यांचा वापर करते. जर तो डेटा आज फक्त PHP द्वारे रेंडर केलेल्या HTML म्हणून अस्तित्वात असेल, तर योजना पृष्ठाला आवश्यक असलेल्या लहान JSON एंडपॉइंट्सची यादी करते आणि ते पृष्ठ हलवण्यापूर्वी कोण त्यांना जोडेल यावर आम्ही सहमत होतो.
ग्राहक पुनरावलोकने
आमचे ग्राहक या Zinn बद्दल काय म्हणतात ते पहा
श्रेणी
Zinner धोरणे
संबंधित Zinns
NextJS ReactJS MongoDB Firebase TypeScript सह तुमचा वेब ॲप्लिकेशन विकसित करा
