How to deploy angular app to production - node.js

I'm a little uncertain about some Angular 5 aspects. I've developed an app and don't know how to run it on production.
Currently I run my app using ng serve in NodeJS , but is it same in a production environment ?
thanks!

ng serve
ng serve is for development purpose. Check docs.
When using ng serve the compiled output is served from memory, not from disk.
This means that the application being served is not located on disk in the dist folder.
ng build
ng build --prod is for production purpose. Check docs.
ng build compiles the application into an output directory.
The build artifacts will be stored in the dist/ directory, inside the root directory of your angular app.
Jus copy the dist folder to any server like IIS or Node Express and your angular app is up and running.
To deploy you app using IIS check this and using Node Express check this.

Generally, I do not use Angular CLI's built in web server for production deployments.
With Angular CLI, you can create a production build using this command
ng build –prod
That will create a dist folder, which you can upload to any web server of your choosing to deploy an application.

First and foremost, you should build your app for production using
ng build --prod
You'll find a dist folder in your project folder. This is the Production-ready version of your app.
Now you'd require a server to deploy your app. Install this - https://www.npmjs.com/package/http-server and run using http-server dist/myProject (replace myProject with your project name)

ng build generate production files in outDir folder.
To know where it is, go to .angular-cli.json file and see apps > outDir property. For example:
"apps": [
{
"root": "src",
"outDir": "../../webapp/recorder",
"assets": [
"assets",
"favicon.ico"
],
...
These files are only html, css and javascript and can be used on any web server

Follow this instruction by using Angular CLI:
1- Build your project (for production mode)
ng build --prod
2- If you want to see your project in production mode before deploy it on the real server you can use lite-server to serve your project in a local machine.
First install lite-server
npm i lite-server --save-dev
And then run your project on local server
lite-server --baseDir="dist/your-project-name"

Related

Building and deploying production build of Node.js TypeScript server

I see many questions about how to deploy production build of Node.js app on server, but I not found any about building and deploying TypeScript server.
I am using GitHub Actions to build my TS into JS to /dist folder, but I realized that I can't just move this folder to server and start it.
I also still need to install dependencies, because it is not same as on Client-side (React for example) where all dependencies are bundled.
Are there any best practices how to automatically deploy those kinds of server apps?
Or it is simple as:
Bulding TS to JS
Moving /dist and package.json to production server
Running script on server to yarn install and launch pm2

can we deploy an react js application without source(src folder) code locally

some background:this is my first react application and my assumption is build in react is similar to binary files in c++
question : this is for a react application which sole purpose is to run locally. is there anyway we can do npm start only with build
have tried to delete the src folder after building.
expected result is the app should run as usual.
actual result : app crashes saying, index.js file is missing
npm start won`t work with build version,
you need to install serve and run build using serve locally on your machine
npm install -g serve
serve -s build
ref: https://facebook.github.io/create-react-app/docs/deployment

Deployment on IIS of Nestjs application

I have tried to deploy my Nestjs deploying on IIS server. I have configured iisnode on IIS that works fine for express application but I am getting errors for missing modules for nestjs. I have tried following commands for building production package
npm run start:prod
and
npm run webpack
but failed to deploy on IIS. How can I build a deployment package?? so I can deploy. I am new with nodejs and Nestjs.
Look at the project's package.json. You'll see that start:prod is a script that runs node on the compiled output of the project. You get the compiled output by running:
npm run prestart:prod
that will re-build your app into the dist folder.
So you can
Zip up the dist folder
deploy to the target host
Unzip it
Try running iisnode on it
let me know how that works

execute ng serve pointing to the angular directory from current directory

working with angular2 App, and i am writing .bat scripts to automate the angular build and serving the application, as part of the ng serve. I have to do like
c:\abc\edf>ng serve --server=d:\angualr2\demoApp
Here demoApp is angular2 and node_modules already installed i need to up the angulap app by my batch script.
Where as everyone knows it works and working for me too.
d:\angualr2\demoApp>ng serve
if you build the application, then you don't serve it with ng serve
the flag --server is unknown to me, and to the CLI documentation (--help)
If you have a path issue, start by goign into the right folder of your file explorer with cd D:\angular2\demoApp (not sure about it, I'm more of a Linux man)
ng works because NPM added it to your PATH. If you work on another computer, it won't work. Consider running with the local package with a npm command such as npm run build, where build: "ng build --prod"

How to deploy Nestjs App (on Azure)?

I am trying to deploy a Nestjs API (with Auth0 authentication). When I run it in VS Code with npm run start:watch server, everything's fine.
Now the question is: what should I do to deploy it on a webserver? Should I only copy the dist folder (after runnin tsc)? what about node_modules? Should I leave the port to 3000?
As a side note I am trying to deploy it on Azure but I guess the questions holds for any platform.
Many thanks!
Modify your package.json file, and add a postinstall script, this script should be tsc or tsc --sourceMap false if you would like to avoid sourceMaps from being generated.
That would make azure to run tsc after installing all npm packages, remember to change start script also, so its value is 'node dist/index.js'

Resources