Develop Reference

Angular app, Inside an Asp.Net Core Project, pros & cons

I would like to create a Single Page Web App with Angular but I couldn't decide to project type.
(Just generated files by tools like angular-cli or that generated files inside an Asp.Net Core Project)
I got some question.
What are the advantages and disadvantages of building angular app on ASP.NET Core Project?
Which cases I should prefer to locate angular app inside a ASP.NET Core Project?

I'd like to take a stab at this. I'll agree that the answer is on some part opinion based though.
I have just been comparing the two versions for a new project that I am involved in.
First some facts
The Angular project created inside of the ASP.Net core application is in no way dependant on the .Net code. You can navigate to the directory and type ng serve and run it by itself.
You can copy the angular code to another directory or repo and host it by itself if you for some reason later on decide that you don't want to combine it. All you have to do is copy paste the angular code, and then remove some lines in startup.cs regarding the internal hosting.
The code that gets added inside of the asp net core template is close to the base angular app with a few examples added on.
If you use the login functionality template it implements an oidc client, and an identity server on the back end, (opinion) pretty much the same way I would have done it myself. There is nothing stopping you from rewriting it if you don't like it. At worst it's a good example of how it can be done.
As of today the template is using Angular 8.0.0, you can just change the package.json to get the latest version and run npm install. It works great.
You can still use Visual Studio Code for the Angular parts with a combined project.
Here are when Id choose the different versions (warning opinions ahead).
When to choose the asp.net core angular project.
Small web app with limited functionality.
Small team, probably same person writing angular code as api code.
If you are unsure. You can always split later.
When to choose separate apps.
Big team with deployment builds and automation.
If you want to host angular and asp.net core separately (for reasons such as to achieve maximum performance and load balancing in apps with thousands of visitors).
Separate people coding angular and asp.net
You don't like having it all in same repo and want to split it up.
In a bigger teams and contexts with multiple APIs you will probably have to deal with CORS anyways, but if not you will have to at least think about it for this to work.
If you are unsure, you can always combine it to one app later.

Javascript unit testing with Jasmine and JSP

I am working on a project that uses JSP and Javascript. Now I have to write unit tests so I started using Jasmine for it and since the project is built using Maven, My goal was to run unit tests as part of continuous build and integration. So I thought of using jasmine-maven-plugin it uses PhantomJS for headless testing. I tried PhantomJS API to see whether it can load a JSP based webpage. Using the sample api I was able to create a screenshot of my JSP page. So I think PhantomJS can work with JSP.
My unit tests are heavily dependent on the JSP page but I was to not able to configure the Jasmine specRunner to use JSP, so that I can run my Jasmine tests as part of maven build.
Does anybody used Jasmine, Javascript, JSP combination for unit testing? Any help or comments will be highly appreciated. Thanks!

AngularJS and SpringMVC in the same project

I'm writing Java Web application and want to use AngularJS on frontend.
But I don't want to delegate routing and security to angular, but handle it with spring. My file hierarchy in the project looks like that:
I wrote Angular controllers, services etc. And just apply it on the jsp page with some init parameters. All jsp are loaded by Spring controllers, I have some security rules for that pages. Angular also consumes REST API from this application.
The question is about efficiency of such approach. In fact I have a few SPA in here. Every time i load a page, Angular initializes from the beginning (there is about 10 pages).
The reasons I want to stay on this version are:
It's already set (Routing, Security)
It seems like I don't need to load all the scripts on the page, but only required ones
But also I have feeling I'm doing it wrong way...
Should I separate Spring and Angular and use Angular also for routing and security handling, not only for DOM manipulation.
What do you think? Do you have any suggestion?

