{"id":15638,"date":"2024-06-04T15:39:46","date_gmt":"2024-06-04T12:09:46","guid":{"rendered":"https:\/\/www.itpiran.net\/blog\/?p=15638"},"modified":"2024-06-04T15:39:46","modified_gmt":"2024-06-04T12:09:46","slug":"deploying-a-next-js-application-on-a-digitalocean-droplet","status":"publish","type":"post","link":"https:\/\/www.itpiran.net\/blog\/en\/tutorials\/deploying-a-next-js-application-on-a-digitalocean-droplet\/","title":{"rendered":"Deploying a Next.js application on a DigitalOcean Droplet"},"content":{"rendered":"<h2 id=\"%d9%85%d9%82%d8%af%d9%85%d9%87\">Introduction<\/h2>\n<p>Next.js is a popular React framework for easily building server-rendered React applications. In this tutorial, we will walk through deploying a Next.js application on a DigitalOcean droplet using Nginx as a reverse proxy. This step-by-step guide assumes that you have a ready-to-deploy Next.js application and a DigitalOcean account.<\/p>\n<h5 id=\"%d9%be%db%8c%d8%b4-%d9%86%db%8c%d8%a7%d8%b2%d9%87%d8%a7\">Prerequisites<\/h5>\n<ul>\n<li>A Next.js application<\/li>\n<li>A DigitalOcean account<\/li>\n<li>Registered domain name (optional but recommended)<\/li>\n<li>Local installation of Node.js and npm or yarn<\/li>\n<\/ul>\n<h2 id=\"%d9%85%d8%b1%d8%ad%d9%84%d9%87-1-%d8%a7%db%8c%d8%ac%d8%a7%d8%af-%db%8c%da%a9-digitalocean-droplet\">Step 1: Create a digitalocean Droplet<\/h2>\n<p>We will host our Next.js application on a DigitalOcean Droplet that we will configure ourselves. Let&#039;s create the droplet now.<\/p>\n<ul>\n<li>Log in to your DigitalOcean account and go to the Droplets section.<\/li>\n<li>Click \u201cCreate DROPLET\u201d.<\/li>\n<li>Select the Ubuntu image (preferably the latest LTS version).<\/li>\n<li>Choose the desired droplet size according to your needs and budget.<\/li>\n<li>For better performance, choose the closest data center area to your target audience.<\/li>\n<li>Add your SSH keys for secure access to your droplet.<\/li>\n<li>Choose a hostname for your droplet, which can be your domain name or any preferred name.<\/li>\n<li>Click \u201cCreate DROPLET\u201d.<\/li>\n<li>Create the Droplet<\/li>\n<\/ul>\n<p><img  loading=\"lazy\"  decoding=\"async\"  src=\"data:image\/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABAQMAAAAl21bKAAAAA1BMVEUAAP+KeNJXAAAAAXRSTlMAQObYZgAAAAlwSFlzAAAOxAAADsQBlSsOGwAAAApJREFUCNdjYAAAAAIAAeIhvDMAAAAASUVORK5CYII=\"  alt=\"\"  width=\"1350\"  height=\"1182\"  class=\"aligncenter wp-image-15639 size-full pk-lazyload\"  data-pk-sizes=\"auto\"  data-ls-sizes=\"auto, (max-width: 1350px) 100vw, 1350px\"  data-pk-src=\"https:\/\/cdn.itpiran.net\/2024\/06\/04151644\/create-droplet.png\"  data-pk-srcset=\"https:\/\/cdn.itpiran.net\/2024\/06\/04151644\/create-droplet.png 1350w, https:\/\/cdn.itpiran.net\/2024\/06\/04151644\/create-droplet-300x263.png 300w, https:\/\/cdn.itpiran.net\/2024\/06\/04151644\/create-droplet-1024x897.png 1024w, https:\/\/cdn.itpiran.net\/2024\/06\/04151644\/create-droplet-768x672.png 768w, https:\/\/cdn.itpiran.net\/2024\/06\/04151644\/create-droplet-110x96.png 110w, https:\/\/cdn.itpiran.net\/2024\/06\/04151644\/create-droplet-200x175.png 200w, https:\/\/cdn.itpiran.net\/2024\/06\/04151644\/create-droplet-380x333.png 380w, https:\/\/cdn.itpiran.net\/2024\/06\/04151644\/create-droplet-255x223.png 255w, https:\/\/cdn.itpiran.net\/2024\/06\/04151644\/create-droplet-550x482.png 550w, https:\/\/cdn.itpiran.net\/2024\/06\/04151644\/create-droplet-800x700.png 800w, https:\/\/cdn.itpiran.net\/2024\/06\/04151644\/create-droplet-1160x1016.png 1160w\" ><\/p>\n<p>After creating the Droplet, note the IP address assigned to it.<\/p>\n<h2 id=\"%d9%85%d8%b1%d8%ad%d9%84%d9%87-2-%d8%b1%d8%a7%d9%87-%d8%a7%d9%86%d8%af%d8%a7%d8%b2%db%8c-droplet\">Step 2: Launch the Droplet<\/h2>\n<p>Now that we have created the droplet, we need to prepare it so that it can accept incoming connections and route those connections to our Next.js application.<\/p>\n<p>SSH into your droplet using the IP address and SSH key you provided during droplet creation:<\/p>\n<div class=\"hcb_wrap\" data-no-translation=\"\" data-no-auto-translation=\"\">\n<pre class=\"prism line-numbers lang-bash\" data-lang=\"Bash\"><code>ssh root@&lt;DROPLET_IP&gt;\r\n<\/code><\/pre>\n<\/div>\n<p>Update and upgrade packages in Droplet:<\/p>\n<div class=\"hcb_wrap\" data-no-translation=\"\" data-no-auto-translation=\"\">\n<pre class=\"prism line-numbers lang-bash\" data-lang=\"Bash\"><code>sudo apt update &amp;&amp; sudo apt upgrade -y\r\n<\/code><\/pre>\n<\/div>\n<p>Install the required packages:<\/p>\n<div class=\"hcb_wrap\" data-no-translation=\"\" data-no-auto-translation=\"\">\n<pre class=\"prism line-numbers lang-bash\" data-lang=\"Bash\"><code>sudo apt install -y nodejs npm nginx\r\n<\/code><\/pre>\n<\/div>\n<h2 id=\"%d9%85%d8%b1%d8%ad%d9%84%d9%87-3-%d9%be%db%8c%da%a9%d8%b1%d8%a8%d9%86%d8%af%db%8c-nginx\">Step 3: Configure Nginx<\/h2>\n<p>Nginx is the tool that handles all the routing to our Next.js application. Create a new Nginx configuration file for your Next.js application:<\/p>\n<div class=\"hcb_wrap\" data-no-translation=\"\" data-no-auto-translation=\"\">\n<pre class=\"prism line-numbers lang-bash\" data-lang=\"Bash\"><code>sudo nano \/etc\/nginx\/sites-available\/nextjs\r\n<\/code><\/pre>\n<\/div>\n<p>Paste the following configuration, replacing server_name with your droplet domain name or IP address:<\/p>\n<div class=\"hcb_wrap\" data-no-translation=\"\" data-no-auto-translation=\"\">\n<pre class=\"prism line-numbers lang-plain\" data-lang=\"Plain Text\"><code>server {\r\nlisten 80;\r\nserver_name YOUR_IP_ADDRESS;\r\nlocation \/ {\r\nproxy_pass http:\/\/localhost:3000;\r\nproxy_http_version 1.1;\r\nproxy_set_header Upgrade $http_upgrade;\r\nproxy_set_header Connection 'upgrade';\r\nproxy_set_header Host $host;\r\nproxy_cache_bypass $http_upgrade;\r\n}\r\n}<\/code><\/pre>\n<\/div>\n<p>Save and close the file. Create a symbolic link to activate the configuration:<\/p>\n<div class=\"hcb_wrap\" data-no-translation=\"\" data-no-auto-translation=\"\">\n<pre class=\"prism line-numbers lang-bash\" data-lang=\"Bash\"><code>sudo ln -s \/etc\/nginx\/sites-available\/nextjs \/etc\/nginx\/sites-enabled\/\r\n<\/code><\/pre>\n<\/div>\n<p>Test the Nginx configuration for any syntax errors:<\/p>\n<div class=\"hcb_wrap\" data-no-translation=\"\" data-no-auto-translation=\"\">\n<pre class=\"prism line-numbers lang-bash\" data-lang=\"Bash\"><code>sudo nginx -t\r\n<\/code><\/pre>\n<\/div>\n<p><img  loading=\"lazy\"  decoding=\"async\"  src=\"data:image\/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABAQMAAAAl21bKAAAAA1BMVEUAAP+KeNJXAAAAAXRSTlMAQObYZgAAAAlwSFlzAAAOxAAADsQBlSsOGwAAAApJREFUCNdjYAAAAAIAAeIhvDMAAAAASUVORK5CYII=\"  alt=\"\"  width=\"1686\"  height=\"440\"  class=\"aligncenter wp-image-15640 size-full pk-lazyload\"  data-pk-sizes=\"auto\"  data-ls-sizes=\"auto, (max-width: 1686px) 100vw, 1686px\"  data-pk-src=\"https:\/\/cdn.itpiran.net\/2024\/06\/04152205\/check-nginx-config.png\"  data-pk-srcset=\"https:\/\/cdn.itpiran.net\/2024\/06\/04152205\/check-nginx-config.png 1686w, https:\/\/cdn.itpiran.net\/2024\/06\/04152205\/check-nginx-config-300x78.png 300w, https:\/\/cdn.itpiran.net\/2024\/06\/04152205\/check-nginx-config-1024x267.png 1024w, https:\/\/cdn.itpiran.net\/2024\/06\/04152205\/check-nginx-config-768x200.png 768w, https:\/\/cdn.itpiran.net\/2024\/06\/04152205\/check-nginx-config-1536x401.png 1536w, https:\/\/cdn.itpiran.net\/2024\/06\/04152205\/check-nginx-config-110x29.png 110w, https:\/\/cdn.itpiran.net\/2024\/06\/04152205\/check-nginx-config-200x52.png 200w, https:\/\/cdn.itpiran.net\/2024\/06\/04152205\/check-nginx-config-380x99.png 380w, https:\/\/cdn.itpiran.net\/2024\/06\/04152205\/check-nginx-config-255x67.png 255w, https:\/\/cdn.itpiran.net\/2024\/06\/04152205\/check-nginx-config-550x144.png 550w, https:\/\/cdn.itpiran.net\/2024\/06\/04152205\/check-nginx-config-800x209.png 800w, https:\/\/cdn.itpiran.net\/2024\/06\/04152205\/check-nginx-config-1160x303.png 1160w\" ><\/p>\n<p>If the configuration test was successful, restart Nginx:<\/p>\n<div class=\"hcb_wrap\" data-no-translation=\"\" data-no-auto-translation=\"\">\n<pre class=\"prism line-numbers lang-bash\" data-lang=\"Bash\"><code>sudo service nginx restart\r\n<\/code><\/pre>\n<\/div>\n<h2 id=\"%d9%85%d8%b1%d8%ad%d9%84%d9%87-4-%d8%a7%d8%b3%d8%aa%d9%82%d8%b1%d8%a7%d8%b1-%d8%a8%d8%b1%d9%86%d8%a7%d9%85%d9%87-next-js\">Step 4: Deploy the Next.js application<\/h2>\n<p>Next, we get a Next.js application into the Droplet. There are many options for doing this.<\/p>\n<ol>\n<li>Create an SSH key on the server, connect it to your GitHub account, and clone your repository.<\/li>\n<li>Create a Next.js application in Droplet<\/li>\n<\/ol>\n<p>For this tutorial, we will create a new Next.js application in our Droplet.<\/p>\n<p>SSH back into your droplet:<\/p>\n<div class=\"hcb_wrap\" data-no-translation=\"\" data-no-auto-translation=\"\">\n<pre class=\"prism line-numbers lang-bash\" data-lang=\"Bash\"><code>ssh root@&lt;DROPLET_IP&gt;\r\n<\/code><\/pre>\n<\/div>\n<p>Create a new Next.js application and follow the instructions:<\/p>\n<div class=\"hcb_wrap\" data-no-translation=\"\" data-no-auto-translation=\"\">\n<pre class=\"prism line-numbers lang-bash\" data-lang=\"Bash\"><code>cd \/var\/www\r\nnpx create-next-app nextjs<\/code><\/pre>\n<\/div>\n<p>Go to the Next.js application directory:<\/p>\n<div class=\"hcb_wrap\" data-no-translation=\"\" data-no-auto-translation=\"\">\n<pre class=\"prism line-numbers lang-bash\" data-lang=\"Bash\"><code>cd nextjs\r\n<\/code><\/pre>\n<\/div>\n<p>Install the program dependencies:<\/p>\n<div class=\"hcb_wrap\" data-no-translation=\"\" data-no-auto-translation=\"\">\n<pre class=\"prism line-numbers lang-bash\" data-lang=\"Bash\"><code>npm install\r\n<\/code><\/pre>\n<\/div>\n<p>Build the Next.js application:<\/p>\n<div class=\"hcb_wrap\" data-no-translation=\"\" data-no-auto-translation=\"\">\n<pre class=\"prism line-numbers lang-bash\" data-lang=\"Bash\"><code>npm run build\r\n<\/code><\/pre>\n<\/div>\n<p>Finally, run the Next.js application:<\/p>\n<div class=\"hcb_wrap\" data-no-translation=\"\" data-no-auto-translation=\"\">\n<pre class=\"prism line-numbers lang-bash\" data-lang=\"Bash\"><code>npm start\r\n<\/code><\/pre>\n<\/div>\n<p>Your Next.js application is now deployed and accessible on your droplet domain name or IP address. To have your application run in the background and automatically restart when the server crashes or restarts, you will need to use a process manager like PM2.<\/p>\n<h2 id=\"%d9%85%d8%b1%d8%ad%d9%84%d9%87-5-%d8%b1%d8%a7%d9%87-%d8%a7%d9%86%d8%af%d8%a7%d8%b2%db%8c-pm2-process-manager\">Step 5: Launch PM2 Process Manager<\/h2>\n<p>We started npm from within our Droplet. Sometimes this command may stop running for reasons like a server restart or an update needing to be installed. We will use a tool called PM2 to make sure our Next.js application is always running. PM2 will restart even if the Next.js application crashes.<\/p>\n<p>To install PM2 globally on your droplet:<\/p>\n<div class=\"hcb_wrap\" data-no-translation=\"\" data-no-auto-translation=\"\">\n<pre class=\"prism line-numbers lang-bash\" data-lang=\"Bash\"><code>sudo npm install -g pm2\r\n<\/code><\/pre>\n<\/div>\n<p>Go to the Next.js application directory (if it&#039;s not there already):<\/p>\n<div class=\"hcb_wrap\" data-no-translation=\"\" data-no-auto-translation=\"\">\n<pre class=\"prism line-numbers lang-bash\" data-lang=\"Bash\"><code>cd \/var\/www\/nextjs\r\n<\/code><\/pre>\n<\/div>\n<p>Start the Next.js application using PM2:<\/p>\n<div class=\"hcb_wrap\" data-no-translation=\"\" data-no-auto-translation=\"\">\n<pre class=\"prism line-numbers lang-bash\" data-lang=\"Bash\"><code>pm2 start npm --name \"nextjs\" -- start\r\n<\/code><\/pre>\n<\/div>\n<p>This command starts the Next.js application named \u201cnextjs\u201d using the npm start command. PM2 will automatically restart the application if the server crashes or restarts.<\/p>\n<p>To ensure PM2 starts at boot, run:<\/p>\n<div class=\"hcb_wrap\" data-no-translation=\"\" data-no-auto-translation=\"\">\n<pre class=\"prism line-numbers lang-bash\" data-lang=\"Bash\"><code>pm2 startup\r\n<\/code><\/pre>\n<\/div>\n<p>This command will create a script that you can copy and paste into your terminal to start PM2 at boot time.<\/p>\n<p>Save current PM2 processes:<\/p>\n<div class=\"hcb_wrap\" data-no-translation=\"\" data-no-auto-translation=\"\">\n<pre class=\"prism line-numbers lang-bash\" data-lang=\"Bash\"><code>pm2 save\r\n<\/code><\/pre>\n<\/div>\n<h2 id=\"%d9%86%d8%aa%db%8c%d8%ac%d9%87\">Result<\/h2>\n<p><img  loading=\"lazy\"  decoding=\"async\"  src=\"data:image\/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABAQMAAAAl21bKAAAAA1BMVEUAAP+KeNJXAAAAAXRSTlMAQObYZgAAAAlwSFlzAAAOxAAADsQBlSsOGwAAAApJREFUCNdjYAAAAAIAAeIhvDMAAAAASUVORK5CYII=\"  alt=\"\"  width=\"2722\"  height=\"1976\"  class=\"aligncenter wp-image-15641 size-full pk-lazyload\"  data-pk-sizes=\"auto\"  data-ls-sizes=\"auto, (max-width: 2722px) 100vw, 2722px\"  data-pk-src=\"https:\/\/cdn.itpiran.net\/2024\/06\/04153049\/nextjs-site.png\"  data-pk-srcset=\"https:\/\/cdn.itpiran.net\/2024\/06\/04153049\/nextjs-site.png 2722w, https:\/\/cdn.itpiran.net\/2024\/06\/04153049\/nextjs-site-300x218.png 300w, https:\/\/cdn.itpiran.net\/2024\/06\/04153049\/nextjs-site-1024x743.png 1024w, https:\/\/cdn.itpiran.net\/2024\/06\/04153049\/nextjs-site-768x558.png 768w, https:\/\/cdn.itpiran.net\/2024\/06\/04153049\/nextjs-site-1536x1115.png 1536w, https:\/\/cdn.itpiran.net\/2024\/06\/04153049\/nextjs-site-2048x1487.png 2048w, https:\/\/cdn.itpiran.net\/2024\/06\/04153049\/nextjs-site-110x80.png 110w, https:\/\/cdn.itpiran.net\/2024\/06\/04153049\/nextjs-site-200x145.png 200w, https:\/\/cdn.itpiran.net\/2024\/06\/04153049\/nextjs-site-380x276.png 380w, https:\/\/cdn.itpiran.net\/2024\/06\/04153049\/nextjs-site-255x185.png 255w, https:\/\/cdn.itpiran.net\/2024\/06\/04153049\/nextjs-site-550x399.png 550w, https:\/\/cdn.itpiran.net\/2024\/06\/04153049\/nextjs-site-800x581.png 800w, https:\/\/cdn.itpiran.net\/2024\/06\/04153049\/nextjs-site-1160x842.png 1160w\" ><\/p>\n<p>You have now successfully run a Next.js application on a DigitalOcean droplet using Nginx as a reverse proxy and PM2 as a process manager. Your application should be accessible at your droplet&#039;s domain name or IP address.<\/p>\n<p>If you are using a domain name, remember to configure your DNS settings. Point your domain&#039;s A record to your droplet&#039;s IP address so you can access the application using the domain name.<\/p>\n<p>For improved security and SEO, consider setting up SSL certificates using Let&#039;s Encrypt and implementing HTTPS connections. Additionally, you can explore optimizing your Next.js application with caching and other performance improvements.<\/p>","protected":false},"excerpt":{"rendered":"Introduction to Next.js, a popular React framework for building server-rendered React applications easily\u2026","protected":false},"author":1,"featured_media":15642,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_yoast_wpseo_focuskw":"\u0627\u0633\u062a\u0642\u0631\u0627\u0631 \u06cc\u06a9 \u0628\u0631\u0646\u0627\u0645\u0647 Next.js \u062f\u0631 DigitalOcean Droplet","_yoast_wpseo_title":"","_yoast_wpseo_metadesc":"","_yoast_wpseo_canonical":"","_yoast_wpseo_opengraph-description":"","_yoast_wpseo_opengraph-image":"","_yoast_wpseo_twitter-description":"","_yoast_wpseo_twitter-image":"","_yoast_wpseo_focuskeywords":"","_yoast_wpseo_primary_category":"193","footnotes":""},"categories":[193,363],"tags":[401,428],"class_list":{"0":"post-15638","1":"post","2":"type-post","3":"status-publish","4":"format-standard","5":"has-post-thumbnail","7":"category-tutorials","8":"category-programming","9":"tag-digitalocean","10":"tag-next-js"},"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v27.3 - https:\/\/yoast.com\/product\/yoast-seo-wordpress\/ -->\n<title>\u0627\u0633\u062a\u0642\u0631\u0627\u0631 \u06cc\u06a9 \u0628\u0631\u0646\u0627\u0645\u0647 Next.js \u062f\u0631 DigitalOcean Droplet - \u0628\u0644\u0627\u06af ITPiran<\/title>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/www.itpiran.net\/blog\/en\/tutorials\/deploying-a-next-js-application-on-a-digitalocean-droplet\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"\u0627\u0633\u062a\u0642\u0631\u0627\u0631 \u06cc\u06a9 \u0628\u0631\u0646\u0627\u0645\u0647 Next.js \u062f\u0631 DigitalOcean Droplet - \u0628\u0644\u0627\u06af ITPiran\" \/>\n<meta property=\"og:description\" content=\"\u0645\u0642\u062f\u0645\u0647 Next.js \u06cc\u06a9 \u0641\u0631\u06cc\u0645 \u0648\u0631\u06a9 \u0645\u062d\u0628\u0648\u0628 React \u0628\u0631\u0627\u06cc \u0633\u0627\u062e\u062a \u0628\u0631\u0646\u0627\u0645\u0647 \u0647\u0627\u06cc React \u0631\u0646\u062f\u0631 \u0634\u062f\u0647 \u062a\u0648\u0633\u0637 \u0633\u0631\u0648\u0631 \u0628\u0647 \u0631\u0627\u062d\u062a\u06cc&hellip;\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.itpiran.net\/blog\/en\/tutorials\/deploying-a-next-js-application-on-a-digitalocean-droplet\/\" \/>\n<meta property=\"og:site_name\" content=\"\u0628\u0644\u0627\u06af ITPiran\" \/>\n<meta property=\"article:published_time\" content=\"2024-06-04T12:09:46+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/cdn.itpiran.net\/2024\/06\/04153808\/Dgdrop.jpg\" \/>\n\t<meta property=\"og:image:width\" content=\"1793\" \/>\n\t<meta property=\"og:image:height\" content=\"1110\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/jpeg\" \/>\n<meta name=\"author\" content=\"admin\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"admin\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"1 minute\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\\\/\\\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\\\/\\\/www.itpiran.net\\\/blog\\\/tutorials\\\/deploying-a-next-js-application-on-a-digitalocean-droplet\\\/#article\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/www.itpiran.net\\\/blog\\\/tutorials\\\/deploying-a-next-js-application-on-a-digitalocean-droplet\\\/\"},\"author\":{\"name\":\"admin\",\"@id\":\"https:\\\/\\\/www.itpiran.net\\\/blog\\\/#\\\/schema\\\/person\\\/04ed27b919baca468a2273f8e4318f81\"},\"headline\":\"\u0627\u0633\u062a\u0642\u0631\u0627\u0631 \u06cc\u06a9 \u0628\u0631\u0646\u0627\u0645\u0647 Next.js \u062f\u0631 DigitalOcean Droplet\",\"datePublished\":\"2024-06-04T12:09:46+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\\\/\\\/www.itpiran.net\\\/blog\\\/tutorials\\\/deploying-a-next-js-application-on-a-digitalocean-droplet\\\/\"},\"wordCount\":123,\"commentCount\":0,\"publisher\":{\"@id\":\"https:\\\/\\\/www.itpiran.net\\\/blog\\\/#organization\"},\"image\":{\"@id\":\"https:\\\/\\\/www.itpiran.net\\\/blog\\\/tutorials\\\/deploying-a-next-js-application-on-a-digitalocean-droplet\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/cdn.itpiran.net\\\/2024\\\/06\\\/04153808\\\/Dgdrop.jpg\",\"keywords\":[\"Digitalocean\",\"next.js\"],\"articleSection\":[\"\u0622\u0645\u0648\u0632\u0634\u06cc\",\"\u0628\u0631\u0646\u0627\u0645\u0647 \u0646\u0648\u06cc\u0633\u06cc\"],\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\\\/\\\/www.itpiran.net\\\/blog\\\/tutorials\\\/deploying-a-next-js-application-on-a-digitalocean-droplet\\\/#respond\"]}]},{\"@type\":\"WebPage\",\"@id\":\"https:\\\/\\\/www.itpiran.net\\\/blog\\\/tutorials\\\/deploying-a-next-js-application-on-a-digitalocean-droplet\\\/\",\"url\":\"https:\\\/\\\/www.itpiran.net\\\/blog\\\/tutorials\\\/deploying-a-next-js-application-on-a-digitalocean-droplet\\\/\",\"name\":\"\u0627\u0633\u062a\u0642\u0631\u0627\u0631 \u06cc\u06a9 \u0628\u0631\u0646\u0627\u0645\u0647 Next.js \u062f\u0631 DigitalOcean Droplet - \u0628\u0644\u0627\u06af ITPiran\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/www.itpiran.net\\\/blog\\\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\\\/\\\/www.itpiran.net\\\/blog\\\/tutorials\\\/deploying-a-next-js-application-on-a-digitalocean-droplet\\\/#primaryimage\"},\"image\":{\"@id\":\"https:\\\/\\\/www.itpiran.net\\\/blog\\\/tutorials\\\/deploying-a-next-js-application-on-a-digitalocean-droplet\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/cdn.itpiran.net\\\/2024\\\/06\\\/04153808\\\/Dgdrop.jpg\",\"datePublished\":\"2024-06-04T12:09:46+00:00\",\"breadcrumb\":{\"@id\":\"https:\\\/\\\/www.itpiran.net\\\/blog\\\/tutorials\\\/deploying-a-next-js-application-on-a-digitalocean-droplet\\\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\\\/\\\/www.itpiran.net\\\/blog\\\/tutorials\\\/deploying-a-next-js-application-on-a-digitalocean-droplet\\\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/www.itpiran.net\\\/blog\\\/tutorials\\\/deploying-a-next-js-application-on-a-digitalocean-droplet\\\/#primaryimage\",\"url\":\"https:\\\/\\\/cdn.itpiran.net\\\/2024\\\/06\\\/04153808\\\/Dgdrop.jpg\",\"contentUrl\":\"https:\\\/\\\/cdn.itpiran.net\\\/2024\\\/06\\\/04153808\\\/Dgdrop.jpg\",\"width\":1793,\"height\":1110},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\\\/\\\/www.itpiran.net\\\/blog\\\/tutorials\\\/deploying-a-next-js-application-on-a-digitalocean-droplet\\\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\\\/\\\/www.itpiran.net\\\/blog\\\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"\u0622\u0645\u0648\u0632\u0634\u06cc\",\"item\":\"https:\\\/\\\/www.itpiran.net\\\/blog\\\/category\\\/tutorials\\\/\"},{\"@type\":\"ListItem\",\"position\":3,\"name\":\"\u0627\u0633\u062a\u0642\u0631\u0627\u0631 \u06cc\u06a9 \u0628\u0631\u0646\u0627\u0645\u0647 Next.js \u062f\u0631 DigitalOcean Droplet\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\\\/\\\/www.itpiran.net\\\/blog\\\/#website\",\"url\":\"https:\\\/\\\/www.itpiran.net\\\/blog\\\/\",\"name\":\"\u0628\u0644\u0627\u06af ITPiran\",\"description\":\"\u0627\u062e\u0628\u0627\u0631 \u0648 \u0645\u0642\u0627\u0644\u0627\u062a \u062a\u062c\u0627\u0631\u062a \u067e\u0627\u06cc\u062f\u0627\u0631 \u0627\u06cc\u0631\u0627\u0646\u06cc\u0627\u0646\",\"publisher\":{\"@id\":\"https:\\\/\\\/www.itpiran.net\\\/blog\\\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\\\/\\\/www.itpiran.net\\\/blog\\\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-US\"},{\"@type\":\"Organization\",\"@id\":\"https:\\\/\\\/www.itpiran.net\\\/blog\\\/#organization\",\"name\":\"\u0628\u0644\u0627\u06af \u062a\u062c\u0627\u0631\u062a \u067e\u0627\u06cc\u062f\u0627\u0631 \u0627\u06cc\u0631\u0627\u0646\u06cc\u0627\u0646\",\"alternateName\":\"ITPIran Blog\",\"url\":\"https:\\\/\\\/www.itpiran.net\\\/blog\\\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/www.itpiran.net\\\/blog\\\/#\\\/schema\\\/logo\\\/image\\\/\",\"url\":\"https:\\\/\\\/cdn.itpiran.net\\\/2023\\\/12\\\/27150508\\\/cropped-ITPIRAN-BLOG-LOGO-2.png\",\"contentUrl\":\"https:\\\/\\\/cdn.itpiran.net\\\/2023\\\/12\\\/27150508\\\/cropped-ITPIRAN-BLOG-LOGO-2.png\",\"width\":512,\"height\":512,\"caption\":\"\u0628\u0644\u0627\u06af \u062a\u062c\u0627\u0631\u062a \u067e\u0627\u06cc\u062f\u0627\u0631 \u0627\u06cc\u0631\u0627\u0646\u06cc\u0627\u0646\"},\"image\":{\"@id\":\"https:\\\/\\\/www.itpiran.net\\\/blog\\\/#\\\/schema\\\/logo\\\/image\\\/\"}},{\"@type\":\"Person\",\"@id\":\"https:\\\/\\\/www.itpiran.net\\\/blog\\\/#\\\/schema\\\/person\\\/04ed27b919baca468a2273f8e4318f81\",\"name\":\"admin\",\"url\":\"https:\\\/\\\/www.itpiran.net\\\/blog\\\/en\\\/author\\\/admin\\\/\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Deploying a Next.js application on a DigitalOcean Droplet - ITPiran Blog","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/www.itpiran.net\/blog\/en\/tutorials\/deploying-a-next-js-application-on-a-digitalocean-droplet\/","og_locale":"en_US","og_type":"article","og_title":"\u0627\u0633\u062a\u0642\u0631\u0627\u0631 \u06cc\u06a9 \u0628\u0631\u0646\u0627\u0645\u0647 Next.js \u062f\u0631 DigitalOcean Droplet - \u0628\u0644\u0627\u06af ITPiran","og_description":"\u0645\u0642\u062f\u0645\u0647 Next.js \u06cc\u06a9 \u0641\u0631\u06cc\u0645 \u0648\u0631\u06a9 \u0645\u062d\u0628\u0648\u0628 React \u0628\u0631\u0627\u06cc \u0633\u0627\u062e\u062a \u0628\u0631\u0646\u0627\u0645\u0647 \u0647\u0627\u06cc React \u0631\u0646\u062f\u0631 \u0634\u062f\u0647 \u062a\u0648\u0633\u0637 \u0633\u0631\u0648\u0631 \u0628\u0647 \u0631\u0627\u062d\u062a\u06cc&hellip;","og_url":"https:\/\/www.itpiran.net\/blog\/en\/tutorials\/deploying-a-next-js-application-on-a-digitalocean-droplet\/","og_site_name":"\u0628\u0644\u0627\u06af ITPiran","article_published_time":"2024-06-04T12:09:46+00:00","og_image":[{"width":1793,"height":1110,"url":"https:\/\/cdn.itpiran.net\/2024\/06\/04153808\/Dgdrop.jpg","type":"image\/jpeg"}],"author":"admin","twitter_card":"summary_large_image","twitter_misc":{"Written by":"admin","Est. reading time":"1 minute"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/www.itpiran.net\/blog\/tutorials\/deploying-a-next-js-application-on-a-digitalocean-droplet\/#article","isPartOf":{"@id":"https:\/\/www.itpiran.net\/blog\/tutorials\/deploying-a-next-js-application-on-a-digitalocean-droplet\/"},"author":{"name":"admin","@id":"https:\/\/www.itpiran.net\/blog\/#\/schema\/person\/04ed27b919baca468a2273f8e4318f81"},"headline":"\u0627\u0633\u062a\u0642\u0631\u0627\u0631 \u06cc\u06a9 \u0628\u0631\u0646\u0627\u0645\u0647 Next.js \u062f\u0631 DigitalOcean Droplet","datePublished":"2024-06-04T12:09:46+00:00","mainEntityOfPage":{"@id":"https:\/\/www.itpiran.net\/blog\/tutorials\/deploying-a-next-js-application-on-a-digitalocean-droplet\/"},"wordCount":123,"commentCount":0,"publisher":{"@id":"https:\/\/www.itpiran.net\/blog\/#organization"},"image":{"@id":"https:\/\/www.itpiran.net\/blog\/tutorials\/deploying-a-next-js-application-on-a-digitalocean-droplet\/#primaryimage"},"thumbnailUrl":"https:\/\/cdn.itpiran.net\/2024\/06\/04153808\/Dgdrop.jpg","keywords":["Digitalocean","next.js"],"articleSection":["\u0622\u0645\u0648\u0632\u0634\u06cc","\u0628\u0631\u0646\u0627\u0645\u0647 \u0646\u0648\u06cc\u0633\u06cc"],"inLanguage":"en-US","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/www.itpiran.net\/blog\/tutorials\/deploying-a-next-js-application-on-a-digitalocean-droplet\/#respond"]}]},{"@type":"WebPage","@id":"https:\/\/www.itpiran.net\/blog\/tutorials\/deploying-a-next-js-application-on-a-digitalocean-droplet\/","url":"https:\/\/www.itpiran.net\/blog\/tutorials\/deploying-a-next-js-application-on-a-digitalocean-droplet\/","name":"Deploying a Next.js application on a DigitalOcean Droplet - ITPiran Blog","isPartOf":{"@id":"https:\/\/www.itpiran.net\/blog\/#website"},"primaryImageOfPage":{"@id":"https:\/\/www.itpiran.net\/blog\/tutorials\/deploying-a-next-js-application-on-a-digitalocean-droplet\/#primaryimage"},"image":{"@id":"https:\/\/www.itpiran.net\/blog\/tutorials\/deploying-a-next-js-application-on-a-digitalocean-droplet\/#primaryimage"},"thumbnailUrl":"https:\/\/cdn.itpiran.net\/2024\/06\/04153808\/Dgdrop.jpg","datePublished":"2024-06-04T12:09:46+00:00","breadcrumb":{"@id":"https:\/\/www.itpiran.net\/blog\/tutorials\/deploying-a-next-js-application-on-a-digitalocean-droplet\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/www.itpiran.net\/blog\/tutorials\/deploying-a-next-js-application-on-a-digitalocean-droplet\/"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.itpiran.net\/blog\/tutorials\/deploying-a-next-js-application-on-a-digitalocean-droplet\/#primaryimage","url":"https:\/\/cdn.itpiran.net\/2024\/06\/04153808\/Dgdrop.jpg","contentUrl":"https:\/\/cdn.itpiran.net\/2024\/06\/04153808\/Dgdrop.jpg","width":1793,"height":1110},{"@type":"BreadcrumbList","@id":"https:\/\/www.itpiran.net\/blog\/tutorials\/deploying-a-next-js-application-on-a-digitalocean-droplet\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/www.itpiran.net\/blog\/"},{"@type":"ListItem","position":2,"name":"\u0622\u0645\u0648\u0632\u0634\u06cc","item":"https:\/\/www.itpiran.net\/blog\/category\/tutorials\/"},{"@type":"ListItem","position":3,"name":"\u0627\u0633\u062a\u0642\u0631\u0627\u0631 \u06cc\u06a9 \u0628\u0631\u0646\u0627\u0645\u0647 Next.js \u062f\u0631 DigitalOcean Droplet"}]},{"@type":"WebSite","@id":"https:\/\/www.itpiran.net\/blog\/#website","url":"https:\/\/www.itpiran.net\/blog\/","name":"ITPiran Blog","description":"Iranian Sustainable Trade News and Articles","publisher":{"@id":"https:\/\/www.itpiran.net\/blog\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/www.itpiran.net\/blog\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":"Organization","@id":"https:\/\/www.itpiran.net\/blog\/#organization","name":"Sustainable Iranian Business Blog","alternateName":"ITPIran Blog","url":"https:\/\/www.itpiran.net\/blog\/","logo":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.itpiran.net\/blog\/#\/schema\/logo\/image\/","url":"https:\/\/cdn.itpiran.net\/2023\/12\/27150508\/cropped-ITPIRAN-BLOG-LOGO-2.png","contentUrl":"https:\/\/cdn.itpiran.net\/2023\/12\/27150508\/cropped-ITPIRAN-BLOG-LOGO-2.png","width":512,"height":512,"caption":"\u0628\u0644\u0627\u06af \u062a\u062c\u0627\u0631\u062a \u067e\u0627\u06cc\u062f\u0627\u0631 \u0627\u06cc\u0631\u0627\u0646\u06cc\u0627\u0646"},"image":{"@id":"https:\/\/www.itpiran.net\/blog\/#\/schema\/logo\/image\/"}},{"@type":"Person","@id":"https:\/\/www.itpiran.net\/blog\/#\/schema\/person\/04ed27b919baca468a2273f8e4318f81","name":"admin","url":"https:\/\/www.itpiran.net\/blog\/en\/author\/admin\/"}]}},"_links":{"self":[{"href":"https:\/\/www.itpiran.net\/blog\/en\/wp-json\/wp\/v2\/posts\/15638","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.itpiran.net\/blog\/en\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.itpiran.net\/blog\/en\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.itpiran.net\/blog\/en\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.itpiran.net\/blog\/en\/wp-json\/wp\/v2\/comments?post=15638"}],"version-history":[{"count":1,"href":"https:\/\/www.itpiran.net\/blog\/en\/wp-json\/wp\/v2\/posts\/15638\/revisions"}],"predecessor-version":[{"id":15643,"href":"https:\/\/www.itpiran.net\/blog\/en\/wp-json\/wp\/v2\/posts\/15638\/revisions\/15643"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.itpiran.net\/blog\/en\/wp-json\/wp\/v2\/media\/15642"}],"wp:attachment":[{"href":"https:\/\/www.itpiran.net\/blog\/en\/wp-json\/wp\/v2\/media?parent=15638"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.itpiran.net\/blog\/en\/wp-json\/wp\/v2\/categories?post=15638"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.itpiran.net\/blog\/en\/wp-json\/wp\/v2\/tags?post=15638"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}