SlideShare a Scribd company logo
1 of 13
Full-Stack
Author:
TU Tran
Skype: tranthanhtu83
Level 1
Part 2 - Angular
- Implement permission management feature
- Create and register route to appropriated component
- Display data and display on UI
- Getting data from remote source (Http + REST)
- Multiple languages
- Error handling
Scope
TU Tran(skype: tranthanhtu83)
- Sample code: https://github.com/techcoaching/angular_for_enterprise
- Angular docs: https://angular.io/
- Visual code: https://code.visualstudio.com
- Slides: http://www.slideshare.net/TuTran10/fullstack-part-2-angular
- Node Js: https://nodejs.org/en/
Resource
TU Tran(skype: tranthanhtu83)
 Overview
 Configure and run sample code
 Route & component
 Data binding
 Service & REST (Http)
Agenda
TU Tran(skype: tranthanhtu83)
Overview
TU Tran(skype: tranthanhtu83)
Configure and Run
TU Tran(skype: tranthanhtu83)
Route & Component
TU Tran(skype: tranthanhtu83)
Route & Component
TU Tran(skype: tranthanhtu83)
Route & Component
TU Tran(skype: tranthanhtu83)
Binding
TU Tran(skype: tranthanhtu83)
Component
(.ts)
Component UI
(.html)
Service REST ApiHttp
Promise
Binding
Service
TU Tran(skype: tranthanhtu83)
TU Tran(skype: tranthanhtu83)
Q&A
TU Tran(skype: tranthanhtu83)
THANK YOUFullstack Part 2 - Angular

More Related Content

Viewers also liked

Do Logic Apps support error handling?
Do Logic Apps support error handling?Do Logic Apps support error handling?
Do Logic Apps support error handling?BizTalk360
 
Maalouf - Sample 2 world affairs
Maalouf - Sample 2 world affairsMaalouf - Sample 2 world affairs
Maalouf - Sample 2 world affairsAnthony Maalouf
 
Silver bend week 5 philippine
Silver bend week 5 philippineSilver bend week 5 philippine
Silver bend week 5 philippineSimpony
 

Viewers also liked (7)

Do Logic Apps support error handling?
Do Logic Apps support error handling?Do Logic Apps support error handling?
Do Logic Apps support error handling?
 
Soorah Hujrat Part 2
Soorah Hujrat Part 2Soorah Hujrat Part 2
Soorah Hujrat Part 2
 
Maalouf - Sample 2 world affairs
Maalouf - Sample 2 world affairsMaalouf - Sample 2 world affairs
Maalouf - Sample 2 world affairs
 
Bruxismo
BruxismoBruxismo
Bruxismo
 
Silver bend week 5 philippine
Silver bend week 5 philippineSilver bend week 5 philippine
Silver bend week 5 philippine
 
CASO DE TRATADOS
CASO DE TRATADOSCASO DE TRATADOS
CASO DE TRATADOS
 
anthology
anthologyanthology
anthology
 

Similar to Fullstack Part 2 - Angular

Angular2 getstart
Angular2 getstartAngular2 getstart
Angular2 getstartTu Tran
 
Fluentd - road to v1 -
Fluentd - road to v1 -Fluentd - road to v1 -
Fluentd - road to v1 -N Masahiro
 
WebRTC: A front-end perspective
WebRTC: A front-end perspectiveWebRTC: A front-end perspective
WebRTC: A front-end perspectiveshwetank
 
What's New with Windows Phone - FoxCon Talk
What's New with Windows Phone - FoxCon TalkWhat's New with Windows Phone - FoxCon Talk
What's New with Windows Phone - FoxCon TalkSam Basu
 
Fluentd - RubyKansai 65
Fluentd - RubyKansai 65Fluentd - RubyKansai 65
Fluentd - RubyKansai 65N Masahiro
 
DotDotPwn Fuzzer - Black Hat 2011 (Arsenal)
DotDotPwn Fuzzer - Black Hat 2011 (Arsenal)DotDotPwn Fuzzer - Black Hat 2011 (Arsenal)
DotDotPwn Fuzzer - Black Hat 2011 (Arsenal)Alejandro Hernández
 
Webapps development on ubuntu
Webapps development on ubuntuWebapps development on ubuntu
Webapps development on ubuntuXiaoguo Liu
 
