Install Nginx di VPS Ubuntu/Debian

Server OS :
Debian 5 Lenny &
Ubuntu 9.04 jaunty

Nginx Version :
Stable 0.7.67
(from source)

Web Developer mana yang tidak tahu web server yang bernama Nginx (Engine X) ini, dan sudah pasti tahu perbedaan yang sangat signifikan dalam hal performance dengan web server yang lainnya. Beberapa keunggulan lainnya juga dapat dirasakan ketika nginx dijadikan sebagai reverse proxy untuk aplikasi web seperti Django, Tomcat, Glassfish atau web server yang lainnya seperti Apache dan lighttpd.

Akan lebih ringan lagi ketika anda membutuhkan php dalam nginx dengan menggunakan php-fpm. Berikut ini adalah beberapa langkah mudah yang anda bisa ikuti ketika anda mempunya sebuah server atau VPS yang menggunakan OS Ubuntu atau Debian. Langkah-langkah ini baru saya tes di Ubuntu 9.04 (Jaunty) dan Debian 5 (Lenny). Dengan menggunakan Nginx versi Stable terbaru yaitu 0.7.67 dan php 5.3.0.

Saya asumsikan server anda dalam keadaan bersih dan belum terinstall software apapun, agar lebih up-to-date, pastikan anda sudah melakukan langkah ini:

1 apt-get update
2 apt-get upgrade

Install terlebih dahulu paket yang di perlukan oleh nginx, untuk melihat paket apa saja yang diperlukan oleh nginx, gunakan cara berikut:

1 aptitude show nginx
2 ...
3 Depends: libc6 (>= 2.7-1), libpcre3 (>= 7.4), libssl0.9.8 (>= 0.9.8f-5), zlib1g (>= 1:1.1.4)
4 ...

Install paket-paket berikut ini:
1 aptitude install build-essential libc6 libpcre3 libpcre3-dev libpcrecpp0 libssl0.9.8 libssl-dev zlib1g zlib1g-dev lsb-base sysv-rc-conf

Dan pastikan anda memilih “Yes” septiap pertanyaan yang ada. Disini kita akan mengunstall nginx dari source (bukan dari package masing-masing OS). Download terlebih dahulu:
1 cd /usr/local/src
2 wget http://sysoev.ru/nginx/nginx-0.7.67.tar.gz
3 tar -zxf nginx-0.7.67.tar.gz

Setelah anda mendapatkan folder “nginx-0.7.67″ agar lebih memudahkan anda, rename folder menjadi “nginx”:
1
2
3
4

mv nginx-0.7.67 nginx
ls -l
drwxr-xr-x 8 root staff 4096 Aug 29 23:40 nginx
-rw-r--r-- 1 root staff 608462 Jun 15 16:55 nginx-0.7.67.tar.gz

Lalu masuk ke folder nginx, lakukan configure default seperti ini:
1 cd nginx
2 ./configure \
3 --sbin-path=/usr/local/sbin \
4 --conf-path=/etc/nginx/nginx.conf \
5 --pid-path=/var/run/nginx.pid \
6 --error-log-path=/var/log/nginx/error.log \
7 --http-log-path=/var/log/nginx/access.log \
8 --with-http_ssl_module \
9 --http-client-body-temp-path=/tmp/nginx_client \
10 --http-proxy-temp-path=/tmp/nginx_proxy \
11 --http-fastcgi-temp-path=/tmp/nginx_fastcgi

Setelah anda yakin dan siap install nginx, lakukan install nginx sebagai berikut:
1 make
2 make install

Tunggu proses sampai berhasil, dan pastikan tidak ada pesan error yang muncul. Jika ada pesan error atau failed, silahkan jangan sungkan, tanyakan disini melalui komentar di bawah. Siapa tahu saya bisa membantu :) .

Selamat, nginx di server anda sudah berhasil di install. Tinggal sekarang bagaimana caranya kita mengatur proses nginx melalui script int.d.
1 cd ~
2 nano /etc/init.d/nginx

Copy script ini untuk init.d nginx di server anda, anda bisa copas disini, atau dengan cara wget:
1 cd /etc/init.d
2 wget http://ddl.fauzievolute.com/etc/init.d/nginx

Pastikan file init.d ini bisa di eksekusi dengan baik oleh daemon dan berjalan otomatis ketika server anda pertama penyala atau setelah di reboot, dengan menggunakan perintah ini:
1 chmod u+x /etc/init.d/nginx
2 sysv-rc-conf --level 2345 nginx on

Jika tidak berhasil dengan cara di atas, anda bisa menjadikan nginx agar melulai otomatis ketika reboot dengan cara berikut:
1 /usr/sbin/update-rc.d -f nginx defaults

