12 ms·
How do I “think in AngularJS” if I have a jQuery background?
- junto 13y agoThe first answer is really so well written it was worth yet another upvote.
- TheHippo 13y agoThe first answer should be part of the official documentation.
- JeremyMorgan 13y agoIt's answers like these that make SO an invaluable resource. They should award bonus points for stuff like that.
- neon_electro 13y agoLooks like there's a bounty in place, so the best answer will get some bonus points :)
- danso 13y agoA couple months ago I created an Angular app just to try it out for myself (only NYCers will find it useful: http://summerstagelove.com http://summerstagelove.com) and it was the first Javascript-using website, since having learned jQuery 5+ years ago, that I've made that doesn't include jQuery...I tried for awhile to get jquery.isotope.js to work but didn't know enough about the order of callbacks and such in directives, so just left it out entirely. I've developed enough Rails apps to think architecture-first...but thinking back in my jQuery only days, the OP's question seems like it'd be a very common one among jQuery-only-front-end developers...and the top-answer is excellent: if you don't include jQuery, then you're forced to think about the architecture, and you'll be better off for it as a developer.
- adamnemecek 13y agoNot to nitpick but by including angular you are including jqlite which is a subset of jquery. But yeah, your point still stands.
- joshuacc 13y agoBut it is a very, very small subset. :-)
- wasd 13y agoThis looks great. Thanks!
- ibejoeb 13y agoIsotope is a jQuery plugin, so it stands to reason that you'll need it. Angular will use jQuery over jqlite as long as you include it first. I use isotope with angular and have written directives to support it. I haven't written it up, but If you're interested, I can share some of that with you.
- wes-k 13y agoI was lucky enough to read this when I first got started with angular. Huge help shifting your mindset to angular and seeing the advantages it provides. I'd also recommend http://egghead.io http://egghead.io for some in depth walk throughs.
- j_s 13y agoThis extensive list is still updated regularly: https://github.com/jmcunningham/AngularJS-Learning https://github.com/jmcunningham/AngularJS-Learning
- jacques_chester 13y agoI liked the egghead videos, but I don't think they really taught me the deeper conceptual Angular.
- rzendacott 13y agoI'm very glad to see that this answer hasn't been closed as not constructive! It seems like most popular questions like this are, even though they're incredibly useful and insightful. I was leaning toward learning Ember, but this post makes me really curious about Angular. In particular, the ease of testing has my interest piqued. Is testing as simple/easy with Ember? I know that unlike Angular, Ember doesn't have DI as a core feature. Either way, I should probably just flip a coin and start learning!
- Osiris 13y agoEmber includes a full test suite which is run on each pull request, so TDD is not unique to Angular. Personally, I found Angular's concepts a bit foreign and hard to grasp while Ember was much more straight-forward, but that's just a personal opinion.
- manojlds 13y agoHow is the framework having unit tests ( and please, don't say TDD, when you mean unit tests) say anything about how testable code written using the framework is?
- j_s 13y ago> I'm very glad to see that this answer hasn't been closed as not constructive! Don't jinx it!
- benatkin 13y agoI was disappointed that it hadn't been closed. The first answer is a backhanded dig at non-angular developers saying that angular is about architecture and implying that the others aren't. I like angular but "angular architect" rolls off the tongue too easily.
- jamesaguilar 13y agoYou're disappointed that a really informative answer has not been closed because of some subtext you've read into it that may or may not actually be there? That doesn't seem like a very productive attitude to me.
- joshavant 13y ago'How do I "think in X" if I have a Y background" seems like an incredible programming blog/book idea. I, for one, constantly find myself thinking along the same lines whenever I try out a new language.
- Jach 13y agoIndeed. Rich Hickey's 2-part presentation on "Clojure for Java Programmers" was a really slick presentation of a Lisp. (Focusing on the 'code is data' aspect from the beginning (at least once he starts talking about the language specifics themselves, he does spend a while motivating dynamic languages) rather than talking a lot about just higher order functions and macros and so on. He goes over the evaluation model and its difference from a Java/C++ model, he shows how to interop with Java... It's just a great talk.) Part 1: http://www.youtube.com/watch?v=P76Vbsk_3J0 http://www.youtube.com/watch?v=P76Vbsk_3J0 Part 2: http://www.youtube.com/watch?v=hb3rurFxrZ8 http://www.youtube.com/watch?v=hb3rurFxrZ8 Slides: http://www.slideshare.net/adorepump/clojure-an-introduction-for-java-programmers http://www.slideshare.net/adorepump/clojure-an-introduction-...
- tocomment 13y agoI'm curious if anyone could point me to a really simple application that shows how to use AngularJS and Firebase together? I'm thinking it makes sense to do my next project in those technologies since that way I can avoid setting up a hosting platform entirely and not even pay for hosting? Does that seem like a good idea? (It's going to be a way people can pay bitcoins to other people to read books)
- mwheeler 13y agoThere is this, if you haven't already seen it: https://www.firebase.com/blog/2013-03-29-firebase-bindings-for-angular.html https://www.firebase.com/blog/2013-03-29-firebase-bindings-f....
- tocomment 13y agoThat's perfect thanks! But I feel dumb asking this, where is the source code for their todo demo app? I want to get a feel for what a simple app looks like.
- anant 13y agoIt's up at https://github.com/firebase/angularFire/tree/gh-pages/examples/todomvc https://github.com/firebase/angularFire/tree/gh-pages/exampl...
- marknutter 13y agoI actually do exactly this for a site I'm building. I use Firebase and Angular together and I host the site for next to nothing using Amazon's S3 static hosting option (costs me like $2 a month). I wrote a more robust angular firebase module than angular-fire, the one the Firebase guys wrote, and I also created a tiny framework/script-runner similar to Yeoman that automates a bunch of stuff including deploying to S3. I'll message you when I make it all publicly available.
- tocomment 13y agoYes, let me know when it's available. I thought you could host your HTML file on firebase too? Why do you need S3?
- thangalin 13y agoHow well do screen readers for the blind and AngularJS play together? I thought that JavaScript-based frameworks are often not very compatible with screen reading technologies, but have not investigated what advances have been made for the blind in this area. http://stackoverflow.com/q/15318661/59087 http://stackoverflow.com/q/15318661/59087 http://juicystudio.com/article/making-ajax-work-with-screen-readers.php http://juicystudio.com/article/making-ajax-work-with-screen-...
- steveklabnik 13y agoThis post is about Ember, but in sure it's not much different: http://words.steveklabnik.com/emberjs-and-accessibility http://words.steveklabnik.com/emberjs-and-accessibility
- thangalin 13y agoThe http://vimeo.com/59124303 http://vimeo.com/59124303 link is illuminating, as is the WAI-ARIA specification from http://www.w3.org/TR/wai-aria/ http://www.w3.org/TR/wai-aria/.
- ceol 13y agoI was about to come back here and yell at you for making a post about accessibility unaccessible to the hard-of-hearing (and those of us who browse with SOs sleeping right next to us that we never, ever, ever want to wake.) Then I saw the transcript below the fold. Cool post, thanks!
- voltagex_ 13y agoThat's a fantastic post. VoiceOver seems to blow a few of the competitors away, too.
- joelhooks 13y agoWe've built a large AngularJS application and one of the requirements was screen reader usage and keyboard accessibility. It took some effort, but it works very well.
- gohrt 13y agoThis answer convinces me to prefer jQuery for apps that aren't Facebook or Gmail. It has an "architecture astronaut" feel (explicitly eschewing graceful degradation!), which most web pages don't need. I'd be interested in "controller" plugins for jQuery, so I can opt into upgrading from trigger->DOM to trigger->controller->DOM as my app grows.
- axelf 13y agoI consider Separation of Concerns, Dependency Injection, and TDD to be basic software engineering principles. Sure if you have a mostly static page with a few dynamic components jQuery will work fine, but with a larger project that you really need to consider a more maintainable architecture.
- mattmcknight 13y ago"Separating configuration from use" is the principle, and dependency injection is one of many patterns used to aim for that... http://www.martinfowler.com/articles/injection.html#SeparatingConfigurationFromUse http://www.martinfowler.com/articles/injection.html#Separati...
- smrtinsert 13y agoAbsolutely. Honestly it seems to fly really far with the node youngsters who want to code all night for some reason. What you're talking about is event delegation. It's a one liner practically, but shh, we're talking about "architecture" now.
- macspoofing 13y agoAngularJS is an MVVM framework. It's fairly new to JS and front end web development, but not that new for UI development in general (it's been around since 2005 in WPF and used in Silverlight and Flex applications, and possibly others). It isn't just 'event delegation'.
- macspoofing 13y agoIt shouldn't. AngularJS should work great in most situations, even for simpler pages. I'm a big fan of MVVM pattern as it lends itself to a hard separation between the nitty-gritty view details (e.g. effects, transitions, styles, etc.) and the rest of your business logic. Create your view, declare how it should behave based on view-model values and then hook it up to your core business logic that is now completely agnostic to your view details. jQuery, on the other hand, forces you down the path where your business logic needs to care about how the view should render the content, and those ugly view details are sprinkled all over the place.
- sluukkonen 13y agoThere is a simple todo app example on the angularjs homepage. It's one of the first examples there.
- VeejayRampay 13y agoMaybe it's because of my background with Backbone.js but Angular really doesn't feel right. Any way I look at it, it feels like HTML and JS is being miished mashed together all over again and I thought we were past this way of doing things.
- smrtinsert 13y agoThe web likes to retread old patterns. Shhh, the emperor has fine clothes indeed.
- joevandyk 13y agoJavascript isn't being put into the HTML. Angular expressions are. It's a big difference. IMO, it makes writing javascript-only applications (like all the internal tools for my company) much easier. It bugged me to look at a given view and not know what happened when something was clicked, or what the class name for an element needed to be to get the right behavior. Angular apps feel like writing a desktop app, which is great.
- dchuk 13y agoNeither way (Angular or Backbone) is "right" or "wrong"...just different ways to solve the same problems. Angular reduces the amount of boilerplate code you need to build nice applications immensely, but to get to that point (and beyond two way binding hello world demos) there's a nearly vertical learning curve. Once you near the top of that curve though, apps just kind of come together like magic. It's really neat.
- wwweston 13y agoMaybe it's because of my background in cartesian coordinate systems, but polar coordinate systems just don't feel right to me.
- guiomie 13y agoI've just started using angular.js lately. One of the best advice I read was not to use jquery with angular.js, and I couldnt agree more. My question now is, why would I ever want to use jquery and angular.js together? I can do everything I needed to do before in jquery with angular.js
- defen 13y agoOnly time I've used jQuery with angular.js is when I've needed to use a jQuery/jQuery UI plugin that I didn't feel like rewriting.
- jacques_chester 13y agoSo far I've spent several weeks of my spare time forensically decomposing the documentation, nearly line by line. It's been very slow going. The main thing I've learnt is that Angular is elaborate. Each time I get my head around something, I realise that my previous understanding was utterly wrong. The docs are sufficiently vague that I spend a lot of time looking for secondary sources or just reading the code directly. Sometimes the code is self-documenting. And sometimes it's neutron-star dense. But what I'm seeing, I really like. I think that directives are a big part of the magic -- building the HTML you wish existed and then writing your app in that domain-specific HTML.
- Chris2048 13y agoI tried to get into angular, but it seemed to hard beyond the tutorials. Aren't frameworks supposed to make things easier?
- jacques_chester 13y agoThey're meant to make particular kinds of complex application easier. I think Angular's problems is that docs are frankly dreadful. They tell people to fork it and improve it, but go look at their github pull requests. There are hundreds.
- durzagott 13y agoA fellow HN'er posted a collection of all the best tutorials and docs into one cohesive training programme. It's an excellent resource for those of us trying get our heads around Angular's woeful documentation: Website: http://www.thinkster.io/ http://www.thinkster.io/ HN Submission: https://news.ycombinator.com/item?id=6072383 https://news.ycombinator.com/item?id=6072383
- akadien 13y agoAngular.js makes me hate Javascript.
- isaacb 13y agoThe cool thing about Angular is that it introduces a pretty unique way of building applications. What people don't seem to get is that it isn't mutually exclusive with jQuery. You can use Angular and still pull in the full jQuery library for your directives. What you'll find, however, is that you don't really need much more than the jqLite library that ships with Angular. The "Angular Way" alleviates the need for the more involved DOM functions in jQuery.