Setup your own VPN server with Outline in less than 10 minutes

If you’ve stumbled upon this post via Google or search engine, I’m hoping that you’re already familiar with using VPN and you’ve already expected to see how to guide to setup your own VPN. If you’re not familiar with the term VPN below is the tl;dr for you to understand what VPN is.

TL;DR: Virtual Private Network (VPN) allows you to connect to the network which residing in different part of where you’re currently living. For example: if you’re living in Singapore and the VPN server that you’re connected to is in United States, the website or the app you’re accessing only to understand that you’re United States like you can browse some movies in Netflix which are only available in United States. VPN is not just about the location but it is also securing your data between your browser/app and the server you’re communicating. If you’re living in the country where some sites are blocked, you can use VPN to access those sites without being blocked.

Virtual Private Network (VPN)

Outline VPN

Outline VPN

Outline VPN is an open-source project created by Jigsaw that provides a safer way for individuals and organizations to access the open internet. What makes Outline VPN standout is that it lets you create, run, and share the access keys to your own VPN server with you don’t have to have much technical knowledge or going through all the complicated scripts to setup.

How to setup Outline VPN

This guide will walk you through how to setup your own Outline VPN server and create access keys to your devices such as computer, desktop, laptops , and mobile devices.

Sign up required at VPS providers

Outline VPN requires you to have your own virtual private server (VPS) which you can easily create an account at Digital Ocean, Amazon, Google Cloud Service, or Linode. I suggest you to use Digital Ocean which they offers $5 / month to run your own VPS server. Once you’ve finished setting up and provided necessary information like credit cards there, then you can follow the following steps.

Download Outline VPN Manager

Now, just head over to Outline website and download the Outline VPN manager for your operating system. If you’re using windows or mac, select the appropriate one.

Download Outline Manager

Install and run Outline Manager

After downloading the outline manager file for your operating system, please install and run Outline manager. Outline manager will probably look like this at the time of I am writing.

Outline Manager running on Ubuntu

As you can see the screenshot above, I’ve already setup two outline servers from different cloud providers.

Select VPS Provider

Now click “ADD SERVER” from the left menu and Outline will show you which provider you would like to setup. You can select Digital Ocean if you’ve created the account there. Press “CREATE SERVER”.

Cloud Provider selection in Outline VPN Manager

Select Location

It is important to know that you should decide which location you want to create your own VPS server to run outline VPN. For example: if you want to watch Netflix videos content available in U.S, you can select the New York or San Francisco. Once Outline has created the server, you can’t change it back. What you can also do is either you create a new VPS server in another region to install Outline VPS or destroy the existing one and create the new one again. It’s all up to your decision.

Location selection in Outline VPN Manager

Give authorization access at Digital Ocean

Next step, Outline Manager will open the browser and you have to give authorization access at Digital Ocean in order for Outline Manager to create the VPS server and install Outline VPN server on behalf of you. It may take about two minutes depending on the connection.

Create Key Access for your Outline VPN clients

You’ll see something similar like the screen below after the setup has been completed. All you have to do is to create the keys for your devices. “Acess keys” allow you to connect with your device and your Outline VPN. Click “Add new key” and it will automatically create the key for you. You can click on the name to provide the meaningful name so that you can easily remember.

Outline VPN Manager

Copy the Access Key

You can click Share Icon to copy the access key. The access invitation is something like below.

Share access key dialog in Outline VPN Manager

You’re invited to connect to my Outline server. Use it to access the open internet, no matter where you are. Follow the instructions on your invitation link below to download the Outline App and get connected.

https://s3.amazonaws.com/outline-vpn/invite.html#ss%3A%2F%2FY2hhY2hhMjAtaWV0Zi1wb2x5MTMwNTplVHFoVk5qbW5JdWo%40100.200.186.211%3A9875%2F%3Foutline%3D1

Having trouble accessing the invitation link?

Copy your access key: ss://[email protected]:9875/?outline=1
Follow our invitation instructions on GitHub: https://github.com/Jigsaw-Code/outline-client/blob/master/docs/invitation-instructions.md

Download Outline VPN Client App

Look for “Outline VPN” in Google Play Store for Android or Apps Store in iOS devices. Outline has clients for other platforms such as Windows, Mac, and Linux.

Outline App Clients

Installing Key for your Outline VPN client

After you have installed Outline VPN client in your phone or OS, all you have to do is to copy the access key from the previous step starting with ss:// protocol string ending with ?outline=1, Outline VPN client automatically detected and show you to add server. Tap “ADD SERVER”, Tap on “CONNECT” and you’re basically done.

Outline VPN Client Access Key Installation and Connecting to Outline VPN Server

Testing if you’re connected to VPN server

You can try searching “What’s my IP” in Google or What is my IP website and see if you’re connected to another location. You can disconnect from Outline VPN client and try to see the IP address you see with or without VPN are different.

Other Outline Manager VPN features

  • You can change port in outline VPN
  • Set the data limitation for each access keys to control the VPN usage

Benefits of using your own Outline VPN server

  • You only have to spend just about $5 / month for using virtual private server
  • You can create acess keys for your devices as much as you want without having to pay for additional fee
  • You can destroy your own VPN server or create a new one with different location

Conclusion