OGCE Overview for SciDAC 2009
OGCE Overview for SciDAC 2009OGCE Overview for SciDAC 2009
OGCE Overview for SciDAC 2009marpierc
 
Navigating the YANGscape of network automation
Navigating the YANGscape of network automationNavigating the YANGscape of network automation
Navigating the YANGscape of network automationRoman Dodin
 
Spring_Boot_Microservices-5_Day_Session.pptx
Spring_Boot_Microservices-5_Day_Session.pptxSpring_Boot_Microservices-5_Day_Session.pptx
Spring_Boot_Microservices-5_Day_Session.pptxPrabhakaran Ravichandran
 
Angular 4 fronts
Angular 4 frontsAngular 4 fronts
Angular 4 frontsbadal dubla
 
Unify logz with fluentd
Unify logz with fluentdUnify logz with fluentd
Unify logz with fluentdSoluto
 
apidays LIVE Jakarta - REST the events: REST APIs for Event-Driven Architectu...
apidays LIVE Jakarta - REST the events: REST APIs for Event-Driven Architectu...apidays LIVE Jakarta - REST the events: REST APIs for Event-Driven Architectu...
apidays LIVE Jakarta - REST the events: REST APIs for Event-Driven Architectu...apidays
 
FIWARE Global Summit - Real-time Media Stream Processing Using Kurento
FIWARE Global Summit - Real-time Media Stream Processing Using KurentoFIWARE Global Summit - Real-time Media Stream Processing Using Kurento
FIWARE Global Summit - Real-time Media Stream Processing Using KurentoFIWARE
 
Front-end development introduction (JavaScript). Part 2
Front-end development introduction (JavaScript). Part 2Front-end development introduction (JavaScript). Part 2
Front-end development introduction (JavaScript). Part 2Oleksii Prohonnyi
 
Fluentd and Embulk Game Server 4
Fluentd and Embulk Game Server 4Fluentd and Embulk Game Server 4
Fluentd and Embulk Game Server 4N Masahiro
 
03_clere-HTTP2 HTTP3 the State of the Art in Our Servers.pdf
03_clere-HTTP2 HTTP3 the State of the Art in Our Servers.pdf03_clere-HTTP2 HTTP3 the State of the Art in Our Servers.pdf
03_clere-HTTP2 HTTP3 the State of the Art in Our Servers.pdfJean-Frederic Clere
 

Similar to Fullstack Part 2 - Angular (20)

Angular2 getstart
Angular2 getstartAngular2 getstart
Angular2 getstart
 
Fluentd - road to v1 -
Fluentd - road to v1 -Fluentd - road to v1 -
Fluentd - road to v1 -
 
WebRTC: A front-end perspective
WebRTC: A front-end perspectiveWebRTC: A front-end perspective
WebRTC: A front-end perspective
 
What's New with Windows Phone - FoxCon Talk
What's New with Windows Phone - FoxCon TalkWhat's New with Windows Phone - FoxCon Talk
What's New with Windows Phone - FoxCon Talk
 
Fluentd - RubyKansai 65
Fluentd - RubyKansai 65Fluentd - RubyKansai 65
Fluentd - RubyKansai 65
 
DotDotPwn Fuzzer - Black Hat 2011 (Arsenal)
DotDotPwn Fuzzer - Black Hat 2011 (Arsenal)DotDotPwn Fuzzer - Black Hat 2011 (Arsenal)
DotDotPwn Fuzzer - Black Hat 2011 (Arsenal)
 
Webapps development on ubuntu
Webapps development on ubuntuWebapps development on ubuntu
Webapps development on ubuntu
 
El viaje de Angular1 a Angular2
El viaje de Angular1 a Angular2El viaje de Angular1 a Angular2
El viaje de Angular1 a Angular2
 
OGCE Overview for SciDAC 2009
OGCE Overview for SciDAC 2009OGCE Overview for SciDAC 2009
OGCE Overview for SciDAC 2009
 
Navigating the YANGscape of network automation
Navigating the YANGscape of network automationNavigating the YANGscape of network automation
Navigating the YANGscape of network automation
 
Spring_Boot_Microservices-5_Day_Session.pptx
Spring_Boot_Microservices-5_Day_Session.pptxSpring_Boot_Microservices-5_Day_Session.pptx
Spring_Boot_Microservices-5_Day_Session.pptx
 