Kemudian gunakan script untuk konfigurasi utama nginx seperti ini. Atau dengan cara wget:
1 cd /etc/nginx
2 wget http://ddl.fauzievolute.com/etc/nginx/nginx.conf

Buat folder baru untuk virtual host:
1 cd /etc/nginx
2 mkdir sites-available
3 mkdir sites-enabled

Yang dimana folder ‘sites-available’ digunakan untuk kofigurasi situs yang tersedia, yang akan di symlink ke folder ‘sites-enabled’ agar bisa dibaca oleh konfigurasi utama nginx. Salah satu contohnya seperti berikut:

1 cd ~
2 nano /etc/nginx/sites-available/default

Masukkan script untuk default nginx disini, atau anda bisa download dengan cara wget:
1 cd /etc/nginx/sites-available
2 wget http://ddl.fauzievolute.com/etc/nginx/sites-available/default

Aktifkan konfigurasi virtualhost default anda, dengan cara:
1 ln -s /etc/nginx/sites-available/default /etc/nginx/sites-enabled/default

Jalankan nginx di server anda:
1 /etc/init.d/nginx start

Cek melalui browser anda melalui IP server anda. Jika berhasil, anda akan melihat text Welcome to Nginx!

Nginx dan php-fpm di Ubuntu 10.04

Belum lama ini php-fpm telah update ke php versi 5.3.3. Kemudahan serta optimalisasi webserver terutama pengguna VPS yang mempunya resource yang minimalis sangat cocok menggunakan dua paket instalasi ini.

Mengapa harus php-fpm?
Php-fpm adalah versi lightweight dari php yang dimana kita hanya mengunakan core php dan modul standar saja yang digunakan. Kelebihan lainnya php-fpm mempunya proses tersendiri yang bisa kita monitor dan atur sedemikian rupa.
Selengkapnya di : http://www.php-fpm.org

Mengapa harus nginx?
Nginx adalah webserver yang bisa di andalkan untuk server yang mempunya resource minimalis seperti VPS. Ukuran proses yang tidak terlalu banyak, tetapi bisa meng-handle semua proses yang berkaitan dengan web interface. Kelebihan utama nginx adalah kecepatan untuk akses file statis dari server lebih cepat dan stabil.
Selengkapnya di : http://wiki.nginx.org

Di dalam tutorial ini saya menggunakan instalasi versi package khusus untuk ubuntu dari ppa. Di dalam VPS paket VIR MEDIUM dari Magnet hosting dengan template os Ubuntu 10.04 LTS 32 Bit. Berikut ini adalah langkah cepat untuk instalasinya.

Pertama kita harus meng-update source paket yang akan kita gunakan dengan cara mengedit file /etc/apt/sources.list :

1 deb http://ubuntu.pesat.net.id/archive lucid main universe
2 deb http://security.ubuntu.com/ubuntu lucid-security main universe
3 # Source php-fpm
4 deb http://ppa.launchpad.net/brianmercer/php/ubuntu lucid main
5 # Source nginx
6 deb http://ppa.launchpad.net/nginx/stable/ubuntu lucid main

Sebelum di update, masukkan dulu key untuk ppa php-fpm :
1 apt-key adv --keyserver keyserver.ubuntu.com --recv-keys A42227CB8D0DC64F

Kemudian akan muncul pesan seperti ini :
1 Executing: gpg --ignore-time-conflict --no-options --no-default-keyring --secret-keyring /etc/apt/secring.gpg --trustdb-name /etc/apt/trustdb.gpg --keyring /etc/apt/trusted.gpg --primary-keyring /etc/apt/trusted.gpg --keyserver keyserver.ubuntu.com --recv-keys A42227CB8D0DC64F
gpg: requesting key 8D0DC64F from hkp server keyserver.ubuntu.com
2 gpg: key 8D0DC64F: public key "Launchpad Brian's PPA" imported
3 gpg: Total number processed: 1
4 gpg: imported: 1 (RSA: 1)

Lalu masukkan juga source ppa key untuk nginx :
1 apt-key adv --keyserver keyserver.ubuntu.com --recv-keys C300EE8C

Kemudian akan muncul pesan seperti ini :
1 Executing: gpg --ignore-time-conflict --no-options --no-default-keyring --secret-keyring /etc/apt/secring.gpg --trustdb-name /etc/apt/trustdb.gpg --keyring /etc/apt/trusted.gpg --primary-keyring /etc/apt/trusted.gpg --keyserver keyserver.ubuntu.com --recv-keys C300EE8C
2 gpg: requesting key C300EE8C from hkp server keyserver.ubuntu.com
3 gpg: key C300EE8C: public key "Launchpad Stable" imported
4 gpg: Total number processed: 1
5 gpg: imported: 1 (RSA: 1)

