React සංරචක සැකසීමේ ක්රම
React සංරචක සැකසීම සඳහා විවිධ ක්රම රාශියක් පවතී. මෙහිදී අපි ඒවායින් මූලික ඒවා කිහිපයක් සලකා බලමු.
අපට යෙදිය හැකි සම්මත ප්රවේශය වන්නේ සාමාන්ය වෙබ් පිටු සැකසුම් කරන විට යොදා ගන්නා පරිදිම ගෝලීය CSS භාවිතා කිරීමයි. මෙහිදී අපි විලාසිතා සමඟ එක් බාහිර පොදු CSS ගොනුවක් සාදන්නෙමු. මෙම ප්රවේශය භාවිතා කරන විට, සියලුම පන්ති නම් ගෝලීය ප්රදේශය තුළ පවතින අතර, එය ඒවා අතර ගැටුම් සිදුවීමට හේතු විය හැකිය. එසේම කුඩා CSS ගොනු බොහෝ ගණනක්ද සාදා ගත හැකිය. මෙම ප්රවේශය විශාල පරිමාණනීය යෙදුම් සෑදීම සඳහා අඩු කාර්යක්ෂමතාවයක් දක්වයි.
ඊළඟ ප්රවේශය වන්නේ අභ්යන්තර සැකසුම,
එය භාවිතා කරමින්, අපට සාමාන්ය HTML හි කරනවා
මෙන් CSS විලාසිතා අභ්යන්තරව එක් කළ හැකිය.
මෙම අවස්ථාවේ දී අපි style ගුණාංගය සමඟ
වැඩ කරමු, අවශ්ය CSS ගුණාංග එයට සම්පාදනය කරමින්.
මෙවැනි සැකසුමක් භාවිතා කිරීම නරක පුරුද්දක් ලෙස
සැලකෙන අතර නිර්මාණය කරන අවස්ථාවේ දී ගතිකව
ගණනය කරන ලද විලාසිතා එකතු කිරීම සඳහා පමණක්
නිර්දේශ කෙරේ. වෙනම සංරචකයක අතුරු මුහුණතක්
ක්ෂණිකව නිර්මාණය කිරීම සඳහා මෙම ක්රමය
හොඳය.
අපි සලකා බලන ඊළඟ ක්රම යුගලය නම් නවීන, ජනප්රියත්වය ලබමින් පවතින, කාර්යක්ෂම සැකසුම් ක්රම වේ. විශාල පරිමාණනීය React යෙදුම් සැකසීම සඳහා යෙදිය යුතු ක්රම යනු මේවාය.
ඒවායින් පළමුවැන්න වන්නේ Styled Components පුස්තකාලය යෙදීමයි, එය සැකසුම සඳහා ආදර්ශ පේළි භාවිතා කරයි. මෙම ක්රමය අපට එහි සම්පූර්ණ ක්රියාකාරීත්වය භාවිතා කරමින් JS කේතය තුළ සාමාන්ය CSS ලිවීමට ඉඩ සලසයි.
දෙවන ක්රමය වන්නේ CSS මොඩියුල යෙදීමයි. මෙම අවස්ථාවේ දී, CSS මොඩියුලය යනු CSS ගොනුවක් වන අතර, සාමාන්යයෙන් සියලුම පන්ති නම් සහ සජීවිකරණ ප්රාදේශීය ප්රදේශය තුළ පවතින අතර, එනම් එය භාවිතා කරන සංරචකය තුළ පමණක් ප්රවේශ විය හැකිය.
මෙම අවසාන ක්රම දෙක තුළ, අපට පන්ති නම් අතර ගැටුම් ගැන බිය විය යුතු නැත, මන්ද ඒවා අද්විතීය වන අතර - ප්රාදේශීය ප්රදේශය පිළිබඳ අදහස භාවිතා කරයි. එසේම ඒවා භාවිතා කරන විට BEM ක්රමවේදය අවශ්ය නොවේ.
ඊළඟ පාඩම්වල දී, අපි මෙහි දක්වා ඇති සියලුම ක්රම විස්තරාත්මකව සලකා බලමු.