Downloaded 172 times
Uploaded byAmit Baghel
Angularjs PPT
This document summarizes the history and benefits of AngularJS. It explains that AngularJS was originally created in 2009 as a side project by Misko Hevery and Adam Abrons to build a tool for both front-end and back-end development. When working on a Google project called Google Feedback, Hevery was able to rewrite 17,000 lines of code into 1,500 lines using his AngularJS framework by taking advantage of its features like separation of concerns, modularity, and reusable components. The document then lists some key benefits of AngularJS like being lightweight, free, and improving structure, quality, organization and maintainability of code.
More Related Content
Similar to Angularjs PPT
Angularjs PPT
- 1. A session byAmit Baghel Superheroic JavaScript MVW Framework
- 2. History AngularJS was created,as a side project, in 2009 by two developers, Misko Hevery and Adam Abrons. The two originally envisioned their project, GetAngular, to be an end-to-end tool that allowed web designers to interact with both the frontend and the backend. Hevery eventually began working on a project at Google called Google Feedback. Hevery and 2 other developers wrote 17,000 lines of code over the period of 6 months for Google Feedback. However, as the code size increased, Hevery began to grow frustrated with how difficult it was to test and modify the code the team had written. So Hevery made the bet with his manager that he could rewrite the entire application using his side GetAngular project in two weeks. Hevery lost the bet. Instead of 2 weeks it took him 3 weeks to rewrite the entire application, but he was able to cut the application from 17,000 lines to 1,500 lines.
- 3. 17000 lines ofcode to 1500 how? Take an example In JQuery HTML <p id="test"></p> <p id="test1"></p> <p id="test2"></p> <p id="test3"></p>
- 4. 17000 lines ofcode to 1500 how? Script $(function(){ $('#test’).text('Hello World!'); $('#test1’).show(); $('#test2’).hide(); $('#test3’).addClass(‘active’); });
- 5. 17000 lines ofcode to 1500 how? Same thing in Angularjs ? HTML <p>{{greeting}}</p> <p ng-show=’visible’ ></p> <p ng-hide=’visible’></p> <p ng-class=’{ ‘active’: visible }’></p>
- 6. 17000 lines ofcode to 1500 how? Same thing in Angularjs ? Script $scope.greeting=’Hello Viatech’; $scope.visible=’true’;
- 7. •Structure, Quality andOrganization •Lightweight ( < 36KB compressed and minified) •Free •Separation of concern •Modularity •Extensibility & Maintainability •Reusable Components Benefits of Angularjs
- 8. What Browsers DoesAngularJS Support? Angular claims to support “Class A Browsers.” As of Angular 1.2, the Angular team considers the following browsers “Class A”: ● Chrome ● Firefox ● Safari ● iOS ● Android ● IE8+.
- 9.
- 11.
- 12. In Angularjs SPAapplication is created with the help of one of the most happening features of Angularjs i.e. Routing
- 13. ● Modules ● Directives ●Templates ● Scope ● Expressions ● DataBinding ● MVC (Model, View & Controller) ● Validations ● Filters ● Services ● Routing ● Dependency Injection Features
- 14. What is amodule? A container for code for the different parts of your applications. Your module goes here ng-app=’yourModuleName’ Module
- 15. What is acontroller? AngularJS applications are controlled by controllers. Controller does not directly communicate to views but with the help of scope as like model in ASP.Net MVC. ng- controller=’yourControllerName’ ControllerController
- 16. A quick note $rootscopeis the parent scope for all the scopes of several controller Behaves like models in MVC but models are two-way Scope
- 17. one way bindingis done with the help of inbuilt directive i.e. Ng-bind for once and {{}} / interpolation / expression Binding
- 18. Two way bindingis done with the help of an inbuilt directive i.e. ng-model Binding
- 19. As we saycontrols in ASP.net or Partial views in MVC Directive
- 20. What are expressionsor code blocks in ASP.Net or MVC?
- 21. ASP.NET MVC Code blocks inMicrosoft technologies
- 22. {{ variable }} Willget evaluated to its value . Expression in Angularjs
- 23. Good luck! Keep learning. Thankyou everyone !!
- 24. In next session Wewill decide :)