Setelah kedua key ring tersebut berhasil masuk, lakukan update dan upgrade:
1 apt-get update
2 apt-get upgrade

Kemudian install paket nginx :
1 apt-get install nginx

lalu install juga paket php yang sesuai dengan kebutuhan anda :
1 apt-get install php5-fpm php5-mysql php5-json php5-mcrypt php5-curl php5-imap php5-gd

Setelah keduanya berhasil di install, anda bisa start nginx dan php-fpm dengan cara :
1 service nginx start
2 service php5-fpm start

Selamat mencoba dan semoga berhasil :) jika ada trouble dan sudah merasa benar mengikuti tutorial ini silahkan komentarkan masalah anda disini, mungkin bisa saya bantu untuk memecahkannya.

Facebook Style Sheet Hack

Sekarang mari kita membahas bagaimana kita bisa membuat style aplikasi atau situs Facebook dan agar terlihat dan benar-benar seperti beberapa aplikasi milik Facebook platform. Saya telah memeriksa warna, huruf, dimensi dan beberapa pola desain umum yang oleh Facebook diterapkan dalam aplikasinya.

Jadi, jika anda mempunyai niat untuk membuat sebuah aplikasi facebook atau situs yang serupa dengan style yang digunakan Facebook, tidak ada salahnya anda mecoba style yang akan saya tulis disini.

Dengan menggunakan beberapa tools yang terdapat di browser, saya dapat mengetahui beberapa style dan elemen apa saja yang digunakan dalam facebook style itu. Saya tidak akan membahas secara rinci tentang proses ini, singkatnya saya hanya menggunakan Firebug salah satu ekstensi Firefox dan Chrome yang digunakan untuk mengorek style atau source code pada sebuah situs.

Mari kita lihat beberapa unsur penting dari kategori CSS dan kemudian saya akan menjelaskan bagaimana untuk mempraktekannya pada beberapa elemennya.

Warna Dasar dari CSS Facebook

Facebook menggunakan model warna yang sederhana, dan ini merupakan penggunaan yang cukup efektif. Teks pada umumnya mempunyai warna dari terang ke gelap abu-abu (tidak hitam) dari beberapa link dalam “Si Biru Facebook” itu. Untuk warna background dan border, Facebook menggunakan sepasang warna terang dan gelap pada satu variasi warna untuk membuatnya terlihat kontras.

Si Biru Facebook
Biru Facebook #3b5998

Warna Text/Font
Light Text #999999
Medium Text #666666
Dark Text #333333
Warna Link #3b5998

Grey Box
Background #f7f7f7
Border #CCCCCC

Blue Box
Background #eceff6
Border #d4dae8

Information Box
Background #fff9d7
Border #e2c822

Error Box
Background #ffebe8
Border #dd3c10

Tipografi Facebook

Sebuah penelitian kecil saya membuktikan, bahwa font-family dari “Si Biru” yang digunakan secara global, seperti ini:

[css]
body {
font-family: “lucida grande”, tahoma, verdana, arial, sans-serif;
}
[/css]

Icon Pada Halaman Facebook

Facebook menggunakan icon 16×16 px pada seluruh aplikasi mereka. Untuk tampilan dan nuansa yang sama dengan kemampuan ekspansi secara besar-besaran, lihat selengkapnya di FamFamFam Icon.

Jika Anda perhatikan dengan saksama pada beberapa icon di famfam, anda akan melihat salah satu ikon yang digunakan untuk komentar di facebook.
Komponen Utama Style Facebook

Gray Box

[html]
Terlihat dengan baik seperti grey box yang ada di facebook?

[/html]

Terlihat dengan baik seperti grey box yang ada di facebook?

Blue Box : Komentar

[html]
Terlihat dengan baik seperti komentar yang ada di facebook?

[/html]

Terlihat dengan baik seperti komentar yang ada di facebook?

Info Box : Peringatan

[html]
Terlihat dengan baik seperti informasi yang ada di facebook?

[/html]

Terlihat dengan baik seperti informasi yang ada di facebook?

Error Box : Pesan Error

[html]
Terlihat dengan baik seperti pesan error yang ada di facebook?

[/html]

Terlihat dengan baik seperti pesan error yang ada di facebook?

Facebook Tabs yg terdapat dalam Profil

[html]
Facebook Tab #1
Facebook Tab #2
Facebook Tab #3
Facebook Tab #4
[/html]

