നിങ്ങളുടെ ഫ്രണ്ട് എൻഡ് ഇപ്പോഴും jQuery-യിലോ, പഴയ ക്ലാസ്സ് ഘടകങ്ങളിലോ അല്ലെങ്കിൽ കാലഹരണപ്പെട്ട Next.js സജ്ജീകരണത്തിലോ ആണ് പ്രവർത്തിക്കുന്നത്, ഓരോ മാറ്റത്തിനും ആവശ്യമുള്ളതിലും കൂടുതൽ സമയമെടുക്കുന്നു. ഉൽപ്പന്നം പ്രവർത്തിച്ചുകൊണ്ടിരിക്കുമ്പോൾ തന്നെ ഞാൻ അത് ടൈപ്പ്സ്ക്രിപ്റ്റിൽ ആധുനിക റിയാക്റ്റിലേക്കോ Next.js-ലേക്കോ ഓരോ പേജായി മാറ്റുന്നു.
നിങ്ങളുടെ jQuery അല്ലെങ്കിൽ ലെഗസി റിയാക്റ്റ് ഫ്രണ്ട് എൻഡ് ഞാൻ ആധുനിക റിയാക്റ്റിലേക്കോ Next.js-ലേക്കോ പേജ് തിരിച്ച് മാറ്റും.
നിങ്ങളുടെ ഫ്രണ്ട് എൻഡിനായുള്ള ഒരു മൈഗ്രേഷൻ പ്ലാനും ഒരു ചെറിയ പേജ് സാമ്പിളായി മാറ്റുകയും ചെയ്യുന്നു.
- പ്ലാനും ഒരു സാമ്പിൾ പേജും
- എഴുതിയ മൈഗ്രേഷൻ പ്ലാൻ
- സോഴ്സ് കോഡ്
3 പേജുകൾ വരെ റിയാക്റ്റിലേക്കോ Next.js-ലേക്കോ മാറ്റി, പഴയ കോഡിനൊപ്പം പ്രവർത്തിക്കുന്നു.
- 3 പേജുകൾ വരെ മാറ്റി
- എഴുതിയ മൈഗ്രേഷൻ പ്ലാൻ
- സോഴ്സ് കോഡ്
8 പേജുകൾ വരെ, പങ്കിട്ട ഘടകങ്ങൾ, ടൈപ്പ്സ്ക്രിപ്റ്റ് തരങ്ങൾ, ടെസ്റ്റുകൾ.
- 8 പേജുകൾ വരെ, ഘടകങ്ങൾ, ടെസ്റ്റുകൾ
- എഴുതിയ മൈഗ്രേഷൻ പ്ലാൻ
- സോഴ്സ് കോഡ്
ഒരു കസ്റ്റം ഓഫർ അഭ്യർത്ഥിക്കുക
ഈ സിന്നറിൽ നിന്ന് വ്യക്തിഗതമാക്കിയ ഓഫർ അഭ്യർത്ഥിക്കാൻ ഒരു സൗജന്യ അക്കൗണ്ട് ഉണ്ടാക്കുക അല്ലെങ്കിൽ ലോഗിൻ ചെയ്യുക.
പ്രീ-സെയിൽ ചോദ്യം ചോദിക്കുക
പ്രവേശിക്കുക / രജിസ്റ്റർ ചെയ്യുകഒരു ചോദ്യം ചോദിക്കാൻ ലോഗിൻ ചെയ്യുക
പ്ലാറ്റ്ഫോം സ്പാം കുറയ്ക്കുന്നതിന്, പ്രീ-സെയിൽ സന്ദേശങ്ങൾ ലോഗിൻ ചെയ്ത ഉപയോക്താക്കൾക്ക് മാത്രമേ അയയ്ക്കാൻ കഴിയൂ.
ഈ സിന്നറിന് നേരിട്ട് സന്ദേശം അയയ്ക്കാൻ ഒരു സൗജന്യ അക്കൗണ്ട് ഉണ്ടാക്കുക അല്ലെങ്കിൽ ലോഗിൻ ചെയ്യുക.
ലോഗിൻ ആവശ്യമാണ്
പ്രവേശിക്കുക / രജിസ്റ്റർ ചെയ്യുകലോഗിൻ ആവശ്യമാണ്
ഈ Zinner-ന് സന്ദേശം അയയ്ക്കാൻ ഒരു സൗജന്യ അക്കൗണ്ട് ഉണ്ടാക്കുക അല്ലെങ്കിൽ ലോഗിൻ ചെയ്യുക.
പ്രവേശിക്കുക / രജിസ്റ്റർ ചെയ്യുകലോഗിൻ ആവശ്യമാണ്
വ്യക്തിഗതമാക്കിയ ഓഫറിനായി അഭ്യർത്ഥിക്കാൻ ഒരു സൗജന്യ അക്കൗണ്ട് ഉണ്ടാക്കുക അല്ലെങ്കിൽ ലോഗിൻ ചെയ്യുക.
പ്രവേശിക്കുക / രജിസ്റ്റർ ചെയ്യുകഒറ്റനോട്ടത്തിൽ
നിങ്ങൾക്ക് തീരുമാനമെടുക്കാൻ സഹായിക്കുന്ന ഈ സേവനത്തെക്കുറിച്ചുള്ള പ്രധാന വിവരങ്ങൾ. Zinn Hub ആണ് ഇത് ഉണ്ടാക്കിയത്, വിൽപ്പനക്കാരനല്ല.
മൂല്യ സ്ഥാനം
മൈഗ്രേഷൻ സമീപനം
സാങ്കേതിക സ്റ്റാക്ക്
എന്താണ് കേടുകൂടാതെയിരിക്കുന്നത്
ഡെലിവറിക്ക് ശേഷമുള്ള പിന്തുണ
നിങ്ങൾക്ക് എന്ത് ലഭിക്കും
പൂർണ്ണ വിവരണം
ചില ഉൽപ്പന്നങ്ങൾ പ്രവർത്തിക്കുകയും പണം സമ്പാദിക്കുകയും ചെയ്യുന്നു, പക്ഷേ അവയുടെ ഫ്രണ്ട് എൻഡ് മാറ്റാൻ പ്രയാസകരമായിത്തീർന്നു: ടെംപ്ലേറ്റുകളിലുടനീളം വ്യാപിച്ചുകിടക്കുന്ന jQuery, വർഷങ്ങൾക്ക് മുമ്പുള്ള റിയാക്റ്റ് ക്ലാസ് ഘടകങ്ങൾ, അല്ലെങ്കിൽ പേജസ് റൂട്ടറിൽ ഇപ്പോഴുമുള്ള ഒരു Next.js ആപ്പ്. ഒരു പൂർണ്ണമായ മാറ്റിയെഴുതൽ ഉൽപ്പന്നത്തെ മാസങ്ങളോളം മരവിപ്പിക്കുന്നു. ഞാൻ മറ്റൊന്നാണ് ചെയ്യുന്നത്: പഴയതും പുതിയതുമായ കോഡ് ഒന്നിച്ച് പ്രവർത്തിക്കുന്നു, പേജുകൾ ഓരോന്നായി മാറുന്നു, അതിനാൽ നിങ്ങളുടെ ഉപയോക്താക്കൾക്ക് വലിയ മാറ്റത്തിനുള്ള ദിവസമില്ല.
NDA-യുടെ കീഴിലുള്ള ഒരു മുൻ പ്രോജക്റ്റിൽ ഞാൻ ഇത് കൃത്യമായി ചെയ്തു: ഉൽപ്പന്നം ലൈവായിരിക്കുമ്പോൾ ഒരു jQuery ഫ്രണ്ട് എൻഡ് പേജ് തിരിച്ച് റിയാക്റ്റിലേക്ക് മാറ്റി.
സ്റ്റാർട്ടർ നിങ്ങൾക്ക് പ്ലാൻ നൽകുന്നു: ഞാൻ പഴയ ഫ്രണ്ട് എൻഡ് വായിക്കുന്നു, അതിന്റെ പേജുകളും പങ്കിട്ട ഭാഗങ്ങളും മാപ്പ് ചെയ്യുന്നു, അപകടസാധ്യതകൾ ലിസ്റ്റ് ചെയ്യുന്നു, സമീപനത്തിന്റെ ഒരു പ്രവർത്തന സാമ്പിളായി ഒരു ചെറിയ പേജ് മൈഗ്രേറ്റ് ചെയ്യുന്നു. സ്റ്റാൻഡേർഡ് മൂന്ന് പേജുകളോ സ്ക്രീനുകളോ വരെ മാറ്റുന്നു. അഡ്വാൻസ്ഡ് എട്ട് പേജുകൾ വരെ മാറ്റുന്നു, അവയ്ക്ക് ആവശ്യമായ പങ്കിട്ട ഘടകങ്ങൾ നിർമ്മിക്കുന്നു, കൂടാതെ അവയുടെ ഡാറ്റയ്ക്കുള്ള ടൈപ്പ്സ്ക്രിപ്റ്റ് തരങ്ങളും പ്രധാന ഫ്ലോകൾക്കുള്ള ടെസ്റ്റുകളും ഉൾക്കൊള്ളുന്നു.
എന്താണ് നിലനിൽക്കുന്നത്: നിങ്ങളുടെ ബാക്കെൻഡ്, നിങ്ങളുടെ URL-കൾ, ഉപയോക്താക്കൾക്ക് അറിയാവുന്ന സ്വഭാവം. എന്താണ് മാറുന്നത്: കോഡ് എങ്ങനെയാണ് ക്രമീകരിച്ചിരിക്കുന്നത്, അതിനാൽ അടുത്ത ഫീച്ചർ ഒരു തവണ, ഒരിടത്ത് എഴുതുന്നു. ഡെലിവറി കഴിഞ്ഞ് 14 ദിവസത്തേക്ക്, ഞങ്ങൾ സമ്മതിച്ചതുപോലെ പ്രവർത്തിക്കാത്ത എന്തും ഞാൻ സൗജന്യമായി പരിഹരിക്കുന്നു.
പേജ് ഓർഡറും പ്ലാനും ഓർഡർ ചാറ്റിൽ, കോളുകളില്ലാതെ അംഗീകരിക്കുന്നു. ഓരോ മൈഗ്രേറ്റ് ചെയ്ത പേജും സ്വന്തമായി ഷിപ്പ് ചെയ്യുന്നു, കൂടാതെ ഓരോ പ്രവൃത്തി ദിവസവും നിങ്ങൾക്ക് ഒരു എഴുതിയ സ്റ്റാറ്റസ് നോട്ട് ലഭിക്കും.
നിങ്ങളുടെ പ്രോജക്റ്റ് പൂർത്തിയാക്കുന്നതിനുള്ള ഘട്ടങ്ങൾ
1. പഴയ ഫ്രണ്ട് എൻഡ് മാപ്പ് ചെയ്യുക - ഞാൻ ടെംപ്ലേറ്റുകൾ, സ്ക്രിപ്റ്റുകൾ, ഘടകങ്ങൾ എന്നിവയിലൂടെ കടന്നുപോകുന്നു, കൂടാതെ പേജുകൾ, പങ്കിട്ട ഭാഗങ്ങൾ, ആഗോള സ്റ്റേറ്റ് അല്ലെങ്കിൽ ഇൻലൈൻ സ്ക്രിപ്റ്റുകൾ പോലുള്ള അപകടകരമായ എന്തും ലിസ്റ്റ് ചെയ്യുന്നു.
2. ഓർഡർ അംഗീകരിക്കുക - നിങ്ങൾക്ക് ഒരു രേഖാമൂലമുള്ള പ്ലാൻ ലഭിക്കുന്നു: ഏത് പേജ് ആദ്യം വരുന്നു, അതിനൊപ്പം എന്താണ് നീങ്ങുന്നത്, പഴയതും പുതിയതുമായ കോഡ് രണ്ടും നിലവിലുണ്ടായിരിക്കുമ്പോൾ ഉൽപ്പന്നം എങ്ങനെ പങ്കിടുന്നു.
3. ബ്രിഡ്ജ് - പുതിയ റിയാക്റ്റ് അല്ലെങ്കിൽ നെക്സ്റ്റ്.ജെഎസ് കോഡ് പഴയ കോഡിന് അടുത്തായി സജ്ജീകരിച്ചിരിക്കുന്നു, ഓരോ പേജിനെയും അതിൻ്റെ ഉടമസ്ഥതയിലുള്ള ഭാഗത്തേക്ക് അയയ്ക്കുന്ന റൂട്ടിംഗോടുകൂടി.
4. പേജുകൾ ഓരോന്നായി നീക്കുക - ഓരോ പേജും പുനർനിർമ്മിക്കുകയും പഴയ പതിപ്പുമായി താരതമ്യം ചെയ്യുകയും സ്വന്തമായി മാറ്റുകയും ചെയ്യുന്നു, അതിനാൽ ഒരു പ്രശ്നം ഒരു പേജിനെ മാത്രമേ ബാധിക്കൂ, ഉൽപ്പന്നത്തെ മുഴുവൻ ബാധിക്കില്ല.
5. കൈമാറ്റം - മൈഗ്രേറ്റ് ചെയ്ത പേജുകൾ, ശേഷിക്കുന്നവയ്ക്കുള്ള അപ്ഡേറ്റ് ചെയ്ത പ്ലാൻ, അടുത്ത പേജുകൾക്കായി പിന്തുടരേണ്ട പാറ്റേണുകളെക്കുറിച്ചുള്ള ഒരു ചെറിയ കുറിപ്പ്.
Zinner ഗുണമേന്മ ഉറപ്പ്
ഓരോ Zinner-നെയും പ്ലാറ്റ്ഫോമിൽ ചേരുന്നതിന് മുമ്പ് അവലോകനം ചെയ്യുകയും അംഗീകരിക്കുകയും ചെയ്യുന്നു.
എല്ലാ സേവനങ്ങൾക്കും ഞങ്ങളുടെ ഗുണമേന്മ ഉറപ്പ് പ്രതിബദ്ധതയുടെ പിന്തുണയുണ്ട്.
ഡെലിവർ ചെയ്ത ജോലി നിങ്ങൾ അംഗീകരിക്കുന്നത് വരെ നിങ്ങളുടെ പേയ്മെന്റ് പരിരക്ഷിക്കപ്പെടും.
പാക്കേജുകൾ താരതമ്യം ചെയ്യുക
| ഫംഗ്ഷൻ | തുടക്കക്കാരൻ | സ്റ്റാൻഡേർഡ് | വിപുലമായത് |
|---|---|---|---|
| ഡെലിവറി സമയം | 4 ദിവസങ്ങൾ | 10 ദിവസങ്ങൾ | 21 ദിവസങ്ങൾ |
| പുനരവലോകനങ്ങൾ | 1 | 2 | 3 |
| വ്യാപ്തി | പ്ലാനും ഒരു സാമ്പിൾ പേജും | 3 പേജുകൾ വരെ മാറ്റി | 8 പേജുകൾ, ഘടകങ്ങൾ, ടെസ്റ്റുകൾ വരെ |
| എഴുതിയ മൈഗ്രേഷൻ പ്ലാൻ | ✓ | ✓ | ✓ |
| സോഴ്സ് കോഡ് | ✓ | ✓ | ✓ |
പോർട്ട്ഫോളിയോ
ഈ Zinn-മായി ബന്ധപ്പെട്ട വിൽപ്പനക്കാരന്റെ ജോലിയുടെ ഉദാഹരണങ്ങൾ.

