LUMIFY WORK Angular 12 වැඩසටහන්කරණය

මෙම පාඨමාලාව හැදෑරීමට හේතුව

මෙම විස්තීරණ කෝණික 12 ක්‍රමලේඛන පාඨමාලාව සෛද්ධාන්තික ඉගෙනුම් සහ ප්‍රායෝගික විද්‍යාගාරවල එකතුවකි, එයට කෝණික හැඳින්වීමක් ඇතුළත් වන අතර ඉන් පසුව TypeScript, සංරචක, විධාන, සේවා, HTTP සේවාලාභියා, පරීක්ෂණ සහ නිදොස්කරණය ඇතුළත් වේ.
පාඨමාලාව ප්‍රයෝජනවත් සහ ක්‍රියාකාරී තොරතුරු වලින් පිරී ඇත, ඔබට ඔබගේ කාර්යයට වහාම යෙදිය හැක. තනි පිටු බ්‍රවුසර යෙදුම්, ප්‍රතිචාරාත්මක වැනි මූලික කෝණික 12 සංවර්ධනයේ මූලික කරුණු ඉගෙන ගන්න webඅඩවි, සහ දෙමුහුන් ජංගම යෙදුම්.
සටහන: අපට Angular හි අනෙකුත් අනුවාද පිළිබඳවද පුහුණුව ලබා දිය හැක. විමසීමක් කිරීමට හෝ ඔබේ උනන්දුව ලියාපදිංචි කිරීමට කරුණාකර අප හා සම්බන්ධ වන්න.

ඔබ ඉගෙන ගන්නා දේ
මෙම පාඨමාලාව සාර්ථකව නිම කිරීමෙන් පසු, ඔබට හැකි වනු ඇත:

• Typescript භාවිතයෙන් තනි පිටු කෝණික යෙදුම් සංවර්ධනය කරන්න
• සම්පූර්ණ කෝණික සංවර්ධන පරිසරයක් සකසන්න
• සංරචක, විධාන, සේවා, පයිප්ප, පෝරම සහ අභිරුචි වලංගු කරන්නන් සාදන්න
• Observables භාවිතයෙන් උසස් ජාල දත්ත ලබා ගැනීමේ කාර්යයන් හසුරුවන්න REST වෙතින් දත්ත පරිභෝජනය කරන්න web කෝණික HT TP සේවාලාභියා භාවිතා කරන සේවාවන් භාවිතා කරමින් තල්ලු දත්ත සම්බන්ධතා හසුරුවන්න Webසොකට් ප්රොටෝකෝලය
• දත්ත හැඩතල ගැන්වීම සඳහා කෝණික පයිප්ප සමඟ වැඩ කරන්න
• උසස් කෝණික සංරචක රවුටර විශේෂාංග භාවිතා කරන්න
• බිල්ට් මෙවලම් භාවිතයෙන් කෝණික යෙදුම් පරීක්ෂා කර දෝෂහරණය කරන්න.

පාඨමාලා විෂයයන්

පරිච්ඡේදය 1. කෝණික හඳුන්වා දීම

• කෝණික යනු කුමක්ද?
• කෝණික රාමුවේ කේන්ද්‍රීය විශේෂාංග සුදුසු භාවිත අවස්ථා
• කෝණික යෙදුමක ගොඩනැඟිලි කොටස් කෝණික යෙදුමක මූලික ගෘහ නිර්මාණ ශිල්පය කෝණික ස්ථාපනය කිරීම සහ භාවිතා කිරීම
• යෙදුම ක්‍රියාත්මක කරන කෝණික යෙදුමක ව්‍යුහ විද්‍යාව
• දේශීය ජංගම යෙදුම් සඳහා කෝණික යෙදුම ගොඩනැගීම සහ යෙදවීම
• සාරාංශය

පරිච්ඡේදය 2. TypeScript සඳහා හැඳින්වීම

