Angular 2 Type Script - angularjs

I went over some Angular 2 tutorials and they are all using TypeScript to generate their Angular code. But people around me are using plain JavaScript to code Angular 1. So why do we need another language to generate Angular code for us, and is TypeScript the only language that Angular 2 currently supports?

You really shouldn't learn Angular 1 and 2 at the same time.
If you want or need to take care of existing projects in Angular 1, try to get a grip on its principles first and postpone learning Angular 2.
If, however, you'll be moving to Angular 2 in the foreseeable future, go ahead and skip Angular 1 alltogether. Angular 2 is a complete redevelopment and ditches a lot of concepts that are still in use in Angular 1.
Concerning the language, you can develop Angular 2 in plain JavaScript, Dart, or in TypeScript. This (closed) question goes into some detail on the Pros and Cons of each of these languages.

Related

Using Vue and AngularJS Together

Can we use AngularJS with Vue? As Vue is more like a library than a framework so what are pros and cons of using them together?
Yes you can use Angular with Vue. However, there isn't any reason to use both Vue and Angular 1 in same web app and certainly not in the same page.
As AfikDeri pointed out you probably won't notice any functionality differences.
You're correct in pointing out that Vue is more like a library but Angular 1 can also be used as a library so the decision is largely which one you're more comfortable with or see as more valuable long term. The comparison between Vue and Angular becomes more pronounced when you consider Angular version 2 (which is much harder to use as a library).

How to easily switch to angular 2

So I learn angularJs not long ago, and I'm just getting started to get comfortable with it. But angular 2 is on the way and I have 2 major question:
1) Should I stop learning and working with angular 1 and start learning angular 2 instead?
I know a little about angular 2 and I know almost every thing has changed. So
2) What I know from angular 1 is any good in learning angular 2? Or should I learn angular 2 like it's a whole new framework? Is there any good way or guide to switch from angular 1 to 2?
Thanks in advance for your answers.
I learn angularJs not long ago
Then, this is the perfect time to start learning Angular 2, too. Starting a new language version while you have not already spend a lot of time on another one is a good choice in my opinion. However since Angular 2 is still in RC you should not completely leave learning Angular 1.x and start with Angular 2.
1) Should I stop learning and working with angular 1 and start
learning angular 2 instead?
No, even though the future of Angular framework seems to be Angular 2, this version is still in RC and building large apps using it would be a high risk.Angular 1.x compared to Angular 2 is more stable on this aspect. Angular 2 is constantly evolving, every few weeks there are totally new concepts included.
You should not stop learning Angular 1.x but, you should start learning Angular 2, too.
2) What I know from angular 1 is any good in learning angular 2?
Although there are a lot of changes like between these versions they still have similarities.For instance, in Angular 2 the concept of controllers does not exist, but they use Components. ng-if and ng-for directives from Angular 1.x look like *ngIf and *ngFor in Angular 2. The best resource to compare the two versions is their official website which you can find here here.
Is there any good way or guide to switch from angular 1 to 2?
Although you can still find very useful information about upgrading from Angular 1.x to Angular 2 on their official website
I would suggest that you treat Angular 2 as a completely new framework and start it from zero.Also the knowledge you already have about Angular 1.x will be helpful since there are concepts that have not changed that much. There are plenty of tutorials available online for free that you could use.
My favorite YouTube playlists are:
Angular 2 Start
Angular 2 Basics Course
Build Angular 2 Weather App
Well , This is the major question for all angular2 beginners who knows angular1 ... ,
Just imagine you don't know angularjs1 then Definitely you are more comfortable with angular2 ... The thing is Angular is the future that is the unwritten truth ... Definitely Angular1 is not going to die ...but It may be loose from the competition ... You have to consider following things to choose angular2 ...
Type Script (Great Coding Structure)
Componets (Great Library Support )
Rich Third party library Support
Creator the Giant (Google )
Finally You have to go with the future ... (Angular2)

Prerequisite for learning Angular [closed]

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

Using angular 1 module in angular 2 app [duplicate]

Can I use Angular libraries, for example angular-cookies in Angular 2 app?
Seems that this is not possible, but I want to know this cause I'm planning to upgrade project to Angular2
In general, no. If you're interested in following the migration guide by running Angular 1 and 2 simultaneously, you may be able to get an Angular 1 library functioning, but it's likely not worth your trouble.
I'd encourage you not to be scared of rewriting common libraries for yourself. You'll be surprised by how easy it is - in many instances you'd spend more time trying to figure out a library's documentation, and you gain an intimate understanding of the code.

Replacing angular with standard web technologies