ഫോംലൈൻ: സ്ട്രൈപ്പ് ഉള്ള Next.js സ്റ്റോർ
നിങ്ങൾക്ക് ക്ലിക്ക് ചെയ്യാൻ കഴിയുന്ന ഒരു സ്റ്റോർഫ്രണ്ട്: 16 പോസ്റ്ററുകൾ 4 ശേഖരങ്ങളിൽ, URL-ൽ തുടരുന്ന ഫിൽട്ടറുകളും തിരയലും, ഒരു കാർട്ട്, ലൈറ്റ്, ഡാർക്ക് തീമുകൾ, ഒരു ഡെമോ ഓർഡറിലോ ടെസ്റ്റ് മോഡിൽ ഒരു യഥാർത്ഥ സ്ട്രൈപ്പ് ചെക്ക്ഔട്ട് സെഷനിലോ അവസാനിക്കുന്ന ഒരു ചെക്ക്ഔട്ട്. ഞാൻ ഇത് Next.js സ്റ്റാറ്റിക് എക്സ്പോർട്ടായി ടൈപ്പ്സ്ക്രിപ്റ്റിൽ ടെയിൽവിൻഡ് CSS ഉപയോഗിച്ച് നിർമ്മിച്ചു. കാർഡ് പേയ്മെന്റുകൾ ഒരു ക്ലൗഡ്ഫ്ലെയർ വർക്കറിലൂടെയാണ് നടക്കുന്നത്, അത് സെർവറിൽ കാർട്ടിന്റെ വില പുനർനിർണ്ണയിക്കുകയും സ്ട്രൈപ്പിന്റെ വെബ്ഹുക്ക് സിഗ്നേച്ചർ പരിശോധിക്കുകയും ചെയ്യുന്നു.