• කෝණික ටයිප්ස්ක්‍රිප්ට් සින්ටැක්ස් සමඟ භාවිතය සඳහා ක්‍රමලේඛන භාෂා
• ක්‍රමලේඛන සංස්කාරකවරුන්
• වර්ග පද්ධතිය - විචල්යයන් නිර්වචනය කිරීම
• වර්ග පද්ධතිය - අරා අර්ථ දැක්වීම
• මූලික ප්රාථමික වර්ග
• Functions ටයිප් කරන්න
• අනුමානය වර්ගය
• පන්ති නිර්වචනය කිරීම
• පන්ති ක්‍රම
• දෘශ්‍යතා පාලනය
• පන්ති ඉදිකිරීම්කරුවන්
• පන්ති ඉදිකිරීම්කරුවන් - විකල්ප ආකෘති පත්‍රය ආරම්භ නොකළ ක්ෂේත්‍ර
• අතුරුමුහුණත්
• ES6 මොඩියුල සමඟ වැඩ කිරීම
• var vs let
• ඊතල කාර්යයන්
• Arrow Function Compact Syntax Template Strings
• පන්තියේ ජෙනරික්ස්
• ක්‍රියාකාරීත්වයේ ජෙනරික්ස්
• සාරාංශය

පරිච්ඡේදය 3. සංරචක

• සංරචකයක් යනු කුමක්ද?
• හිටපු කෙනෙක්ample සංරචකය
• කෝණික CLI භාවිතයෙන් සංරචකයක් නිර්මාණය කිරීම
• සංරචක පන්තිය
• @Component Decorator
• එහි මොඩියුල සංරචක සැකිල්ලට සංරචකයක් ලියාපදිංචි කිරීම
• Example: HelloComponent සැකිල්ල
• Example: සංරචකයක් භාවිතා කරමින් HelloComponent පන්තිය
• යෙදුම ධාවනය කරන්න
• සංරචක ධුරාවලිය
• යෙදුම් මූල සංරචකය
• Bootstrap File
• සංරචක ජීවන චක්‍ර කොකු Example Lifecycle Hooks
• CSS විලාස
• සාරාංශය

පරිච්ඡේදය 4. සංරචක සැකිලි

• සැකිලි
• සැකිලි ස්ථානය
• උඩු රැවුල {{ }} වාක්‍ය ඛණ්ඩය
• DOM මූලද්‍රව්‍ය ගුණාංග සැකසීම
• මූලද්‍රව්‍ය අන්තර්ගත පෙළ සැකසීම
• සිදුවීම් බැඳීම
• ප්රකාශන සිදුවීම් හසුරුවන්නා
• පෙරනිමියෙන් හැසිරවීම වැළැක්වීම
• ගුණාංග විධාන
• CSS පන්ති වෙනස් කිරීමෙන් මෝස්තර යොදන්න
• Example: ngClass
• ශෛලීන් කෙලින්ම යෙදීම
• ව්‍යුහාත්මක විධාන
• කොන්දේසි සහිතව සැකිල්ල ක්‍රියාත්මක කරන්න
• Example: ngIf
• ngFor භාවිතා කරමින් ලූප කිරීම
• ng දේශීය විචල්‍යයන් සඳහා
• එකතුව හැසිරවීම Example - අයිතමයක් මකා දැමීම
• ngSwitch කණ්ඩායම්කරණ මූලද්‍රව්‍ය සමඟින් මූලද්‍රව්‍ය හුවමාරු කිරීම සඳහා ng සමඟ අයිතම ලුහුබැඳීම
• සැකිලි යොමු විචල්‍ය සාරාංශය

පරිච්ඡේදය 5. අන්තර් සංරචක සන්නිවේදනය

• සන්නිවේදන මූලික කරුණු
• දත්ත ප්රවාහ ගෘහ නිර්මාණ ශිල්පය
• දත්ත ලබාගැනීමට දරුවා සූදානම් කිරීම
• දෙමාපියන්ගෙන් දත්ත යවන්න
• ගුණාංග සැකසීම ගැන වැඩි විස්තර
• සංරචකයකින් වෙඩි තැබීමේ සිදුවීම
• @ප්‍රතිදානය() උදාample – ළමා සංරචක @Output() Example - මාපිය සංරචකය
• සම්පූර්ණ ද්වි මාර්ග බැඳීම
• දෙමාපිය තුළ ද්වි මාර්ග දත්ත බන්ධනය සැකසීම
• සාරාංශය

