സങ്കീർണ്ണമായ ഒരു പ്രോജക്റ്റിൽ പ്രവർത്തിക്കുന്നു, നിങ്ങൾ ഒരു പരിചയസമ്പന്നനായ പ്രോഗ്രാമർ അല്ലെങ്കിൽ ഒരു പുതുമുഖം ആണെങ്കിലും, നിങ്ങൾ ഫലത്തിൽ പ്രശ്നങ്ങളിലൂടെ കടന്നുപോകാനിടയുണ്ട്. നിങ്ങളുടെ പ്രോജക്റ്റ് നിരവധി മൊഡ്യൂളുകളായി വിഭജിക്കുമ്പോൾ, പ്രശ്നങ്ങൾ ഉണ്ടാകുന്നു, ഇത് പിശകുകൾ കണ്ടെത്തുന്നതും പരിഹാരങ്ങൾ കണ്ടെത്തുന്നതും കൂടുതൽ ബുദ്ധിമുട്ടാക്കുന്നു. മറ്റ് സാഹചര്യങ്ങളിൽ, നിങ്ങൾ പ്രവർത്തിച്ചുകൊണ്ടിരിക്കുന്ന പ്രശ്നത്തിന് ശരിയായ പരിഹാരം കണ്ടെത്താത്തതിനാൽ വ്യക്തിഗത സംഭവങ്ങൾ ഡീബഗ്ഗുചെയ്യുന്നത് കഠിനമായേക്കാം.
ചില സന്ദർഭങ്ങളിൽ കോഡിന്റെ ഒരു ഭാഗമായും ഇത് സംഭവിക്കുന്നു, അത് ആ സമയത്ത് സങ്കീർണ്ണമായി തോന്നിയേക്കാം. പഠിക്കാൻ വളരെ എളുപ്പമുള്ള വെബ് അധിഷ്ഠിത ഭാഷകളിൽ ഒന്നാണ് ജാവാസ്ക്രിപ്റ്റ്. നിങ്ങളുടെ ഡെസ്ക്ടോപ്പ് ബ്രൗസർ സമാരംഭിച്ച് ഡെവലപ്പർ ടൂളുകളിലേക്ക് (സാധാരണയായി F12) നാവിഗേറ്റ് ചെയ്യുക, നിങ്ങൾ പൂർത്തിയാക്കി! സങ്കീർണ്ണമായ ഏതെങ്കിലും സോഫ്റ്റ്വെയർ ഇൻസ്റ്റാൾ ചെയ്യുകയോ പ്രവർത്തിപ്പിക്കുകയോ ചെയ്യാതെ തന്നെ നിങ്ങൾക്ക് JS ഉപയോഗിച്ച് പരീക്ഷിക്കാം.
ആരംഭിക്കുന്നതിന്, നിങ്ങൾക്ക് വേണ്ടത് ഒരു ബ്രൗസർ മാത്രമാണ്. ഈ ലാളിത്യങ്ങളെല്ലാം ബോക്സിൽ നിന്ന് പുറത്തുവരുന്നത് അതിശയകരമാണ്, എന്നാൽ നിങ്ങൾക്ക് കൂടുതൽ ആവശ്യമുള്ള അവസരങ്ങളുണ്ട്. ഉദാഹരണത്തിന്, നിങ്ങൾ അടുത്തിടെ കണ്ടെത്തിയ ഒരു പുതിയ വെബ് API ഉപയോഗിച്ച് പരീക്ഷണം നടത്താൻ ആഗ്രഹിക്കുന്നുവെന്ന് കരുതുക, എന്നാൽ ഒരു പുതിയ പ്രോജക്റ്റ് ആരംഭിക്കാൻ താൽപ്പര്യമില്ല.
ഈ പോസ്റ്റിൽ, ഞങ്ങൾ ഏറ്റവും ജനപ്രിയമായ മൂന്ന് JS കളിസ്ഥലങ്ങളായ CodePen, CodeSandbox, StackBlitz എന്നിവ താരതമ്യം ചെയ്യുകയും കോൺട്രാസ്റ്റ് ചെയ്യുകയും ചെയ്യും. നമുക്ക് തുടങ്ങാം!
കോഡ്പെൻ
ഫ്രണ്ടെൻഡ് വെബ് ഡെവലപ്മെന്റ് ടൂളുകൾ എല്ലായ്പ്പോഴും വികസിച്ചുകൊണ്ടിരിക്കുന്നു, കൂടാതെ ഒരു ഡെവലപ്പറുടെ ജീവിതം ലളിതമാക്കുന്ന ഏറ്റവും പുതിയ സാങ്കേതികവിദ്യകളുടെ ഒരു വലിയ ഘടകമാണ് ടെക്സ്റ്റ് എഡിറ്റർമാർ. ആറ്റം അല്ലെങ്കിൽ നോട്ട്പാഡ് ++ പോലുള്ള സ്റ്റാൻഡ്-എലോൺ ടെക്സ്റ്റ് എഡിറ്ററുകൾക്ക് പുറമെ, പ്രോഗ്രാം ഇൻസ്റ്റാളേഷൻ ആവശ്യമില്ലാത്തതും കൂടുതൽ സഹകരണം പ്രോത്സാഹിപ്പിക്കാത്തതുമായ ബ്രൗസർ അധിഷ്ഠിത എഡിറ്റർമാരുടെ ഒരു സ്ഫോടനം സമീപ വർഷങ്ങളിൽ ഉണ്ടായിട്ടുണ്ട്.
"ഉപയോക്താക്കൾ സൃഷ്ടിച്ച HTML, CSS, JavaScript കോഡ് സ്നിപ്പെറ്റുകൾ പരീക്ഷിക്കുന്നതിനും അവതരിപ്പിക്കുന്നതിനുമുള്ള ഒരു ഓൺലൈൻ കമ്മ്യൂണിറ്റി" ആണ് CodePen, അത് ഫ്രണ്ട്എൻഡ് വെബ്പേജുകൾ എങ്ങനെ മികച്ച രീതിയിൽ എഴുതാമെന്ന് അറിയാനുള്ള മികച്ച അവസരങ്ങൾ പ്രദാനം ചെയ്യുന്നു.
CodePen നിങ്ങൾക്ക് രണ്ട് "മോഡുകൾ" നൽകുന്നു. ആദ്യത്തേതും ഏറ്റവും സാധാരണയായി ഉപയോഗിക്കുന്നതും പേനയാണ്. ഒരു ബട്ടണിൽ ക്ലിക്കുചെയ്ത് എഡിറ്ററിലേക്ക് നേരിട്ട് കൊണ്ടുപോകുന്നത് പോലെ ഇത് ലളിതമാണ്. അവിടെ നിന്ന്, നിങ്ങൾക്ക് ഒരു പ്രിവ്യൂ പാനലും അടിസ്ഥാന HTML, CSS, JS എഡിറ്റിംഗ് വിൻഡോകളും ആക്സസ് ചെയ്യാൻ കഴിയും.
"ഫയൽ സിസ്റ്റം," "ഇന്റലിസെൻസ്" അല്ലെങ്കിൽ മറ്റെന്തെങ്കിലും ഇല്ല - ലളിതമായ വാക്യഘടന ഹൈലൈറ്റിംഗും പ്രെറ്റിഫൈ പോലുള്ള ഫാസ്റ്റ് കമാൻഡുകളും മാത്രം. ഓപ്ഷൻ ടാബിൽ, മൂന്ന് ഭാഷകൾക്കും (ജെഎസിനുള്ള ടൈപ്പ്സ്ക്രിപ്റ്റ് പോലുള്ളവ) പ്രീപ്രോസസറുകളുടെ നിയന്ത്രിത ശ്രേണിയിൽ നിന്ന് നിങ്ങൾക്ക് തിരഞ്ഞെടുക്കാം അല്ലെങ്കിൽ ബാഹ്യ ഉറവിടങ്ങളിലേക്ക് കണക്ഷനുകൾ ചേർക്കുക.
നിങ്ങൾക്ക് സൗജന്യമായി എന്തെങ്കിലും ചെയ്യേണ്ടതുണ്ടെങ്കിൽ, ഏതെങ്കിലും എഡിറ്റർ മതിയാകും. ധാരാളം സജ്ജീകരണങ്ങളോ ലൈബ്രറികളോ ആവശ്യമില്ലാത്ത എന്തിനും വേണ്ടി ഞാൻ കോഡ്പെൻ നിർദ്ദേശിക്കുന്നു - മുകളിൽ ഓപ്ഷണൽ പ്രീ-പ്രോസസറുകളുള്ള HTML, CSS, JS. നിങ്ങളുടെ സോഷ്യൽ മീഡിയ സാന്നിധ്യം മെച്ചപ്പെടുത്തുന്നതിനോ വ്യക്തിഗത പോർട്ട്ഫോളിയോ വികസിപ്പിക്കുന്നതിനോ കളിസ്ഥലം ഉപയോഗിക്കണമെങ്കിൽ, CodePen ഒരു മികച്ച ഓപ്ഷനാണ്.
പ്രീമിയം പതിപ്പ്
നിങ്ങൾക്ക് CodePen-ൽ നിന്ന് തിരഞ്ഞെടുക്കാൻ കുറച്ച് ഇതരമാർഗങ്ങളുണ്ട്. നിങ്ങൾ വർഷം തോറും പണമടയ്ക്കുകയാണെങ്കിൽ, ഓരോ മാസവും $12, $19, അല്ലെങ്കിൽ $39 എന്നിങ്ങനെയുള്ള മൂന്ന് പ്രീമിയം പ്ലാനുകളിൽ ഒന്ന് നിങ്ങൾക്ക് ലഭിക്കും. നിങ്ങൾക്ക് മൂന്ന് ടയറുകളിൽ ഏതെങ്കിലുമൊരു പരിധിയില്ലാത്ത സ്വകാര്യ പേനകൾ, പോസ്റ്റുകൾ, ശേഖരങ്ങൾ എന്നിവ സൃഷ്ടിക്കാം.
നിങ്ങൾക്ക് പ്രോ ബാഡ്ജ് (ഒരു സോഷ്യൽ ബൂസ്റ്റ്), ലൈവ് കൊളാബ് മോഡ് ആക്സസ്, പരസ്യം ചെയ്യേണ്ടതില്ല എന്നിവയും മറ്റും ലഭിക്കും. ചില ടീം-നിർദ്ദിഷ്ട തന്ത്രങ്ങളും മറ്റ് ക്രോസ്-ടയർ വ്യത്യാസങ്ങളും ഉണ്ട്. കൂടുതൽ വിവരങ്ങൾക്ക് അവരുടെ ഔദ്യോഗിക ബില്ലിംഗ് ബോർഡ് പരിശോധിക്കുക.
പ്രധാന സവിശേഷതകൾ
CodePen-ൽ HTML, CSS, JavaScript എന്നിവ സൃഷ്ടിക്കുന്നതിന് പുറമെ, അതിനെ വേറിട്ട് നിർത്തുന്ന ചില കാര്യങ്ങൾ കൂടിയുണ്ട്.
- നിങ്ങളുടെ കോഡിന്റെ തത്സമയ കാഴ്ച സാധ്യമാണ്. ഇതിന് സമാഹാരം ആവശ്യമില്ല.
- പുതിയ കാര്യങ്ങൾ പഠിക്കാൻ പരീക്ഷണം നിങ്ങളെ അനുവദിക്കുന്നു.
- പ്രശ്നങ്ങൾ കണ്ടെത്താനും പരിഹരിക്കാനും ചെറിയ ടെസ്റ്റ് കേസുകൾ സൃഷ്ടിക്കുക.
- നിങ്ങളുടെ അത്ഭുതകരമായ പ്രവൃത്തികൾ പ്രദർശിപ്പിക്കുക.
- പിന്നീടുള്ള ഉപയോഗത്തിനായി പേനകൾ സൃഷ്ടിച്ച് സംഭരിക്കുക.
- മറ്റ് ഡെവലപ്പർമാരുടെ കോഡ് പരീക്ഷിച്ച് അത് പ്രവർത്തനക്ഷമമായി കാണുക.
പ്രയോജനങ്ങൾ
- ആരംഭിക്കുന്നതിന്, ഒരു ചെലവും ഇല്ല.
- ബിൽറ്റ്-ഇൻ പഠന വിഭവങ്ങൾ.
- മറ്റുള്ളവരുമായി സഹകരിക്കുകയും ഭാവിയിൽ അവർക്ക് എവിടേക്കാണ് പോകാനാവുകയെന്ന് കാണാൻ പ്രോജക്റ്റുകൾ താരതമ്യം ചെയ്യുകയും ചെയ്യുക.
- UI ഉപയോഗിക്കാൻ ലളിതവും നേരായതുമാണ്.
സഹടപിക്കാനും
- കോഡ് ലൈബ്രറി ചെറുതാണ്, സ്വയമേവയുള്ള കോഡ് പൂർത്തീകരണം അപര്യാപ്തമാണ്. ഒരു പേജുള്ള പ്രോജക്റ്റുകൾക്ക് ഇത് നല്ലതാണ്, വലുതായി ഒന്നും കൈകാര്യം ചെയ്യാൻ കഴിയില്ല.
- CodePen-ൽ, നിങ്ങൾക്ക് സ്വകാര്യ പേനകൾ സൃഷ്ടിക്കാൻ കഴിയും, എന്നാൽ നിങ്ങൾ ഒരു പ്രോ അംഗത്വത്തിലേക്ക് ($9/മാസം) അപ്ഗ്രേഡ് ചെയ്യേണ്ടതുണ്ട്.
കോഡ്സാൻഡ്ബോക്സ്
CodeSandbox ഒരു വെബ് അധിഷ്ഠിത കോഡ് എഡിറ്ററാണ്. ഒറ്റ ക്ലിക്കിലൂടെ ഒരു പുതിയ പ്രോജക്റ്റ് നിർമ്മിക്കാൻ നിങ്ങളെ അനുവദിക്കുന്ന ട്രാൻസ്പൈറിംഗ്, പാക്കേജിംഗ്, ഡിപൻഡൻസി മാനേജ്മെന്റ് എന്നിവ ഇത് ഓട്ടോമേറ്റ് ചെയ്യുന്നു. നിങ്ങൾ ആകർഷകമായ എന്തെങ്കിലും സൃഷ്ടിച്ചതിന് ശേഷം, വെബ്സൈറ്റ് പങ്കിടുന്നതിലൂടെ നിങ്ങൾക്ക് അത് മറ്റുള്ളവരുമായി പങ്കിടാം.
ക്രിയേറ്റ്-റിയാക്റ്റ്-ആപ്പ് ടെംപ്ലേറ്റിൽ പ്രൊജക്റ്റ് സേവ് ചെയ്യാനുള്ള ഓപ്ഷൻ പോലുള്ള ചില റിയാക്റ്റ്-നിർദ്ദിഷ്ട സവിശേഷതകൾ ഉൾപ്പെട്ടിട്ടുണ്ടെങ്കിലും, എഡിറ്റർ ഏത് JavaScript പ്രോജക്റ്റുമായും പൊരുത്തപ്പെടുന്നു.
CodeSandbox-ൽ നിങ്ങൾ നിർമ്മിക്കുന്ന ഏതൊരു പ്രോജക്റ്റും ഒരു ടെംപ്ലേറ്റിൽ ആരംഭിക്കുന്നു. ഇതിന് ഒന്നുകിൽ ഒരു പ്രത്യേക ലൈബ്രറിയുമായോ ചട്ടക്കൂടുമായോ റൺടൈമുമായോ (Node.js ഉൾപ്പെടെ) ബന്ധപ്പെട്ടിരിക്കാം അല്ലെങ്കിൽ സാധാരണ വെബ് സാങ്കേതികവിദ്യകൾ ഉപയോഗിക്കാം. ഒരു ടെംപ്ലേറ്റ് തിരഞ്ഞെടുത്ത ശേഷം, നിങ്ങളെ എഡിറ്ററിലേക്ക് അയയ്ക്കും, അവിടെ ആവശ്യമായ എല്ലാ ഫയലുകളും ഇതിനകം തുറന്നിരിക്കുന്ന പ്രിവ്യൂ വിൻഡോയും നിങ്ങൾ കണ്ടെത്തും.
നിങ്ങൾക്ക് എല്ലാ സാൻഡ്ബോക്സുകളിലും ഒരു "ഫയൽ സിസ്റ്റത്തിലേക്ക്" ആക്സസ് ഉണ്ട്, അതിനർത്ഥം നിങ്ങൾക്ക് പുതിയ ഫയലുകൾ സൃഷ്ടിക്കാനും മൊഡ്യൂളുകൾ (NPM പാക്കേജുകൾ ഉൾപ്പെടെ) ഉപയോഗിക്കാനും സ്റ്റാറ്റിക് അസറ്റുകളുമായി സംവദിക്കാനും കഴിയും. ടെംപ്ലേറ്റ്-നിർദ്ദിഷ്ട കോൺഫിഗറേഷൻ ഫയലുകൾ പരിഷ്കരിക്കാനുള്ള അവസരവുമുണ്ട്.
ഒരു ഐഡിഇയിലെന്നപോലെ, ഫയൽ ഘടനയും ഡിപൻഡൻസിയും ഉപയോഗിച്ച് പൂർണ്ണമായി, നിങ്ങളുടെ തനതായ ഉപയോഗ-കേസിനായി നിങ്ങൾക്ക് സ്വന്തമായി ടെംപ്ലേറ്റുകൾ നിർമ്മിക്കാം. ഉപകരണം Github-ലേക്ക് ലിങ്ക് ചെയ്തിരിക്കുന്നതിനാൽ, നിങ്ങൾക്ക് വേഗത്തിൽ കമ്മിറ്റുകൾ സൃഷ്ടിക്കാനും PR-കൾ തുറക്കാനും കഴിയും. നിങ്ങൾക്ക് ഉടൻ തന്നെ ZEIT അല്ലെങ്കിൽ Netlify-ലേക്ക് നിങ്ങളുടെ അപേക്ഷ വിന്യസിക്കാം.
CodeSandbox ടീം പ്രോ
ബ്രൗസർ അധിഷ്ഠിത വെബ് ആപ്പ് ഡെവലപ്മെന്റ് സാൻഡ്ബോക്സ് നിർമ്മിക്കാൻ ഡവലപ്പർമാരെ അനുവദിക്കുന്ന ഡച്ച് ബിസിനസ്സായ CodeSandbox, ക്ലൗഡിൽ കോഡിൽ പ്രവർത്തിക്കാൻ ടീമുകളെ അനുവദിക്കുന്ന ഒരു സഹകരണ പ്ലാറ്റ്ഫോം ഔദ്യോഗികമായി പുറത്തിറക്കി. പുതിയ ഉൽപ്പന്നമായ ടീം പ്രോ, ഡിസൈനർമാരും മാനേജർമാരും മുതൽ ക്വാളിറ്റി അഷ്വറൻസ് (ക്യുഎ) ടീമുകളിലൂടെയും അതിനപ്പുറവുമുള്ള സമ്പൂർണ്ണ ഉൽപ്പന്ന ടീമുകൾക്കായി നിർമ്മിച്ച ഒരു കോഡ് രഹിത പരിഹാരമാണ്.
ഒരു വെബ് ആപ്ലിക്കേഷനിൽ മാറ്റങ്ങൾ വരുത്താനോ സ്വീകരിക്കാനോ ആഗ്രഹിക്കുന്ന ഏതൊരാൾക്കും ഉപയോക്തൃ-സൗഹൃദ ഇന്റർഫേസിലാണ് പ്രോജക്റ്റുകൾ നൽകിയിരിക്കുന്നത്, മാറ്റങ്ങൾ നടപ്പിലാക്കുന്നതിനായി ഡവലപ്പർമാർക്ക് കുറിപ്പുകളും ശുപാർശകളും അയയ്ക്കുക, ചർച്ചയ്ക്കായി തിരികെ കൈമാറുക, പ്രക്രിയ ആവർത്തിക്കുക തുടങ്ങിയ ഇതര രീതികൾ ഒഴിവാക്കുക.
പ്രധാന സവിശേഷതകൾ
- ഒരു വെബ് അധിഷ്ഠിത കോഡ് എഡിറ്ററും പ്രോട്ടോടൈപ്പ് ടൂളും.
- പ്രാദേശിക ഉപയോഗത്തിനായി, ഒരു zip ഫയലിൽ ഒരു സാൻഡ്ബോക്സ് എളുപ്പത്തിൽ ഡൗൺലോഡ് ചെയ്തേക്കാം.
- പ്രോഗ്രാമിംഗ് സാൻഡ്ബോക്സുകളിലാണ് ചെയ്യുന്നത്, അത് സഹപ്രവർത്തകരുമായി എളുപ്പത്തിൽ പങ്കിടാം.
പ്രയോജനങ്ങൾ
- മെച്ചപ്പെട്ട ഉപയോക്തൃ അനുഭവവും എഡിറ്ററിൽ കൂടുതൽ നിയന്ത്രണവും.
- തത്സമയ പ്രിവ്യൂ ഫീച്ചർ പരിഷ്കരിക്കാനും പ്രത്യേക വിൻഡോയിൽ കാണാനും കഴിയും.
- കോഡ് സ്വയമേവ ഫോർമാറ്റ് ചെയ്യപ്പെടുകയും ഒരു CLI (codesandbox-cli) ഉൾപ്പെടുന്നു
- വിപുലമായ npm മൊഡ്യൂളുകൾക്കുള്ള പിന്തുണ.
- ശുപാർശകൾക്കൊപ്പം നല്ല പിശക് സന്ദേശങ്ങൾ.
- മികച്ച ടെർമിനൽ, ടെസ്റ്റ് വ്യൂവർ, ഇഷ്യൂ വ്യൂവർ എന്നിവ നൽകിക്കൊണ്ട് ഇത് ഡീബഗ്ഗിംഗ് അനുഭവം മെച്ചപ്പെടുത്തുന്നു.
സഹടപിക്കാനും
- അന്തിമ ഉപഭോക്താവ് നിരവധി വ്യക്തിഗതമാക്കലുകൾക്ക് വിധേയനാണ്.
- ഒരു ലോക്കൽ കമ്പ്യൂട്ടറിൽ നിന്ന് ഫയലുകൾ വലിച്ചിടുന്നത് ശരിയായി പ്രവർത്തിക്കുന്നില്ല.
- CodeSandbox-ൽ ഒരു നിശ്ചിത ഫോൾഡർ ഘടന പിന്തുടരേണ്ടതുണ്ട്.
- ഒരു സ്വകാര്യ സാൻഡ്ബോക്സിന്റെ പ്രവർത്തനം രക്ഷാധികാരികൾക്ക് മാത്രമേ ലഭ്യമാകൂ.
സ്റ്റാക്ക്ബ്ലിറ്റ്സ്
വെബ് ആപ്ലിക്കേഷനുകൾക്കായുള്ള വിഷ്വൽ സ്റ്റുഡിയോ കോഡിൽ പ്രവർത്തിക്കുന്ന ഒരു ഓൺലൈൻ IDE ആണ് StackBlitz. പ്ലാറ്റ്ഫോം ഡെസ്ക്ടോപ്പ് പതിപ്പ് പോലെ പ്രതികരിക്കുന്നതും പൊരുത്തപ്പെടുത്താവുന്നതുമാണ്. StackBlitz ഒരു ഓൺലൈൻ IDE ആണ്, അത് മുൻകൂട്ടി ലോഡുചെയ്തു കോണീയവും പ്രതികരണവും വികസന ഉപകരണങ്ങൾ.
ഡിപൻഡൻസി ഇൻസ്റ്റാളേഷനെക്കുറിച്ചോ ബിൽഡ് ക്രമീകരണങ്ങളെക്കുറിച്ചോ ആകുലപ്പെടാതെ തന്നെ നിങ്ങളുടെ ആംഗുലാർ അല്ലെങ്കിൽ റിയാക്റ്റ് പ്രോജക്റ്റ് ഉപയോഗിച്ച് ആരംഭിക്കുന്നത് കഴിയുന്നത്ര ലളിതമാക്കാൻ Thinkster.io ആ അതിശയകരമായ പ്രോജക്റ്റ് നിർമ്മിച്ചു. ഇപ്പോൾ മറ്റൊരു ഓൺലൈൻ കോഡ് എഡിറ്റർക്കും ഇല്ലാത്ത അതിശയകരവും അതുല്യവുമായ നിരവധി സവിശേഷതകൾ StackBlitz നൽകുന്നു. തൽഫലമായി, StackBlitz-നെ കുറിച്ച് കൂടുതൽ അന്വേഷിച്ച് ഈ ഓൺലൈൻ IDE എന്താണ് വാഗ്ദാനം ചെയ്യുന്നതെന്ന് കണ്ടെത്തുന്നത് മൂല്യവത്താണ്.
Stackblitz പൂർണ്ണമായ IDE-യുമായി താരതമ്യപ്പെടുത്താവുന്നതാണ്, പ്രത്യേകിച്ചും നിങ്ങൾക്ക് VS കോഡിനോട് വിട പറയാൻ കഴിയുന്നില്ലെങ്കിൽ, ഉപകരണം അതിനെ അടിസ്ഥാനമാക്കിയുള്ളതാണ്. ഒരു ഫുൾ-സ്റ്റാക്ക് ആപ്ലിക്കേഷൻ സൃഷ്ടിക്കാൻ തുടങ്ങുന്നതിനും തുടരുന്നതിനും നിങ്ങളെ അനുവദിക്കുന്ന വൈവിധ്യമാർന്ന സവിശേഷതകൾ പാക്കേജിലുണ്ട്.
ഡെവലപ്പർമാർക്കിടയിൽ അറിയപ്പെടുന്ന വിഷ്വൽ സ്റ്റുഡിയോയാണ് പ്രോഗ്രാം പ്രവർത്തിപ്പിക്കുന്നത്. ഓഫ്ലൈൻ എഡിറ്റിംഗ് പ്രോജക്റ്റിന്റെ ശ്രദ്ധേയമായ സവിശേഷതയാണ്. ഇത് സാധ്യമാക്കാൻ, Stackblitz ടീം ഒരു ഇൻ-ബ്രൗസർ വെബ്സെർവർ സൃഷ്ടിച്ചു. നിങ്ങൾ ടൈപ്പ് ചെയ്യുമ്പോൾ, അത് സ്വയമേവ ഡിപൻഡൻസികൾ ഇൻസ്റ്റാൾ ചെയ്യുന്നു, കംപൈൽ ചെയ്യുന്നു, ബണ്ടിലുകൾ ചെയ്യുന്നു, കൂടാതെ ഹോട്ട് റീലോഡിംഗ് ചെയ്യുന്നു.
പ്രീമിയം പതിപ്പ്
കേഡറ്റ്, ബഹിരാകാശയാത്രികൻ, കമാൻഡർ എന്നിവ യഥാക്രമം $8/മാസം, $29/മാസം എന്നിങ്ങനെ സൗജന്യമായി ലഭ്യമാണ്. അൺലിമിറ്റഡ് പ്രൈവറ്റ് പ്രൊജക്റ്റുകൾ, അൺലിമിറ്റഡ് ഫയൽ അപ്ലോഡുകൾ, കോർ ടീം സ്ലാക്ക് ചാനലിലേക്കുള്ള ക്ഷണം, തുടങ്ങിയ നിരവധി ഫീച്ചറുകൾ ബഹിരാകാശയാത്രികനും കമാൻഡറും ഉൾക്കൊള്ളുന്നു. കൂടുതൽ വിവരങ്ങൾക്ക്, ഔദ്യോഗിക ബില്ലിംഗ് ബോർഡ് കാണുക.
പ്രധാന സവിശേഷതകൾ
- നിങ്ങളുടെ പ്രോജക്റ്റിലേക്ക് NPM പാക്കേജുകൾ ചേർക്കുന്നു.
- ഒരു നോവൽ ഇൻ-ബ്രൗസർ ദേവ് സെർവറിന് നന്ദി, ഓഫ്ലൈനിലായിരിക്കുമ്പോൾ നിങ്ങൾക്ക് എഡിറ്റുചെയ്യാനാകും.
- ഏത് സമയത്തും ഞങ്ങളുടെ തത്സമയ ആപ്പ് ആക്സസ് ചെയ്യാൻ (പങ്കിടാനും) ഞങ്ങളെ അനുവദിക്കുന്ന ഒരു ഹോസ്റ്റ് ചെയ്ത ആപ്പ് URL.
- ഇന്റലിസെൻസ്, പ്രോജക്റ്റ് തിരയൽ (Cmd/Ctrl+P), Go to Definition, എന്നിവയും മറ്റ് ശ്രദ്ധേയമായ വിഷ്വൽ സ്റ്റുഡിയോ കോഡ് സവിശേഷതകളും ഉൾപ്പെടുന്നു.
പ്രയോജനങ്ങൾ
- വിന്യാസത്തിനുള്ള ഫയർബേസിന്റെ കഴിവുകൾ.
- എഡിറ്റർ ഉപയോഗിക്കാൻ വളരെ എളുപ്പവും വളരെ വേഗവുമാണ്.
- പാക്കേജ്.json, index.html, index.js എന്നിവയിലേക്ക് ഉപയോക്താക്കൾക്ക് ആക്സസ് ഉണ്ട്.
- ഉൾച്ചേർക്കാവുന്ന പങ്കിടാവുന്ന സോഴ്സ് കോഡ്.
- പേജിന്റെ വലിയൊരു ഭാഗത്ത് തത്സമയ പ്രിവ്യൂ, ആവശ്യമെങ്കിൽ മറ്റൊരു പേജിൽ തുറക്കാനുള്ള ഓപ്ഷൻ.
- ഓഫ്ലൈനായിരിക്കുമ്പോൾ, എഡിറ്റിംഗ്
- മികച്ച പൂർത്തീകരണങ്ങളും മെച്ചപ്പെട്ട ഇന്റലിസെൻസും.
- സ്റ്റാക്ക്ബ്ലിറ്റ്സിന്റെ കാതൽ ഓപ്പൺ സോഴ്സ്.
സഹടപിക്കാനും
- നിങ്ങൾക്ക് കെട്ടിടത്തിലോ ഡെവലപ്പർ സെർവറിലോ സ്വാധീനമില്ല, കാരണം അവ നിയന്ത്രിക്കുന്നത് create-react-app കമാൻഡ് ആണ്.
- പ്രതികരണത്തിൽ, ഒരു അടിസ്ഥാന ഫോൾഡർ ഘടന നിരീക്ഷിക്കണം.
- കോഡ് സ്വയമേവ ഫോർമാറ്റ് ചെയ്യുന്നത് സാധ്യമല്ല, എന്നിരുന്നാലും ഇത് സ്വമേധയാ ചെയ്യാൻ കഴിയും.
തീരുമാനം
ഇക്കാലത്ത്, ഏത് വെബ് പ്രോജക്റ്റും പൂർണ്ണമായും നിർമ്മിക്കാൻ നമ്മൾ മുകളിൽ കണ്ടത് പോലെയുള്ള ഒരു കോഡിംഗ് പ്ലേഗ്രൗണ്ട് ഉപയോഗിച്ചേക്കാം. നിങ്ങളുടെ വെബ് ബ്രൗസറിൽ നിന്ന് നേരിട്ട് നിർമ്മിക്കാനും ഡീബഗ് ചെയ്യാനും പരിശോധിക്കാനും വിന്യസിക്കാനും കഴിയുമ്പോൾ നിങ്ങളുടെ പിസിയിൽ ബുദ്ധിമുട്ടുള്ള IDE-കൾ ഇൻസ്റ്റാൾ ചെയ്യേണ്ട ആവശ്യമില്ല.
എന്റെ അഭിപ്രായത്തിൽ, StackBlitz അവയിൽ ഏറ്റവും മികച്ചതായിരിക്കും, കാരണം Node.js, npm, പോലുള്ള പ്രാദേശിക വികസന പരിതസ്ഥിതികളൊന്നും ഇൻസ്റ്റാൾ ചെയ്യേണ്ടതില്ല, JavaScript, Angular, മറ്റ് വികസന പദ്ധതികൾ എന്നിവ അനുവദിക്കുന്ന ഒരു വെബ് അധിഷ്ഠിത IDE ആയതിനാൽ. അല്ലെങ്കിൽ കോണിക. പ്രാദേശികമായി വിഷ്വൽ സ്റ്റുഡിയോ കോഡ് ഉപയോഗിക്കുന്നതിന് സമാനമായ അനുഭവം ഇത് നൽകുന്നു. യഥാർത്ഥത്തിൽ, StackBlitz വിഷ്വൽ സ്റ്റുഡിയോ കോഡാൽ നയിക്കപ്പെടുന്നതിനാൽ, ഡെസ്ക്ടോപ്പ് പതിപ്പ് പോലെ വേഗമേറിയതും വൈവിധ്യപൂർണ്ണവുമാണ് ഇതിന് അനുഭവപ്പെടുന്നത്.
CodePen, CodeSandbox, StackBlitz എന്നിവയിൽ ഏതാണ് നിങ്ങളുടെ ഗോ-ടു ടൂൾ? അഭിപ്രായങ്ങളിൽ ഞങ്ങളെ അറിയിക്കുക.
അബ്ബത്തയ്യ
ഈ മഹത്തായ ലേഖനത്തിന് നന്ദി, ഒരിക്കൽ ഞാൻ stackblitz.com കണ്ടു, ഇതാണ് എനിക്ക് വേണ്ടത് എന്ന് എനിക്കറിയാം.