[{"data":1,"prerenderedAt":-1},["ShallowReactive",2],{"global-header-tutorials-static":3,"article-how-to-deploy-nuxt-app-in-ubuntu-server":4,"initial-similar-fetch":22},[],{"alias":5,"title":6,"description":7,"content":8,"thumbnail":9,"keywords":10,"categories":16,"tags":19,"createdAt":21},"how-to-deploy-nuxt-app-in-ubuntu-server","How to deploy Nuxt app in Ubuntu Server","Deploy Nuxt App in Linux VM","{\"type\":\"doc\",\"content\":[{\"type\":\"heading\",\"attrs\":{\"textAlign\":null,\"level\":1},\"content\":[{\"type\":\"text\",\"text\":\"Deploy Nuxt App in Ubuntu Server\"}]},{\"type\":\"paragraph\",\"attrs\":{\"textAlign\":null},\"content\":[{\"type\":\"text\",\"text\":\"For this, first you need to have a running Ubuntu server and a Nuxt app to build.\"}]},{\"type\":\"heading\",\"attrs\":{\"textAlign\":null,\"level\":2},\"content\":[{\"type\":\"text\",\"text\":\"Build the Nuxt App\"}]},{\"type\":\"paragraph\",\"attrs\":{\"textAlign\":null},\"content\":[{\"type\":\"text\",\"text\":\"Navigate to your project directory and build the app using the following command\"}]},{\"type\":\"codeBlock\",\"attrs\":{\"language\":\"bash\"},\"content\":[{\"type\":\"text\",\"text\":\"npm run build\"}]},{\"type\":\"codeBlock\",\"attrs\":{\"language\":\"bash\"},\"content\":[{\"type\":\"text\",\"text\":\"┌  Building Nuxt for production...\\n│\\n●  Nuxt 4.4.2 (with Nitro 2.13.3, Vite 7.3.1 and Vue 3.5.32)\\n✔ Processed 2 collections and 0 files in 69.58ms (0 cached, 0 parsed)                                                                                              @nuxt\u002Fcontent 2:46:56 PM\\nℹ Nuxt Icon server bundle mode is set to local                                                                                                                                   2:46:57 PM\\n│\\n●  Nitro preset: node-server\\nℹ Building client...  \"}]},{\"type\":\"paragraph\",\"attrs\":{\"textAlign\":null},\"content\":[{\"type\":\"text\",\"text\":\"The build folder will be \"},{\"type\":\"text\",\"marks\":[{\"type\":\"bold\"}],\"text\":\".output. \"},{\"type\":\"text\",\"text\":\"If you look into the folder, you can see a lot of build files. Inside the server folder, you can see the node_modules as well. This is when you build the app. Nuxt bundles everything your application needs into a standalone package, so you don't have to run \"},{\"type\":\"text\",\"marks\":[{\"type\":\"code\"}],\"text\":\"npm install\"},{\"type\":\"text\",\"text\":\" it on your server.\"}]},{\"type\":\"paragraph\",\"attrs\":{\"textAlign\":null},\"content\":[{\"type\":\"text\",\"text\":\"Transferring those files to the remote server will take much time, so we need zip them. Use the following command to zip the folder\"}]},{\"type\":\"codeBlock\",\"attrs\":{\"language\":\"bash\"},\"content\":[{\"type\":\"text\",\"text\":\"tar -czf build.tar.gz .output\"}]},{\"type\":\"paragraph\",\"attrs\":{\"textAlign\":null},\"content\":[{\"type\":\"text\",\"text\":\"Now, transfer the file to our Ubuntu server. \"}]},{\"type\":\"codeBlock\",\"attrs\":{\"language\":\"bash\"},\"content\":[{\"type\":\"text\",\"text\":\"scp build.tar.gz user@your-server-ip:~\"}]},{\"type\":\"paragraph\",\"attrs\":{\"textAlign\":null},\"content\":[{\"type\":\"text\",\"text\":\"Now SSH into the remote Ubuntu server\"}]},{\"type\":\"codeBlock\",\"attrs\":{\"language\":\"bash\"},\"content\":[{\"type\":\"text\",\"text\":\"ssh user@your-server-ip\"}]},{\"type\":\"paragraph\",\"attrs\":{\"textAlign\":null},\"content\":[{\"type\":\"text\",\"text\":\"Provide the password if required. Here, \"},{\"type\":\"text\",\"marks\":[{\"type\":\"bold\"}],\"text\":\"user\"},{\"type\":\"text\",\"text\":\" is your Ubuntu server username that might be \"},{\"type\":\"text\",\"marks\":[{\"type\":\"bold\"}],\"text\":\"root\"},{\"type\":\"text\",\"text\":\" or \"},{\"type\":\"text\",\"marks\":[{\"type\":\"bold\"}],\"text\":\"ubuntu\"}]},{\"type\":\"paragraph\",\"attrs\":{\"textAlign\":null},\"content\":[{\"type\":\"text\",\"text\":\"Inside the Ubuntu server, untar the file\"}]},{\"type\":\"codeBlock\",\"attrs\":{\"language\":\"bash\"},\"content\":[{\"type\":\"text\",\"text\":\"tar -xzf build.tar.gz\"}]},{\"type\":\"heading\",\"attrs\":{\"textAlign\":null,\"level\":2},\"content\":[{\"type\":\"text\",\"text\":\"Install NodeJS on the Server\"}]},{\"type\":\"paragraph\",\"attrs\":{\"textAlign\":null},\"content\":[{\"type\":\"text\",\"text\":\"We need to install the node inside the server. We are using nvm node manager to do so, it's due to get rid of version conflict between the node used to develop locally and the server. First, install the nvm \"}]},{\"type\":\"codeBlock\",\"attrs\":{\"language\":\"bash\"},\"content\":[{\"type\":\"text\",\"text\":\"curl -o- https:\u002F\u002Fraw.githubusercontent.com\u002Fnvm-sh\u002Fnvm\u002Fv0.40.4\u002Finstall.sh | bash\"}]},{\"type\":\"paragraph\",\"attrs\":{\"textAlign\":null},\"content\":[{\"type\":\"text\",\"text\":\"Now install NodeJS\"}]},{\"type\":\"codeBlock\",\"attrs\":{\"language\":\"bash\"},\"content\":[{\"type\":\"text\",\"text\":\"nvm install v22.17.1\"}]},{\"type\":\"blockquote\",\"content\":[{\"type\":\"paragraph\",\"attrs\":{\"textAlign\":null},\"content\":[{\"type\":\"text\",\"text\":\"Make sure to use your own node version.\"}]}]},{\"type\":\"paragraph\",\"attrs\":{\"textAlign\":null},\"content\":[{\"type\":\"text\",\"text\":\"Verify the node is installed\"}]},{\"type\":\"codeBlock\",\"attrs\":{\"language\":\"bash\"},\"content\":[{\"type\":\"text\",\"text\":\"node -v\"}]},{\"type\":\"heading\",\"attrs\":{\"textAlign\":null,\"level\":2},\"content\":[{\"type\":\"text\",\"text\":\"Install and Set Up Process Manager(PM2)\"}]},{\"type\":\"heading\",\"attrs\":{\"textAlign\":null,\"level\":3},\"content\":[{\"type\":\"text\",\"text\":\"Install PM2\"}]},{\"type\":\"paragraph\",\"attrs\":{\"textAlign\":null},\"content\":[{\"type\":\"text\",\"text\":\"We are going to manage the process using pm2, which helps to run the application in the background.\"}]},{\"type\":\"codeBlock\",\"attrs\":{\"language\":\"bash\"},\"content\":[{\"type\":\"text\",\"text\":\"npm install -g pm2\"}]},{\"type\":\"paragraph\",\"attrs\":{\"textAlign\":null},\"content\":[{\"type\":\"text\",\"text\":\"Let's create a configuration file for pm2 to manage. Create the file in the same directory where our .output folder is located.\"}]},{\"type\":\"codeBlock\",\"attrs\":{\"language\":\"bash\"},\"content\":[{\"type\":\"text\",\"text\":\"touch ecosystem.config.cjs\"}]},{\"type\":\"paragraph\",\"attrs\":{\"textAlign\":null},\"content\":[{\"type\":\"text\",\"text\":\"Set up the config file\"}]},{\"type\":\"codeBlock\",\"attrs\":{\"language\":\"javascript\"},\"content\":[{\"type\":\"text\",\"text\":\"module.exports = {\\n  apps: [\\n    {\\n      name: 'csbyte',\\n      port: '3000',\\n      exec_mode: 'cluster',\\n      instances: 'max',\\n      script: '.\u002F.output\u002Fserver\u002Findex.mjs'\\n    }\\n  ]\\n}\"}]},{\"type\":\"paragraph\",\"attrs\":{\"textAlign\":null},\"content\":[{\"type\":\"text\",\"text\":\"Here, use your own name. You can see the instances are set to max, which will create multiple instances as the user requests increase. When you use \"},{\"type\":\"text\",\"marks\":[{\"type\":\"bold\"}],\"text\":\"Cluster \"},{\"type\":\"text\",\"text\":\"Mode, PM2 acts as a load balancer. Instead of running one single process, it will utilize all available CPU cores on your Ubuntu server. \"}]},{\"type\":\"paragraph\",\"attrs\":{\"textAlign\":null},\"content\":[{\"type\":\"text\",\"text\":\"If your server have 2 core cpu, setting instances max will create one instance per core, resulting in 2 instances.\"}]},{\"type\":\"heading\",\"attrs\":{\"textAlign\":null,\"level\":3},\"content\":[{\"type\":\"text\",\"text\":\" Start pm2\"}]},{\"type\":\"paragraph\",\"attrs\":{\"textAlign\":null},\"content\":[{\"type\":\"text\",\"text\":\"Simply, start the pm2 using the following command\"}]},{\"type\":\"codeBlock\",\"attrs\":{\"language\":\"bash\"},\"content\":[{\"type\":\"text\",\"text\":\"pm2 start ecosystem.config.cjs\"}]},{\"type\":\"image\",\"attrs\":{\"src\":\"https:\u002F\u002Fapi.csbyte.com\u002Fuploads\u002Feditor\u002F808571e8-1ce9-4e1b-901f-7afd81f4c7df_pm2.png\",\"alt\":null,\"title\":null,\"width\":null,\"height\":null}},{\"type\":\"paragraph\",\"attrs\":{\"textAlign\":null},\"content\":[{\"type\":\"text\",\"text\":\"The output looks something like the above, for instance, set to 1.\"}]},{\"type\":\"paragraph\",\"attrs\":{\"textAlign\":null},\"content\":[{\"type\":\"text\",\"text\":\"Now you can open the IP address with port 3000 it will load the app.\"}]},{\"type\":\"codeBlock\",\"attrs\":{\"language\":null},\"content\":[{\"type\":\"text\",\"text\":\"http:\u002F\u002Fyour-server-ip-address:3000\u002F\"}]},{\"type\":\"heading\",\"attrs\":{\"textAlign\":null,\"level\":3},\"content\":[{\"type\":\"text\",\"text\":\"Run Node APP in the background\"}]},{\"type\":\"paragraph\",\"attrs\":{\"textAlign\":null},\"content\":[{\"type\":\"text\",\"text\":\"Run the following command to run your node app in the background\"}]},{\"type\":\"codeBlock\",\"attrs\":{\"language\":\"bash\"},\"content\":[{\"type\":\"text\",\"text\":\"pm2 save\\npm2 startup\"}]},{\"type\":\"heading\",\"attrs\":{\"textAlign\":null,\"level\":3},\"content\":[{\"type\":\"text\",\"text\":\"Useful command for PM2 \"}]},{\"type\":\"codeBlock\",\"attrs\":{\"language\":\"bash\"},\"content\":[{\"type\":\"text\",\"text\":\"pm2 delete app-name\"}]},{\"type\":\"paragraph\",\"attrs\":{\"textAlign\":null},\"content\":[{\"type\":\"text\",\"text\":\"This will delete the app use app-name as your configured name in ecosystem.config.cjs\"}]},{\"type\":\"codeBlock\",\"attrs\":{\"language\":\"bash\"},\"content\":[{\"type\":\"text\",\"text\":\"pm2 logs\"}]},{\"type\":\"paragraph\",\"attrs\":{\"textAlign\":null},\"content\":[{\"type\":\"text\",\"text\":\"This will list the logs of all the running processes if you have multiple nuxt app setup.\"}]},{\"type\":\"codeBlock\",\"attrs\":{\"language\":\"bash\"},\"content\":[{\"type\":\"text\",\"text\":\"pm2 logs app-name\"}]},{\"type\":\"paragraph\",\"attrs\":{\"textAlign\":null},\"content\":[{\"type\":\"text\",\"text\":\"This will log for a specific Nuxt app.\"}]},{\"type\":\"codeBlock\",\"attrs\":{\"language\":\"bash\"},\"content\":[{\"type\":\"text\",\"text\":\"pm2 logs app-name --lines 100\"}]},{\"type\":\"paragraph\",\"attrs\":{\"textAlign\":null},\"content\":[{\"type\":\"text\",\"text\":\"This will show the older logs, the last 100 lines\"}]},{\"type\":\"codeBlock\",\"attrs\":{\"language\":\"bash\"},\"content\":[{\"type\":\"text\",\"text\":\"pm2 monit\"}]},{\"type\":\"paragraph\",\"attrs\":{\"textAlign\":null},\"content\":[{\"type\":\"text\",\"text\":\"This will show a more visual way to monitor logs alongside CPU and RAM usage\"}]},{\"type\":\"paragraph\",\"attrs\":{\"textAlign\":null},\"content\":[{\"type\":\"text\",\"text\":\"If your logs are getting too cluttered and you want to wipe them to start fresh\"}]},{\"type\":\"codeBlock\",\"attrs\":{\"language\":\"bash\"},\"content\":[{\"type\":\"text\",\"text\":\"pm2 flush\"}]},{\"type\":\"paragraph\",\"attrs\":{\"textAlign\":null},\"content\":[{\"type\":\"text\",\"text\":\"All these logs are located inside these locations.\"}]},{\"type\":\"paragraph\",\"attrs\":{\"textAlign\":null},\"content\":[{\"type\":\"text\",\"text\":\"Output console logs:\"}]},{\"type\":\"codeBlock\",\"attrs\":{\"language\":\"bash\"},\"content\":[{\"type\":\"text\",\"text\":\"~\u002F.pm2\u002Flogs\u002Fapp-name-out.log\"}]},{\"type\":\"paragraph\",\"attrs\":{\"textAlign\":null},\"content\":[{\"type\":\"text\",\"text\":\"Errors logs:\"}]},{\"type\":\"codeBlock\",\"attrs\":{\"language\":\"bash\"},\"content\":[{\"type\":\"text\",\"text\":\"~\u002F.pm2\u002Flogs\u002Fapp-name-error.log\"}]},{\"type\":\"paragraph\",\"attrs\":{\"textAlign\":null},\"content\":[{\"type\":\"text\",\"text\":\"This is the process to deploy our Nuxt application.\"}]}]}","https:\u002F\u002Fapi.csbyte.com\u002Fuploads\u002Feditor\u002F808571e8-1ce9-4e1b-901f-7afd81f4c7df_pm2.png",[11,12,13,14,15],"ssr","vuejs","deploy","ubuntu","nuxt",[17,18],"Deployment","NuxtJS",[15,20],"deployment","2026-05-02T08:11:55.437Z",[23,30,36,42,48,54,60,66,72],{"alias":24,"title":25,"description":26,"thumbnail":27,"createdAt":28,"tutorialAlias":29,"lessonAlias":29},"configure-profile-in-spring-boot","Configure different spring profiles in spring boot application","Managing Spring Boot profiles for different environments along with Docker","\u002Fuploads\u002Fthumbnails\u002F59a52e59-4b56-469d-8902-41af5e0f13dd_Spring-profil.jpeg","2026-06-20T04:51:27.098Z",null,{"alias":31,"title":32,"description":33,"thumbnail":34,"createdAt":35,"tutorialAlias":29,"lessonAlias":29},"securing-nuxt-ssr-app-with-cookies-sessions","Securing Nuxt SSR Apps with cookies sessions","Nuxt 4 App how to create an authentication system in SSR mode","\u002Fuploads\u002Fthumbnails\u002F6088642b-8dcb-4d13-bb68-f90084ddbe04_nuxt_ssr_logi.jpeg","2026-05-18T14:36:54.441Z",{"alias":37,"title":38,"description":39,"thumbnail":40,"createdAt":41,"tutorialAlias":29,"lessonAlias":29},"static-assets-vs-dynamic-routing-collision","Static Assets vs. Dynamic Routing Collision","Resolving the Static Assets vs. Dynamic Routing Collision","\u002Fuploads\u002Fthumbnails\u002F0f4d63d1-8ca4-472f-8f6d-9bd6919a88b9_nuxt_collisio.jpeg","2026-05-16T08:36:46.316Z",{"alias":43,"title":44,"description":45,"thumbnail":46,"createdAt":47,"tutorialAlias":29,"lessonAlias":29},"environment-variables-in-nuxt","The Definitive Guide to Environment Variables in Nuxt 4","How to create Environment Variables in Nuxt 4","https:\u002F\u002Fapi.csbyte.com\u002Fuploads\u002Feditor\u002Fe8a3c4e7-98a6-4114-a8c8-49ebb4a9522f_nuxt_env_cloudflare.png","2026-05-04T12:35:52.854Z",{"alias":49,"title":50,"description":51,"thumbnail":52,"createdAt":53,"tutorialAlias":29,"lessonAlias":29},"setting-nginx-ssl-for-spring-boot-application","Setup Nginx and SSL for Spring Boot Application","Setting Nginx as a reverse proxy in our Spring Boot application","\u002Fuploads\u002Fthumbnails\u002F5433c987-9e86-4d90-9cce-a831d1598ba4_spring-boot-nginx.png","2026-05-04T05:36:23.075Z",{"alias":55,"title":56,"description":57,"thumbnail":58,"createdAt":59,"tutorialAlias":29,"lessonAlias":29},"configure-nginx-as-reverse-proxy-in-nuxt","Configure Nginx as a reverse proxy in Nuxt application","Deploy and set up the nginx in Nuxt application","\u002Fuploads\u002Fthumbnails\u002F23c9fd84-6a39-40f1-876f-ba81011ccf06_nginx_nux.jpeg","2026-05-03T10:00:48.702Z",{"alias":61,"title":62,"description":63,"thumbnail":64,"createdAt":65,"tutorialAlias":29,"lessonAlias":29},"deploy-spring-boot-application-with-docker","Deploy Spring Boot Application with Docker on Ubuntu Server","The ultimate guide to deploying our Spring Boot application with Docker on an Ubuntu server","https:\u002F\u002Fapi.csbyte.com\u002Fuploads\u002Feditor\u002F55a11844-d1e9-4e83-80e5-c6bb6df7d58b_intellij-idea-build.png","2026-05-03T05:58:55.642Z",{"alias":67,"title":68,"description":69,"thumbnail":70,"createdAt":71,"tutorialAlias":29,"lessonAlias":29},"how-to-install-and-setup-the-docker-on-ubuntu","How to install and setup the docker on Ubuntu","Setting up Docker in Ubuntu Linux","https:\u002F\u002Fapi.csbyte.com\u002Fuploads\u002Feditor\u002F6c8baf8b-90b9-486c-8a92-56621ea6a234_show_container.png","2026-05-02T12:15:48.659Z",{"alias":73,"title":74,"description":75,"thumbnail":76,"createdAt":77,"tutorialAlias":29,"lessonAlias":29},"how-to-deploy-our-nuxt-application-to-cloudflare","How to deploy our nuxt application to cloudflare","Deploy our Nuxt application to Cloudflare using Wrangler","https:\u002F\u002Fapi.csbyte.com\u002Fuploads\u002Feditor\u002F19c8ef54-4006-4bfa-a07d-b2dd5e401c22_nuxt_deploy.png","2026-05-02T02:23:45.510Z"]