
APLIKASYON UG WEB KALAMBOAN
Angular 15 Programming
DUGAY 5 ka adlaw
BERSIYON 15
NGANONG PAGTUON KINI NGA KURSO
Kini nga intensive ug komprehensibo nga Angular 15 nga kurso sa pagbansay naghatag sa mga nanambong og mga kahanas nga magamit nila dayon sa ilang trabaho. Mahibal-an nimo ang mga sukaranan sa pag-uswag sa Angular 15 sama sa usa ka panid nga aplikasyon sa browser, responsive webmga site, ug hybrid nga mobile applicat ions.
Kini nga kurso usa ka kombinasyon sa theoret ical learning ug hands-on labs nga naglakip sa pasiuna nga ion sa Angular, gisundan sa TypeScript, mga sangkap, direktang ives, serbisyo, HTTPClient, pagsulay, ug pag-debug.
Mubo nga sulat: Makahatag usab kami og pagbansay sa ubang mga bersyon sa Angular. Palihog kontaka kami sa paghimo og pangutana o pagparehistro sa imong interes.
ANGULAR AT LUMIFY NGA TRABAHO
UNSAY IMONG MAKAT-ON
Sa malampuson nga pagkompleto niini nga kurso, ikaw adunay kahibalo sa:
- Pagpalambo og usa ka panid nga Angular applicat ions gamit ang Typescript
- Paghimo og usa ka kompleto nga Angular development environment
- Paghimo og mga component, Direct ives, Services, Pipe, Forms, ug Custom Validator
- Pagdumala sa abante nga network data retrieval nga mga buluhaton gamit ang Observables
- Gamita ang datos gikan sa REST web mga serbisyo gamit ang Angular HTTP Client
- Pagdumala sa push-data connect ions gamit ang WebSocket protocol
- Pagtrabaho uban ang Angular Pipes aron ma-format ang datos
- Gamita ang mga advanced nga Angular Component Router nga mga feature
- Sulayi ug i-debug ang Angular applicat ions gamit ang built in nga mga himan
- Pagtrabaho uban ang Angular CLI
Nindot kaayo ang akong instruktor nga nakabutang sa mga senaryo sa tinuud nga mga higayon sa kalibutan nga adunay kalabotan sa akong piho nga kahimtang.
Gibati ko nga giabi-abi gikan sa akong pag-abot ug ang abilidad sa paglingkod isip usa ka grupo sa gawas sa classroom aron hisgutan ang among mga sitwasyon ug ang among mga tumong hilabihan ka bililhon.
Daghan kog nakat-onan ug gibati nako nga importante nga ang akong mga tumong pinaagi sa pagtambong niini nga kurso matuman.
Nindot nga trabaho Lumify Work team.
AMANDA NICOL
IT SUPPORT SERVICES MANAGER – HEALTH WORLD LIMITED
MGA SUBJECT SA KURSO
- Pagpaila sa Angular
• Unsa ang Angular?
• Sentral nga mga bahin sa Angular Framework
• Angay nga mga Kaso sa Paggamit
• Building Blocks sa usa ka Angular Application
• Basic Architecture sa usa ka Angular Application
• Pag-instalar ug Paggamit sa Angular
• Anatomy sa usa ka Angular Applicat ion
• Pagpadagan sa Aplikasyon ion
• Pagtukod ug Pag-deploy sa Aplikasyon
• Angular para sa Lumad nga Mobile Apps - Pasiuna sa TypeScript
• Mga Pinulongan sa Programming para Gamiton sa Angular
• TypeScript Syntax
• Mga Editor sa Programa
• Ang Type System – Def ining Variables
• Ang Type System – Def ining Arrays
• Basic Primit ive Types
• Type sa Funct ions
• Type Inference
• Paghubit sa mga Klase
• Mga Pamaagi sa Klase
• Pagkontrol sa Visibility
• Mga Magtutukod sa Klase
• Class Constructors – Alternate Form
• Uninitialized Fields
• Mga Interface
• Pagtrabaho uban sa ES6 Modules
• var vs let
• Arrow Function
• Arrow Function Compact Syntax
• Template Strings
• Generics sa Klase
• Generics sa Funct ion - Mga sangkap
• Unsa ang Component?
• Usa ka Exampang Component
• Paghimo og Component Gamit ang Angular CLI
• Ang Component Class
• Ang @Component Decorator
• Pagparehistro sa usa ka Component sa Module niini
• Template sa Component
• Example: HelloComponent Template
• Example: Ang HelloComponent nga Klase
• Paggamit og Component
• Pagdalagan ang Aplikasyon
• Component Hierarchy
• Ang Applicat ion Root Component
• Ang Bootstrap File
• Component Lifecycle Hooks
• Example Lifecycle Hooks
• Mga Estilo sa CSS - Mga Template sa Component
• Mga template
• Lokasyon sa Template
• Ang Mustache {{ }} Syntax
• Pagbutang sa DOM Element Properties
• Pagbutang Element Body Text
• Pagbugkos sa Hitabo
• Expression Event Handler
• Paglikay sa Default nga Pagdumala
• Mga Direktiba sa Hiyas
• Ibutang ang mga Estilo pinaagi sa Pag-usab sa mga Klase sa CSS
• Example: ngClass
• Direkta nga Pagpadapat sa mga Estilo
• Structural Directives
• Kondisyon nga Ipatuman ang Template
• Example: ngIf
• Looping Gamit ang ngFor
• ngFor Local Variables
• Pagmaniobra sa Koleksyon
• Example - Pagtangtang sa usa ka butang
• Pagsubay sa butang gamit ang ngFor
• Pagbaylo sa mga Elemento sa ngSwitch
• Paggrupo sa mga Elemento
• Template Reference Variable - Inter-Component nga Komunikasyon
• Mga Sukaranan sa Komunikasyon
• Ang Data Flow Architecture
• Pag-andam sa Bata sa Pagdawat sa Data
• Ipadala ang Data gikan sa Ginikanan
• Dugang Mahitungod sa Pag-set Properties
• Pagpabuto nga Hitabo gikan sa usa ka Component
• @Output() Example – Bata nga Component
• @Output() Example – Ginikanan nga Component
• Bug-os nga Two Way Binding
• Pag-set up sa Two Way Data Binding sa Ginikanan - Mga Porma nga Gimaneho sa Template
• Mga Porma nga Gimaneho sa Template
• Pag-import sa mga Porma nga Module
• Basic nga Pamaagi
• Paghimo og usa ka Porma
• Pagkuha User Input
• Pagtangtang sa ngForm Attribute
• Pagsugod sa Porma
• Two Way Data Binding
• Pagpamatuod sa porma
• Angular Validator
• Pagpakita sa Validat ion State Gamit ang mga Klase
• Dugang nga Input Types
• Mga checkbox
• Pagpili (Drop Down) Fields
• Mga Opsyon sa Pag-render para sa Pagpili (I-drop Down)
• Mga field sa petsa
• Mga Butang sa Radyo - Reaktibo nga mga Porma
• Reaktibo nga mga Porma Tapos naview
• Ang Building Blocks
• Import Reactive FormsModule
• Paghimo og usa ka Porma
• Pagdesinyo sa Template
• Pagkuha og Input Values
• Pagsugod sa Input Fields
• Pagbutang sa Form Values
• Pag-subscribe sa Input Changes
• Pagpamatuod
• Gitukod nga mga Validator
• Pagpakita sa Validation Error
• Custom Validator
• Paggamit sa usa ka Custom Validator
• Paghatag Configuration sa Custom Validator
• FormArray – Dynamically Add Inputs
• FormArray – Ang Component Class
• FormArray – Ang Template
• FormArray – Mga bili
• Sub FormGroups – Component Class
• Sub FormGroups – HTML Template
• Nganong Gamiton ang Sub FormGroups - Mga Serbisyo ug Dependency Injection
• Unsa ang Serbisyo?
• Paghimo og Basic Service
• Ang Klase sa Serbisyo
• Unsa ang Dependency Injection?
• Pag-inject sa usa ka Instance sa Serbisyo
• Mga injector
• Hierarchy sa Injector
• Pagparehistro sa usa ka Serbisyo sa Root Injector
• Pagparehistro sa usa ka Serbisyo sa usa ka Component's Injector
• Pagrehistro og Serbisyo nga adunay Feature Module Injector
• Asa Magparehistro og Serbisyo?
• Dependency Injection sa Ubang Artifacts
• Paghatag ug Alternate Implementation
• Dependency Injection ug @Host
• Dependency Injection ug @Optional - HTTP Kliyente
• Ang Angular HTTP Client
• Paggamit sa HTTP Client – Overview
• Import sa HttpClientModule
• Serbisyo Gamit ang HttpClient
• Paghimo og GET Request
• Unsa ang gibuhat sa usa ka Makita nga Butang?
• Paggamit sa Serbisyo sa usa ka Component
• Ang PeopleService Client Component
• Pagdumala sa Sayop
• Pag-customize sa Error Object
• Paghimo og POST Request
• Paghimo ug PUT Request
• Paghimo ug DELETE Request - Pipe ug Data Formatting
• Unsa ang Pipe?
• Gitukod-Sa Pipe
• Paggamit sa Pipes sa HTML Template
• Pag-chaining Pipe
• Internat nga ionalized Pipe (i18n)
• Nag-load sa Lokal nga Data
• Ang petsa Pipe
• Ang numero nga Pipe
• Pipe sa Salapi
• Paghimo og Custom Pipe
• Custom Pipe Example
• Paggamit sa Custom Pipes
• Paggamit sa Pipe nga adunay ngFor
• Usa ka Filter Pipe
• Pipe Category: Putli ug Dili putli
• Purong Tubo Example
• Dili putli nga Pipe Example - Pasiuna sa Usa ka Panid nga Aplikasyon
• Unsa ang Single Page Applicat ion (SPA)
• Tradisyonal Web Aplikasyon
• SPA Workflow
• Usa ka Panid nga Aplikasyon Advantages
• HTML5 History API
• Mga Hagit sa SPA
• Pagpatuman sa SPA's Paggamit sa Angular - Ang Angular Component Router
• Ang Component Router
• View Nabigasyon
• Ang Angular Router API
• Paghimo og Router Enabled Application
• Pag-host sa mga Routed Components
• Navigation Gamit ang Links ug Buttons
• Programmatic Navigation
• Mga Parameter sa Paglabay sa Ruta
• Pag-navigate gamit ang mga Parameter sa Ruta
• Pag-angkon sa Route Parameter Values
• Pagkuha sa Parameter sa Ruta nga dungan
• Pagkuha sa usa ka Parameter sa Ruta Asynchronously
• Mga Parameter sa Pangutana
• Paghatag sa mga Parameter sa Pangutana
• Pagkuha sa mga Parameter sa Pangutana nga Asynchronous
• Problema sa Manwal URL entry ug Bookmarking - Advanced nga HTTP Client
• Mga Opsyon sa Paghangyo
• Pagbalik ug HttpResponse Object
• Pagbutang sa mga Pangutana sa Panghangyo
• Paghimo Bag-ong mga Obserbasyon
• Paghimo og Simple Observable
• Ang Observable Constructor Method
• Mapaniid nga mga Operator
• Ang mapa ug filter Operators
• Ang flatMap() Operator
• Ang tap() Operator
• Ang zip() Combinator
• Pag-cache sa HTTP nga Tubag
• Paghimo sa Sequential HTTP Tawag
• Paghimo Parallel Calls
• Pag-customize sa Error Object gamit ang catchError()
• Sayop sa Pipeline
• Sayop Recovery - Angular nga mga Module
• Nganong Angular Modules?
• Anatomy sa usa ka Klase sa Module
• @NgModule Properties
• Feature Modules
• ExampAng Istruktura sa Module
• Paghimo og Domain Module
• Paghimo ug Routed/Routing Module Pares
• Paghimo og Service Module
• Paghimo Komon nga mga Module
• Paggamit sa Usa ka Module Gikan sa Lain - Abanteng Ruta
• Routing Enabled Feature Module
• Paggamit sa Feature Module
• Lay Loading sa Feature Module
• Paghimo og mga Link para sa Feature Module Components
• Dugang mahitungod sa Lazy Loading
• Preloading Modules
• routerLinkActive pagbugkos
• Default nga Ruta
• Wildcard nga Dalan sa Ruta
• redirect sa
• Mga Ruta sa Bata
• Paghubit sa mga Ruta sa Bata alang sa mga Ruta sa Bata
• Mga Link para sa mga Ruta sa Bata
• Navigation Guards
• Pagmugna sa Guard Implementations
• Paggamit sa mga Guards sa usa ka Ruta - Unit Testing Angular Applications
• Unit Testing Angular Artifacts
• Testing Tools
• Kinaandan nga mga Lakang sa Pagsulay
• Mga Resulta sa Pagsulay
• Jasmine Test Suites
• Jasmine Specs (Unit Tests)
• Pagdahom (Assert ions)
• Matchers
• Examples sa Paggamit sa Matchers
• Paggamit sa dili Property
• Setup ug Teardown sa Unit Test Suites
• Example sa beforeEach ug afterEach Functions
• Angular Test Module
• Example Angular Test Module
• Pagsulay sa usa ka Serbisyo
• Pag-inject sa usa ka Instance sa Serbisyo
• Sulayi ang usa ka Synchronous nga Pamaagi
• Sulayi ang usa ka Asynchronous nga Pamaagi
• Paggamit sa Mock HTTP Client
• Pag-supply og Canned Response
• Pagsulay sa usa ka Component
• Component Test Module
• Paghimo og Component Instance
• Ang ComponentFixture nga Klase
• Basic Component Tests
• Ang DebugElement nga Klase
• Pagsundog sa Interaksyon sa Gumagamit - Pag-debug
• Labaw naview sa Angular Debugging
• Viewsa TypeScript Code sa Debugger
• Paggamit sa debugger Keyword
• Debug logging
• Unsa ang Angular DevTools?
• Paggamit sa Angular DevTools
• Angular DevTools - Component Structure
• Angular DevTools – Usba ang Detect ion Execut ion
• Pagdakop sa Syntax Error
PARA KINSA ANG KURSO?
Kini nga kurso gitumong sa bisan kinsa nga kinahanglan nga makakat-on sa mga sukaranan sa pag-uswag sa Angular 15 ug ipadapat kini dayon sa paghimo web mga aplikasyon.
Mahimo usab namon nga ihatud ug ipasibo kini nga kurso sa pagbansay para sa daghang mga grupo - makatipig oras, salapi ug mga kapanguhaan sa imong organisasyon. Para sa dugang nga impormasyon, palihog kontaka kami pinaagi sa email sa ph.training@lumifywork.com
MGA KINAHANGLAN
- Web Ang kasinatian sa pag-uswag gamit ang HTML, CSS, ug JavaScript gikinahanglan aron makuha ang labing kaayo sa kini nga Angular nga kurso
- Ang kahibalo sa browser DOM mapuslanon usab
- Walay naunang kasinatian sa Angular o AngularJS ang gikinahanglan
Ang suplay niini nga mga kurso sa Lumify Work gidumala sa mga termino ug kondisyon sa pagpareserba.
Palihug basaha pag-ayo ang mga termino ug kondisyon sa dili pa magpalista niini nga kurso, tungod kay ang pagpalista sa kurso adunay kondisyon sa pagdawat niini nga mga termino ug kondisyon.
https://www.lumifywork.com/en-ph/courses/angular-15-programming/
ph.training@lumifywork.com
lumifywork.com
facebook.com/LumifyWorkPh
linkedin.com/company/lumify-work-ph
twitter.com/LumifyWorkPH
youtube.com/@lumifywork
Mga Dokumento / Mga Kapanguhaan
![]() |
LUMIFY WORK Angular 15 Programming [pdf] Giya sa Gumagamit Angular 15 Programming, Programming |




