How to deploy a pure Angular application from Visual Studio Team System to Azure websites - angularjs

Does anyone know how to deploy a pure Angular application to Azure websites?
I have a Angular 2 application (like the Angular 2 Quick Start) in VSTS Git source control. How can I deploy the application to Azure websites from setting up the VSTS build?
I saw document for deploying node.js (with angular) to Azure: https://msdn.microsoft.com/en-us/library/vs/alm/build/azure/nodejs. I did successfully deploy many of my angular applications to Azure websites following the instructions in the document. But I don't use anything with node.js in my Angular application. I hope that I can just deploy my pure Angular application to azure websites.
Previously, I used Visual Studio to create empty project to contain my Angular application. These kind of projects can be easily deployed to Azure websites. Now I am using VS code and I don't want to create any Visual Studio Solution. I don't know how to setup a continuous deployment in VSTS with just the pure Angular code.
I know I probably need to use IIS anyway and I need some settings/configs. But I just don't want to do them in Visual Studio project.

Using node.js to create a deploy package and then deploying the package by "Azure Web App Deployment" task is a convenient way to deploy to Azure Site.
However, if you don't like this, you can create a batch/power-shell script to copy your deployment files in Azure Web App via FTP method. Refer to this link for details: Deploy by copying files to Azure manually
And you can also try to deploy it from Source Control directly: Deploy from a cloud-based source control service

Related

How to deploy modules separately in single page application (SPA)?

I want to build an admin panel with single-spa framework and vue3 or react framework where the below features needs:
user management should be separate deployed
role management should be separate deployed
rule management should be separate deployed
resource management should be separate deployed
database api DataStax Astra
All module will be Single Page Application and separately deployed.
Datastax does provide a repository of sample projects. I think it would be a helpful resource to your project.
https://github.com/DataStax-Examples

How to deploy a Flask+React application to Azure Web Service

I have been working on this app on my localhost, which has Flask as the backend (localhost:5000) and React as the front end (localhost:3000), and they have been communicating well. Now I am supposed to put it up online so that other ppl can see it as well - I didn't have much experience in Azure, but how can I deploy these two components(React&Flask) into one URL on Azure web app service? (Before I had some experience in using FTP to upload the 'build' folder to a "site/wwwroot" folder to put up a simple React app without any backend)
Newest
After testing, the python project is deployed in the webapp, the react project is deployed in the virtual application, and the normal node project is also deployed in the virtual application.
Deploy the flask python project to the windows environment, the normal deployment method will fail, please be sure to follow this blog document (third-party document) to operate, it works for me.
Running Flask app with HttpPlatformHandler in Azure App Services
The effect is shown in the figure. You can see that the normal node project can be accessed normally, but the react project is not. I think there are some bugs. (Has raised a support ticket to confirm)
The deployment method of virtual application is recommended to adopt the publishing method shown in the figure below.
Privious
It is recommended to choose windows when creating azure web app, because windows supports virtual application.
We can deploy flask app normally and deploy react app in virtual app.
Under normal circumstances, the process.env.port of the two webapps is the same and will not interfere with each other because of the virtual path.
Reference post:
1. Vue Frontend and Express backend on same Azure web app Service
2. Azure Front Door Is Not Maintaining Custom Domain in Browser

How to setup a build+deploy environment for an angularjs/asp.net web api?

I have an angularjs app with a c# webapi . The repo for the angular app is stash and the c# restapi is in TFS. Is it possible/easy to create an automated build and deployment environment for this stack? What are possible solutions for this? Does anyone have a blogpost abt. this?
There is two way to integrate with Bitbucket repo and TFS for now:
Option 1: One-Time import of source code form Bitbucket
Option 2: Stick with Bitbucket and trigger CI on VSTS/TFS
Note it's not a real CI
While this is not exactl what some people might expect from CI
(because it doesn’t really build on every check-in) for most scenarios
this should be good enough. Especially if your build process is
running for a longer time this shouldn’t be an issue at all.
Details please refer this tutorial: Integrating VSTS with Bitbucket, you could also take a look at this blog: Visual Studio Team Services: Connecting a BitBucket Repository
For the CI/CD of angular app/angularjs/asp.net web api, even though there is not a blog full described everything. You still could refer some similar related blogs(even for Azure) and setup your own pipeline, use NPM to install packages/dependencies:
Setting up a CI pipeline for deploying your Angular application to
Azure using Visual Studio Team Services and GitHub
Define a continuous integration build for your Node.js app
How to deploy a pure Angular application from Visual Studio Team System to Azure websites

