Rezha Julio

Hi!
My name is Rezha Julio
I am a chemist graduate from Bandung Institute of Technology. Currently working as Data Engineer at Traveloka.
You can reach me by email:

contact@rezhajulio.id

, @ Q Q

Powered by Hugo

filter by tags

How to Build Nginx with Google Pagespeed Support

time to read 3 min | 552 words

Nginx (engine-x) is an open source and high-performance HTTP server, reverse proxy and IMAP/POP3 proxy server. The outstanding features of Nginx are stability, a rich feature set, simple configuration and low memory consumption. This tutorial shows how to build a Nginx .deb package for Ubuntu 16.04 from source that has Google PageSpeed module compiled in.

PageSpeed is a web server module developed by Google to speed up the website response time, optimize the returned HTML and reduce the page load time. ngx_pagespeed features including:

  • Image optimization: stripping meta-data, dynamic resizing, recompression.
  • CSS & JavaScript minification, concatenation, inlining, and outlining.
  • Small resource inlining.
  • Deferring image and JavaScript loading.
  • HTML rewriting.
  • Cache lifetime extension.

see more https://developers.google.com/speed/pagespeed/module/.

Install the build dependencies

sudo apt-get install dpkg-dev build-essential zlib1g-dev libpcre3 libpcre3-dev unzip

Installing nginx with ngx_pagespeed

Step 1 - Add the nginx repository

Create a new repository file /etc/apt/sources.list.d/nginx.list with you favourite editor.

nano /etc/apt/sources.list.d/nginx.list

There you add the lines: Save the file and exit the editor.

deb http://nginx.org/packages/ubuntu/ xenial nginx
deb-src http://nginx.org/packages/ubuntu/ xenial nginx

Add the key and update the repository:

sudo sudo apt-key adv --keyserver keyserver.ubuntu.com --recv-keys ABF5BD827BD9BF62
sudo apt-get update

Step 2 - Download nginx 1.12 from ubuntu repository

Create a new directory for the nginx source files and download the nginx sources with apt:

cd ~
mkdir -p ~/compile/nginx_source/
cd ~/compile/nginx_source/
apt-get source nginx

Sometimes, there is an error: ‘packages cannot be authenticated’. You can solve it by typing command below:

rm -rf /var/lib/apt/lists/
apt-get update

Next, install all dependencies to build the nginx package.

apt-get build-dep nginx

Step 3 - Download Pagespeed

Create a new directory for PageSpeed and download the PageSpeed source. In this tutorial, we will use pagespeed 1.11.33.4 (latest stable one)

mkdir -p ~/compile/ngx_pagespeed/
cd ~/compile/ngx_pagespeed/
export ngx_version=1.11.33.4
wget https://github.com/pagespeed/ngx_pagespeed/archive/release-${ngx_version}.zip
unzip release-${ngx_version}.zip

cd ngx_pagespeed-release-${ngx_version}/
wget https://dl.google.com/dl/page-speed/psol/${ngx_version}.tar.gz
tar -xf ${ngx_version}.tar.gz

Step 4 - Configure nginx to build with Pagespeed

Go to the ‘nginx_source’ directory and edit the ‘rules’ file.

cd ~/compile/nginx_source/nginx-1.12.0-1/debian/
vim rules

Add this parameter under config.status.nginx and config.status.nginx_debug:

--add-module=~/compile/ngx_pagespeed/ngx_pagespeed-release-1.11.33.3-beta

Save and exit.

Step 5 - Build the nginx Ubuntu package and install it

Go to the nginx source directory and build nginx from source with the dpkg-buildpackage command:

cd ~/compile/nginx_source/nginx-1.12.0-1/
dpkg-buildpackage -b

The nginx Ubuntu package will be saved under ~/compile/nginx_source/. Once package building is complete, please look in the directory:

cd ~/compile/nginx_source/
ls

The Nginx Ubuntu package has been built. And install nginx and modules deb with dpkg command.

dpkg -i *.deb

Testing

Step 1 - Testing with the Nginx Command