Angular 4 fronts
Angular 4 frontsAngular 4 fronts
Angular 4 fronts
 
Unify logz with fluentd
Unify logz with fluentdUnify logz with fluentd
Unify logz with fluentd
 
apidays LIVE Jakarta - REST the events: REST APIs for Event-Driven Architectu...
apidays LIVE Jakarta - REST the events: REST APIs for Event-Driven Architectu...apidays LIVE Jakarta - REST the events: REST APIs for Event-Driven Architectu...
apidays LIVE Jakarta - REST the events: REST APIs for Event-Driven Architectu...
 
T2 Web Framework
T2 Web FrameworkT2 Web Framework
T2 Web Framework
 
FIWARE Global Summit - Real-time Media Stream Processing Using Kurento
FIWARE Global Summit - Real-time Media Stream Processing Using KurentoFIWARE Global Summit - Real-time Media Stream Processing Using Kurento
FIWARE Global Summit - Real-time Media Stream Processing Using Kurento
 
WebRTC on Mobile
WebRTC on MobileWebRTC on Mobile
WebRTC on Mobile
 
Front-end development introduction (JavaScript). Part 2
Front-end development introduction (JavaScript). Part 2Front-end development introduction (JavaScript). Part 2
Front-end development introduction (JavaScript). Part 2
 
Fluentd and Embulk Game Server 4
Fluentd and Embulk Game Server 4Fluentd and Embulk Game Server 4
Fluentd and Embulk Game Server 4
 
03_clere-HTTP2 HTTP3 the State of the Art in Our Servers.pdf
03_clere-HTTP2 HTTP3 the State of the Art in Our Servers.pdf03_clere-HTTP2 HTTP3 the State of the Art in Our Servers.pdf
03_clere-HTTP2 HTTP3 the State of the Art in Our Servers.pdf
 

Recently uploaded

Understanding the Laravel MVC Architecture
Understanding the Laravel MVC ArchitectureUnderstanding the Laravel MVC Architecture
Understanding the Laravel MVC ArchitecturePixlogix Infotech
 
Factors to Consider When Choosing Accounts Payable Services Providers.pptx
Factors to Consider When Choosing Accounts Payable Services Providers.pptxFactors to Consider When Choosing Accounts Payable Services Providers.pptx
Factors to Consider When Choosing Accounts Payable Services Providers.pptxKatpro Technologies
 
Azure Monitor & Application Insight to monitor Infrastructure & Application
Azure Monitor & Application Insight to monitor Infrastructure & ApplicationAzure Monitor & Application Insight to monitor Infrastructure & Application
Azure Monitor & Application Insight to monitor Infrastructure & ApplicationAndikSusilo4
 
Integration and Automation in Practice: CI/CD in Mule Integration and Automat...
Integration and Automation in Practice: CI/CD in Mule Integration and Automat...Integration and Automation in Practice: CI/CD in Mule Integration and Automat...
Integration and Automation in Practice: CI/CD in Mule Integration and Automat...Patryk Bandurski
 
How to convert PDF to text with Nanonets
How to convert PDF to text with NanonetsHow to convert PDF to text with Nanonets
How to convert PDF to text with Nanonetsnaman860154
 
Neo4j - How KGs are shaping the future of Generative AI at AWS Summit London ...
Neo4j - How KGs are shaping the future of Generative AI at AWS Summit London ...Neo4j - How KGs are shaping the future of Generative AI at AWS Summit London ...
Neo4j - How KGs are shaping the future of Generative AI at AWS Summit London ...Neo4j
 
Unblocking The Main Thread Solving ANRs and Frozen Frames
Unblocking The Main Thread Solving ANRs and Frozen FramesUnblocking The Main Thread Solving ANRs and Frozen Frames
Unblocking The Main Thread Solving ANRs and Frozen FramesSinan KOZAK
 
My Hashitalk Indonesia April 2024 Presentation
My Hashitalk Indonesia April 2024 PresentationMy Hashitalk Indonesia April 2024 Presentation
My Hashitalk Indonesia April 2024 PresentationRidwan Fadjar
 
Slack Application Development 101 Slides
Slack Application Development 101 SlidesSlack Application Development 101 Slides
Slack Application Development 101 Slidespraypatel2
 
