તમારું ફ્રન્ટ એન્ડ હજુ પણ jQuery, જૂના ક્લાસ કમ્પોનન્ટ્સ અથવા જૂના Next.js સેટઅપ પર ચાલે છે, અને દરેક ફેરફારમાં જરૂર કરતાં વધુ સમય લાગે છે. હું તેને એક સમયે એક પેજ કરીને આધુનિક રિએક્ટ અથવા Next.js માં ટાઇપસ્ક્રીપ્ટમાં ખસેડું છું, જ્યારે પ્રોડક્ટ કામ કરતી રહે છે.
હું તમારા jQuery અથવા લેગસી રિએક્ટ ફ્રન્ટ એન્ડને આધુનિક રિએક્ટ અથવા Next.js પર, પેજ બાય પેજ ખસેડીશ.
તમારા ફ્રન્ટ એન્ડ માટે એક માઇગ્રેશન પ્લાન અને નમૂના તરીકે એક નાનું પેજ ખસેડવામાં આવ્યું.
- પ્લાન અને એક નમૂના પેજ
- લેખિત માઇગ્રેશન પ્લાન
- સ્રોત કોડ
3 પેજ સુધી રિએક્ટ અથવા Next.js પર ખસેડવામાં આવ્યા, જે જૂના કોડની બાજુમાં ચાલી રહ્યા છે.
- સુધીના 3 પેજ ખસેડવામાં આવ્યા
- લેખિત માઇગ્રેશન પ્લાન
- સ્રોત કોડ
8 પેજ સુધી, શેર કરેલા ઘટકો, ટાઇપસ્ક્રીપ્ટ પ્રકારો અને પરીક્ષણો.
- સુધીના 8 પેજ, ઘટકો, પરીક્ષણો
- લેખિત માઇગ્રેશન પ્લાન
- સ્રોત કોડ
કસ્ટમ ઑફરની વિનંતી કરો
કસ્ટમ ઑફરની વિનંતી કરવા માટે લોગ ઇન કરો
આ Zinner પાસેથી વ્યક્તિગત ઑફરની વિનંતી કરવા માટે મફત એકાઉન્ટ બનાવો અથવા લૉગ ઇન કરો.
લોગ ઇન / રજીસ્ટર કરોપૂર્વ-વેચાણ પ્રશ્ન પૂછો
પ્રશ્ન પૂછવા માટે લોગ ઇન કરો
પ્લેટફોર્મ સ્પામ ઘટાડવા માટે, પ્રી-સેલ સંદેશાઓ ફક્ત લૉગ-ઇન કરેલા વપરાશકર્તાઓ દ્વારા જ મોકલી શકાય છે.
આ Zinner ને સીધો મેસેજ કરવા માટે મફત એકાઉન્ટ બનાવો અથવા લોગ ઇન કરો.
લોગ ઇન / રજીસ્ટર કરોલોગ ઇન કરવું જરૂરી છે
આ Zinner ને મેસેજ કરવા માટે મફત એકાઉન્ટ બનાવો અથવા લોગ ઇન કરો.
લોગ ઇન / રજીસ્ટર કરોલોગ ઇન કરવું જરૂરી છે
વ્યક્તિગત ઑફરની વિનંતી કરવા માટે મફત એકાઉન્ટ બનાવો અથવા લૉગ ઇન કરો.
લોગ ઇન / રજીસ્ટર કરોએક નજરમાં
તમને નિર્ણય લેવામાં મદદ કરવા માટે આ સેવા વિશેની મુખ્ય વિગતો. Zinn Hub દ્વારા જનરેટ કરાયેલ, વિક્રેતા દ્વારા નહીં.
મૂલ્ય સ્થિતિ
સ્થળાંતર અભિગમ
ટેક સ્ટેક
શું અકબંધ રહે છે
ડિલિવરી પછીનો સપોર્ટ
તમને શું મળશે
સંપૂર્ણ વર્ણન
કેટલાક ઉત્પાદનો કામ કરે છે અને પૈસા કમાય છે, પરંતુ તેમનો ફ્રન્ટ એન્ડ બદલવો મુશ્કેલ બની ગયો છે: ટેમ્પ્લેટ્સમાં ફેલાયેલ jQuery, વર્ષો પહેલાના રિએક્ટ ક્લાસ ઘટકો, અથવા પેજીસ રાઉટર પર હજુ પણ Next.js એપ્લિકેશન. સંપૂર્ણ ફરીથી લખવાથી ઉત્પાદન મહિનાઓ સુધી સ્થિર થઈ જાય છે. હું બીજી વસ્તુ કરું છું: જૂનો અને નવો કોડ બાજુમાં ચાલે છે, અને પેજ એક સમયે એક ખસે છે, જેથી તમારા વપરાશકર્તાઓ માટે ક્યારેય મોટો સ્વિચ-ઓવર દિવસ હોતો નથી.
મેં NDA હેઠળના ભૂતકાળના પ્રોજેક્ટ પર બરાબર આ જ કર્યું: એક jQuery ફ્રન્ટ એન્ડ રિએક્ટ પેજ બાય પેજ પર ખસેડવામાં આવ્યું જ્યારે ઉત્પાદન લાઇવ રહ્યું.
સ્ટાર્ટર તમને પ્લાન આપે છે: હું જૂનો ફ્રન્ટ એન્ડ વાંચું છું, તેના પેજ અને શેર કરેલા ટુકડાઓ મેપ કરું છું, જોખમોની સૂચિ બનાવું છું, અને અભિગમના કાર્યકારી નમૂના તરીકે એક નાનું પેજ માઇગ્રેટ કરું છું. સ્ટાન્ડર્ડ ત્રણ પેજ અથવા સ્ક્રીન સુધી ખસેડે છે. એડવાન્સ્ડ આઠ સુધી ખસેડે છે, તેમને જરૂરી શેર કરેલા ઘટકો બનાવે છે, અને તેમના ડેટા માટે ટાઇપસ્ક્રીપ્ટ પ્રકારો અને મુખ્ય પ્રવાહો માટે પરીક્ષણો સાથે તેમને આવરી લે છે.
શું રહે છે: તમારું બેકએન્ડ, તમારા URL અને વપરાશકર્તાઓ જાણે છે તે વર્તન. શું બદલાય છે: કોડ કેવી રીતે ગોઠવાયેલ છે, જેથી આગામી સુવિધા એકવાર, એક જગ્યાએ લખાય. ડિલિવરી પછી 14 દિવસ સુધી, અમે સંમત થયા મુજબ કામ ન કરતી કોઈપણ વસ્તુને હું વિના મૂલ્યે સુધારું છું.
પેજનો ક્રમ અને પ્લાન ઓર્ડર ચેટમાં, કોલ વિના સંમત થાય છે. દરેક માઇગ્રેટ કરેલું પેજ તેના પોતાના પર મોકલવામાં આવે છે, અને તમને દર કાર્યકારી દિવસે એક લેખિત સ્થિતિ નોંધ મળે છે.
તમારા પ્રોજેક્ટને પૂર્ણ કરવાના પગલાં
1. જૂના ફ્રન્ટ એન્ડને મેપ કરો - હું ટેમ્પ્લેટ્સ, સ્ક્રિપ્ટ્સ અને કમ્પોનન્ટ્સમાંથી પસાર થાઉં છું, અને પૃષ્ઠો, શેર કરેલા ભાગો અને કોઈપણ જોખમી વસ્તુઓ, જેમ કે ગ્લોબલ સ્ટેટ અથવા ઇનલાઇન સ્ક્રિપ્ટ્સની સૂચિ બનાવું છું.
2. ક્રમ પર સંમત થાઓ - તમને એક લેખિત યોજના મળે છે: કયું પૃષ્ઠ પહેલા આવે છે, તેની સાથે શું ખસે છે, અને જૂનો અને નવો કોડ બંને અસ્તિત્વમાં હોય ત્યારે ઉત્પાદનને કેવી રીતે શેર કરે છે.
3. બ્રિજ - નવો React અથવા Next.js કોડ જૂના કોડની બાજુમાં સેટ કરવામાં આવે છે, જેમાં રૂટિંગ હોય છે જે દરેક પૃષ્ઠને તેના માલિકીના પક્ષમાં મોકલે છે.
4. પૃષ્ઠોને એક પછી એક ખસેડો - દરેક પૃષ્ઠને ફરીથી બનાવવામાં આવે છે, જૂના સંસ્કરણ સાથે સરખાવવામાં આવે છે અને તેને તેના પોતાના પર સ્વિચ કરવામાં આવે છે, જેથી કોઈ સમસ્યા એક પૃષ્ઠને અસર કરે છે, ઉત્પાદનને નહીં.
5. હેન્ડઓવર - સ્થળાંતરિત પૃષ્ઠો, બાકી રહેલી વસ્તુઓ માટે અપડેટ કરેલી યોજના, અને આગામી પૃષ્ઠો માટે અનુસરવા માટેના પેટર્ન પર એક ટૂંકી નોંધ.
Zinner ગુણવત્તા ગેરંટી
પ્લેટફોર્મમાં જોડાતા પહેલા દરેક Zinnerની સમીક્ષા કરવામાં આવે છે અને તેને મંજૂર કરવામાં આવે છે.
બધી સેવાઓ અમારી ગુણવત્તા ખાતરી પ્રતિબદ્ધતા દ્વારા સમર્થિત છે.
તમે ડિલિવર કરેલા કામને મંજૂર ન કરો ત્યાં સુધી તમારી ચુકવણી સુરક્ષિત છે.
પેકેજોની તુલના કરો
| કાર્ય | સ્ટાર્ટર | માનક | અદ્યતન |
|---|---|---|---|
| ડિલિવરી સમય | 4 દિવસો | 10 દિવસો | 21 દિવસો |
| પુનરાવર્તનો | 1 | 2 | 3 |
| વિસ્તાર | યોજના અને એક નમૂના પૃષ્ઠ | 3 પૃષ્ઠો ખસેડવામાં આવ્યા | 8 પૃષ્ઠો, ઘટકો, પરીક્ષણો સુધી |
| લેખિત સ્થળાંતર યોજના | ✓ | ✓ | ✓ |
| સ્રોત કોડ | ✓ | ✓ | ✓ |
પોર્ટફોલિયો
આ Zinn સંબંધિત વિક્રેતાના કાર્યના ઉદાહરણો.
ફોર્મલાઇન: સ્ટ્રાઇપ સાથે Next.js સ્ટોર
એક સ્ટોરફ્રન્ટ જેના પર તમે ક્લિક કરી શકો છો: 16 પોસ્ટરો 4 સંગ્રહોમાં, ફિલ્ટર્સ અને શોધ જે URL માં રહે છે, એક કાર્ટ, લાઇટ અને ડાર્ક થીમ્સ, અને એક ચેકઆઉટ જે ડેમો ઓર્ડર અથવા ટેસ્ટ મોડમાં વાસ્તવિક સ્ટ્રાઇપ ચેકઆઉટ સત્રમાં સમાપ્ત થાય છે. મેં તેને Next.js સ્ટેટિક એક્સપોર્ટ તરીકે TypeScript માં Tailwind CSS સાથે બનાવ્યું છે. કાર્ડ પેમેન્ટ્સ Cloudflare Worker દ્વારા થાય છે જે સર્વર પર કાર્ટની કિંમત ફરીથી નક્કી કરે છે અને સ્ટ્રાઇપની વેબહુક સહીને ચકાસે છે.
Next.js માં દ્વિભાષી વ્યક્તિગત સાઇટ
અંગ્રેજી અને રશિયનમાં એક-પૃષ્ઠની વ્યક્તિગત સાઇટ, સેવાઓ વિભાગ અને મારા ડેમો પ્રોજેક્ટ્સની લિંક્સ સાથે. મેં તેને Next.js, React અને TypeScript સાથે સ્ટેટિક એક્સપોર્ટ તરીકે ડિઝાઇન અને બનાવ્યું છે, જે સાદા CSS મોડ્યુલ્સ અને કોઈ UI ફ્રેમવર્ક વિના સ્ટાઇલ કરવામાં આવ્યું છે. તેમાં લાઇટ અને ડાર્ક થીમ્સ છે, અને દરેક ભાષા માટે બિલ્ડ સમયે એક સામાજિક પૂર્વાવલોકન છબી જનરેટ થાય છે. GitHub Actions તેને Bunny CDN પર બનાવે છે અને જમાવે છે, જે સુરક્ષા હેડર ઉમેરે છે અને www અને સાદા HTTP ને મુખ્ય HTTPS સરનામાં પર રીડાયરેક્ટ કરે છે.
સેવા વિગતો
વારંવાર પૂછાતા પ્રશ્નો
કારણ કે ઉત્પાદન મહિનાઓ સુધી સ્થિર રહેશે અને તમામ જોખમ એક જ રિલીઝ દિવસે આવશે. પૃષ્ઠ દ્વારા પૃષ્ઠ, દરેક પગલું નાનું, પરીક્ષણ કરી શકાય તેવું અને પાછું ફેરવવું સરળ છે.
પૃષ્ઠો તેમના સરનામાં જાળવી રાખે છે. Next.js સાથે, નવા પૃષ્ઠો તૈયાર HTML તરીકે બ્રાઉઝર સુધી પહોંચે છે, જે સર્વર પર અથવા બિલ્ડ સમયે રેન્ડર થાય છે, જેથી સર્ચ એન્જિન સામગ્રીને પહેલાની જેમ જુએ છે. Vite સાથે React બ્રાઉઝરમાં રેન્ડર થાય છે, તેથી જે પૃષ્ઠો શોધ ટ્રાફિક લાવે છે તેના માટે હું Next.js ની ભલામણ કરું છું.
હા. સ્થળાંતરિત પૃષ્ઠો TypeScript માં લખાયેલા છે, અને જૂનો કોડ JavaScript તરીકે ચાલુ રહે છે જ્યાં સુધી તેનો વારો ન આવે.
ના. સ્થળાંતર ફક્ત ફ્રન્ટ એન્ડને સ્પર્શે છે. જ્યાં તમારા બેકએન્ડમાં પૃષ્ઠને જરૂરી ડેટા માટે પહેલેથી જ એન્ડપોઇન્ટ્સ છે, ત્યાં નવું પૃષ્ઠ તેનો ઉપયોગ કરે છે. જો તે ડેટા આજે ફક્ત PHP દ્વારા રેન્ડર કરાયેલ HTML તરીકે અસ્તિત્વમાં છે, તો યોજના પૃષ્ઠને જરૂરી નાના JSON એન્ડપોઇન્ટ્સની સૂચિ આપે છે, અને અમે સંમત છીએ કે તે પૃષ્ઠ ખસેડતા પહેલા તેને કોણ ઉમેરે છે.
ગ્રાહક સમીક્ષાઓ
અમારા ગ્રાહકો આ Zinn વિશે શું કહે છે તે જુઓ
