Thanks for joining me in part 2. Now in this edition there will be very little code. Okay, there won’t be any code. I have to introduce some concepts first. I know, I know, but this is the stuff I was looking for when I started digging into Angular and I could not find it. Hopefully, armed with some context you will be more productive as we progress.
AngularJS for jQuery Developers – Part 2
In part one, we learned that AngularJS handles updating the DOM very differently than jQuery. jQuery< is a great tool for manipulation HTML documents. Angular does that manipulation for you by letting you “direct” how the HTML should change when a data model changes.
Angular is much different in jQuery in another respect, however.
js folder, the CSS in the
css folder, images in the
img folder and go to work. That was it. Testing meant, “Does this look good in my browser?”
The AngularJS community has a very different approach to web application development. In short, they are extremely passionate about application development. That means they want you to learn many, many new things.
Here’s a short list of the tools that sprang out of the AngularJS box at me, BEFORE I found one shred of documentation or tutorials on how to handle forms:
- jshint (you want to actually jump to the jshint-docs)
- Twitter Bootstrap
All of these tools fall into ONE big idea. If you are going to make web applications, you need a process. It’s not enough to just throw some files in directories and start hacking. The AngularJS community wants you to know that if you plan to build a web application, then you need to understand how applications are built.
Most of the web development tools I have used, whether it was Dreamweaver, or the excellent Coda 2, or Komodo IDE have virtually no concept of a build process. Or to put it more accurately, they do not require that you have a build process.
So how does that effect you the jQuery developer? You have to understand…
Angular Loves Test.
You might also want to incorporate tools that help you keep your code clean and bug free like lint, or give added functionality like LESS and SASS, but at the expense of requiring you to compile files first before you include them in your html.
All this means you will start to get comfortable with some software you never knew you needed.
– The software you did not know you needed,
– Did not ask for,
– And don’t know how to use.
Node.JS is also a piece of software you can’t live without. If you want to build AngularJS applications, you will want to know about node.js.
But I thought this was a tutorial about AngularJS!?
It is. However, we have to back up for a second and wrap our heads around the idea that part of the “angular” way is to test code as we write it. And that is exactly what we are going to do.
I am now going to show you how to write an AngularJS controller, and then test it. In order to do that, I plan to share with you what I had to do. I stopped and learn each piece along the way.
The biggest challenge I found with AngularJs is that most angular developers assume you already know about Node.js and karma and Jasmine, all these other tools. The trouble is that I never needed any of these other tools when I used jQuery.
Now I need them.