Maximizing Board Effectiveness 2024 Webinar.pptx
Maximizing Board Effectiveness 2024 Webinar.pptxMaximizing Board Effectiveness 2024 Webinar.pptx
Maximizing Board Effectiveness 2024 Webinar.pptxOnBoard
 
SQL Database Design For Developers at php[tek] 2024
SQL Database Design For Developers at php[tek] 2024SQL Database Design For Developers at php[tek] 2024
SQL Database Design For Developers at php[tek] 2024Scott Keck-Warren
 
Swan(sea) Song – personal research during my six years at Swansea ... and bey...
Swan(sea) Song – personal research during my six years at Swansea ... and bey...Swan(sea) Song – personal research during my six years at Swansea ... and bey...
Swan(sea) Song – personal research during my six years at Swansea ... and bey...Alan Dix
 
The Codex of Business Writing Software for Real-World Solutions 2.pptx
The Codex of Business Writing Software for Real-World Solutions 2.pptxThe Codex of Business Writing Software for Real-World Solutions 2.pptx
The Codex of Business Writing Software for Real-World Solutions 2.pptxMalak Abu Hammad
 
Transforming Data Streams with Kafka Connect: An Introduction to Single Messa...
Transforming Data Streams with Kafka Connect: An Introduction to Single Messa...Transforming Data Streams with Kafka Connect: An Introduction to Single Messa...
Transforming Data Streams with Kafka Connect: An Introduction to Single Messa...HostedbyConfluent
 
How to Remove Document Management Hurdles with X-Docs?
How to Remove Document Management Hurdles with X-Docs?How to Remove Document Management Hurdles with X-Docs?
How to Remove Document Management Hurdles with X-Docs?XfilesPro
 
Presentation on how to chat with PDF using ChatGPT code interpreter
Presentation on how to chat with PDF using ChatGPT code interpreterPresentation on how to chat with PDF using ChatGPT code interpreter
Presentation on how to chat with PDF using ChatGPT code interpreternaman860154
 
Install Stable Diffusion in windows machine
Install Stable Diffusion in windows machineInstall Stable Diffusion in windows machine
Install Stable Diffusion in windows machinePadma Pradeep
 
Benefits Of Flutter Compared To Other Frameworks
Benefits Of Flutter Compared To Other FrameworksBenefits Of Flutter Compared To Other Frameworks
Benefits Of Flutter Compared To Other FrameworksSoftradix Technologies
 
Pigging Solutions in Pet Food Manufacturing
Pigging Solutions in Pet Food ManufacturingPigging Solutions in Pet Food Manufacturing
Pigging Solutions in Pet Food ManufacturingPigging Solutions
 
08448380779 Call Girls In Diplomatic Enclave Women Seeking Men
08448380779 Call Girls In Diplomatic Enclave Women Seeking Men08448380779 Call Girls In Diplomatic Enclave Women Seeking Men
08448380779 Call Girls In Diplomatic Enclave Women Seeking MenDelhi Call girls
 

Recently uploaded (20)

Understanding the Laravel MVC Architecture
Understanding the Laravel MVC ArchitectureUnderstanding the Laravel MVC Architecture
Understanding the Laravel MVC Architecture
 
Factors to Consider When Choosing Accounts Payable Services Providers.pptx
Factors to Consider When Choosing Accounts Payable Services Providers.pptxFactors to Consider When Choosing Accounts Payable Services Providers.pptx
Factors to Consider When Choosing Accounts Payable Services Providers.pptx
 
Azure Monitor & Application Insight to monitor Infrastructure & Application
Azure Monitor & Application Insight to monitor Infrastructure & ApplicationAzure Monitor & Application Insight to monitor Infrastructure & Application
Azure Monitor & Application Insight to monitor Infrastructure & Application
 
Integration and Automation in Practice: CI/CD in Mule Integration and Automat...
Integration and Automation in Practice: CI/CD in Mule Integration and Automat...Integration and Automation in Practice: CI/CD in Mule Integration and Automat...
Integration and Automation in Practice: CI/CD in Mule Integration and Automat...
 
How to convert PDF to text with Nanonets
How to convert PDF to text with NanonetsHow to convert PDF to text with Nanonets
How to convert PDF to text with Nanonets
 
