
Angular Front-end Development පාඨමාලාව
Angular මුල සිට ප්රගුණ කර විශ්වාසයෙන් නිෂ්පාදන-සුදානම් තනි-පිටු යෙදුම් සාදන්න. මෙම පාඨමාලාව TypeScript මූලධර්ම සහ සංරචක ගෘහ නිර්මාණ ශිල්පයේ සිට NgRx තත්ව කළමනාකරණය, SSR, සහ CI/CD යෙදවීම දක්වා සියල්ල ආවරණය කරයි. ඔබ ඔබේ front-end කුසලතා ඉහළ නංවනවා වේවා, නැතහොත් වෘත්තීය Angular සංවර්ධනයට පිවිසෙනවා වේවා, මෙය ඔබට අවශ්ය සම්පූර්ණ තාක්ෂණික මාර්ග සිතියමයි.
ඔබ ඉගෙන ගන්නා දේ:
Angular යෙදුම් ස්කැෆෝල්ඩ් කිරීමට සහ ව්යුහගත කිරීමට මොඩියුල්, සංරචක සහ සේවා භාවිතා කරන ආකාරය ඔබ ඉගෙන ගනු ඇත. අච්චු-ධාවන සහ ප්රතික්රියාශීලී පෝරම ඔබ ප්රගුණ කරනු ඇති අතර, ආරක්ෂක සහ විසඳුම් සමඟ සංකීර්ණ මාර්ගගත කිරීම ක්රියාත්මක කරනු ඇති අතර, NgRx සමඟ යෙදුම් තත්ත්වය කළමනාකරණය කරනු ඇත. පාඨමාලාව කාර්ය සාධන ප්රශස්තකරණය, ඒකක සහ අන්තයේ සිට අන්තය දක්වා පරීක්ෂා කිරීම සහ නිෂ්පාදන ගොඩනැගීම් යෙදවීම ද ආවරණය කරයි. උසස් මාතෘකා අතරට සේවාදායක-පාර්ශ්ව ප්රදර්ශනය සඳහා Angular Universal, මොඩියුල ෆෙඩරේෂන් සමඟ ක්ෂුද්ර-ඉදිරිපස පද්ධති ගෘහ නිර්මාණය සහ ප්රගතිශීලී වෙබ් යෙදුම් වින්යාසය ඇතුළත් වේ. අවසානය වන විට, පරිමාණය කළ හැකි Angular යෙදුම් ගොඩනැගීමට, පරීක්ෂා කිරීමට සහ යෙදවීමට අවශ්ය කුසලතා ඔබට හිමි වනු ඇත.
ඔබ ප්රායෝගිකව ඉගෙන ගන්නේ කෙසේද Angular Front-end Development පාඨමාලාව
ඔබ ප්රායෝගිකව පුහුණු වන්නේ කෙසේද Angular Front-end Development පාඨමාලාව
ඔබ සමාගමක් වන අතර ඔබේ කණ්ඩායම පුහුණු කිරීමට කැමති නම්
Dedika සමාගම් සඳහා, පාඨමාලාව ඔබේම ව්යාපාරයේ උදාහරණ සහ පුහුණු කටයුතු සමඟ, ඔබේ සමාගමට අවශ්ය ආකාරයටම ලබාදේ.
පාඨමාලාවේ අන්තර්ගතය
8 අධ්යයන • 40 පාඩම්4 සහ 360 පැය අතර කාලය (ඔබ තීරණය කරයි)
අධ්යයන 1සඟවන්නවිස්තර සඟවන්නවිස්තර බලන්නAngular පදනම් සහ පරිසර සැකසුම
Angular පදනම් සහ පරිසර සැකසුම
පාඩම 1 • Angular මොඩියුල සහ යෙදුම් ආරම්භකරණය
NgModules, මූල AppModule, සහ Angular යෙදුම ආරම්භ කරන ආකාරය පැහැදිලි කරයි. සංරචක තැනීමට පෙර අවශ්ය ව්යුහාත්මක සන්දර්භය සපයයි.
පාඩම 2 • Angular සඳහා TypeScript අත්යවශ්ය කරුණු
Angular කේතය විශ්වාසයෙන් ලිවීමට අවශ්ය TypeScript වර්ග, අතුරුමුහුණත්, සහ සැරසිලි හඳුන්වා දෙයි. JavaScript දැනුම Angular හි ටයිප් කළ පරිසර පද්ධතියට සම්බන්ධ කරයි.
පාඩම 3 • Angular රාමුවට හැඳින්වීම
පද්ධති ගෘහ නිර්මාණය
පාඩම 4 • සංවර්ධන පරිසරය සැකසීම
Node.js, npm, සහ Angular CLI ස්ථාපනය කර වින්යාස කරයි. සෑම සිසුවෙකුටම අනුකූල, ප්රතිනිෂ්පාදනය කළ හැකි දේශීය වැඩබිමක් ඇති බව සහතික කරයි.
පාඩම 5 • ඔබේ පළමු Angular ව්යාපෘතිය ආරම්භ කිරීම
Angular CLI භාවිතා කර නව ව්යාපෘතියක් ජනනය කර ජනනය කළ ගොනු ව්යුහය ගවේෂණය කරයි. පරිසර සැකසුම ප්රායෝගික ව්යාපෘති නිර්මාණයට සම්බන්ධ කරයි.
අධ්යයන 2සඟවන්නවිස්තර සඟවන්නවිස්තර බලන්නසංරචක, සැකිලි, සහ දත්ත බැඳීම
සංරචක, සැකිලි, සහ දත්ත බැඳීම
පාඩම 1 • ගොඩනගන ලද ව්යුහාත්මක නියෝජිත
DOM ව්යුහය ගතිකව පාලනය කිරීමට *ngIf, *ngFor, සහ *ngSwitch යොදයි. නියෝජිත සැකිලි ප්රකාශන ශක්තිය වැඩි කරන ආකාරය පෙන්නුම් කරයි.
පාඩම 2 • ගුණාංග සහ සිද්ධි බැඳීම
ගුණාංග බැඳීම හරහා එක්-මාර්ග දත්ත ප්රවාහය සහ සිද්ධි බැඳීම හරහා පරිශීලක-සිද්ධි හැසිරවීම උගන්වයි. සංරචක තර්කනය DOM මූලද්රව්ය සහ පරිශීලක අන්තර්ක්රියා වලට සම්බන්ධ කරයි.
පාඩම 3 • සැකිලි වාක්ය ඛණ්ඩය සහ ප්රකාශන
Angular හි සැකිලි ප්රකාශන භාෂාව, ආරක්ෂිත සංචාලනය, සහ සැකිලි යොමු විචල්ය ආවරණය කරයි. සංරචක දර්ශන තුළ ගතික අන්තර්ගත ප්රදර්ශනය සක්රීය කරයි.
පාඩම 4 • සංරචක ජීවන චක්ර කොකු
ngOnInit සිට ngOnDestroy දක්වා සම්පූර්ණ ජීවන චක්ර කොකු අනුක්රමය ගවේෂණය කරයි. ආරම්භ කිරීම සහ පිරිසිදු කිරීම සඳහා එක් එක් කොකු භාවිතා කළ යුත්තේ කවදාද සහ ඇයිද යන්න උගන්වයි.
පාඩම 5 • Angular සංරචකයක ව්යුහ විච්ඡේදනය
@Component සැරසිලිකරු, පාර-දත්ත ගුණාංග, සහ සංරචක ජීවන චක්රය විග්රහ කරයි. සෑම Angular UI මූලද්රව්යයක් සඳහාම ගොඩනැගිලි කොටස ස්ථාපිත කරයි.
අධ්යයන 3සඟවන්නවිස්තර සඟවන්නවිස්තර බලන්නසංරචක සන්නිවේදනය සහ නියෝජිත
සංරචක සන්නිවේදනය සහ නියෝජිත
පාඩම 1 • ViewChild සහ ContentChild ප්රශ්න
ප්රශ්න හරහා ක්රමලේඛනගතව ළමා සංරචක අවස්ථා සහ ප්රක්ෂේපිත අන්තර්ගත වෙත ප්රවේශ වෙයි. සැකිලි බැඳීමෙන් ඔබ්බට උසස් සංරචක සම්බන්ධීකරණය සක්රීය කරයි.
පාඩම 2 • @Input සමඟ මාපිය-සිට-ළමා සන්නිවේදනය
සංරචක ගසට පහළට දත්ත යැවීමට @Input භාවිත කර සෙටර් සමඟ ආදාන වලංගු කරයි. Angular හි ප්රාථමික පහළට දත්ත-ප්රවාහ රටාව ස්ථාපිත කරයි.
පාඩම 3 • අභිරුචි ව්යුහාත්මක නියෝජිත ගොඩනැගීම
DOM හැසිරවීමට TemplateRef සහ ViewContainerRef භාවිතා කර ව්යුහාත්මක නියෝජිත ක්රියාත්මක කරයි. නැවත භාවිත කළ හැකි පිරිසැලසුම් තර්කනය නිර්මාණය කිරීමේ හැකියාව වැඩි කරයි.
පාඩම 4 • අභිරුචි ගුණාංග නියෝජිත ගොඩනැගීම
DOM ව්යුහය වෙනස් නොකර සත්කාරක මූලද්රව්යයේ පෙනුම හෝ හැසිරීම වෙනස් කරන නියෝජිත නිර්මාණය කරයි. 2 වන පරිච්ඡේදයේ හඳුන්වා දුන් නියෝජිත රටාව ශක්තිමත් කරයි.
පාඩම 5 • @Output සමඟ ළමා-සිට-මාපිය සන්නිවේදනය
සංරචක ගසට ඉහළට අභිරුචි සිද්ධි විමෝචනය කිරීමට @Output සහ EventEmitter භාවිත කරයි. ද්වි-දිශානුගත මාපිය-ළමා සන්නිවේදන රටාව සම්පූර්ණ කරයි.
අධ්යයන 4සඟවන්නවිස්තර සඟවන්නවිස්තර බලන්නසේවා, යැපීම් එන්නත් කිරීම, සහ HTTP
සේවා, යැපීම් එන්නත් කිරීම, සහ HTTP
පාඩම 1 • Angular සේවා නිර්මාණය සහ සැපයීම
CLI සමඟ සේවා ජනනය කර ඒවා මොඩියුල, සංරචක, හෝ මූල විෂය පථයේ ලියාපදිංචි කරයි. බෙදාගත් තර්කනය සඳහා නිවහන ලෙස සේවා ස්ථරය ස්ථාපිත කරයි.
පාඩම 2 • HTTP සේවාලාභියා සහ REST API ඒකාබද්ධ කිරීම
HttpClientModule වින්යාස කර GET, POST, PUT, සහ DELETE ඉල්ලීම් සිදු කරයි. සේවා ස්ථරය සැබෑ පසුපෙළ දත්ත ප්රභවයන්ට සම්බන්ධ කරයි.
පාඩම 3 • දෝෂ හැසිරවීම සහ HTTP අන්තර්ග්රහණ
catchError සමඟ ගෝලීය දෝෂ හැසිරවීම සහ අන්තර්ග්රහණ සමඟ ඉල්ලීම්/ප්රතිචාර පරිවර්තනය ක්රියාත්මක කරයි. නිෂ්පාදන-සූදානම් HTTP සන්නිවේදන රටා නිපදවයි.
පාඩම 4 • යැපීම් එන්නත් කිරීම ගැඹුරු ගවේෂණය
DI ධූරාවලිය, එන්නත් කිරීමේ token, සහ සපයන්නා වර්ග ගවේෂණය කරයි. යැපීම් යෙදුම පුරා විසඳන ආකාරය පිළිබඳ සියුම් පාලනය සක්රීය කරයි.
පාඩම 5 • RxJS නිරීක්ෂණ හැඳින්වීම
Angular හි අසමමුහුර්ත APIs සමඟ වැඩ කිරීමට අවශ්ය Observable, Subject, සහ මූලික ක්රියාකාරක හඳුන්වා දෙයි. ප්රතික්රියාශීලී HTTP සහ සිද්ධි හැසිරවීමේ රටා සඳහා සිසුන් සූදානම් කරයි.
අධ්යයන 5සඟවන්නවිස්තර සඟවන්නවිස්තර බලන්නAngular මාර්ගගත කිරීම සහ සංචාලනය
Angular මාර්ගගත කිරීම සහ සංචාලනය
පාඩම 1 • මාර්ග ආරක්ෂක සහ ප්රවේශ පාලනය
මාර්ග ආරක්ෂා කිරීමට CanActivate, CanDeactivate, සහ CanLoad ආරක්ෂක ක්රියාත්මක කරයි. සංචාලන ස්ථරයට සත්යාපනය සහ අවසරකරණය ඒකාබද්ධ කරයි.
පාඩම 2 • කම්මැලි පූරණය සහ මාර්ග විසඳුම්
ඉල්ලුම මත පටවන ලද විශේෂාංග මොඩියුල වලට යෙදුම බෙදා විසඳුම් සමඟ දත්ත පූර්ව-ලබා ගනී. ආරම්භක පූරණ කාර්ය සාධනය සහ පරිශීලක අත්දැකීම වැඩි දියුණු කරයි.
පාඩම 3 • කැදැලි මාර්ග සහ නම් කළ පිටවීම්
මාපිය මාර්ග යටතේ ළමා මාර්ග ව්යුහගත කර අමතර දර්ශන සඳහා නම් කළ පිටවීම් භාවිත කරයි. විශාල යෙදුම් වල සංකීර්ණ පිරිසැලසුම් අවශ්යතා සඳහා සහාය දක්වයි.
පාඩම 4 • රවුටර සැකසුම සහ මූලික සංචාලනය
මාර්ග අර්ථ දැක්වීම් සමඟ RouterModule වින්යාස කර router-outlet සහ routerLink එකතු කරයි. සියලු සංචාලන විශේෂාංග සඳහා පදනම ස්ථාපිත කරයි.
පාඩම 5 • මාර්ග පරාමිතීන් සහ ප්රශ්න තන්තු
ActivatedRoute වෙතින් ගතික මාර්ග කොටස් සහ විකල්ප ප්රශ්න පරාමිතීන් කියවයි. විස්තර දර්ශන සහ පෙරූ ලැයිස්තු පිටු සක්රීය කරයි.
අධ්යයන 6සඟවන්නවිස්තර සඟවන්නවිස්තර බලන්නAngular ආකෘති: සැකිලි-ධාවනය කළ සහ ප්රතික්රියාශීලී
Angular ආකෘති: සැකිලි-ධාවනය කළ සහ ප්රතික්රියාශීලී
පාඩම 1 • FormArray සමඟ ගතික ආකෘති
විචල්ය-දිග දත්ත සඳහා ධාවන වේලාවේ ආකෘති පාලන එකතු කිරීමට සහ ඉවත් කිරීමට FormArray භාවිත කරයි. පුනරාවර්තන රේඛා අයිතම වැනි සැබෑ ලෝක අවස්ථා හසුරුවයි.
පාඩම 2 • වලංගුකාරක සහ අභිරුචි වලංගු කිරීම
සමමුහුර්ත සහ අසමමුහුර්ත වලංගුකාරක යොදන අතර නැවත භාවිත කළ හැකි අභිරුචි වලංගුකාරක ශ්රිත නිර්මාණය කරයි. ඉදිරිපත් කිරීමට පෙර දත්ත අඛණ්ඩතාව සහතික කරයි.
පාඩම 3 • ආකෘති ඉදිරිපත් කිරීම සහ තත්ත්ව කළමනාකරණය
ඔප දැමූ පරිශීලක අත්දැකීමක් ලබා දීමට ආකෘති ඉදිරිපත් කිරීම, නැවත සැකසීම, සහ අපිරිසිදු/ස්පර්ශ කළ තත්ත්වය හසුරුවයි. 4 වන පරිච්ඡේදයේ හඳුන්වා දුන් සේවා ඇමතුම් වලට ආකෘති දත්ත සම්බන්ධ කරයි.
පාඩම 4 • සැකිලි-ධාවනය කළ ආකෘති
සැකිල්ලේ ප්රකාශනාත්මකව ආකෘති ගොඩනැගීමට ngForm, ngModel, සහ ගොඩනගන ලද වලංගුකාරක භාවිත කරයි. අවම TypeScript අතිරික්තයක් සහිත ආකෘති සංකල්ප හඳුන්වා දෙයි.
පාඩම 5 • ප්රතික්රියාශීලී ආකෘති මූලික කරුණු
FormControl, FormGroup, සහ ReactiveFormsModule සමඟ ක්රමලේඛනගතව ආකෘති ගොඩනඟයි. ආකෘති තත්ත්වය සහ වලංගු කිරීම කෙරෙහි පැහැදිලි, පරීක්ෂා කළ හැකි පාලනය සපයයි.
අධ්යයන 7සඟවන්නවිස්තර සඟවන්නවිස්තර බලන්නතත්ත්ව කළමනාකරණය සහ ප්රතික්රියාශීලී රටා
තත්ත්ව කළමනාකරණය සහ ප්රතික්රියාශීලී රටා
පාඩම 1 • NgRx Entity සහ DevTools
NgRx Entity සමඟ එකතු කළමනාකරණය සරල කර Redux DevTools සමඟ තත්ත්වය පරීක්ෂා කරයි. ගබඩා-බර විශේෂාංග සංවර්ධනය සහ දෝෂ නිරාකරණය වේගවත් කරයි.
පාඩම 2 • NgRx ගබඩාවට හැඳින්වීම
NgRx ස්ථාපනය කර විශේෂාංග කොටසක් සඳහා ක්රියා, අඩු කරන්නන්, සහ ගබඩාව නිර්වචනය කරයි. Angular පරිසර පද්ධතිය තුළ Redux රටාව ස්ථාපිත කරයි.
පාඩම 3 • BehaviorSubject සමඟ සේවා-පාදක තත්ත්වය
සේවාවක BehaviorSubject භාවිතා කර සංරචක හරහා තත්ත්වය ගබඩා කර බෙදා ගනී. NgRx හඳුන්වා දීමට පෙර සැහැල්ලු තත්ත්ව විසඳුමක් සපයයි.
පාඩම 4 • අතුරු ඵල සඳහා NgRx Effects
NgRx Effects භාවිතා කර අඩු කරන්නන්ගෙන් පිටත HTTP ඇමතුම් වැනි අසමමුහුර්ත මෙහෙයුම් හසුරුවයි. අඩු කරන්නන් පිරිසිදුව තබා ගනිමින් අතුරු ඵල තර්කනය මධ්යගත කරයි.
පාඩම 5 • තේරීම්කාරක සහ සංරචක ඒකාබද්ධ කිරීම
මතක තබා ගත් තේරීම්කාරක නිර්මාණය කර Store සේවාව හරහා සංරචක වලින් ක්රියා යවයි. NgRx ගබඩාව සංරචක ස්ථරයට සම්බන්ධ කරයි.
අධ්යයන 8සඟවන්නවිස්තර සඟවන්නවිස්තර බලන්නකාර්ය සාධනය, පරීක්ෂාව, සහ යෙදවීම
කාර්ය සාධනය, පරීක්ෂාව, සහ යෙදවීම
පාඩම 1 • යෙදවීමේ උපාය මාර්ග සහ CI/CD ඒකාබද්ධ කිරීම
Angular ගොඩනැගිලි ස්ථිතික සත්කාරකත්වයට යොදවන අතර අඛණ්ඩ බෙදා හැරීම සඳහා ස්වයංක්රීය නල මාර්ග ඒකාබද්ධ කරයි. කේතයේ සිට නිෂ්පාදනය දක්වා සංවර්ධන ජීවන චක්රය වසා දමයි.
පාඩම 2 • සංරචක සහ සේවා ඒකක පරීක්ෂාව
Jasmine සහ TestBed සමඟ සංරචක, සේවා, සහ පයිප් සඳහා ඒකක පරීක්ෂණ ලියයි. ඒකාබද්ධ කිරීමට පෙර තනි ඒකක හුදකලාව වලංගු කරයි.
පාඩම 3 • බණ්ඩල ප්රශස්තිකරණය සහ ගොඩනැගීමේ වින්යාසය
ප්රශස්ත බණ්ඩල ප්රමාණය සඳහා නිෂ්පාදන ගොඩනැගිලි, ගස් සෙලවීම, සහ අවකල පූරණය වින්යාස කරයි. සැබෑ ලෝක යෙදවීමේ සීමාවන් සඳහා යෙදුම සූදානම් කරයි.
පාඩම 4 • Cypress සමඟ අන්ත-සිට-අන්ත පරීක්ෂාව
සම්පූර්ණ යෙදුම් හැසිරීම වලංගු කිරීමට Cypress සමඟ පරිශීලක-ප්රවාහ පරීක්ෂාව ස්වයංක්රීය කරයි. යථාර්ථවාදී බ්රව්සර්-පාදක අවස්ථා සමඟ ඒකක පරීක්ෂණ සම්පූර්ණ කරයි.
පාඩම 5 • වෙනස්කම් හඳුනා ගැනීම සහ කාර්ය සාධන ප්රශස්තිකරණය
Angular හි පෙරනිමි සහ OnPush වෙනස්කම් හඳුනාගැනීමේ උපාය මාර්ග සහ පැතිකඩ මෙවලම් පැහැදිලි කරයි. විශාල සංරචක ගස් වල අනවශ්ය නැවත ප්රදර්ශන අඩු කරයි.
ඔබගේ සත්යාපිත නිමාව
මෙම පාඨමාලාව ඔබ සඳහායි:
JavaScript සංවර්ධකයින්: ව්යුහගත, ව්යවසාය-ශ්රේණියේ ඉදිරිපස රාමුවක් අනුගමනය කිරීමට සූදානම්.
React හෝ Vue සංවර්ධකයින්: ඔවුන්ගේ වෘත්තීය මෙවලම් කට්ටලයට Angular ප්රවීණත්වය එක් කිරීමට කැමති.
පසුපස-අන්ත සංවර්ධකයින්: නවීන ඉදිරිපස කුසලතා අවශ්ය full-stack භූමිකාවන්ට පුළුල් කිරීම.
පරිගණක විද්යා උපාධිධාරීන්: ශාස්ත්රීය දැනුම කර්මාන්ත-සම්මත Angular සංවර්ධනය සමඟ පාලම් කිරීම.
නිදහස් වෙබ් සංවර්ධකයින්: විශාල, වඩා සංකීර්ණ සේවාදායක ව්යාපෘති සඳහා සුදුසුකම් ලැබීමට ඉලක්ක කරයි.
වෘත්තීය වෙනස් කරන්නන්: ශක්තිමත් ක්රමලේඛන පදනමකින් රැකියා-සූදානම් ඉදිරිපස කුසලතා ගොඩනැගීම.
අපේ ශිෂ්යයන් කියන දේ
ඔබේ පාඩම් පරිපූර්ණයි. මම වසරක පැකේජයක් ගත්තා, අවසානයේ වේදිකාව වෙනස් කිරීමකින් තොරව මගේ උනන්දුවට ලක්වන විවිධ විෂයයන් අනුගමනය කිරීමේ අවස්ථාව මට ලැබුණා... ඔබ කරන සියල්ලට ස්තූතියි, මම ඔබව වෙනත් අයට නිර්දේශ කර ඇත්තෙමි...