පරිච්ඡේදය 6. සැකිලි ධාවනය කරන ලද ආකෘති

• සැකිලි ධාවන ආකෘති
• ආකෘති මොඩියුලය ආනයනය කිරීම
• මූලික ප්‍රවේශය
• පෝරමයක් සැකසීම
• පරිශීලක ආදානය ලබා ගැනීම
• ngForm ගුණාංගය මඟ හැරීම
• පෝරමය ආරම්භ කරන්න
• ද්වි-මාර්ග දත්ත බන්ධනය
• පෝරමය වලංගු කිරීම
• කෝණික වලංගුකාරක
• පන්ති අමතර ආදාන වර්ග භාවිතා කරමින් වලංගු කිරීමේ තත්ත්වය ප්‍රදර්ශනය කිරීම
• පිරික්සුම් කොටු
• (Drop Down) ක්ෂේත්‍ර තෝරන්න
• තෝරන්න (ඩ්‍රොප් ඩවුන්) දින ක්ෂේත්‍ර සඳහා විදැහුම්කරණ විකල්ප
• ගුවන්විදුලි බොත්තම්
• සාරාංශය

පරිච්ඡේදය 7. ප්රතික්රියාශීලී ආකෘති

• ප්‍රතික්‍රියා පෝරම අවසන්view
• ගොඩනැගිලි කොටස්
• ReactiveFormsModule ආයාත කරන්න
• පෝරමයක් සාදන්න
• සැකිල්ල සැලසුම් කරන්න
• ආදාන අගයන් ලබා ගැනීම
• ආදාන ක්ෂේත්‍ර ආරම්භ කිරීම
• ආකෘති අගයන් සැකසීම
• ආදාන වෙනස්කම් වලට දායක වීම
• වලංගුකරණය
• බිල්ට් වලංගු කරන්නන්
• වලංගු කිරීමේ දෝෂයක් පෙන්වමින්
• අභිරුචි වලංගුකාරකය
• අභිරුචි වලංගුකාරකයක් භාවිතා කිරීම
• Custom Validator වෙත වින්‍යාසය සැපයීම
• FormArray - ගතිකව ආදාන එකතු කරන්න
• FormArray - සංරචක පන්තිය
• FormArray - සැකිල්ල
• FormArray - අගයන්
• උප පෝරම කණ්ඩායම් - සංරචක පන්තිය
• උප පෝරම කණ්ඩායම් - HTML සැකිල්ල
• උප පෝරම කණ්ඩායම් භාවිතා කරන්නේ ඇයි?
• සාරාංශය

පරිච්ඡේදය 8. සේවා සහ යැපුම් එන්නත්

• සේවාවක් යනු කුමක්ද?
• මූලික සේවාවක් නිර්මාණය කිරීම
• සේවා පන්තිය
• යැපුම් එන්නත් කිරීම යනු කුමක්ද?
• සේවා අවස්ථාවක් එන්නත් කිරීම
• ඉන්ජෙක්ටර්
• ඉන්ජෙක්ටර් ධුරාවලිය
• Root Injector සමඟ සේවාවක් ලියාපදිංචි කිරීම
• සංරචක ඉන්ජෙක්ටරයක් ​​සමඟ සේවාවක් ලියාපදිංචි කිරීම
• විශේෂාංග මොඩියුල ඉන්ජෙක්ටරයක් ​​සමඟ සේවාවක් ලියාපදිංචි කරන්න
• සේවාවක් ලියාපදිංචි කළ යුත්තේ කොතැනින්ද?
• වෙනත් කෞතුක වස්තු වල පරායත්ත එන්නත් කිරීම විකල්ප ක්‍රියාත්මක කිරීමක් සපයන යැපුම් එන්නත් සහ @Host
• යැපුම් එන්නත් සහ @විකල්ප
• සාරාංශය

පරිච්ඡේදය 9. HTTP සේවාලාභියා

