I have a MEAN Stack app that I need to host on CPanel and I have never deployed an app before. It is easy to deploy Angular part of the app by creating a bundle in dist folder using the command:
ng build --prod
But I would like to know how should I post my backend code on the server. Is there any command/commands that can create a minified bundle like in Angular?
I would also like to know if I need to install some npm packages to make sure my app runs smoothly on the server? Like I keep reading about PM2 and Nginx when I googled about deploying nodejs. So what are their benefits?
Please mention any articles or videos that might be useful.
Angular version 7
Node version 8.11.3
Ubuntu 16.04
2
Answers
You can deploy the code as it is and it will work!
You don’t need to minify the code. The VM is fast enough to run it. Minification is usually done to reduce the size of the file when sending it from the Server to the Client, and since you’re not sending any file, you don’t need to worry about it.
I recommend PM2 for managing the Node processes once you reach production status. It includes logs, auto-restart and many cool features that will help you out.
If you’re concerned about the size of your
node_modules
directory, perhaps you can identify which packages are being used during development only (for example, testing tools like Jest and Mocha, transpilers like Babel, Typescript, etc). Place these inside the"devDependency"
key in yourpackage.json
file. Then, on production, runnpm install --production
and it will not install whatever you listed as adevDependency
. That should produce smallernode_modules
.If you’re following The Twelve Factors, then also create an environment file for the production-only credentials.
For completeness, if you’re using Babel/Typescript or any other tool like that then you do need to transpile the project to a Javascript Code that Node can understand. Run the respective commands to generate a production build.
About Nginx, some people like to place Nginx as a reverse proxy to let it serve the static assets, while for API requests they forward it to the Node API. This is “best practices” since Nginx can be easily tweaked to serve the static assets faster and includes several options for cache, security protection, etc.
Install Node.js
We will install the latest LTS release of Node.js, using the NodeSource package archives.
First, you need to install the NodeSource PPA in order to get access to its contents. Make sure you’re in your home directory, and use curl to retrieve the installation script for the Node.js 6.x archives:
You can inspect the contents of this script with nano (or your preferred text editor):
And run the script under sudo:
The PPA will be added to your configuration and your local package cache will be updated automatically. After running the setup script from nodesource, you can install the Node.js package in the same way that you did above:
The nodejs package contains the nodejs binary as well as npm, so you don’t need to install npm separately. However, in order for some npm packages to work (such as those that require compiling code from source), you will need to install the build-essential package:
The Node.js runtime is now installed, and ready to run an application! Let’s write a Node.js application.
Note: When installing from the NodeSource PPA, the Node.js executable is called nodejs, rather than node.
Create Node.js Application
We will write a Hello World application that simply returns “Hello World” to any HTTP requests. This is a sample application that will help you get your Node.js set up, which you can replace with your own application–just make sure that you modify your application to listen on the appropriate IP addresses and ports.
Hello World Code
First, create and open your Node.js application for editing. For this tutorial, we will use nano to edit a sample application called hello.js:
Insert the following code into the file. If you want to, you may replace the highlighted port, 8080, in both locations (be sure to use a non-admin port, i.e. 1024 or greater):
hello.js
Now save and exit.
This Node.js application simply listens on the specified address (localhost) and port (8080), and returns “Hello World” with a 200 HTTP success code. Since we’re listening on localhost, remote clients won’t be able to connect to our application.
Test Application
In order to test your application, mark hello.js executable:
And run it like so:
Output
Server running at http://localhost:8080/
Note: Running a Node.js application in this manner will block additional commands until the application is killed by pressing Ctrl-C.
In order to test the application, open another terminal session on your server, and connect to localhost with curl:
If you see the following output, the application is working properly and listening on the proper address and port:
If you do not see the proper output, make sure that your Node.js application is running, and configured to listen on the proper address and port.
Once you’re sure it’s working, kill the application (if you haven’t already) by pressing Ctrl+C.
Install PM2
Now we will install PM2, which is a process manager for Node.js applications. PM2 provides an easy way to manage and daemonize applications (run them in the background as a service).
We will use npm, a package manager for Node modules that installs with Node.js, to install PM2 on our server. Use this command to install PM2:
The -g option tells npm to install the module globally, so that it’s available system-wide.
Manage Application with PM2
PM2 is simple and easy to use. We will cover a few basic uses of PM2.
Start Application
The first thing you will want to do is use the pm2 start command to run your application, hello.js, in the background:
This also adds your application to PM2’s process list, which is outputted every time you start an application:
As you can see, PM2 automatically assigns an App name (based on the filename, without the .js extension) and a PM2 id. PM2 also maintains other information, such as the PID of the process, its current status, and memory usage.
Applications that are running under PM2 will be restarted automatically if the application crashes or is killed, but an additional step needs to be taken to get the application to launch on system startup (boot or reboot). Luckily, PM2 provides an easy way to do this, the startup subcommand.
The startup subcommand generates and configures a startup script to launch PM2 and its managed processes on server boots:
The last line of the resulting output will include a command that you must run with superuser privileges:
Run the command that was generated (similar to the highlighted output above, but with your username instead of sammy) to set PM2 up to start on boot (use the command from your own output):
This will create a systemd unit which runs pm2 for your user on boot. This pm2 instance, in turn, runs hello.js. You can check the status of the systemd unit with systemctl:
For a detailed overview of systemd, see Systemd Essentials: Working with Services, Units, and the Journal.
Other PM2 Usage (Optional)
PM2 provides many subcommands that allow you to manage or look up information about your applications. Note that running pm2 without any arguments will display a help page, including example usage, that covers PM2 usage in more detail than this section of the tutorial.
Stop an application with this command (specify the PM2 App name or id):
Restart an application with this command (specify the PM2 App name or id):
The list of applications currently managed by PM2 can also be looked up with the list subcommand:
More information about a specific application can be found by using the info subcommand (specify the PM2 App name or id):
The PM2 process monitor can be pulled up with the monit subcommand. This displays the application status, CPU, and memory usage:
Now that your Node.js application is running, and managed by PM2, let’s set up the reverse proxy.
Set Up Nginx as a Reverse Proxy Server
Now that your application is running, and listening on localhost, you need to set up a way for your users to access it. We will set up the Nginx web server as a reverse proxy for this purpose.
In the prerequisite tutorial, we set up our Nginx configuration in the /etc/nginx/sites-available/default file. Open the file for editing:
Within the server block you should have an existing location / block. Replace the contents of that block with the following configuration. If your application is set to listen on a different port, update the highlighted portion to the correct port number.
This configures the server to respond to requests at its root. Assuming our server is available at example.com, accessing https://example.com/ via a web browser would send the request to hello.js, listening on port 8080 at localhost.
You can add additional location blocks to the same server block to provide access to other applications on the same server. For example, if you were also running another Node.js application on port 8081, you could add this location block to allow access to it via http://example.com/app2:
Once you are done adding the location blocks for your applications, save and exit.
Make sure you didn’t introduce any syntax errors by typing:
Next, restart Nginx:
Assuming that your Node.js application is running, and your application and Nginx configurations are correct, you should now be able to access your application via the Nginx reverse proxy. Try it out by accessing your server’s URL (its public IP address or domain name).
Conclusion
Congratulations! You now have your Node.js application running behind an Nginx reverse proxy on an Ubuntu 16.04 server. This reverse proxy setup is flexible enough to provide your users access to other applications or static web content that you want to share. Good luck with your Node.js development!
I also found this help video:https://www.youtube.com/watch?v=Jsmeh7q9Qv4