පාඩම් කෙලින්ම කරුණට යන ආකාරය සහ මට අවශ්ය නොවන අන්තර්ගතයන් මඟ හැර පරිච්ඡේද වෙනස් කිරීමට හැකි වීම මම කැමතියි.

අන්තර්ගතය සහ වීඩියෝ ඉදිරිපත් කිරීමේ සහ පිටපත් කිරීමේ ක්රමය මම කැමතියි, එය ක්රියාවලිය වේගවත් කරයි!

වේදිකාව වේගවත්, භාවිතයට සරලයි. අන්තර්ගත විවිධත්වය සහ අතිරේක වීඩියෝ ඉගෙනීමට බෙහෙවින් උපකාරී වේ.

ප්රධාන පුහුණු පාඨමාලා
ප්රශ්නෝත්තර
Dedika කියන්නේ කවුද?
සහතිකය ශ්රී ලංකාවේ වලංගුද?
පාඨමාලා නොමිලේද?
පාඨමාලා වැඩබරය කුමක්ද?
පාඨමාලා කෙසේද?
පාඨමාලා කෙසේ ක්රියා කරයි?
පාඨමාලා කාලය කීයද?
පාඨමාලා මිල කීයද?
EAD හෝ මාර්ගගත පාඨමාලාවක් කියන්නේ කුමක්ද? එය කෙසේ ක්රියා කරයි?
PDF පාඨමාලාව




