• කෝණික HT TP සේවාලාභියා
• T he HT TP සේවාලාභියා භාවිතා කිරීම - ඉවරයිview
• HttpClientModule ආයාත කිරීම
• HttpClient භාවිතා කරන සේවාව
• GET ඉල්ලීමක් කිරීම
• නිරීක්ෂණය කළ හැකි වස්තුවක් කරන්නේ කුමක්ද?
• සංරචකයක සේවාව භාවිතා කිරීම
• The PeopleService Client Component දෝෂය හැසිරවීමේ
• දෝෂ වස්තුව අභිරුචිකරණය කිරීම
• POST ඉල්ලීමක් කිරීම
• PUT ඉල්ලීමක් කිරීම
• මකන්න ඉල්ලීමක් කිරීම

10 වන පරිච්ඡේදය. පයිප්ප සහ දත්ත හැඩතල ගැන්වීම

• පයිප්ප යනු කුමක්ද?
• ඉදිකළ පයිප්ප
• HTML Template Chaining Pipes හි පයිප්ප භාවිතා කිරීම
• ජාත්‍යන්තරකරණය කරන ලද පයිප්ප (i18n) දේශීය දත්ත පූරණය කරමින්
• දිනය නළය
• අංකය පයිප්ප
• මුදල් පයිප්ප
• අභිරුචි පයිප්පයක් සාදන්න
• අභිරුචි පයිප්ප Example
• අභිරුචි පයිප්ප භාවිතා කිරීම
• ngFor සමඟ නලයක් භාවිතා කිරීම
• පෙරහන් නලයක්
• පයිප්ප කාණ්ඩය: පිරිසිදු සහ අපිරිසිදු
• සාරාංශය
• පිරිසිදු පයිප්ප Example
• අපිරිසිදු පයිප්ප Example
• සාරාංශය

පරිච්ඡේදය 11. තනි පිටු යෙදුම් සඳහා හැඳින්වීම

• සම්ප්‍රදායික තනි පිටු යෙදුමක් (SPA) යනු කුමක්ද? Web යෙදුම
• SPA කාර්ය ප්රවාහය
• තනි පිටු අයදුම්පත Advantages HTML5 ඉතිහාස API
• SPA අභියෝග
• කෝණික සාරාංශය භාවිතා කරමින් SPA ක්‍රියාත්මක කිරීම

පරිච්ඡේදය 12. කෝණික සංරචක රවුටරය

• සංරචක රවුටරය
• View සංචලනය
• කෝණික රවුටර API
• Router Enabled Application එකක් නිර්මාණය කිරීම
• මාර්ගගත සංරචක සත්කාරකත්වය
• සබැඳි සහ බොත්තම් භාවිතයෙන් සංචලනය
• ක්‍රමලේඛන සංචාලනය
• ගමන් මාර්ග පරාමිතීන්
• මාර්ග පරාමිතීන් සමඟ සැරිසැරීම
• මාර්ග පරාමිති අගයන් ලබා ගැනීම
• මාර්ග පරාමිතිය සමමුහුර්තව ලබා ගැනීම
• මාර්ග පරාමිතියක් අසමමුහුර්තව ලබා ගැනීම
• විමසුම් පරාමිතීන්
• විමසුම් පරාමිතීන් සැපයීම
• විමසුම් පරාමිති අසමමුහුර්තව ලබා ගැනීම
• අත්පොත සමඟ ගැටළු URL ඇතුල්වීම සහ පිටු සලකුණු කිරීම
• සාරාංශය

පරිච්ඡේදය 13. උසස් HTTP සේවාලාභියා

• ඉල්ලීම් විකල්ප
• HttpResponse වස්තුවක් ආපසු ලබා දීම
• ඉල්ලීම් ශීර්ෂ සැකසීම
• නව නිරීක්ෂණ නිර්මාණය කිරීම
• සරල නිරීක්ෂණයක් නිර්මාණය කිරීම
• නිරීක්ෂණය කළ හැකි ඉදිකිරීම් ක්‍රමය නිරීක්ෂණය කළ හැකි ක්‍රියාකරුවන්
• සිතියම සහ පෙරහන් ක්රියාකරුවන්
• පැතලි සිතියම () ක්රියාකරු
• ටැප් () ක්රියාකරු
• සිප්() සංයුක්තකාරකය
• HT TP ප්‍රතිචාරය හැඹිලිගත කිරීම
• අනුක්‍රමික HT TP ඇමතුම් ලබා ගැනීම
• සමාන්තර ඇමතුම් ලබා ගැනීම
• CatchError() සමඟ දෝෂ වස්තුව අභිරුචිකරණය
• නල මාර්ගයේ දෝෂයක්
• දෝෂ ප්‍රතිසාධනය
• සාරාංශය

