හැඳින්වීම
ඔබ ක්‍රමලේඛනයට අලුත් හෝ පළපුරුදු සංවර්ධකයෙකු වුවද, ප්‍රවණතා සමඟින් සිටීමට මෙම කර්මාන්තය තුළ නව සංකල්ප සහ භාෂා/රාමු ඉගෙනීම අත්‍යවශ්‍ය වේ.
උදාහරණයක් ලෙස, React ගන්න, එය වසර හතරකට පෙර Facebook විවෘත මූලාශ්‍ර ලබා ගත් අතර දැනටමත් ලොව පුරා JavaScript සංවර්ධකයින් සඳහා අංක එකේ තේරීම බවට පත්ව ඇත.
Vue සහ Angular, ඇත්ත වශයෙන්ම, ඔවුන්ගේම නීත්‍යානුකූල රසික පිරිසක් ද ඇත. ඉන්පසු Svelte සහ Next.js හෝ Nuxt.js වැනි වෙනත් විශ්වීය රාමු ඇත. සහ Gatsby, සහ Gridsome, සහ Quasar... සහ තවත් බොහෝ දේ.
ඔබට පළපුරුදු ජාවාස්ක්‍රිප්ට් සංවර්ධකයෙකු ලෙස ඔප්පු කිරීමට අවශ්‍ය නම්, ඔබට හොඳ පැරණි JS සමඟ වැඩ කිරීමට අමතරව විවිධ රාමු සහ පුස්තකාල සමඟ අවම වශයෙන් යම් අත්දැකීමක් තිබිය යුතුය.
2020 දී ඔබට ඉදිරිපෙළ ප්‍රධානියෙකු වීමට උදවු කිරීම සඳහා, මම විවිධ ව්යාපෘති නවයක් එකට එකතු කර ඇත, ඒ සෑම එකක්ම වෙනස් JavaScript රාමුවක් සහ පුස්තකාලයක් වෙත අවධානය යොමු කරමින් ඔබට ගොඩනගා ඔබේ කළඹට එක් කළ හැකිය. ඇත්ත වශයෙන්ම දේවල් නිර්මාණය කිරීමට වඩා කිසිවක් ඔබට උපකාරී නොවන බව මතක තබා ගන්න, එබැවින් ඉදිරියට යන්න, ඔබේ මනස භාවිතා කර එය සිදු කරන්න
ලිපිය පරිවර්තනය කරන ලද්දේ EDISON මෘදුකාංගයේ සහය ඇතිවය , මෙන්ම .
ප්රතික්රියා භාවිතයෙන් චිත්‍රපට සෙවුම් යෙදුම (කොකු සහිත)
ඔබට ආරම්භ කළ හැකි පළමු දෙය නම් React භාවිතයෙන් චිත්‍රපට සෙවුම් යෙදුමක් නිර්මාණය කිරීමයි. අවසාන යෙදුම කෙබඳු වනු ඇත්ද යන්න පිළිබඳ රූපයක් පහත දැක්වේ:
ඔබ මොනවද ඉගෙන ගන්නේ
මෙම යෙදුම ගොඩනැගීමෙන්, ඔබ සාපේක්ෂව නව Hooks API භාවිතා කිරීමෙන් ඔබේ ප්රතික්රියා කුසලතා වැඩි දියුණු කරයි. උදාහරණ ව්යාපෘතිය ප්රතික්රියා සංරචක, කොකු ගොඩක්, බාහිර API සහ ඇත්ත වශයෙන්ම සමහර CSS මෝස්තර භාවිතා කරයි.
තාක්ෂණික තොග සහ විශේෂාංග
- කොකු සමඟ ප්රතික්රියා කරන්න
- සාදන්න-ප්රතික්රියා කරන්න-යෙදුම
- JSX
- CSS
කිසිදු පංතියක් භාවිතා නොකර, මෙම ව්යාපෘති ඔබට ක්‍රියාකාරී ප්‍රතික්‍රියාවට පරිපූර්ණ පිවිසුම් ලක්ෂ්‍යයක් ලබා දෙන අතර 2020 දී ඔබට අනිවාර්යයෙන්ම උපකාර කරනු ඇත. ඔබට සොයා ගත හැක . උපදෙස් අනුගමනය කරන්න හෝ එය ඔබේම කර ගන්න.
Vue සමඟ චැට් යෙදුම
ඔබට කළ යුතු තවත් විශිෂ්ට ව්‍යාපෘතියක් නම් මගේ ප්‍රියතම ජාවාස්ක්‍රිප්ට් පුස්තකාලය භාවිතයෙන් කතාබස් යෙදුමක් නිර්මාණය කිරීමයි: VueJS. යෙදුම මේ වගේ දෙයක් පෙනෙනු ඇත:
ඔබ මොනවද ඉගෙන ගන්නේ
මෙම නිබන්ධනය තුළ, ඔබ මුල සිටම Vue යෙදුමක් සාදා ගන්නේ කෙසේදැයි ඉගෙන ගනු ඇත - සංරචක සෑදීම, තත්වය හැසිරවීම, මාර්ග නිර්මාණය කිරීම, තෙවන පාර්ශවීය සේවා වෙත සම්බන්ධ වීම සහ සත්‍යාපනය හැසිරවීම පවා.
තාක්ෂණික තොග සහ විශේෂාංග
- Vue
- vuex
- Vue රවුටරය
- Vue CLI
- පුෂර්
- CSS
මෙය Vue සමඟ ආරම්භ කිරීමට හෝ 2020 දී සංවර්ධනයට පිවිසීමට ඔබේ පවතින කුසලතා වැඩි දියුණු කිරීමට ඇත්තෙන්ම විශිෂ්ට ව්‍යාපෘතියකි. ඔබට සොයා ගත හැක .
Angular 8 සමඟ ලස්සන කාලගුණ යෙදුම
මෙම උදාහරණය ඔබට Angular 8 භාවිතයෙන් ලස්සන කාලගුණ යෙදුමක් නිර්මාණය කිරීමට උපකාරී වනු ඇත:
ඔබ මොනවද ඉගෙන ගන්නේ
මෙම ව්යාපෘතිය මුල සිටම යෙදුම් තැනීමේ වටිනා කුසලතා ඔබට උගන්වනු ඇත - සැලසුම් කිරීමේ සිට සංවර්ධනය දක්වා, යෙදවීමට සූදානම් යෙදුමක් දක්වා.
තාක්ෂණික තොග සහ විශේෂාංග
- කෝණික 8
- ෆයර්බෙස්
- සේවාදායක පැත්ත විදැහුම්කරණය
- Grid සහ Flexbox සමඟ CSS
- ජංගම හිතකාමී සහ අනුවර්තනය වීමේ හැකියාව
- අඳුරු මාදිලිය
- ලස්සන අතුරු මුහුණත
මෙම සර්ව සම්පූර්ණ ව්යාපෘතිය ගැන මම සැබවින්ම ප්‍රිය කරන්නේ ඔබ හුදකලා දේවල් අධ්‍යයනය නොකිරීමයි. ඒ වෙනුවට, ඔබ සැලසුම් කිරීමේ සිට අවසාන යෙදවීම දක්වා සම්පූර්ණ සංවර්ධන ක්‍රියාවලිය ඉගෙන ගනී.
Svelte භාවිතයෙන් කළ යුතු යෙදුම
Svelte යනු සංරචක-පාදක ප්‍රවේශයේ නව ළමයෙකු වැනිය - අවම වශයෙන් ප්රතික්රියා, Vue සහ Angular වලට සමාන වේ. මෙය 2020 සඳහා උණුසුම්ම නව නිෂ්පාදනවලින් එකකි.
කළ යුතු යෙදුම් අනිවාර්යයෙන්ම උණුසුම්ම මාතෘකාව නොවේ, නමුත් එය ඇත්ත වශයෙන්ම ඔබට ඔබේ Svelte කුසලතා ඔප්නැංවීමට උපකාරී වනු ඇත. එය මේ ආකාරයෙන් පෙනෙනු ඇත:
ඔබ මොනවද ඉගෙන ගන්නේ
මෙම නිබන්ධනය ආරම්භයේ සිට අවසානය දක්වා Svelte 3 භාවිතයෙන් යෙදුමක් නිර්මාණය කරන්නේ කෙසේදැයි පෙන්වයි. ඔබ සංරචක, හැඩගැන්වීම් සහ සිදුවීම් හසුරුවන්නන් භාවිතා කරනු ඇත
තාක්ෂණික තොග සහ විශේෂාංග
- ස්වෙල්ට් 3
- සංරචක
- CSS සමඟ හැඩගැන්වීම
- ES 6 වාක්‍ය ඛණ්ඩය
බොහෝ හොඳ Svelte ආරම්භක ව්යාපෘති නොමැත, එබැවින් මම සොයා ගතිමි .
Next.js භාවිතයෙන් ඊ-වාණිජ්‍යය යෙදුම
Next.js යනු පෙට්ටියෙන් පිටත සේවාදායක පැත්තේ විදැහුම්කරණයට සහාය වන ප්රතික්රියා යෙදුම් තැනීමේ වඩාත් ජනප්‍රිය රාමුවයි.
මෙම ව්යාපෘතිය මඟින් ඔබට මෙවැනි ඊ-වාණිජ්‍ය යෙදුමක් නිර්මාණය කරන්නේ කෙසේදැයි පෙන්වනු ඇත:
ඔබ මොනවද ඉගෙන ගන්නේ
මෙම ව්‍යාපෘතියේදී, ඔබ Next.js සමඟින් සංවර්ධනය කරන්නේ කෙසේදැයි ඉගෙන ගනු ඇත—නව පිටු සහ සංරචක නිර්මාණය කිරීම, දත්ත උකහා ගැනීම සහ විලාසය සහ ඊළඟ යෙදුමක් යෙදවීම.
තාක්ෂණික තොග සහ විශේෂාංග
- ඊළඟට
- සංරචක සහ පිටු
- දත්ත නියැදීම
- ශෛලීගත කිරීම
- ව්යාපෘති යෙදවීම
- SSR සහ SPA
අලුත් දෙයක් ඉගෙන ගැනීමට ඊ-වාණිජ්‍යය යෙදුමක් වැනි සැබෑ ලෝක ආදර්ශයක් තිබීම සැමවිටම විශිෂ්ටයි. ඔයාට පුළුවන් .
Nuxt.js සමඟ පූර්ණ-පරිපූර්ණ බහුභාෂා බ්ලොගය
Nuxt.js යනු Vue සඳහා වන අතර, Next.js යනු ප්රතික්රියා සඳහා කුමක්ද: සේවාදායක පැත්තේ විදැහුම්කරණයේ සහ තනි පිටු යෙදුම්වල බලය ඒකාබද්ධ කිරීම සඳහා විශිෂ්ට රාමුවකි.
ඔබට නිර්මාණය කළ හැකි අවසාන යෙදුම මේ ආකාරයෙන් පෙනෙනු ඇත:
ඔබ මොනවද ඉගෙන ගන්නේ
මෙම නියැදි ව්යාපෘතිය තුළ, ඔබ Nuxt.js භාවිතයෙන් සම්පූර්ණ වෙබ් අඩවියක් නිර්මාණය කරන්නේ කෙසේදැයි ඉගෙන ගනු ඇත, මුලික සැකසුමේ සිට අවසාන යෙදවීම දක්වා.
එය Nuxt විසින් පිරිනමනු ලබන පිටු සහ සංරචක, සහ SCSS සමඟ හැඩගැන්වීම වැනි බොහෝ සිසිල් විශේෂාංගවලින් ප්‍රයෝජන ගනී.
තාක්ෂණික තොග සහ විශේෂාංග
- Nuxt.js
- සංරචක සහ පිටු
- Storyblock මොඩියුලය
- හග්ෆිෂ්
- රාජ්ය කළමනාකරණය සඳහා Vuex
- හැඩගැන්වීම සඳහා SCSS
- Nuxt midwares
, බොහෝ විශිෂ්ට Nuxt.js විශේෂාංග ඇතුළත් වේ. මම පුද්ගලිකව Nuxt සමඟ වැඩ කිරීමට ප්‍රිය කරමි, එබැවින් එය ඔබව විශිෂ්ට Vue සංවර්ධකයෙකු බවට පත් කරන බැවින් ඔබ එය උත්සාහ කර බලන්න.
Gatsby සමඟ බ්ලොග් කරන්න
Gatsby යනු React සහ GraphQL භාවිතා කරන විශිෂ්ට ස්ථිතික අඩවි උත්පාදකයකි. ව්‍යාපෘතියේ ප්‍රතිඵලය මෙයයි.
ඔබ මොනවද ඉගෙන ගන්නේ
මෙම නිබන්ධනයේදී, ඔබ React සහ GraphQL භාවිතයෙන් ඔබේම ලිපි ලිවීමට භාවිතා කරන බ්ලොග් එකක් සෑදීමට Gatsby භාවිතා කරන්නේ කෙසේදැයි ඉගෙන ගනු ඇත.
තාක්ෂණික තොග සහ විශේෂාංග
- ගැට්ස්බි
- React
- GraphQL
- ප්ලගීන සහ තේමා
- MDX/Markdown
- Bootstrap CSS
- රටා
ඔබට කවදා හෝ බ්ලොග් අඩවියක් ආරම්භ කිරීමට අවශ්‍ය නම්, React සහ GraphQL භාවිතයෙන් එය සාදා ගන්නේ කෙසේද යන්න පිළිබඳව.
මම WordPress නරක තේරීමක් යැයි නොකියමි, නමුත් Gatsby සමඟින් ඔබට React භාවිතයෙන් ඉහළ කාර්යසාධනයක් සහිත වෙබ් අඩවි ගොඩනගා ගත හැකිය - එය විශ්මයජනක සංයෝජනයකි.
Gridsome සමඟ බ්ලොග් කරන්න
Vue සඳහා Gridsome... හරි, අපි දැනටමත් මෙය Next/Nuxt සමඟ ඇත.
නමුත් Gridsome සහ Gatsby සම්බන්ධයෙන්ද එයම සත්‍ය වේ. දෙකම ඔවුන්ගේ දත්ත ස්ථරය ලෙස GraphQL භාවිතා කරයි, නමුත් Gridsome VueJS භාවිතා කරයි. මෙය විශිෂ්ට ස්ථිතික අඩවි උත්පාදකයක් වන අතර එය ඔබට විශිෂ්ට බ්ලොග් නිර්මාණය කිරීමට උපකාරී වනු ඇත:
ඔබ මොනවද ඉගෙන ගන්නේ
Gridsome, GraphQL සහ Markdown සමඟින් ආරම්භ කිරීම සඳහා සරල බ්ලොගයක් නිර්මාණය කරන ආකාරය මෙම ව්යාපෘතිය මඟින් ඔබට කියා දෙනු ඇත. Netlify හරහා යෙදුමක් යෙදවිය යුතු ආකාරය ද එය ආවරණය කරයි.
තාක්ෂණික තොග සහ විශේෂාංග
- ග්රිඩ්සම්
- Vue
- GraphQL
- Markdown
- නෙට්ලිෆයි
මෙය නිසැකවම වඩාත් විස්තීර්ණ නිබන්ධනය නොවේ, නමුත් එය Gridsome හි මූලික සංකල්ප ආවරණය කරයි .
Quasar භාවිතා කරන SoundCloud වැනි ශ්‍රව්‍ය වාදකය
Quasar යනු ජංගම යෙදුම් නිර්මාණය කිරීමට භාවිතා කළ හැකි තවත් Vue රාමුවකි. මෙම ව්‍යාපෘතියේදී ඔබ ඕඩියෝ ප්ලේයර් යෙදුමක් සාදනු ඇත, උදාහරණයක් ලෙස:
ඔබ මොනවද ඉගෙන ගන්නේ
අනෙකුත් ව්යාපෘති ප්‍රධාන වශයෙන් වෙබ් යෙදුම් කෙරෙහි අවධානය යොමු කරන අතර, මෙය Vue සහ Quasar රාමුව භාවිතයෙන් ජංගම යෙදුමක් නිර්මාණය කරන්නේ කෙසේදැයි පෙන්වයි.
ඔබ දැනටමත් Android Studio/Xcode වින්‍යාස කර ඇති Cordova ධාවනය කර තිබිය යුතුය. එසේ නොවේ නම්, අත්පොතෙහි Quasar වෙබ් අඩවියට සබැඳියක් ඇත, එහිදී ඔවුන් ඔබට සියල්ල සකසන්නේ කෙසේදැයි පෙන්වයි.
තාක්ෂණික තොග සහ විශේෂාංග
- ක්වාසාර්
- Vue
- Cordova
- WaveSurfer
- UI සංරචක
, ජංගම යෙදුම් නිර්මාණය කිරීම සඳහා ක්වාසාර්ගේ හැකියාවන් ප්‍රදර්ශනය කිරීම.
මූලාශ්රය: www.habr.com