Next.js-ലെ ദ്വിഭാഷാ വ്യക്തിഗത സൈറ്റ്
ഇംഗ്ലീഷിലും റഷ്യനിലും ഒരു പേജുള്ള ഒരു വ്യക്തിഗത സൈറ്റ്, ഒരു സേവന വിഭാഗവും എന്റെ ഡെമോ പ്രോജക്റ്റുകളിലേക്കുള്ള ലിങ്കുകളും സഹിതം. ഞാൻ ഇത് Next.js, React, TypeScript എന്നിവ ഉപയോഗിച്ച് ഒരു സ്റ്റാറ്റിക് എക്സ്പോർട്ടായി രൂപകൽപ്പന ചെയ്യുകയും നിർമ്മിക്കുകയും ചെയ്തു, പ്ലെയിൻ CSS മൊഡ്യൂളുകൾ ഉപയോഗിച്ച് സ്റ്റൈൽ ചെയ്തു, UI ഫ്രെയിംവർക്ക് ഇല്ല. ഇതിന് ലൈറ്റ്, ഡാർക്ക് തീമുകൾ ഉണ്ട്, ഓരോ ഭാഷയ്ക്കും ഒരു സോഷ്യൽ പ്രിവ്യൂ ചിത്രം ബിൽഡ് സമയത്ത് ജനറേറ്റ് ചെയ്യുന്നു. GitHub Actions ഇത് നിർമ്മിച്ച് Bunny CDN-ലേക്ക് വിന്യസിക്കുന്നു, ഇത് സുരക്ഷാ ഹെഡറുകൾ ചേർക്കുകയും www, പ്ലെയിൻ HTTP എന്നിവ പ്രധാന HTTPS വിലാസത്തിലേക്ക് റീഡയറക്ട് ചെയ്യുകയും ചെയ്യുന്നു.