Neo4j - How KGs are shaping the future of Generative AI at AWS Summit London ...
Neo4j - How KGs are shaping the future of Generative AI at AWS Summit London ...Neo4j - How KGs are shaping the future of Generative AI at AWS Summit London ...
Neo4j - How KGs are shaping the future of Generative AI at AWS Summit London ...
 
Unblocking The Main Thread Solving ANRs and Frozen Frames
Unblocking The Main Thread Solving ANRs and Frozen FramesUnblocking The Main Thread Solving ANRs and Frozen Frames
Unblocking The Main Thread Solving ANRs and Frozen Frames
 
My Hashitalk Indonesia April 2024 Presentation
My Hashitalk Indonesia April 2024 PresentationMy Hashitalk Indonesia April 2024 Presentation
My Hashitalk Indonesia April 2024 Presentation
 
Slack Application Development 101 Slides
Slack Application Development 101 SlidesSlack Application Development 101 Slides
Slack Application Development 101 Slides
 
Maximizing Board Effectiveness 2024 Webinar.pptx
Maximizing Board Effectiveness 2024 Webinar.pptxMaximizing Board Effectiveness 2024 Webinar.pptx
Maximizing Board Effectiveness 2024 Webinar.pptx
 
SQL Database Design For Developers at php[tek] 2024
SQL Database Design For Developers at php[tek] 2024SQL Database Design For Developers at php[tek] 2024
SQL Database Design For Developers at php[tek] 2024
 
Swan(sea) Song – personal research during my six years at Swansea ... and bey...
Swan(sea) Song – personal research during my six years at Swansea ... and bey...Swan(sea) Song – personal research during my six years at Swansea ... and bey...
Swan(sea) Song – personal research during my six years at Swansea ... and bey...
 
The Codex of Business Writing Software for Real-World Solutions 2.pptx
The Codex of Business Writing Software for Real-World Solutions 2.pptxThe Codex of Business Writing Software for Real-World Solutions 2.pptx
The Codex of Business Writing Software for Real-World Solutions 2.pptx
 
Transforming Data Streams with Kafka Connect: An Introduction to Single Messa...
Transforming Data Streams with Kafka Connect: An Introduction to Single Messa...Transforming Data Streams with Kafka Connect: An Introduction to Single Messa...
Transforming Data Streams with Kafka Connect: An Introduction to Single Messa...
 
How to Remove Document Management Hurdles with X-Docs?
How to Remove Document Management Hurdles with X-Docs?How to Remove Document Management Hurdles with X-Docs?
How to Remove Document Management Hurdles with X-Docs?
 
Presentation on how to chat with PDF using ChatGPT code interpreter
Presentation on how to chat with PDF using ChatGPT code interpreterPresentation on how to chat with PDF using ChatGPT code interpreter
Presentation on how to chat with PDF using ChatGPT code interpreter
 
Install Stable Diffusion in windows machine
Install Stable Diffusion in windows machineInstall Stable Diffusion in windows machine
Install Stable Diffusion in windows machine
 
Benefits Of Flutter Compared To Other Frameworks
Benefits Of Flutter Compared To Other FrameworksBenefits Of Flutter Compared To Other Frameworks
Benefits Of Flutter Compared To Other Frameworks
 
Pigging Solutions in Pet Food Manufacturing
Pigging Solutions in Pet Food ManufacturingPigging Solutions in Pet Food Manufacturing
Pigging Solutions in Pet Food Manufacturing
 
08448380779 Call Girls In Diplomatic Enclave Women Seeking Men
08448380779 Call Girls In Diplomatic Enclave Women Seeking Men08448380779 Call Girls In Diplomatic Enclave Women Seeking Men
08448380779 Call Girls In Diplomatic Enclave Women Seeking Men
 

Fullstack Part 2 - Angular

Editor's Notes

  1. Not learning angular, we learn how to make the app using angular
  2. - Typescript vs js Deployment code is pure static content => Can deploy to any webserver Typescript is super set of js
  3. Get the source code from github Using api at http://myerpapi.azurewebsites.net/api/ Login with accout: tu.tran@yahoo.com/123456
  4. Route with param useAsDefault RouterLink RouterOutle
  5. Route with param useAsDefault RouterLink RouterOutle
  6. Route with param
  7. Also introduce i18n and error handler
  8. Create new instance Using injection Mention disadvantage of auto inject