Angular 21 නවතම සංස්කරණය සමඟ Module Federation භාවිතා කරමින් මයික්රො ෆ්රන්ට්එන්ඩ් ආකෘතියක් සකස් කිරීමේ පියවර 6ක් මෙහි විස්තර කර ඇත.
පළමුව Angular CLI 21 ස්ථාපනය කර, ng new විධානයෙන් හිස් වැඩසටහනක් (workspace) සාදයි. එම පසු ng generate application භාවිතයෙන් host-app එක හා auth-app, user-app, role-app යන රිමෝට් 3 ක් එකතු කරයි. සෑම යෙදුමක්ම --routing සහ --style css විකල්ප සමඟ නිර්මාණය කරන අතර, ප්රොජෙක්ට් රූපලාවන්යය projects ෆෝල්ඩරයට යටතේ සකස් වේ.
ඊළඟට Angular Architects විසින් ලබා දෙන @angular-architects/module-federation සහ @angular-architects/native-federation පැකේජ 2 ක් npm install --save-dev මඟින් එකතු කරයි. පසුව ng add @angular-architects/native-federation විධානය භාවිතයෙන් host සහ රිමෝට් යෙදුම් සඳහා federation සැකසීම් (port, type, project) සකස් කරයි. ඒ අනුව host-app 4200 වරායෙහි, auth-app 4201, user-app 4202, role-app 4203 වරායෙහි ක්රියාත්මක වේ.
අවසන් වශයෙන් host-app හි app-routing.module.ts යාවත්කාලීන කර /auth, /users, /roles මාර්ගයන් රිමෝට් යෙදුම් වෙත නියෝජනය කරයි. මෙයින් එක් පිටුවකින් සියලු රිමෝට් කොම්පෝනන්ට් ලෝඩ් කර, එකම UI අත්දැකීමක් ලබා දිය හැක.
ශ්රී ලංකාවට ඇති වැදගත්කම
- දැනුම වර්ධනය – Angular 21 හා Module Federation නවතම තාක්ෂණික ප්රවණතාවයන් වන බැවින්, ශ්රී ලංකාවේ ඩෙවලපර්ලාට ජාත්යන්තර තලයේ කුසලතා ලබා ගත හැක.
- ව්යාපාරික වාසි – මයික්රො ෆ්රන්ට්එන්ඩ් ආකෘතියෙන් කණ්ඩායම්වලට ස්වයංක්රීයව කොම්පෝනන්ට් පරිභෝගය, නවීන UI සංවර්ධනයේ වේගය වැඩිවීම සහ නව පද්ධති ඇතුළත් කිරීමේ වැය අඩුවීමේ හැකියාව ඇත.
- ඉගෙනුම් අවස්ථා – විශ්වවිද්යාල හා තාක්ෂණික පුහුණු මධ්යස්ථානවල මේ ආකෘතිය අන්තර්ගත කර ගත හැකි බැවින්, සිසුන්ට ප්රායෝගික ව්යාපෘති මඟින් කුසලතා වර්ධනය කළ හැක.
අවසන් වශයෙන්, Angular 21 Native Federation සමඟ සකස් කළ මෙම මයික්රො ෆ්රන්ට්එන්ඩ් වැඩසටහන, එක් හොස්ට් සහ ත්රිත්ව රිමෝට් යෙදුම් සමඟ, සරල කමාන්ඩ් එකක් මගින් දියත් කරගත හැකි නිසා, ඔබේ සංවර්ධන කාලය හා පරිපාලන පිරිවැය ඉතාමත් අඩු කරයි. දැන් ඔබත් මෙම පියවර අනුගමනය කර, ශ්රී ලංකාවේ තාක්ෂණික පරිසරයට නව මට්ටමක් එක් කරන්න.
