React පදනම් UI ටෙම්ප්ලේට් එකක් අත්හදා බලන්න හෝ වර්ණයක් වෙනස් කර බලන්න අවශ්ය වෙලා, සාමාන්යයෙන් ගිට් කොපි කර, npm install කර, Vite සර්වර් එකක් ධාවනය කර, බ්රවුසරයේ localhost එකට යන්න වෙයි. ඒ වැඩේ තරමක් කාලයක් ගත කරයි, ගිගාබයිට් ගණනාවක් node_modules වලට වැය වෙයි.
එහෙමත් නැතිව, Minimal UI Kit කණ්ඩායම විසින් නිර්මාණය කරන ලද material‑kit‑react ටෙම්ප්ලේට් එක CrossUI Studio තුළ සෘජුයෙන්ම විවෘත කර, build පියවරක් නොගෙන ප්රීව්යු කිරීමේ ක්රමයක් ලේඛකයා හෙළි කරයි. මේකෙන් තේරුම් ගත හැක්කේ, ඔබට සොෆ්ට්වෙයාර් එකක් ස්ථාපනය නොකර, Vite හෝ localhost නැතිවත් Dashboard එකක් දැකගත හැකි බවයි.
කියුම් ක්රියාවලිය
- Git clone – රිපෝ එක ඔබේ පරිගණකයට පිටපත් කරගන්න. GitHub API හරහා සෘජුවම විවෘත කරනවාට වඩා, ලොකල් ෆෝල්ඩරයක් භාවිතා කිරීම වේගවත්.
- CrossUI Studio තුළ Local Folder විකල්පය තෝරා, clone කරන ලද material‑kit‑react ෆෝල්ඩරය තෝරන්න.
- Studio එකට Project Settings ගොනුවක් නොමැති බව පෙන්වයි; Scan & Generate බොත්තම ඔබා, ස්වයංක්රීයව සැකසීමක් සකසයි.
- src/main.tsx ගොනුව විවෘත කර, Preview බොත්තම ඔබා Dashboard එක Canvas එකේ පෙන්වන්න.
මෙම ක්රියාවලිය සම්පූර්ණයෙන්ම npm install, Vite, හෝ localhost සෙට්‑අප් අවශ්ය නොවේ. එය මූලිකව Look‑and‑Tweak ලූප් එකක් සඳහායි – ටෙම්ප්ලේට් එකක් ඇගයීම, වර්ණයක් වෙනස් කිරීම, හෝ ගනුදෙනුකරුවකුට පෙන්නුම් කිරීම වැනි කාර්යයන්ට ඉතා සුදුසු.
ශ්රී ලංකාවට ඇති වැදගත්කම
ශ්රී ලංකාවේ තාක්ෂණික ශිෂ්යයන්, ඩෙවලපර්වරු සහ ස්මාල් බිස්නස් හිමියන්ට මේ ක්රමය විශාල වාසියක් ගෙනදෙයි. පළමු වරට, බහුලව භාවිතා වන Node.js පරිසරයක් ස්ථාපනය නොකළත්, ටෙම්ප්ලේට් එකේ UI පරීක්ෂා කරගත හැකිය. එයින් කාලය ඉතිරි වීමත්, පරිසර සකස් කිරීමේ වැරදි අවස්ථා අඩු වීමත් සිදු වේ.
- විශ්ව විද්යාල හා තාක්ෂණ පාඨමාලා වලදී, සිසුන්ට UI කට්ටලයක් ඉක්මනින් පරීක්ෂා කර, තමන්ගේ අදහස් දැනගැනීමට අවස්ථාව.
- ස්ථානාධාරක සමාගම්ට, පාරිභෝගිකයන්ට නව UI එකක් දැක්වීමට වඩා වේගවත්, සාර්ථක පෙන්වීම්.
- ස්මාල් බිස්නස් සඳහා, වැඩි පරිසර පිරිවැය 없이, ඉක්මනින් ප්රොටොටයිප් නිර්මාණය කරගැනීමට හැකියාව.
ඔබට CrossUI Studio Pro ගිණුමක් අවශ්ය වුවත්, ලිපියේ සදහන් කේතය භාවිතා කර, නොමිලේ උත්සාහ කළ හැකිය. නමුත් මෙය නිෂ්පාදන තලය සඳහා නොව, පරීක්ෂණ, ඩෙමෝ, හා UI සැලසුම් වෙනස් කිරීම සඳහා පමණක් යොදා ගත යුතුය.
ඉදිරියට, මෙවැනි “build‑less” ක්රමය භාවිතා කර, ඔබේ වැඩි කාලය හා සම්පත් ආරක්ෂා කරගනිමු.