Unable to deploy Eclipse WTP EAR multi-module project to remote instance

I am creating a GAE application, and I am following the proposed structure of modularized GAE applications in Eclipse with WTP, as documented here (see section "Enterprise Application EAR").
I have created and linked a local server instance of GAE, and the deployment of the EAR with its modules to the GAE development instance at localhost works fine.
However, when I try to "Deploy to App Engine" (via the Google button) in order to release my app to the Google remote server, I am stuck with the error "...(EAR project name) is not an App Engine project". I have also tried to define a new server with a remote address, but this fails with the error "The currently selected server type does not support remote hosts". The host name's field is restricted to "localhost" as a valid server address.
My Eclipse project structure looks as follows:
<<Enterprise Application Project>> ear-app
|
-- <<Dynamic Web Project>> app-module-1
-- <<Dynamic Web Project>> app-module-2
-- <<Dynamic Web Project>> app-module-3
-- <<Dynamic Web Project>> app-module-4
Please note that this is not a single "Google / Web Application Project", which works as expected (but does not support modularization with multiple Eclipse projects).
Please also note that I am not using Maven and the proposed mvn commands, as documented here.
I am using the GAE SDK 1.9.3 and GPE 3.5.1 in Eclipse Kepler 4.3.1.
So how do I deploy the Eclipse WTP project structure to Google remote servers? If this is not possible, do you suggest that I switch to Maven, and if so, does this support a multi-module project to be managed from within Eclipse?
Rather by chance, I stumbled across the solution:
In the Servers view, and upon right-click of the local development server, there is another context menu entry "Google App Engine WTP / Deploy to Remote Server". This will deploy the EAR and all modules to the Google infrastructure. There is also a "Google App Engine WTP" button in the Servers view's menu, offering the same options.
Frankly, I find this a highly inconsistent UI implementation: If we create a project of type Google Web Application, then the Google button in the main menu is effective, and the context menus can be found as "Google...". These become invalid (but are still present) when we create a multi-module EAR structure in the WTP style. This will create a different set of buttons and context menu entries, all in different places, and the context menu of the LOCAL server would then support deployment to the REMOTE server.
UPDATE:
After using the GAE tools for a couple of weeks, I finally switched to the command line options (appcfg) for remote deployments. I had additional errors in GPE for deployment rollbacks (which fail in Eclipse but work with appcfg). I recommend appcfg as administration tool for the Google infrastructure, it provides more control and it is more mature than the Eclipse plugin.

package of google app engine project

HI I m new to google app engine,and I want to know is there an option in app engine to create a installer package of a project which can be deployed in other google app domains.So basically project will not be hosted publically but only for particular google app domains
An analogy I m looking here is salesforce package,where a developer can create a package url,through which package can be installed in other orgs. The project is not hosted publically. http://appexchange.salesforce.com/
You can package your source easily. The only variable that needs to change is in app.yaml application: field in python and appengine-web.xml in java. This will allow you to deploy the app in other domains.
As far as the package url that isn't how App Engine works. You can set your application to allow only certain domains to access it and provide an API for integrating it into another application, but that is different than Sales Force package url.
When developing a Google App Engine application you don't have to specify the url of the project. So you can install and deploy your application to several organizations or even subprojects.
The only thing you need to set is the application name in the app.yaml (in case you are using python) or appengine-web.xml (for java)
So for developing an installer I would create a script that first asks the user for the name of the application they want to deploy to, modifying the configuration files accordingly, and then calls the normal appcfg.py installer.

Resources