Closed. This question is opinion-based. It is not currently accepting answers.
Want to improve this question? Update the question so it can be answered with facts and citations by editing this post.
Closed 7 years ago.
Improve this question
I just starting to learn AngularJS (Version 1.5.0) with Material Design for Angular - damn looks so freaking sweet :)
For building and deployment i use Gulp to automate my tasks.
So far so good, but while googling my way to more questions i found Frameworks like MEAN Stack, Meteor, lumX, Ionic and many many more.
Im wondering if its better to start with one of the Frameworks or if Gulp + AngularJS + Material Design for Angular is just fine.
Before i played a bit with Foundation for Apps which looks sweet too but i really like the look and feel from Material Design. Before i used Zurb Foundation for my Responsive Webdesign Projects but consider to jump to Material Design (which is based on FlexBox) even i miss support for some older browsers.
So im bit confused if im wasting time to learn Angular Version 1 now and better straight jump to Angular2 beta. My concern is that i may run in a lack of documentation and help. Also i have to learn more about ES6 (which is necessary in the next time anyway but makes it more hard to start). I guess lot of the stuff i will learn from Angular v1 i can later on use in Angular v2 anyway, or?
Another question for me as a Freelance Web Developer is if its not better to stick with Angular v1 for a while and learn more about it and later jump to Angular v2 when its out of beta. Because the goal is later to get into some projects and i can imagine that the companies stick with v1 for a while till v2 gets more stable.
For some starting projects i wanted to create a few Templates and Apps for my Wordpress Sites based on Angular with Material Design on a LAMP Enviroment. My Webspace sadly doesn't provide NOSQL databases yet so i guess i will keep coding on PHP / MySQL for a bit.
So in short, if you guys where in my place (experienced in Web Development but new to Angular) where would you start right now?
What Frameworks, Extensions and Tools do you recommend for Application Development with Angular?
From a business point of view when do you think will Angular2 be widely be used on live projects and is it better to start learning Angular v1 or go to v2?
Thanks for your replies.
Cheers bin2hex
Instead of giving a biased opinion, I'll just provide for you a few links of project structures that are being used currently that might serve you some guidance.
https://github.com/TheLarkInn/angular-starter-es6-webpack (This one is Shamelessly authored by me).
https://github.com/AngularClass/angular2-webpack-starter
https://github.com/AngularClass/NG6-starter (I took some pieces from this repo to create mine).
I'd recommend looking into writing Angular in the 'Component Style' (like the above links). It is a new way to start out using Angular 1/2 for the future and at the least you can use these repositories as thought-provoking brain-food for your own standards.
There are also other bundling platforms such as Browserify and JPSM, however Webpack provides a lot of awesome out of the box functionality that makes Angular development really awesome.
I don't know much about AngularJS V2, but I made some AngularJS V1 projects last year. Here tools I use to make my AngularsJS V1 projects:
As project generator:
Yeoman
As depedency manager (included in Yeoman angular generators):
Bower
As task runner (included in Yeoman angular generators):
Grunt
Set of prebuilt UI components based on AngularJS directives:
Angular Material
Angular Strap
Angular UI
Actually in my opinion is better use AngularJS V1 for production purpose.
The most important thing is something you haven't considered. All that matters is that you get your html/css/javascript to the browser. Everything in-between is trivial and leg work.
Now that Angular belongs to google, they have started very rapid development to support developers of all sorts. Either way it's going to be very stable, and if you keep your code modulare and clean, it's easy to transfer. I would say just make something, make what you need, and keep working on it over time and as the framework evolves, and change your code to match. If you keep waiting for the next big thing nothing will get done, so it's better to choose a framework and stick to it.
I word my answer like this because your question is very subjective, and you should experiment and find an answer based on your needs. As a web developer, you have to learn many different languages anyway, so start with where you think is best, and grow as you figure out what you need.
Related
I'm a project manager of a market place and I'm trying to find solution for my concerns. For two years a ago we decided to develop market place.
In front layer we decide to use angularjs and our team professional implement front layer using AngularJS. We add dependency injection for first time to angularjs 1.3 and solve google analytic crawling in SPA website.
But when google announce On July 1, 2018 AngularJS entered a 3 year Long Term Support period. As a project manager I have a big concern because We living in 2019 and after two years whats happen for our website ?
But my biggest question is how optimistic how long can we use Angularjs?
how much migration is necessary for this framework and
Is it possible that the sites written with Angularjs are not able to work after 2021?
Google announced:
All AngularJS applications that work now, will continue to work in the future. All published versions of AngularJS, on npm, bower, CDNs, etc will continue to be available.
For more information, see
Angular Blog - Stable AngularJS and Long Term Support
AngularJS Version Support Status
It’s out of date now, and new projects should absolutely not be built using it. This isn’t to say it was ever a particularly great choice. AngularJS came out of nowhere and became popular by default, rather than because it had particularly great design. It has a difficulty curve better suited to a great roller coaster than a decent framework, and a bunch of weird architectural and terminology choices. What the hell is a $scope, anyway? And what is a directive? What does transclusion actually mean? Meaningless terms that AngularJS has created. AngularJS does some things that are fundamentally wrong, such as creating invalid attributes on HTML markup. Even Google doesn’t use Angular for their own apps, like Gmail, and there’s a reason for that.
In fairness, AngularJS was always a poor choice. Its idiosyncratic code means that unlike other frameworks, it’s not good at implementing an agnostic, javascript solution. AngularJS code looks unfamiliar to anyone not super experienced with the weird intricacies of AngularJS itself.
Thankfully, this decision is well made for you – AngularJS is now quite thoroughly dead, and only legacy projects will continue to be using it. We should be grateful for what AngularJS has given us, and respect the position it held, but we should be just as pleased that it’s gone.1
The change is only about "support" and it means, no more bug fixes and no more improvements. Other than that, everything will be the same. Although, you should consider some disaster scenarios after LTS.
I saw some posts about running AngularJS and Angular side by side and I think it can be a good solution for your problem. Since you have enough time to migrate, your team can develop new features on Angular and you can also maintain your current AngularJS. Eventually you can get rid of AngularJS depending on your project size and development capacity.
Please check these scenarios.
Running AngularJS 1.6 in Angular 5 (side by side)
Running Angular and AngularJS frameworks side by side
For Angularjs support, you can find the previous discussion on this portal: angularjs 1.x support lifecycle and end-of-life
And the question regarding migration, in my personal opinion migration is a better option as the latest Angular version provides Boost in performance, Mobile-driven approach, code Maintainability & optimization, and most importantly Reduced development time and costs with better support.
And if asked about the migration approach, I would suggest a complete re-write that can be the most cost-effective strategy. If you’re a manager, put your team through Angular training (live, online, videos, books). Allocate time and budget for getting your developers up to speed with Angular as the learning curve is steep and prior experience with AngularJS is not overly helpful. Then your developers will write the new version of the app as per best practices recommended for Angular/TypeScript projects.
And finally, it’ll definitely pay off in the end. And, secondly, the newer versions of Angular won’t let you systems become outdated or irrelevant.
There is a team called XLTS.dev who are providing extended support for AngularJS beyond December 2021.
We have used Angular JS extensively in our company for enterprise projects, mobile applications and continue to use it. Google's decision to stop development of AngularJS and put it on a EOL will definitely make developers to panic. But 3 years to migrate away from it is a long time and you can plan accordingly.
If your plan is to migrate to Angular, then you can follow their official guide to upgrade using ngUpgrade. You can find numerous articles online that explain how they upgraded existing AngularJS apps to Angular.
If your plan is to consider migrating to a totally new framework, then this will involve some work. You should take a look Web Components spec. Your existing directives/components can be re-written, with less effort, as web components (shadow DOM) or custom components (without shadow DOM). There are libraries that help you write these generic components - supported on most browsers today - Stencil JS, lit element and a few others.
The advantage of using Stencil JS is that it provides tools to compile your web components to target different frameworks (Angular, React, Vue, Ember).
The latter solution seems feasible as it allows you to migrate directives one by one over a period of time, without having to re-write the whole application in one go. In the future you can also re-use your components in the framework of your choice.
As for your question about will it continue to work after 2021 - yes it will continue to work. The problems you might face might not really be of technical nature, but related to hiring resources to work on it or maintain it.
I am AngularJS developer and I do continue to use this framework for some of my projects. I am aware that in not too distant future this library will be completely outdated (as some of you can say it's the case now), however:
AngularJS ecosystem gives you still lots of choice/support (as framework is very mature)
my main libraries as ag-grid, highChart or others, help to build great apps out of the box with little time
I still do enjoy to work with this framework for it's simplicity and flexibility
If you should build brand new app I would recommend React or Vue (or other framework) especially if you do not have significant experience with Angularjs. However if Angularjs is not new for you, you need to go fast - just use your experience and go for Angular.
Taking into account what you wrote:
My main concern is after 3 years of support. Whether after the 3 year end of support, Angularjs sites can continue to work without problems
Angularjs apps won't just stop to work like that, from one day to another.
As your project requires long-term maintenance, needs to be built from scratch and will take lots of effort - Angularjs ecosystem is then probably not the best choice for you (I do insist "for you").
Closed. This question is opinion-based. It is not currently accepting answers.
Want to improve this question? Update the question so it can be answered with facts and citations by editing this post.
Closed 4 years ago.
Improve this question
I need to learn Angular for working on a project.
I am a backend Java/Spring developer
I have knowledge of HTML and Javascript. I have also worked on basic Knockout.js.
What are the prerequisite for learning Angular ?
Moderate knowledge of HTML, CSS, and JavaScript.
Basic Model-View-Controller (MVC) concepts.
The Document Object Model (DOM).
JavaScript functions, events, and error handling.
HTML : Most of the templates we create in angularJS is in the form of handcrafted htmls. i.e. So you must know that what are forms in html and what are tags ng-form etc.
CSS : While hand crafting template you should require css to make more attractive UI design.
DOM : Document object model and how document is created. If you have good jquery background you can easily pick up this part.
Object Oriented JavaScript: Global name space: AngularJS heavily uses javascript name space. i.e.
Object Oriented JavaScript: Inheritance: Inheritance is very important concept in JavaScript. Inheritance is heavily used in all the frameworks in JavaScript. i.e.
var Employee = function(fname) {
this.fname =fname;
console.log("Your first name is "+fname);
}
var fistEmployee = new Employee("John");
var secondEmployee = new Employee("Jim");
fistEmployee.prototype.lastname = function(lname) {
this.lname=lname;
console.log("Your last name is "+lname);
}
So using prototype you can easily add properties on the fly.
Model View Whatever(MVW): This term is used heavily by all AngularJS developers. It is coined by Google. It is simple MVC concept.
Separation of Concern(SOC): SOC concept is heavily used in AngularJS. In angularJS all the controllers, directive, services and factories are made for SOC. It provide more lean and cleaner code. Also re usability automatically increases if you use SOC concept.
Promises : Promises are nothing but callbacks. When you call any AngularJS service it will be called asynchronously. When response is send from service callback hold the response and do the needful.
Test Driven Development : Best thing about AngularJS is you can easily write test script so that when you go home, you can easily have sound sleep.
You see this 1 hour Angular 7 tutorial video which explains everything what you need to start with Angular. If you can watch you will have a better understanding of things.
So in all you need five important pre-requisites for Angular :-
You need to know JavaScript in depth.You should have crystal clear concepts on Javascript closures , Javascript IIFE , prototyping and so on.
A good understanding of NodeJs is must and especially how to use NPM ( Node package manager).
You need to know typescript.
A good understanding of module loaders , binders , commonjs , AMD , UMD , ES5 and so on.
This point is not compulsory its optional. If you know VS code you can learn lot of internals of Angular. As every developer has his own favorite IDE and Editor this step is optional. I would still suggest do your first couple of practicals using VS code and then proceed with your favorite IDE.
Below is the road-map of the pre-requisites and how to learn Angular. You can start learning Angular pre-requisites from this Learn Angular Step by Step article which covers around 11 labs in depth.
And yes if you are preparing for Angular interview jobs you can check video 50 Angular Interview Questions with Answers.
The most prerequisite for learning latest Angularjs (version 5.x right now - https://angular.io/tutorial) is:
TYPESCRIPT AND SOME OOPS LIKE INHERITENCE!
Everyone knows that the basics of HTML/CSS/JS is the prerequisite of everything in web development.
Today, Many people are diving into learning angularjs without knowing or just a bit about typescript. This will make learning angular a hell of a trouble, so i thought to put my 2 cents here.
Also the top most selected answer does not emphasize on the importance of learning Typescript, it's weird.
Typescript is not known to many beginners in web development. Even it's declaration is confusing if you do not study it first.
So please start from here if you wanna learn AngularJS:
https://www.typescriptlang.org/docs/handbook/2/everyday-types.html
I think you should know about patterns of desing like MVC on angular. that's the common.
And how to use properly some parts of angular, i'll share you a guide that i've found of good practics coding in angular.
Hope this help you to start coding on Angular
Angular Style Guide
I am trying to get better at coding and am trying to figure out exactly what front end stack I need. I have red a lot and about a lot of tools but it is too much and I don't know which ones work good together or not.
Currently my idea is to do a web app with the design principles of Material Design from google and use angular for the logic of the front end.
I have red about and used these tools: Angular.js, Material Design Lite, Angular-material, polymer, ionic, bootstrap, Materialize and other various material design frameworks.
I am playing with this demo that I wanted to try out Material Design Lite but went too further and ended up needing Polymer for some input drop-down components. Playing further more with MDL I found out that it is not sufficient as bootstrap as I am used to work and would like to have this in it, but don't get me wrong I like MDL.
ionic has some good features for the local server and easy set up of template app as well other nice things like export to ios,android app, push notifications, but I ended up deleting ionic.css cause it was interfering with MDL and Polymer
I am asking some more experienced web app developers to help me out with this stack dilemma. I would like to get this out of my mind so I can be free and develop more.
Also tools like GRUNT, BOWER and so on? which one is the best in my case?
note: if u got interested the back end would be cakePhP and Mysql and the data type is going to be JSON (angular will send json to php into DB).
It can be overwhelming trying to learn all the tools and using them at the same time. My advice is to just use the tools when you need to.
If your web app is simple you may not even need a framework like angular. If you want to play with material design, you can do that with the css classes that MD lite offers no matter if you use angular / polymer / or plain javascript. ( If you want to use Polymer you already have some material design styles included. )
Some people prefer starting with the most simple solution and keep adding more sophisticated tools gradually. Others prefer starting with a more complex solution that has integrated the best practices, and in that case using a "Starter kit" may be useful.
Regarding Grunt/gulp... etc. You could worry about that later when you need to have a "build system" to do tasks like compressing files, optimising images and other things that are important for publishing.
After years doing frontend development i realised that is not possible to master all the tools available ( and having a life outside code ). You eventually settle for some tools (everybody have different preferences) and the important experience comes with solving real problems.
i would recommend you to use angular-material for your project if :
you have good knowledge of angularjs or if you find it interesting to learn
you have gone through google design and you want to implement it in angularjs way
try implementing missing features or take online help
Angular-material team is working on adding more and more features as already build in directives and services. Check releases on github page & demo guide
( Drop downs are already there in latest version as menu)
Few points
Google has an awesome open source guide for design.
Angular-material is a framework that helps you implement and follow that design language and principles using angularjs.
Bootstrap is just a framework which gives implementation of css, js related to front end work. Look and feel will be entirely different from google design.
Ionic is again a completely different framework which provides implementation and guide for mobile app development.
You can read about diff in angular-material/bootstrap/ionic in my post here
Bower/Grunt
bower ( package manager) and grunt ( task runner) are tools which work in node environment.
if your development environment is nodejs you should use them to get work done quickly and efficiently.
Check there sites for more information.
cakePhp/mySql
If your backend runs on these and you have angularjs in frontend.
Angularjs can make restfull calls in JSON to your api and it would all work good.
Closed. This question is opinion-based. It is not currently accepting answers.
Want to improve this question? Update the question so it can be answered with facts and citations by editing this post.
Closed 7 years ago.
Improve this question
I really want to use Ionic Material Design into my app. I am currently using Ionic Material: http://ionicmaterial.com/
It is really easy to use and it work great sometime but not the others. It is little bit buggy on the actual devices and it is NOT PRODUCTION ready (and I am using it on a production app...)
I heard someone has success with Ionic Material - http://materializecss.com/
But is this play well with Ionic? I heard it need jQuery. Does jQuery play well with Ionic? (never combine these 2 together...since jQuery is evil and why we use Ioinc + AngularJS the first place...correct me if I am wrong of this opinion...)
And there is other option out there. And I heard a lots of painful stories Angular Material with Ionic...anyone agree?
I just want to find the best framework before I dive myself into modification. I will start a poll if I can!
I haven't used the Ionic Material tool much, but agree it is primarily a fun dev tool and not ready for production (not that it might be eventually, but its certainly not as field tested as Ionic itself).
Can Ionic and jQuery work together? Sure. Its really can Angular and jQuery work together, since Ionic leverages Angular. Its common to use jQuery with Angular (Angular itself uses a subset of jQuery already, and will use the entire jQuery version if it is found on the page.) jQuery is not evil, the prolific use of jQuery for simple things that can be done without jQuery is what people often refer to as 'evil'. Think of it like loading jQuery just to use it for 5 lines of JavaScript that could have been written without jQuery to begin with.
You can also look at Angular Material (https://material.angularjs.org) for a Google backed project that was actually built with help from the Ionic team. However, it is not Ionic and not finished either. I use it in my projects though haven't used it much on mobile yet (it is designed to meet Material Design spec, which is designed for all platforms).
Lastly, you could just use Ionic. There are some customizations you can make, and I don't know what your vision is exactly, but I think it is the most robust option for hybrid apps today.
I'm using materializecss without any problems. jQuery is mandatory but I did not have any problems with it. I also tried muicss but I had some issues on the iPhone 6 with the button animation.
Closed. This question does not meet Stack Overflow guidelines. It is not currently accepting answers.
We don’t allow questions seeking recommendations for books, tools, software libraries, and more. You can edit the question so it can be answered with facts and citations.
Closed 8 years ago.
Improve this question
I am trying to finalize a tool for testing an AngularJS based web portal.
I have explored Protractor and was quite sure of using it for AngularJS tests until someone from the team came up with a suggestion of using Robot Framework.
So, Now I need to compare Protractor with Robot Framework.
Protractor has an advantage of having customizations available for AngularJS. However, I would agree that the learning curve is not too smooth because of the terminology and concepts (Promises and Control Flow) used.
Now I need to understand how good is Robot Framework for AngularJS testing. Is there anything one would miss regarding Protractor if switched to Robot Framework? Please provide your valuable inputs for the same.
Learning curve
IDEs available
Ease of automating AngularJS UI tests
Any other relevant points you feel are important!
Being in the middle of exactly such debate right now, I can tell you a few things:
AngularJS has a "loading" issue. Protractor solves that issue by giving you the function WaitForAngularToFinish. You get other things as well from Protractor such as ByRepeatNG
Automating UI by Robot Framework is done using Selenium 2, and the robot library doesn't contain Angular Specific code (WaitForAngularToFinish)
For now we're trying the Robot Framework way
We've solved the issue in Robot by tapping into the Java Library ngWebDriver
We've created a new robot library based on ngWebDriver with autowiring (to get the Selenium2 driver from the robot library) that gives the same functionality as Protractor.
Pros to going the robot way:
Robot Framwork gives you the ability to do everything, Not just UI. So you can prepare the test environment exactly like you want it (much harder to do in Protractor)
English. The ability to let non-coders write tests (We're using Gherkin notation).
Stability (everything about NPM for example, is inherently unstable)
Cons to going the robot way:
Harder for the Javascript people to write underlying code for the tests (since some of the underlying code will be in Java)
Simplicity
Regarding you other questions:
Learning Curve - easy on both Robot and Protractor
IDEs available - I'm using a plugin for IntelliJ for Robot Framework. The enterprise version of IntelliJ (which costs a lot of money) works quite well with Protractor as an IDE.
Ease of automating AngularJS UI tests - Once you have Angular keywords in Robot, you're good. Before that, very hard.
Robot Framework is quite lightweight and learning curve is quite fast from what I could see in the different places I used it. In terms of IDEs, there are plugin for most of them (I would not recommend using RIDE if you already have a favorite IDE).
To answer question 3) and 4) I would say that it all depends on your organisation and culture. If the end-2-end tests are going to be written by the Web App Angular developer, then probably better sticking with Protractor as this is all in the JavaScript ecosystem. But if you have a separate team of QA who is in charge of testing, they might indeed find some of the protractor/javascript to be complex/heavyweight for what they have to do. With QA that are a bit less hard-core-coder than developers, I find that Python is more appropriate and easy. And in that case, Robot Framework is a very good choice.