I am confused by the term Angular JS being a front end web development framework and (Spring MVC or Node Js) being a back end or simply web development framework.
My question is:
Can I built a full fledged web application which interacts with an application server like Tomcat and MySQL using just Angular JS?
If answer is "no" to 1(above), then my understanding is that I learn Angular JS for front end and (Spring Boot or Node JS) for back end. If that is the case what role does Angular JS play, which HTML, CSS and JavaScript already does not play?
If I use Angular JS, how does HTML, CSS and Javascript which were used traditionally fit in the picture?
I know there are lot of resources in the web but I am still not very clear.
Thank you in advance for your help!
No, you cannot build a full fledged web app in AngularJs. AngularJs is a JavaScript framework that runs in the browser (front end), not on the server (back end). Unless your application is very simple, your AngularJs application will interact with service(s) to get and set data.
Before even talking about AnglarJs' features, one aspect that a framework gives you is a pattern and guidelines that help with organising your code. If you start writing code without any framework, you have to invest more effort in thinking about how to structure your code. While you still have to do that with a framework, there are usually guidelines that are established by the community that will help you as the code base grows. Now, AngularJs is a Single Page Application (SPA) framework. That means that one of the features that AngularJs gives you is client-side (browser) routing. That allows you to only change the sections of the page that actually need to change instead of refreshing the whole page, resulting in a nicer user experience. AngularJs also gives you two-way data binding. Two-way data binding will automatically reflect JavaScript model changes in your DOM, and vise-versa. In vanilla JavaScript, if a values changes and you want to show that value in the DOM, then you need to write code that will actually apply that change in the DOM. With AngularJs' two-way data binding, that is taken care for you. AngularJs has many more features (dependency injection, components, directives, filters, etc.) that you can all find on the web, but hopefully the two examples I gave you give you an idea.
From my answer to question 2, you may realise now that you will still use HTML, CSS, and JavaScript. AngularJs is not a language, but a framework built on top of those languages.
By the way, at this stage I would not recommend building a new app with AngularJs. Use Angular instead. Angular is the successor of AngularJs.
Related
I want to make a lightening-fast web application and am wondering about the best way to implement it. It's a drawing app that will need support for vector graphics, but it will use a database to store data in user accounts. Here's how I'm breaking it down in MVC terminology:
Controller: Django, hosted on GCP Python app engine
Model: CloudSQL
View: AngularJS
I'm wondering if a Javascript/JQuery approach would be better, since I could have Django handle the database operations and am worried that I'll just be adding overhead with Angular.
I'd welcome any thoughts.
Once you use Javascript framework such as Angular.js and React.js. Your backend and frontend becomes totally isolated. First thing you should do it you gotta make your django REST API. Build your logics to do the vector graphic in your django REST API and build your angular.js app in away that it will "consume" your REST API services.
For the second question, it is depending on your architecture design. If your application is going to be DOM-driven, use jQuery since still jquery still provides lots of UI stuff. However, if it's going to be data-driven and you will use Javascript to organize and display the data in efficient way, choose Angular.js.
Please leave a comment if you have more questions. Thanks!
I've been working with ASP.NET MVC for about a year now. I enjoy the ability to create SPA's especially by using the following tools:
Partial views(via html.action() and renderPartial())
Ajax helpers (Ajax.Actionlink() and Ajax.beginform())
My question is, Is it safe to just continue without a JavaScript frameworks or am i seriously missing out on something by not utilising a Javascript framework like Angular JS.
This depends a lot of the type of application you are building, but in general you don't necessarily have to choose between ASP.NET MVC and Angular, you can use both in a project.
For example, if you have a page with a grid where the user will add rows and you have to calculate sums etc you could use angular on that page (and it will speed up the development process).
But if you have pages with static content you can just serve an html file there using ASP.NET MVC.
And you can even use both of them. For something like a blog post, you can use a static html file for the post content and then implement the comments are with angular.
Since ASP.NET is a server side framework, it can only go that far as AJAX insertions. Angular JS is a client side Framework, designed for SPA in mind. If you are going for a light SPA, ASP.NET will do nicely, but I think you should use the right tools for the right job. Don't hesitate to mix them in order to find the right place between server side rendering and client side dynamism.
You are definitely missing some things.
The purpose of frameworks such as angular is not just to handle your bootstrap tab switches or whatever to display just parts of the UI rather than everything. Sure, you can create small and simple SPAs by utilizing such logic but once you come to create real-world apps that approach will become unusable. The reasons to this are:
Your site will be highly unmaintainable
Frameworks like angular provide much more than just templating (more on that in a moment) but features such as routing, which allows on-demand content loading. That is, instead of sending the whole page to the client, much of which (s)he maybe will not even take a look at, you can load fragments of HTML on-demand, which reduces network usage. Imagine you had to download everything (posts, images, videos, chat messages etc) on Facebook and hide them until you actually want to see them.
Back to templating, this is a very powerful feature. Again, in the case of simple apps you can use custom JS code - that is, concatenate strings to create fragments of HTML and then insert them into the DOM. But even with simple apps this is a smelly thing to do. Imagine you had to write custom JS to concatenate your chat messages in an app like Facebook then insert them into the DOM. With angular2, for example, you can do something like this:
<ul>
<li *ngFor="let msg of messages">{{msg.Sender}} said: {{msg.Content}}</li>
</ul>
This way, Angular2 will do all the parsing and DOM handling for you. That is, you write declarative markup rather than imperative logic for what you want to display.
All in all, they help you to decouple the logic from the UI so you should definitely dig into any of the popular frameworks and get a taste of their capabilities if you want to create rich apps. You will not regret it.
So I just spent the past 5 hours reading up on Angular JS. It seems like a lot of people are heavily associating this framework to single page applications especially when accommodated with a back-end MVC framework with nice API usage like Ruby on Rails or Laravel.
I have 2 main questions that have been boggling me:
How do you initialize such apps considering that the content is
dynamic in nature. When using something like RoR/Laravel, I'd prepare
the HTML with the dynamic data at the back-end and then serve the
initial pages. It seems like most people using Angular serve up a
basic skeleton of the HTML and then do a round trip to web server
again for some data. Is this really how its done? if not, please
suggest a the right way.
Secondly, I dont think I am about to embark on a project with a
single paged application in mind. Does that mean it would be overkill
to use AngularJS for my project. Does anyone have a use case that
they think is appropriate that would require AngularJS with non
single page application that jQuery cant handle easily?
I would like to build a new web site using AngularJS. The idea is to build a server side API with Ruby on Rails that serve Json to a front-end AngularJS.
My question is: Is it better to create a full AngluarJS front-end or a standard ruby on rails front-end with some Angular ?
I know Angular can handle routing so a full application is possible but it looks like the default behavior is for single page app.
For example I wonder if it's not a problem to make some change in an angular page 1 that should modify a page 2. This page 2 will not be updated until an action is taken on the page or the user reload the page.
Is there something wrong in my approach ? What do you advise ?
Thanks for reading.
I have personally done variations of a number of angular apps, varying from SPA with 50K+ views to simply using angular as an extension of basic javascript for useful testing and modularization.
The answer to your question isn't actually all that technical but more has to do with the nature of your application and team (You're essentially trying to pick what type of screwdriver to use). As what you're trying to do is feasible on both the client and server side.
Important questions to ask:
Is your team more comfortable in Rails or Angular
How dynamic are your web pages expected to be
What browsers are you supporting
Is there a requirement for data latency and communication with the server
Are you also going to be reusing the server API for other applications
These questions will drive you towards use of Angular or Rails or the combination of the technologies to find the balance.
The routing mechanism in angular is only within a single window object.
If you have two windows you will have two angular applications. If you want to communicate between the windows object angular does not provide any special mechanism further than standard HTML and javascript.
I don't know what is the better approach for you, that depends in your business requirements and constraints.
AngularJS uses two-way client side data binding (from AngularJS Developers guide):
Has anyone consider using mix of server side templating engine with AngularJS two-way client side data binding. Something like this:
I am thinking about using AngularJS just for parts(components) of the page? Would it be good idea?
I would like to hear if you already had experiences with similar approach and what were drawbacks and advantages...
Angular is a complete UI rendering client framework. You can feed data into it, and it will render the proper html. On it's own Angular is a templating solution completely de-coupled from any server.
What you're attempting to do, is re-couple your Angular application to your server. It will be more work, there will be very few benefits, and you'll lose your ability to switch server technologies but keep your angular application untouched.
In essence, you don't want to do this for the same reason you wouldn't want to have your server rendering JavaScript for you... it's just less obvious because of all of the years we've been rendering all of our HTML at the server.
The end result is what's important. That the UI works properly and the application is easy to maintain. If you find your solution to be easier to maintain, then you should do it. I have a hard time imagining much being easier to maintain than straight HTML and JavaScript with a server that does nothing but host JSON.
I had the same dilemma as you have, I come from a background of using SMARTY as a server side template engine and we recently started using AngularJS.
I think mixing both solution would be appropriate in the the essence of total separation. i.e don't mix part of your page with both technologies but use both technologies separately.
For instance if you have a listing page where users will not interact with it at all, you may use server side template perfectly.
But if a page involve lots of manipulation and user side interaction in this case Angular is what you should use.
If you are using SPA (single page application) don't use server side template at all.
In a cordova app we recently made, we used a kind of a mix. Fix content like forms, lists, headers and menues we did in the angular way, some parts like content from an RTE or often changing templates we added with the directive ngBindHtml. The idea behind is to be flexible in the content pages of the app if the client want to change layout or want to put currently unknown content to it.
But i would suggest: if you can easy maintain the app (no long deployment/approval process) you should do it the angular way (but with no SEO in mind;).