Angular 4 Tutorial For Beginners | Angular 4 Introduction | Angular 4 Training | Edureka
6 likes2,920 views
The document is an overview of Edureka's free Angular course, detailing various topics such as Angular components, data binding, and application structure. It contrasts traditional web applications with single-page applications, highlighting the advantages of the latter. Additionally, it discusses the evolution of Angular versions and features like modular development, performance optimization, and the use of TypeScript.
Angular 4 Tutorial For Beginners | Angular 4 Introduction | Angular 4 Training | Edureka
- 1. Copyright © 2017, edureka and/or its affiliates. All rights reserved. Edureka Free Angular Course For Beginner
- 2. Copyright © 2017, edureka and/or its affiliates. All rights reserved. Edureka Free Angular Course For Beginner
- 3. Copyright © 2017, edureka and/or its affiliates. All rights reserved. Angular Tutorial - Road Map Angular Introduction Angular Install & Project Structure Angular Components Angular Data Binding Angular Directives Angular & angularFirebase Angular CRUD App Angular Services Angular Forms Angular Routing 1 10 9 8 7 6 1 2 3 4 5 678910
- 4. Copyright © 2017, edureka and/or its affiliates. All rights reserved. Edureka’s Angular Certification Training
- 5. Copyright © 2017, edureka and/or its affiliates. All rights reserved. Edureka Angular Certification Training Introduction to JavaScript MVC Framework & Angular Components and DOM Interactions Components and Dependency Injection Routes, Inbuilt Directives and Pipes Custom Directives and Pipes Third-party Library Integration, Other APIs Unit Testing and Angular-CLI 1 2 3 4 5 6 7 www.edureka.co/angular-training
- 6. Copyright © 2017, edureka and/or its affiliates. All rights reserved. What is Angular?
- 7. Copyright © 2017, edureka and/or its affiliates. All rights reserved. What is Angular? Angular is a JavaScript framework that allows you to create modern Single Page Application.
- 8. Copyright © 2017, edureka and/or its affiliates. All rights reserved. Traditional vs Single Page Application
- 9. Copyright © 2017, edureka and/or its affiliates. All rights reserved. Traditional Web Application Traditional Web App Life Cycle Client Server Initial request Click Button ❖ With a traditional website, content is organized on individual pages that are usually static. ❖ Don't change in response to a visitor's actions. ❖ A brand new page with its own static content is served when a visitor clicks a button.
- 10. Copyright © 2017, edureka and/or its affiliates. All rights reserved. Single Page Application Single Page Web App Life Cycle Client Server Initial request Click button ❖ Instead of serving a brand new page to visitors, SPA swaps out the old content for new in case of any user interaction ❖ SPA is faster, more responsive, and more compact. ❖ The SPA and all its content is only loaded once, when the visitor first views the site. { … } JSON
- 11. Copyright © 2017, edureka and/or its affiliates. All rights reserved. Are Angular 2, Angular 4 & AngularJS same?
- 12. Copyright © 2017, edureka and/or its affiliates. All rights reserved. Are Angular 2, Angular 4 & AngularJS same? Angular 2/4/5AngularJS Angular ➢ Released by Google in the year 2010 ➢ JavaScript based framework for creating SPA ➢ Officially supported but no longer will be developed ➢ Released in Sept’ 2016 ➢ Complete re-write of AngularJS ➢ Started from Version 2 ➢ Major version will be released every six months because of Semantic Versioning
- 13. Copyright © 2017, edureka and/or its affiliates. All rights reserved. Angular Features
- 14. Copyright © 2017, edureka and/or its affiliates. All rights reserved. Angular Features M O D U L A R I T Y ❖ Module encapsulate similar cohesive block of functionality together ❖ Adding new features without changing the overall code base ❖ Easy to maintain and test ❖ For example: admin module, home page module, etc. Home Page Admin Module Signup Page
- 15. Copyright © 2017, edureka and/or its affiliates. All rights reserved. Angular Features S P E E D & P E R F O R M A N C E ❖ Angular turns your templates into code that's highly optimized for today's JavaScript virtual machines. ❖ Angular Component Router, which split the code allowing users to load only relevant code required for rendering the requested view/route.
- 16. Copyright © 2017, edureka and/or its affiliates. All rights reserved. Angular Features T Y P E S C R I P T & E S 6 ❖ TypeScript is a superset of JavaScript ❖ Static types make things like IDEs and builders/compilers more effective ❖ TypeScript is apt for developers who are coming from Java and C# ❖ ES6 modules help you to decouple your code easily
- 17. Copyright © 2017, edureka and/or its affiliates. All rights reserved. Angular Features N AT I V E A P P D E V E L O P M E N T ❖ Create native mobile web application using the same angular knowledge ❖ Build hybrid apps with the help of Iconic support and native app using NativeScript or React Native.
- 18. Copyright © 2017, edureka and/or its affiliates. All rights reserved. Thank You