Facebook Tab #1Facebook Tab #2Facebook Tab #3Facebook Tab #4

Selanjutnya Bagaimana Cara Menggunakan Komponen tersebut?

Ini sebenarnya cukup mudah, kode contoh di atas akan membantu Anda memulai menyesuaikan tampilan aplikasi anda seperti layaknya facebook. Pada dasarnya, Anda hanya perlu mengatur kelas dari div atau elemen jangkar kelas yang sesuai dalam stylesheet. Jika Anda ingin menggunakan Facebook sebagai dasar styling pada aplikasi anda, gunakan wrapper pada konten Anda dengan div “fbbody”.

Anda tidak perlu menggunakan lagi file CSS di aplikasi anda, karena facebook telah menyediakannya untuk anda.

Jika anda benar-benar membutuhkan file CSS facebook ini, anda bisa mendownloadnya disini.
Facebook Style Sheet

Membangun Proxy di Ubuntu Server

Proxy server sudah banyak digunakan akhir-akhir ini di beberapa warnet pada umumnya. Kelebihannya tidak hanya menyimpan cache dari situs-situs yang mempunyai static content, bisa juga menghemat BW untuk warnet yang menggunakan type bw non-metered. Oke, untuk yang belum tau apa itu proxy server mari kita lihat disini.

Kita mulai saja cara instalasi proxy server di ubuntu 10.04 server. Disini kita asumsikan bahwa server telah di update dan di upgrade, tinggal kita console lewat Putty.
Yang Dibutuhkan

Spesifikasi minimum untuk membuat proxy server:
- Ubuntu 10.04 LTS 64 bit
- Processor Dual Core
- RAM 1 GB
- HDD SATA 250 GB


Install paket Dasar
1 apt-get install squid squidclient squid-cgi gcc \
2 build-essential sharutils ccze libzip-dev automake1.9

Install Lusca
1 wget http://ddl.fauzievolute.com/squid/LUSCA_FMI.tar.gz
2 tar xzvf LUSCA_FMI.tar.gz
3 cd LUSCA_FMI

Setelah itu kita akan mulai compile dengan perintah sebagai berikut :
1 ./configure --prefix=/usr --exec_prefix=/usr \
2 --bindir=/usr/sbin --sbindir=/usr/sbin \
3 --libexecdir=/usr/lib/squid --sysconfdir=/etc/squid \
4 --localstatedir=/var/spool/squid --datadir=/usr/share/squid \
5 --enable-http-gzip --enable-async-io=24 --with-aufs-threads=24 \
6 --with-pthreads --enable-storeio=aufs --with-maxfd=65536 \
7 --enable-linux-netfilter --enable-arp-acl --enable-epoll \
8 --enable-removal-policies=heap --with-aio --with-dl --enable-snmp \
9 --enable-delay-pools --enable-htcp --enable-cache-digests \
10 --disable-unlinkd --enable-large-cache-files --with-large-files \
11 --enable-err-languages=English --enable-default-err-language=English

Setelah itu kita akan install paket tersebut:
1 make && make install

Konfigurasi Proxy Server
Setelah semuanya terinstall dengan baik, pindah ke direktori /etc/squid, lalu ganti file squid.conf dengan yang baru, dan sebelumnya backup terlebih dahulu file squid.conf yang asli.
1 mv squid.conf squid.conf.asli
2 wget http://ddl.fauzievolute.com/squid/config/squid.conf

Masukkan juga script perl untuk rewrite situs-situs tertentu yang mempunya dynamic content.
1 wget http://ddl.fauzievolute.com/squid/config/storeurl.pl

Ganti juga script init.d untuk squid :
1 cd /etc/init.d
2 rm squid
3 wget http://ddl.fauzievolute.com/squid/other/squid
4 chmod +x squid

Stop dulu squidnya:
1 /etc/init.d/squid stop

Kemudian kita akan membuat direktori dasar untuk penyimpanan squid dan pengaturan permissionnya:
1 mkdir /cache
2 chown proxy:proxy /cache
3 chmod 777 /cache
4 chown proxy:proxy /etc/squid/storeurl.pl
5 chmod 777 /etc/squid/storeurl.pl
6 chmod 600 /etc/squid/squid.conf


Oke, konfigurasi untuk proxy sampai sini selesai, tinggal kita mengaktifkannya:
1 squid -f /etc/squid/squid.conf -z

Setelah itu, kita restart squid, kemudian reboot server agar konfigurasi terbaca dengan baik:
1 /etc/init.d/squid restart

Selamat mencoba dan semoga sukses, silahkan berikan komentar jika anda mendapatkan kendala dengan tutorial di atas ini.