In 1 hour, we cover the essentials of angular that includes component composition, reactivity, computed signals, dynamic interfaces, events, user interactions, control flow, dependency injection, state, services, input, output, model, and much more. Towards the end, we review the code with cursor AI.
We cover all the topics mentioned in the https://angular.dev/essentials section.
00:00 Intro
00:50 Project scaffold
01:22 Application design & walkthrough
06:37 Define service & data
13:00 Add bootstrap theme
15:00 Add component templates
17:00 Consume service in component
24:00 Custom events
27:00 Component level state & computed signals
28:45 Custom inputs
30:00 Wire up TaskList and StatusPanel
37:41 Wire up Status bar
42:11 Add Task
47:45 TemplateRef
49:44 Close panel functionality
51:22 Learning concept summary
51:46 Code review with Cursor AI
57:01 Conclusion & more challenges
Styles: Bootstrap theme.
https://bootswatch.com/ ( I use cyborg )
Angular cli & node installation: https://youtu.be/vqBGrAcH6-M
Github repo.
https://github.com/harikrishkk/task-management-app
Check the readme for HTML templates of components which can be copy pasted.
Fork and use the solution if you like.
Stackblitz: https://stackblitz.com/edit/stackblitz-starters-7hgtudem
#angular #angular19 #angularproject #javascript #javascriptframework