Nginx for Front-end Developers - Load Balancers
Tags: showdev, webdev, tutorial, beginners
Published: 2019-06-16 12:35:51

---
title: Nginx for Front-end Developers - Load Balancers
published: true
description: To read more web development articles, visit - https://cloudnweb.dev
tags: showdev,webdev,tutorial,beginners
canoncial_url : https://cloudnweb.dev/2019/06/nginx-for-front-end-developers-load-balancers/
series: nginx
---

<!-- wp:paragraph -->
<p> In this article we will see, Nginx for Front-end Developers - Load Balancers.  this is a Part three of Nginx for Front-end Developers. To read the Previous articles</p>
<!-- /wp:paragraph -->

<!-- wp:list -->
<ul><li><a href="https://cloudnweb.dev/2019/05/nginx-for-front-end-developers/">Nginx for Front-end Developers - Part 1</a></li><li><a href="https://cloudnweb.dev/2019/06/nginx-for-front-end-developers-beyond-the-basics/">Nginx for Front-end Developers - Part 2</a></li></ul>
<!-- /wp:list -->

<!-- wp:paragraph -->
<p> Above all , Load balancers are an important feature in Nginx. we will see how to configure it in this article.</p>
<!-- /wp:paragraph -->

<!-- wp:heading {"level":3} -->
<h3>What is Load Balancing?</h3>
<!-- /wp:heading -->

<!-- wp:paragraph -->
<p>  Load Balancing is nothing but distributing the traffic to different servers. </p>
<!-- /wp:paragraph -->

<!-- wp:gallery {"ids":[715]} -->
<ul class="wp-block-gallery columns-1 is-cropped"><li class="blocks-gallery-item"><figure><img src="https://cloudnweb.dev/wp-content/uploads/2019/06/nginx_loadBalancer.png" alt="" data-id="715" data-link="https://cloudnweb.dev/?attachment_id=715#main" class="wp-image-715"/></figure></li></ul>
<!-- /wp:gallery -->

<!-- wp:paragraph -->
<p> Mainly, there are three mechanism with which the nginx distributes the request to the speicifed server.</p>
<!-- /wp:paragraph -->

<!-- wp:heading {"level":3} -->
<h3>Load Balancing Mechanism</h3>
<!-- /wp:heading -->

<!-- wp:list -->
<ul><li><strong>Round - Robin</strong> - this mechanism distributes the request to the server according to the server weight.</li></ul>
<!-- /wp:list -->

<!-- wp:code -->
<pre class="wp-block-code"><code>upstream backend {
   # no load balancing method is specified for Round Robin
   server backend1.example.com;
   server backend2.example.com;
}</code></pre>
<!-- /wp:code -->

<!-- wp:list -->
<ul><li><strong>Least - Connection</strong> -  this mechanism distributs the request to the server which has a least active connection</li></ul>
<!-- /wp:list -->

<!-- wp:code -->
<pre class="wp-block-code"><code>upstream backend {
    least_conn;
    server backend1.example.com;
    server backend2.example.com;
}</code></pre>
<!-- /wp:code -->

<!-- wp:list -->
<ul><li><strong>IP - Hash</strong> -  The server to which a request is sent is determined from the client IP address. In this case, either the first three octets of the IPv4 address or the whole IPv6 address are used to calculate the hash value. The method guarantees that requests from the same address get to the same server unless it is not available. </li></ul>
<!-- /wp:list -->

<!-- wp:code -->
<pre class="wp-block-code"><code>upstream backend {
    ip_hash;
    server backend1.example.com;
    server backend2.example.com;
}</code></pre>
<!-- /wp:code -->

<!-- wp:paragraph -->
<p><strong>upstream </strong>is the keyword used to specify the load balancer in nginx configuration.</p>
<!-- /wp:paragraph -->

<!-- wp:heading {"level":3} -->
<h3>Configuring Load Balancer in nginx</h3>
<!-- /wp:heading -->

<!-- wp:paragraph -->
<p>we are going to load balance the request to three different servers using the nginx load balancer.</p>
<!-- /wp:paragraph -->

<!-- wp:paragraph -->
<p>Further, create a three simple node server with different ports and run the server.</p>
<!-- /wp:paragraph -->

<!-- wp:paragraph -->
<p><strong>First Server</strong> - <strong>app.js</strong></p>
<!-- /wp:paragraph -->

<!-- wp:code -->
<pre class="wp-block-code"><code>const express = require('express');

const app = express();


app.get('/',(req,res) => {
     res.send("Welcome to Server 1");   
})

app.listen(3000,() => {
    console.log("app is listening to port 3000");
})</code></pre>
<!-- /wp:code -->

<!-- wp:paragraph -->
<p><strong>Second Server</strong> - <strong>app.js</strong></p>
<!-- /wp:paragraph -->

<!-- wp:code -->
<pre class="wp-block-code"><code>const express = require('express');

const app = express();

app.get('/',(req,res) => {
    res.send("Welcome to server 3");
})

app.listen(3001,() => {
    console.log("app is listening to port 3002");
})</code></pre>
<!-- /wp:code -->

<!-- wp:paragraph -->
<p><strong>Third Server</strong> - <strong>app.js</strong></p>
<!-- /wp:paragraph -->

