Angular 2 Deployment - angularjs

When using Angular 1, development is easy, just quote script in html such as
Deployment is just copy a few .js/.html/.css files to my iis server.
However, when testing with Angular 2, many npm/typescript packages (more than 500 files) are included in a simple hellow world webpage.
Is there any tools that help for deploying Angular 2 apps?
thanks
mintssoul

Angular 2 comes with many build options.Most popular and recommended one is Angular cli.
https://github.com/angular/angular-cli
It uses web pack which is powerful framework for building client side applications and minification,bundling,cache bursting, even gzip compression are inbuilt which are great to reduce package footprint and make your life easier for angular 2 application build and deployment.
App specific file copying or custom logic can be incorporated using gulp : http://gulpjs.com/

Related

What is difference between angularjs and angular cli?

There are 2 things available in angular :
1.angular cli
2.angularjs
please describe briefly. thanks
Angular-cli a command line interface. and it helps to add new components, directives, and services, from the command line;
it builds application based on your input. you can add code, test cases via command itself...
AngularJS is a structural framework for dynamic web apps. It lets you use HTML as your template language and lets you extend HTML's syntax to express your ... you need angularjs library to develop application
Angular-CLI is a TOOL to create your angular 2 application. It provides commands to generate code such as components, services and directives to make angular 2 development easier to the developer. It also allows you to build your application and serve your application as you are developing.
AngularJS : Is the famous JavaScript based framework.
Resume : In general we install Angular-CLI globally to help us in initialization or modification of our Angular projects
In a very simple words,
Angular CLI is a command line interface for writing or easily setting/building up an angular application.
Its just like building a java application from a simple notepad (even though we have other IDEs to help)
Angular js - is a older version of Angular (version 1.x) which is a open-source JavaScript-based front-end web application framework.
AngularJS is a structural framework for dynamic web apps. It lets you use HTML as your template language and lets you extend HTML's syntax to express your application's components clearly and succinctly.It controlls the code to what it actually to do...
Angular CLI is "Command Line Interface".it needs command to run and perform any operations and it is mandatory for angular 2 and not for angular 1.
The CLI is used to start an Angular 2 application, and add new components, directives, and services, from the command line; it builds application “scaffolding” based on your input. It lets you add code, and unit tests, to an application quickly. Afterward, you fill in the actual business code.
The quick start is just a pre-coded application to give you an idea of what you can do with Angular 2 without having to write any code of you own.
Angualrjs- is nothing but just angular package which you can install in your system for further development.
Angular-cli- comes up with additional feature to make developer life easy it basically create a boilerplate code for you
for ex: structure of your project and you want to add ant component class or service class in project so you can point to your directory and run this command
"ng generate service [name]" it will automatically create a service class for you with initial configuration.

JHipster vs MEAN-Stack vs MERN-Stack

I am familiar with developing AngularJS and Angular 2/4 UIs utilizing JHipster 4's JPA CRUD scaffolding but it feels unnatural. And I think developing MEAN-Stack UIs is the path of highest productivity.
How much refactoring is involved utilizing MEAN-Stack UIs with JHipster JPA (MongoDB) and Angular scaffolding?
Also, if using JHipster's new React support, how much refactoring is required to utilize MERN-Stack UIs with JHipster JPA (MongoDB) and React scaffolding?
Oh, I forget to mention my development target is PWAs (Progressive Web Apps) aka mobile first design.
You'll have to fork the jHipster generator, add your own templates for mongodb, express.js and nodejs.
The server side templates are mostly in generators/entity-server/templates, and generators/server/templates. These template files are written as EJS templates (EJS).
One of the steps during the app generation is to create JSON files from the JDL file. You can run just the json creation using a command like this:
yo jhipster:import-jdl jhipster-jdl.jh --db=mysql --json-only=true
The JSON files will get created in .jhipster folder (note the "." in front which makes the folder hidden) under your project.
Create your own sub-generators similar to the "server" and "entity-server" sub-generators, that use the generated JSON. The templates will have JavaScript that uses nodejs, express.js and mongodb, instead of Java with JPA, and Spring Boot.
This is not going to be easy, although you could follow the JHipster code and create the sub-generators.
I guess someone might have already done all this in one of the forks from JHipster, in which case you might want to start from there.

Why should I use front-end plugins with my sbt playframework project?

If I have an angularjs frontend and am using play in the backend, why do people use the various sbt-plugins?
I understand how to use them, to compile the frontend etc. but isn't it better just to seperate the 2 projects completely and just use the native frontend tools like npm, bower, etc. ?
I'm trying to understand if there is some advantage to using the sbt plugins.
The sbt-web tools are useful when:
You have a small amount of front-end code, so that it's not worth setting up a separate build & deployment infrastructure for it
When you have shared code and/or compiled-in data between client and server, eg: javascript model code running in Nashorn as well as the browser, ScalaJS code interoperating with javascript
When you have fixed data (eg: internationalization tables) that are compiled into both client and server
When you have written unit tests in Scala for front-end code (eg: using ScalaCheck to property-check javascript)
When your dev team is already familiar with sbt, but not with other tools

Fast way to develop AngularJS in a Java environment

I am currently working on a Java based Maven project that has a REST backend module and using angular JS as a frontend that uses the backend for data. The 2 modules are named "rest" and "web" accordingly and are deployed as 2 separate war files to a glassfish instance during development. The glassfish is on a different machine.
My problem is that this is kind of slow, especially when developing the angular based frontend. Fix a minor spelling mistake, package, redeploy. Not that slow but every character change or fiddling with angular is another 20-30 seconds lost.
One thing I tried is to directly load the files from the source directory into the browser with file:// tag. This is OK as long as it tries to call the REST backend which fails due to CORS (I don't remember the exact error message, it just doesn't work). This happens a lot so it's a no-go.
I'm open to every kind of solution to develop angular in a way that I could see my changes instantly instead of deploying it every time? Much like the guy does in the egghead videos.
I would recommend breaking your Angular JS application into its own separate project, this would be a new HTML5 project on Netbeans. That way you can focus on pure backend and frontend development in their respective projects and you do not have to manually separate the war files. This link will help you to get CORS working if you are defining your RESTFUL services with Jersey Access-Control-Allow-Origin in ajax call to jersey rest web services. Or you can just mock the data out in the front end project.

Upload files to Angular or Rails

I´m trying to integrate a Blueimp Jquery File Upload plugin in my application.
My application has an AngularJS front-end running in a Node.js server and a Rails API backend running in a WEBrick server.
I would like to clarify which is the best practices to store the files? In Angular (this case Node.js) server or the Rails one.
Thanks,
Roberto.
I'm working on an app that has the exact same layout as yours and I came to the same question.
Since I'm trying to separate the back-end and front-end completely and have all the work with the db and files done in the back-end, I found that it's better to save the files in Rails server. That also gives you an option to do background operations with files (using sidekiq, for example), without making users wait for completion in the front-end.
There are lots of tools for file upload from angularJS to the server (Rails), but I personally found angular-file-upload directive easiest to understand and implement. I recommend you check it out.
I hope it helps,
Ulugbek

Resources