පරිච්ඡේදය 14. කෝණික මොඩියුල

• කෝණික මොඩියුල ඇයි?
• මොඩියුල පන්තියක ව්‍යුහ විද්‍යාව
• @NgModule ගුණාංග
• විශේෂාංග මොඩියුල
• Example මොඩියුල ව්යුහය
• වසම් මොඩියුලයක් සාදන්න
• Routed/Routing Module Pair එකක් සාදන්න
• සේවා මොඩියුලයක් සාදන්න
• පොදු මොඩියුල නිර්මාණය කිරීම

පරිච්ඡේදය 15. උසස් මාර්ගගත කිරීම

• Routing Enabled Feature Module
• විශේෂාංග මොඩියුලය භාවිතා කිරීම
• කම්මැලි විශේෂාංග මොඩියුලය පූරණය කිරීම
• විශේෂාංග මොඩියුල සංරචක සඳහා සබැඳි නිර්මාණය කිරීම
• Lazy Loading ගැන වැඩි විස්තර
• පූර්ව පූරණය මොඩියුල
• පෙරනිමි මාර්ගය
• වයිල්ඩ්කාඩ් මාර්ග මාර්ගය
• වෙත හරවා යැවීම
• ළමා මාර්ග
• ළමා මාර්ග නිර්වචනය කිරීම
• ළමා මාර්ග සඳහා
• ළමා මාර්ග සඳහා සබැඳි
• නාවික ආරක්ෂකයින්
• ආරක්ෂක ක්‍රියාත්මක කිරීම් නිර්මාණය කිරීම
• මාර්ගයක ආරක්ෂකයින් භාවිතා කිරීම
• සාරාංශය

පරිච්ඡේදය 16. ඒකක පරීක්ෂණ කෝණික යෙදුම්

• ඒකක කෝණික කෞතුක භාණ්ඩ පරීක්ෂා කිරීම
• පරීක්ෂණ මෙවලම්
• සාමාන්ය පරීක්ෂණ පියවර
• පරීක්ෂණ ප්රතිඵල
• ජැස්මින් ටෙස්ට් කට්ටල
• ජැස්මින් පිරිවිතර (ඒකක පරීක්ෂණ)
• අපේක්ෂාවන් (ප්‍රකාශයන්)
• ගැළපෙන්නන්
• Examples of Using Matchers
• නොවන දේපල භාවිතා කිරීම
• ඒකක පරීක්ෂණ කට්ටලවල පිහිටුවීම සහ ඉරා දැමීම
• Exampඑක් එක් කාර්යයට පෙර සහ පසු
• කෝණික පරීක්ෂණ මොඩියුලය
• Example කෝණික පරීක්ෂණ මොඩියුලය
• සේවාවක් පරීක්ෂා කිරීම
• සේවා අවස්ථාවක් එන්නත් කිරීම
• සමමුහුර්ත ක්රමයක් පරීක්ෂා කරන්න
• අසමමිතික ක්‍රමයක් පරීක්ෂා කරන්න
• Mock HT TP සේවාලාභියා භාවිතා කිරීම
• ටින් කළ ප්‍රතිචාර සැපයීම
• සංරචකයක් පරීක්ෂා කිරීම
• සංරචක පරීක්ෂණ මොඩියුලය
• සංරචක අවස්ථාවක් නිර්මාණය කිරීම
• ComponentFixture පන්තිය
• මූලික සංරචක පරීක්ෂණ
• DebugElement පන්තිය
• පරිශීලක අන්තර්ක්‍රියා අනුකරණය කිරීම
• සාරාංශය