<!-- wp:code -->
<pre class="wp-block-code"><code>const express = require('express');

const app = express();

app.get('/',(req,res) => {
    res.send("app is running in server 2");
});

app.listen(3002,() => {
    console.log("app is listening to port 3001");
})</code></pre>
<!-- /wp:code -->

<!-- wp:paragraph -->
<p> Meanwhile , Run all the servers with the following command</p>
<!-- /wp:paragraph -->

<!-- wp:code -->
<pre class="wp-block-code"><code>$ node app.js</code></pre>
<!-- /wp:code -->

<!-- wp:gallery {"ids":[726]} -->
<ul class="wp-block-gallery columns-1 is-cropped"><li class="blocks-gallery-item"><figure><img src="https://cloudnweb.dev/wp-content/uploads/2019/06/Screenshot-from-2019-06-16-03-20-40-1024x154.png" alt="" data-id="726" data-link="https://cloudnweb.dev/?attachment_id=726#main" class="wp-image-726"/></figure></li></ul>
<!-- /wp:gallery -->

<!-- wp:gallery {"ids":[727]} -->
<ul class="wp-block-gallery columns-1 is-cropped"><li class="blocks-gallery-item"><figure><img src="https://cloudnweb.dev/wp-content/uploads/2019/06/Screenshot-from-2019-06-16-03-20-58.png" alt="" data-id="727" data-link="https://cloudnweb.dev/?attachment_id=727#main" class="wp-image-727"/></figure></li></ul>
<!-- /wp:gallery -->

<!-- wp:gallery {"ids":[728]} -->
<ul class="wp-block-gallery columns-1 is-cropped"><li class="blocks-gallery-item"><figure><img src="https://cloudnweb.dev/wp-content/uploads/2019/06/Screenshot-from-2019-06-16-03-22-07-1024x91.png" alt="" data-id="728" data-link="https://cloudnweb.dev/?attachment_id=728#main" class="wp-image-728"/></figure></li></ul>
<!-- /wp:gallery -->

<!-- wp:paragraph -->
<p>Now, servers are running. After that, you need to configure nginx to load balance between these severs.</p>
<!-- /wp:paragraph -->

<!-- wp:paragraph -->
<p>I assume that you have already installed nginx and configured it before. if you are not, please follow<a href="https://cloudnweb.dev/2019/05/nginx-for-front-end-developers/"> this article</a> before continuing.</p>
<!-- /wp:paragraph -->

<!-- wp:paragraph -->
<p>create a file called <strong>node-app</strong> in the <strong>/etc/nginx/sites-available</strong>.</p>
<!-- /wp:paragraph -->

<!-- wp:paragraph -->
<p> (Note : I am using Ubuntu , the nginx file location is different for other operating systems)</p>
<!-- /wp:paragraph -->

<!-- wp:code -->
<pre class="wp-block-code"><code> upstream backend {

  server 127.0.0.1:3000;

  server 127.0.0.1:3001;

  server 127.0.0.1:3002;

 }

server {

     listen 80;

     server_name localhost;

      location / {

          proxy_pass "http://backend";

       }
}</code></pre>
<!-- /wp:code -->

<!-- wp:paragraph -->
<p>there are two directive that you need to note. </p>
<!-- /wp:paragraph -->

<!-- wp:list -->
<ul><li><strong>upstream </strong>- upstream is a directive to define the load balancer with contains the server name of the load balancing servers</li><li><strong>server </strong>-  it contains the server configuration and <strong>proxy_pass</strong> which contains the upstream load balancer</li></ul>
<!-- /wp:list -->

<!-- wp:paragraph -->
<p>After that, you need to move the file from <strong>sites-available</strong> to <strong>sites-enabled</strong></p>
<!-- /wp:paragraph -->

<!-- wp:code -->
<pre class="wp-block-code"><code>$ sudo ln -s /etc/nginx/sites-available/node-app /etc/nginx/sites-enabled</code></pre>
<!-- /wp:code -->

<!-- wp:paragraph -->
<p>  Similarly , restart the nginx service</p>
<!-- /wp:paragraph -->

<!-- wp:code -->
<pre class="wp-block-code"><code>$ sudo service nginx restart</code></pre>
<!-- /wp:code -->

<!-- wp:paragraph -->
<p>Once the nginx service resstarted successfully. visit the <strong>http://localhost</strong> in  the browser</p>
<!-- /wp:paragraph -->

{% youtube RuQ_pPOh4sE %}

<!-- wp:paragraph -->
<p> In conclusion , that's how the nginx load balance between different servers.</p>
<!-- /wp:paragraph -->

<!-- wp:paragraph -->
<p> To sum up, this article series covered <a href="https://cloudnweb.dev/2019/05/nginx-for-front-end-developers/">Nginx Setup</a>  , <a href="https://cloudnweb.dev/2019/06/nginx-for-front-end-developers-beyond-the-basics/">Basic Configuration </a> and Nginx Load Balancer</p>
<!-- /wp:paragraph -->

<!-- wp:paragraph -->
<p>Reference : </p>
<!-- /wp:paragraph -->

<!-- wp:paragraph -->
<p><a href="https://docs.nginx.com/nginx/admin-guide/load-balancer/http-load-balancer/">Official Nginx Documentation</a></p>
<!-- /wp:paragraph -->