Overall, Outline VPN is quite easy to setup for most of the normal users without having to know so much about technical scripts and server configurations. What impressed me the most about Outline is that the team behind the project has done a great job at doing everything simple for the user with step by step easy to follow guidelines. The speed and the performance is quite fast in my experience with Outline VPN for over three months. I suggest you to try it out if you want to use your own VPN server.

Let me know if you’ve any questions about Outline VPN or any other problems while installing it. And don’t forget to share this article with your friends. Thank you!

How to create vintage retro effect in Photoshop

I used to do vintage alike photos with Photoshop. Some of my friends asked me how to do it. It wasn’t hard as you think but it is really depends on the color, contrast and tone involved in your photos.

I’m going to show you few steps that make your photos vintage retro alike using Photoshop.

Step 1

Open the photo in Photoshop. Here I used my puppy photo.

Step 2

In Layer Windows, click ‘Create new fill or adjustment layer’ and select ‘Curves’. (Press f7 if you don’t see Layer Windows)

Step 3

You just have created Curve layer, click ‘Curves 1’. In Adjustment Windows, select ‘Red’ Channel. and adjust the Red curve like below.

Step 4

Select ‘Green’ and apply the same thing.

Step 5

Select ‘Blue’ and adjust the curve too.

Step 6

Now go back to Layer Windows, and click ‘Create fill or adjustment layer’. This time, choose ‘Hue/Situation’.

Step 7

In Adjustment Windows, follow the numbers that i show below. Tick the Colorize check box. In Layer Windows, adjust the opacity level of the Hue/Situation layer you have just created.

Step 8

May be you can stop right here. But I want to go a little bit further than this stage. Now I’m going to create the Gredient Map. Click the ‘Create fill or adjustment layer’ and select ‘Gradient Map’ this time.

Step 9

In Adjustment Windows, try to find the pastel color tones. By default, pastel tones are not loaded in Gradient Map. Try clicking ‘>’ arrow icon and select Pastels. Select the pastel color that I choose here and in layers Windows, adjust the opacity of the Gradient Map layer. I set it 10% for this photo.

Now look at the changes before and after editing.

Before

After

If you have any questions or better suggestion leave the comment in this post.

How to use Google Web Fonts

It is really considered to be painful when it comes to design the website with the custom type faces. Web designers and developers are limited to use web safe fonts when specifying the type faces to make the site support in all OS platforms. Thanks to the modern web browsers, you can now use and embed the custom type faces in your website. There are many web font services out there that allow you to embed both commercial and free fonts. I’m going to cover Google web fonts in this post.

Google Web fonts

Google web fonts is a free service from Google that allows you to embed the fonts which are available in Google web fonts. To use google web fonts, please follow the steps.

Step 1

go to http://www.google.com/webfonts and click “start choosing fonts”.

Step 2

There are number of free fonts available in Google web fonts. You can filter by type faces, thickness, slant and width if you want. Select the fonts by clicking add to collection button. After you select the fonts, you can now click ‘use’. Using of too many font faces can slow down your site loading. Please use it wisely.

Step 3

Select the html link tag code that you found in next page and insert the code before head tag element. In order to use the font, you must have to apply the font family in your css file.

Sample HTML

<html>

<head>

<title>Google Web Font testing</title>

<link href='http://fonts.googleapis.com/css?family=Condiment|Asap' rel='stylesheet' type='text/css'>
<style type="text/css">
h1 {
font-family: 'Condiment', cursive, serif;
}
</style>
</head>

<body>
<h1>This is the Title - Condiment</h1>
</body>

</html>

Changing Password in WordPress

It is really important that you should change your password immediately when you logged in your wordpress panel for this first time after fresh installation of your WordPress. To change your password, click admin link next to “Howdy” text message in upper right corner of your WordPress panel Or type yourblogaddress.com/wp-admin/profile.php in browser address bar.

You can change Color scheme of your admin panel, First name, Last name, Nickname, Display name which is used for author name is blog post, contact information, etc in Profile section. This is a WordPress newbie series. I will keep posting like this tutorial in future.

Tilt-shift Fake Photography

The method of Tilt-shift is to focus on a single part of the photo and shift (blur) the other area. I am a huge fan of Tilt-shift and have been learning for a while. Tilt-shit lenses are too expensive for me and of course, I don’t have a professional camera too. But we can get the tilt shift photo with the help of Photoshop. There are so many Tilt-shift tutorials using Photoshop out there and we can learn and create our own ones. See the Tilt-shift photos below which I did in last week.

Tilt-shift photos

Oe Bo Prison Mandalay

Samitivej Hospital Bangkok

Platinum Mall Bangkok

Tilt-shift resources

Overview of WordPress Admin panel

After successful logged in your wordpress, you’ll see the wordpress dashboard. WordPress Dashboard includes Write, Manage, Design and Comments panel.

Wordpress Dashboard

Write

Write panel where you can write new post, page and link (blogroll).

Manage

Manage panel where you can manage posts, pages, categories, Tags, Media, Importing posts from wordpress xml file or other blogging system.

Design

Design panel where you can change or edit your themes uploaded in your server under wp-content/themes folder.

Comments

Comments panel where you can handle all the comments such as deleting, editing and marking comments as spam for your posts.

The rest are Setting, Plugins and Users. WordPress dashboard displays all the information like Recent comments, Incoming link, News feed from WordPress Development blog, popular plugins from WordPress plugin directory and other wordpress news.