Angular is not another jQuery, its Single page application framework.
You can look on SPAs like on ordinary external application which communicates with your backend. So there is no view or prezentation layer on server, just REST API.
Angular app should have its own routing, it doesn't make sense to combine it with spring MVC. Security lays mostly on REST, and you can use spring security on it as ussual.
Best practice is to create Angular app as separate javascript application. You can use a lot of tools from angular ecosystem which makes your work very comfortable.
During development you have your backend running, and develop Angular part separately using javascript devstack. After that you can pack the both parts to single war.
I have nice small example of Spring and Angular integration here:
https://github.com/Angular-cz/java-devstack
Unluckilly the readme is written in Czech (beautifull language :) But if you are experienced in Java and maven you will probably get it from code, I will also try to describe it here.
The bigger app with a nice module structure and jwt autentication can bee seen here:
https://bitbucket.org/angular_cz/beerapp
Both of them has similar architecture:
separate maven module for frontend and separate for backend.
javascript part use npm as package manager
developer is using gulp task runner for javascript development (it is run inside module, where gulpfile.js resides).
there is karma runner configured and several unit tests
the app connects to the backend during development using proxy running on /api for the app can have same configuration on production)
when building war, frontend module uses frontend-maven-plugin which run gulp build task same as javascript developer would
then the built minified assets are put to resources
the next part is just ordinary maven way how to put assets to /static
one more nice thing - there is also integrated e2e test under integration-test profile.
Feel free to ask if you are interested in this kind of architecture.

Azure documentdb how to develop server side?

as a total JavaScript beginner, how do I actually develop for it?
I mean, I've seen https://azure.microsoft.com/en-us/documentation/articles/documentdb-programming/ but there was no mentioning of a development environment.
Is there something like a visual studio project template for server-side javascript?

I use node.js so your mileage may vary if you are developing from .NET, but here's what I do:
First of all, I created an npm package documentdb-utils. It is a wrapper for the DocumentDB node.js package that makes it easier to do a bunch of things.
Then, I created npm package documentdb-mock to write tests for my stored procedures. The source code for documentdb-mock includes 4 example stored procedures along with a test suite for each using nodeunit. You can start with these as they exercise most of the server-side API.
After I have them passing my local unit tests, I write integration tests that exercise my system end-to-end including creating any necessary data for each test run. The only problems that I've found here with sprocs that I didn't see in my mocked testing had to do with reaching certain limits... although, documentdb-mock has been upgraded to simulate many of these now also.
I haven't open sourced this yet, but I have also written a parser/rewriter that will embed any require(d) packages into my sprocs before sending them to DocumentDB. This allows me to write and test in a nicely factored way on node.js even using downloaded packages from within my sprocs, but when they get pushed to DocumentDB any dependencies are automatically embedded inside of the function. I'll open source that at some point (probably adding it to documentdb-utils) but I can share it with you now if you desire.

Here are a few tools that I found helpful for development (especially server-side [by which we mean database-side] scripting):
DocumentDB Studio - https://github.com/mingaliu/DocumentDBStudio/releases
Sample Code - https://github.com/Azure/azure-documentdb-js-server/tree/master/samples/stored-procedures

Here is another nice open source tool for exploring data in documentdb:
documentdb.a7pl.us

How to test a front-end JavaScript library and integrate with Travis?

I have already experimented testing NodeJS libraries using Jasmine or Mocha, but I don't know how to test front-end projects. I have found tutorials online, but everything includes a task manager in the workflow and I would like to know how to do this without one.
I found the following question close to what I am asking:
Using Travis-CI for client-side JavaScript libraries?
In my case, I am using Jasmine and have already set up the Jasmine SpecRunner.html, Jasmine library and spec/mylibSpec.js. The tests pass when I run the SpecRunner.html on my browser.
Now, how do I integrate this with Travis, without Grunt/Gulp/Brunch/etc?
I have heard the words "PhantomJS" and "Selenium" and I think this has to do with what I am trying to accomplish. Is there a "hello, world"-like project with tests and Travis integration one can learn from?

The Travis documentation lists three basic ways to accomplish this:
the PhantomJS headless browser
running Firefox with a virtual display or
using the Saucelabs browser VM service
Testing with PhantomJS is the fastest, since it does not simulate a display (it still allows you to create screenshots, though). PhantomJS comes with a run-jasmine example.
The phantom test script can then be executed directly, simply by running
script: phantomjs run-jasmine.js
in your .travis.yml, without the additional overhead of a build system such as Grunt.
If testing your project requires a real browser GUI, that leaves you with options 2 or 3.
Saucelabs browser VMs have the advantage of real cross-browser testing; if your project is open source, they offer a free plan. They also provide an in-depth tutorial for your specific use case: Travis + Jasmine + Saucelabs, which however does require Grunt in order to run.