Run nginx -V to check that the ngx_pagespeed module has been built into nginx.

Step 2 - Testing with Curl Command

Go to nginx configuration directory and edit default virtual host configuration file.

cd /etc/nginx/
nano nginx.conf

Paste configuration below to enable ngx_pagespeed.

pagespeed on;

# Needs to exist and be writable by nginx.  Use tmpfs for best performance.
pagespeed FileCachePath /var/ngx_pagespeed_cache;

# Ensure requests for pagespeed optimized resources go to the pagespeed handler
# and no extraneous headers get set.
location ~ "\.pagespeed\.([a-z]\.)?[a-z]{2}\.[^.]{10}\.[^.]+" {
  add_header "" "";
}
location ~ "^/pagespeed_static/" { }
location ~ "^/ngx_pagespeed_beacon$" { }

Save and exit. Next, test the nginx configuration file and make sure there is no error:

nginx -t

Restart nginx:

systemctl restart nginx

Finally, access the nginx web server with the curl command:

curl -I your-ip-address

Using Google URL Shortener with Your Domain! For Free!!

time to read 4 min | 845 words

I sometimes feel like URL shorteners are some of the most understated tools in internet marketing, and there have been more than a few times that I wished I’d had someone share some advice on URL shorteners.

For instance: What do you do with really long links? What if you want to track the results? What if the link—long and unwieldy—upstages the content? What if I am on a platform where every character count? (on Twitter for instance)

What URL Shorteners Do (And Don’t Do)

URL shorteners were originally created to address stubborn email systems that wrapped an email after 80 characters and broke any long URLs that might have been in the message. Once Twitter (and other social media) took off and introduced the 140-character limit, that shortened link became even more important.

It wasn’t long before link shorteners quickly became more than mere URL shorteners.

They began to allow publishers to track the links they posted with analytics. They keep URLs that are loaded with UTM tracking tags from looking ugly by hiding the length and characters in the UTM tracking system.

Sounds great, right? Who wouldn’t use this system?

Use A Custom Domain With URL Shorteners

With services like Domainr and IWantMyName, you can easily get a custom domain to use with link shorteners.

Why would you want to do this?

Using a custom domain with your link shortening service is a way to confront the spam and distrust issue.

Your links become branded as yours. Your brand, your name–it’s carried across into the very links that you are sharing. This helps let people know they aren’t spam. As long as your custom domain relates to your brand and you use it consistently, people will know that the links you are sharing have been vetted by you.

Also, a custom domain might improve the amount of clicks your link receives. According to RadiumOne, URL shorteners that offer vanity domains can increase sharing up to 25 percent.

What do I need?

This is the best part, you only need a couple of things which in this day and age you have probably already got access to.

  • A domain name, I’m going to be using go.rezhajulio.id . This domain should not be used for anything else.
  • Hosting space for the domain, this can be Apache or Nginx driven I’ll provide examples for both, you just need to be able to make a change to the vhost configuration. For Apache we can do this easily via the .htaccess file. Nginx people will probably be running a VPS or similar so I’ll assume you have access to create a new vhost configuration.
  • A Google account, if you want to have the URLs you generate with goo.gl be unique to your account and kept in your dashboard to track number of clicks etc. Otherwise anonymous access will work just fine to generate the URL.

I’m ready to go, what’s next?

Everything ready to go we can make the magic happen!

Apache configuration

Apache people create a .htaccess file in the root web directory and add the following lines to it. Of course if you have access to the main vhost configuration then use that to save Apache a little bit of leg work reading in the .htaccess file.

RewriteEngine On
RewriteRule ^(.*)$ http://goo.gl/$1 [L,R=301]

The code above is very simple. This rewrite rule simply takes the requested URL and swaps out your domain for the goo.gl domain and marks it as a permanent (301) redirect.

Nginx Configuration

Nginx people you need to create a server block, I’ve always followed the sites-available, sites-enabled pattern used by Nginx on Ubuntu as I find this to be the most organised method but do it however you’ve been working so long as Nginx can read this server block it will answer any calls to the domain.