സേവന വിശദാംശങ്ങൾ
പതിവായി ചോദിക്കുന്ന ചോദ്യങ്ങൾ
കാരണം ഉൽപ്പന്നം മാസങ്ങളോളം നിശ്ചലമാവുകയും എല്ലാ അപകടസാധ്യതകളും ഒരു റിലീസ് ദിനത്തിൽ വരികയും ചെയ്യും. പേജ് തോറും, ഓരോ ഘട്ടവും ചെറുതും, പരിശോധിക്കാവുന്നതും, എളുപ്പത്തിൽ പഴയപടിയാക്കാവുന്നതുമാണ്.
പേജുകൾക്ക് അവയുടെ വിലാസങ്ങൾ നിലനിർത്താൻ കഴിയും. Next.js ഉപയോഗിച്ച്, പുതിയ പേജുകൾ ബ്രൗസറിൽ തയ്യാറായ HTML ആയി എത്തുന്നു, സെർവറിൽ അല്ലെങ്കിൽ ബിൽഡ് സമയത്ത് റെൻഡർ ചെയ്യുന്നു, അതിനാൽ തിരയൽ എഞ്ചിനുകൾ ഉള്ളടക്കം മുമ്പത്തെപ്പോലെ കാണുന്നു. Vite ഉപയോഗിച്ചുള്ള React ബ്രൗസറിൽ റെൻഡർ ചെയ്യുന്നു, അതിനാൽ തിരയൽ ട്രാഫിക് കൊണ്ടുവരുന്ന പേജുകൾക്ക് ഞാൻ Next.js ശുപാർശ ചെയ്യുന്നു.
അതെ. മൈഗ്രേറ്റ് ചെയ്ത പേജുകൾ ടൈപ്പ്സ്ക്രിപ്റ്റിൽ എഴുതിയിരിക്കുന്നു, പഴയ കോഡ് അതിൻ്റെ ഊഴം വരുന്നത് വരെ ജാവാസ്ക്രിപ്റ്റായി പ്രവർത്തിക്കുന്നത് തുടരും.
ഇല്ല. മൈഗ്രേഷൻ ഫ്രണ്ട് എൻഡിനെ മാത്രമേ സ്പർശിക്കൂ. ഒരു പേജിന് ആവശ്യമായ ഡാറ്റയ്ക്കായി നിങ്ങളുടെ ബാക്കെൻഡിന് ഇതിനകം എൻഡ്പോയിന്റുകൾ ഉണ്ടെങ്കിൽ, പുതിയ പേജ് അവ ഉപയോഗിക്കുന്നു. ആ ഡാറ്റ ഇന്ന് PHP റെൻഡർ ചെയ്ത HTML ആയി മാത്രമേ നിലവിലുള്ളൂവെങ്കിൽ, പേജിന് ആവശ്യമായ ചെറിയ JSON എൻഡ്പോയിന്റുകൾ പ്ലാൻ ലിസ്റ്റ് ചെയ്യുന്നു, കൂടാതെ ആ പേജ് നീക്കുന്നതിന് മുമ്പ് ആരാണ് അവ ചേർക്കുന്നതെന്ന് ഞങ്ങൾ സമ്മതിക്കുന്നു.
ഉപഭോക്തൃ അവലോകനങ്ങൾ
ഈ Zinn-നെക്കുറിച്ച് ഞങ്ങളുടെ ഉപഭോക്താക്കൾ എന്താണ് പറയുന്നതെന്ന് കാണുക
വിഭാഗങ്ങൾ
Zinner നയങ്ങൾ
ബന്ധപ്പെട്ട Zinns

joomla വെബ്സൈറ്റുമായി ബന്ധപ്പെട്ട ഏത് തരത്തിലുള്ള പ്രശ്നങ്ങളും പരിഹരിക്കുക

NextJS ReactJS MongoDB Firebase TypeScript ഉപയോഗിച്ച് നിങ്ങളുടെ വെബ് ആപ്ലിക്കേഷൻ വികസിപ്പിക്കുക

NextJS, ReactJS, Firebase, Supabase എന്നിവ ഉപയോഗിച്ച് വെബ് ആപ്പ് വികസിപ്പിക്കുക