පරිච්ඡේදය 17. නිදොස් කිරීම

• ඉවරයිview කෝණික නිදොස්කරණය
• Viewනිදොස්කරණයේ TypeScript කේතය
• නිදොස් කිරීමේ මූල පදය භාවිතා කිරීම
• නිදොස්කරණය ලොග් කිරීම
• Angular DevTools යනු කුමක්ද?
• Angular DevTools භාවිතා කිරීම
• කෝණික DevTools - සංරචක ව්යුහය
• කෝණික DevTools - අනාවරණය ක්‍රියාත්මක කිරීම වෙනස් කරන්න
• සින්ටැක්ස් දෝෂ අල්ලා ගැනීම
• සාරාංශය

රසායනාගාර අභ්යාස

• රසායනාගාරය 1. කෝණික හැඳින්වීම
• රසායනාගාරය 2. TypeScript සඳහා හැඳින්වීම
• රසායනාගාරය 3. සංරචක සඳහා හැඳින්වීම
• රසායනාගාරය 4. සංරචක සැකිල්ල
• රසායනාගාරය 5. ඡායාරූප ගැලරි සංරචකයක් සාදන්න
• රසායනාගාරය 6. සැකිලි ධාවනය කරන ලද පෝරමය
• රසායනාගාරය 7. සංස්කරණ පෝරමයක් සාදන්න
• රසායනාගාරය 8. ප්රතික්රියාකාරක ආකෘතිය
• රසායනාගාරය 9. සේවාවක් සංවර්ධනය කරන්න
• රසායනාගාරය 10. HT TP සේවාලාභියෙකු සංවර්ධනය කරන්න
• රසායනාගාරය 11. පයිප්ප භාවිතා කරන්න
• රසායනාගාරය 12. රවුටර විද්‍යාගාරය භාවිතා කරන මූලික තනි පිටු යෙදුම 13. තනි පිටු යෙදුමක් (SPA) සාදන්න
• රසායනාගාරය 14. උසස් HT TP සේවාලාභියා
• Lab 15. Angular Bootstrap භාවිතා කිරීම
• Lab 16. Lazy Module Loading
• රසායනාගාරය 17. උසස් මාර්ගගත කිරීම
• රසායනාගාරය 18. ඒකක පරීක්ෂා කිරීම
• රසායනාගාරය 19. කෝණික යෙදුම් දෝෂහරණය කිරීම

පාඨමාලාව කා සඳහාද?
මෙම පා course මාලාව ඉලක්ක කර ඇත්තේ කෝණික 12 සංවර්ධනයේ මූලික කරුණු ඉගෙන ගෙන එය නිර්මාණය කිරීම සඳහා යෙදිය යුතු ඕනෑම කෙනෙකුටය web අයදුම්පත් වහාම. ඔබේ සංවිධානයේ කාලය, මුදල් සහ සම්පත් ඉතිරි කර ගනිමින් - විශාල කණ්ඩායම් සඳහා මෙම පුහුණු පාඨමාලාව ලබා දීමට සහ අභිරුචිකරණය කිරීමට අපට හැකිය.

පූර්වාවශ්යතාවයන්
Web මෙම කෝණික පාඨමාලාවෙන් උපරිම ප්‍රයෝජන ලබා ගැනීමට HTML, CSS සහ JavaScript භාවිතා කරන සංවර්ධන අත්දැකීම් අවශ්‍ය වේ. DOM බ්‍රවුසරයේ දැනුමද ප්‍රයෝජනවත් වේ. AngularJS හෝ Angular හි ඕනෑම අනුවාදයක් සමඟ පූර්ව කෝණික අත්දැකීමක් අවශ්‍ය නොවේ.
https://www.lumifywork.com/en-au/courses/angular-12-programming/

ලේඛන / සම්පත්

LUMIFY WORK Angular 12 වැඩසටහන්කරණය [pdf] පරිශීලක මාර්ගෝපදේශය කෝණික 12 ක්‍රමලේඛනය, කෝණික, 12 ක්‍රමලේඛනය, ක්‍රමලේඛනය

යොමු කිරීම්

• පරිශීලක අත්පොත