server {
  server_name go.rezhajulio.id;
  rewrite ^ http://goo.gl$request_uri permanent;
}

The server block does the same as the Apache rule above and it redirects any requests onto goo.gl. Simple.

How do I use this to make my own short urls?

By now you’ve probably figured it out but just in case. Visit goo.gl and sign in if you want to keep statistics on your links otherwise you will just see the input box Paste your long URL here: follow the instructions and paste in your long URL and shorten that URL!

In return you’ll get a short URL in the form of http://goo.gl/ELenCw all we are interested in is the bit after the domain. We can then append that to our custom domain https://go.rezhajulio.id/ELenCw like so and you’re done!

Now when you use that URL it will first take a trip to your server where it will find the rewrite rules we setup, these will then send the request onto goo.gl to be translated into the long URL and the correct page.

Seriously is that it!?

Yup, that’s it. This method ensures you can still use the analytical data collected by the goo.gl service in their pretty graphs and you get to use your own domain.

Installing Varnish with nginx on Ubuntu 14.04

time to read 2 min | 418 words

About Varnish

Varnish is an HTTP accelerator and a useful tool for speeding up a server, especially during a times when there is high traffic to a site. It works by redirecting visitors to static pages whenever possible and only drawing on the server itself if there is a need for an active process.

Installing Varnish

I assume you already have a web working with nginx. On your terminal, run this command one by one

sudo apt-get install apt-transport-https
curl https://repo.varnish-cache.org/ubuntu/GPG-key.txt | apt-key add -
echo "deb https://repo.varnish-cache.org/ubuntu/ trusty varnish-4.0" >> /etc/apt/sources.list.d/varnish-cache.list
sudo apt-get update
sudo apt-get install varnish

This will install the latest varnish 4 to your system. If you don’t add varnish repo, you’ll only get varnish 3 from official ubuntu repo. Just replace trusty with your version of ubuntu if you don’t use 14.04.

Configuring Varnish

Once you have varnish installed, you can start to configure them to ease the load on your virtual private server.

Varnish will serve the content on port 80, while fetching it from nginx which will run on port 8080.

Go ahead and start setting that up by opening the /etc/default/varnish file:

sudo nano /etc/default/varnish

Find the lines under “DAEMON_OPTS”— in the Alternative 2 section, and change the port number by “-a” to 80. The configuration should match the following code:

 DAEMON_OPTS="-a :80 \
             -T localhost:6082 \
             -f /etc/varnish/default.vcl \
             -S /etc/varnish/secret \
             -s malloc,256m"

Next edit the file located at /etc/varnish/default.vcl. Change to port to from 80 to 8080 like below:

backend default {
    .host = "127.0.0.1";
    .port = "8080";
    .connect_timeout = 60s;
    .first_byte_timeout = 60s;
    .between_bytes_timeout = 60s;
    .max_connections = 800;
}

Because this server run Wordpress and Ghost, I need to tell Varnish to not cache the admin area of wordpress and ghost. Still on /etc/varnish/default.vcl I need to modify sub vcl_recv block into this

sub vcl_recv {
        if (!(req.url ~ "wp-(login|admin)")) {
                unset req.http.cookie;
        }

        if (!(req.url ~ "ghost")) {
                unset req.http.cookie;
        }
}

Now the next step would be to edit the port used by nginx. Each server(it you have it configured that way) would need to be switched from 80 to 8080. The location of my config files are /etc/nginx/sites-available.

Once you have made all of the required changes, restart varnish and nginx.

sudo service nginx restart
sudo service varnish restart

Accessing your domain should instantly take you to the varnish cached version. To test, you can run varnishstat, and that should give you live data as you access the domain affected by varnish.

RECENT SERIES

  1. java 101 (13):
    Apr 29, 2017 - Translating Scanner tokens into primitive types
  2. python data structure (5):
    May 03, 2017 - Enhance your tuples
  3. python function (2):
    Apr 16, 2017 - Lambda Functions in Python
  4. python generator (4):
    Apr 26, 2017 - Next, Function or Method ?

Friends of Rezha