I'm working on a project which has the luxury of using ECMA 6 on the latest browsers for a product that will be shipped in 1.5 years. So we thought why not use Web Components now that Angular 2 isn't available (which is going to be ECMA 6). And while we are at it, can we replace Angular altogether without having to go back to stone age?
How to replace Angular?
There's this site called youmightnotneedjquery.com which is basically about how modern browsers actually have most of the stuff that jQuery was traditionally used for. I'm interested to see something like that for Angular.
We mainly use four Angular features. What are my options for replacing them?
Angular Directives --> Web Components
Angular Modules --> ECMA 6 Modules (not exactly the same thing)
Angular Routes --> ???
Angular 2-way databinding --> ???
PS. We don't want to replace Angular with something similar like Backbone or Ember. We want to replace it with standard web technologies but if we have to use small tools to fill the gap, we'll consider it.
I've been researching in the past 3 weeks and turns out many people are thinking about an alternative after Angular took a drastic change path. Fortunately the upcomming W3C Web Components standard actually has all we need and it works right now with polyfills from the Polymer project. So to answer the question:
Angular Directives --> Web Components use the polyfill until all browsers support it.
Angular Modules --> ECMA 6 Modules part of the problem is solved with HTML imports. But you can also use Traceur until the browsers support it.
Angular Routes --> There's a component for that™ use <app-router>.
Angular 2-way databinding --> Polymer adds a "magic" layer on top of the plain standard web components. This includes many features including data-binding.
+Plus More
If you're wondering about the build process for concatenating files in order to reduce the number of HTTP requests, take a look at Addy Osmani's post about Vulcanize. Spoiler: you may not need it with the upcoming HTTP 2 optimizations.
Many Angular projects use Twitter Bootstrap for the layout. Polymer can do that plus it plays nicely with Google's Paper elements (totally optional but superbly awesome).
If you want to make yourself familiar with web components in general, here is a bunch of nice articles: http://webcomponents.org/articles/
And here is a wealth of web components: http://customelements.io/ I don't know if it's going to be a new NPM, but the list components is pretty impressive and growing.
It's relatively complicated to expose an API for an Angular component. People have come up with all sorts of methods from link function to emitting events. In Web Components, however, it's really easy to make your component interact with the world outside and indeed the API and events you expose aren't much different from standard HTML tags like <audio>.
Just like Angular, you can use Polymer with Dart as well.
Conclusion
Overall, I don't see any reason to use Angular except if:
You have a huge source code investment in angular and don't want to port everything to standard web. (Angular 2.0 will deprecate your code anyway, so you're stuck with Angular 1.*)
Your team is too lazy to learn a new technology (in that case web might not be the right platform for this attitude anyway).
Angular was good for what it was doing and had its own Hype cycle. Web components solve many of the issues Angular was trying to address. Probably Angular had a role as a proof of concept for the Web components. But now it's time to move on. Web is reinventing itself everyday and it's inevitable to moves someone's cheese.
I'm not saying that Polymer is the ultimate answer to everything. At best it's another Angular which will render useless in a couple of years, but now it's a good time to learn and use it. The W3C standards don't die easily though, and Polymer tends to be much closer to them.
There's an element for that™ is the new There's an app for that™
TLDR: seriously consider writing an almost Angular 2.0-compatable Angular 1.3 app before rolling your own framework
It seems as if you've identified that Angular does a lot of things the right way and that's why you're attempting to replicate it, so basically you're going to roll your own by combining a hodgepodge of libraries. Unless you have an enormous investment of Engineering hours, the framework you build will likely be:
Lightly documented
A cross-browser maintenance nightmare and (worst of all)
Difficult for new hires to learn
If there wasn't a framework out there that did what you want to do already, I think rolling your own makes sense, but by trying to recreate Angular you're:
Taking on a lot of Engineering work that has already been done by a dedicated team, that could have been spent on building product
Made it MUCH more difficult to onboard new employees because you have to:
Find candidates that are willing to use a home-grown framework instead of growing their skills at an open source framework they could use elsewhere
Train these employees to use your framework (and good luck unless your documentation is mature)
I know your question asks how to replace Angular, but I've seen too many companies go the route of rolling their own and paying for it down the road. Again, if your budget includes a ton of core resources to build out (and document, and maintain) the framework and you don't think there is any chance corners will get cut when push comes to shove later if timelines get tight, then rolling your own might make sense. However, I think you should seriously consider reading up on how to write Angular 1.3 apps so that they're easy to port to Angular 2.0 and go the Angular route. Just look at the size of the community you're missing out on:
http://www.airpair.com/js/javascript-framework-comparison

Resources