Is AngularJS a "front-end" language that can be used for animations instead of JQuery?

I'm working with a design team to redesign my website, and my lead developer told me to tell them I wanted to use AngularJS instead of JQuery for my HTML pages since it is clean code and has the most modern libs; which they agreed to use.

I guess since AngularJS is newer than JQuery they don't have as much experience with it. In the project scope, we agreed that they would do just the "front-end" work (e.g. templated bootstrap, css/html and animations of the site) for the redesign, but they told me that someone from their team said that AngularJS is also "back-end" programming work too...is this accurate?

If they are creating my HTML pages will they have to do "back-end" programming work if they use AngularJS or will this be only "front-end" work? They say they have to use JQuery because this is all "front-end" work.

Also, they are telling me for specific animation effects such as fading in and out of elements etc. that they want to use jQuery and Bootstrap. They tell me that AngularJS is not the best solution for animations, but it's better for manipulating dynamic and real time information for the website...is this accurate?

It seems to me they are just trying to find ways to not use AngularJS and use JQuery instead which they are more comfortable with.

Let me prefix this by saying I had the exact same problem as you, and that I think I found probably the best solution.

First a little background. Animations in AngularJS are possible using one of it's modules called ngAnimate it works by adding CSS classes to your HTML elements, but you need to write the classes yourself and you'll be using CSS3 animations which are much better performance wise than JQuery animations, and only require pure CSS. This is what I used at first and it seemed to be working pretty well for me. However, what I found was that as I started doing more complex animations my CSS rules grew huge especially because you have to prefix most CSS with -webkit -moz -o and the like.

At this point I was ready to try alternatives, but I didn't want to go back to jQuery. What I found was GSAP. It's a stupidly powerful and convenient javascript library for animations, and I could integrate it perfectly into Angular using directives. For example I have this in one of my projects:

    .directive('highlight', function() {
        return {
            scope: {},
            restrict: 'A',
            link: function(scope, element) {

                element.on('mouseenter', function() {
                    TweenMax.to(element, 0.5, {
                        color: '#000',
                        borderColor: '#000',
                        backgroundColor: '#F2F2F2'
                    });
                });
                element.on('mouseleave', function() {
                    TweenMax.to(element, 0.5, {
                        color: '#BDBDBD',
                        borderColor: '#BDBDBD',
                        backgroundColor: '#FFF'
                    });
                });
            }
        };
    })

If I have a link in my HTML shaped like a button it was as simple as writing

<button highlight></button>

And I'd have a button with an animated border, text color, and background color. Moreover, it's reuseable. I don't have to write the highlight rules for every single button in my DOM. I just have to add the attribute highlight.

jQuery works, but it's animations suck. Angular is better, but it's verbose and I personally didn't enjoy implementing it. I lean towards GSAP because of how powerful and flexible it can be while also giving you the best performance in your animation.

As LoganRx said AngularJS is a client side javascript library. It does have a superb animation module that can be added for CSS animations. However if CSS animations don't cut it you are probably going to want to look at Javascript animations as well. This is where Jquery animations would come into play. There are many Javascript animation libraries out there however. Furthermore AngularJS and Jquery have two different purposes. From the example in your comment fade in and fade out animations are basic css animations that are included with the AngularJS animation module. So you could use it for that purpose.

AngularJS obviously has no dependency on JQuery and vice versa. AngularJS is great for model and view binding making ajax requests, routing, CSS animations and a whole lot more! In fact you can build an entire application with just AngularJS. Jquery however is a very general purpose javascript library that gives you utilities that are not available in AngularJS. In many cases you are going to use both libraries.

Yearofmoo who has contributed greatly to AngularJS has a great blog which includes a lot of animation examples for AngularJS. You can find his blog here: http://www.yearofmoo.com/

To address the issue of whether server side work will need to be done is actually quite tricky. It depends on how the application is rendering dynamic content right now. If the whole HTML document is just being generated by the server based on some dynamic information and there are no real restful data end points then yes you are probably going to have to do some server side work to create end points where you can retrieve the dynamic data to be consumed with AngularJS. However if the current application relies heavily on Ajax calls that return Json or XML objects (or if it was really well designed, and it uses serialization frameworks) then you probably won't have to do much server side changes if any at all.

First off AngularJS is a front-end JS framework and technically does not require any back-end programming. It can interact with a back-end very easily and efficiently but AngularJS by itself is not back-end programming.

In terms of the animations there are just as many ways to animate things in Angular as in jQuery. CSS Transitions, Transforms, and Animations will all work with Angular without jQuery it is just a different way of thinking. There is also an Angular Module called NgAnimate which allows for more directed animations for different interactions on the page.

So in conclusion, as an Angular Developer, I would be aware that everything that you are looking for is possible to accomplish with Angular and is not difficult unless they are unfamiliar with Angular. But the aspects of the application that they are claiming would be made easier with jQuery are extremely similar in syntax and execution in Angular. Also, Angular has jqLite built into it which allows for some basic jQuery functionality already.

Angular is not for animations. Angular is framework for developing applications for the web. So things like advanced user interfaces for example.

Doing animations in angular is just bad idea. You can, but they will be bad, although doing them in jQuery can be also bad if you don't use it properly(and by the way jQuery is also not for animations, but have few useful functions). jQuery is still update and it's industry standard. It was published few years ago for the first time, but new versions are coming regularly.

Don't get me wrong here Angular animations might be quite well done, however whole angular it's tones of tones of code, which only some bits have anything to do with animations

Angular is not back end framework. You can connect it easily with backend using for example mean.io but angular itself mostly still stays on front.

By the way, in my opinion angular is slow and don't embrace good practices. Also next version of angular will be not compatible with previous one so no update to most recent version in the future.