Wern Ancheta

Adventures in Web Development.

Setting Up SSL on Apache

| Comments

In this blog post I’ll walk you through setting up SSL on Apache. When talking about SSL the popular choice is OpenSSL, an open source toolkit for implementing Secure Sockets Layer (SSL) and Transport Layer Security (TLS). So we will be using OpenSSL for this tutorial.

Install OpenSSL

The first thing that you need to do is to determine the latest version of OpenSSL from the sources page. Its usually the one that has a red color. Once you find that, copy its address then use wget to download it to your preferred directory:

wget http://www.openssl.org/source/openssl-1.0.1h.tar.gz

Next create the directory where you want to install openssl:

mkdir /usr/local/openssl

Extract the archive:

tar -xvzf openssl-1.0.1h.tar.gz

Then cd into it:

cd openssl-1.0.1h

Next execute the config command to set the installation path for openssl and check for any errors. This should be the same as the directory you created earlier:

./config --prefix=/usr/local/openssl --openssldir=/usr/local/openssl

Next execute make to compile the source code. If this doesn’t work for you try adding sudo before the actual command. After make is done and there aren’t any errors you can now execute make install to install the source files in there appropriate directories.

Once that’s done you can verify that openssl is successfully installed by executing the following command:

/usr/local/openssl/bin/openssl version

Generate Keys

Once you’re done with installing openssl you can now assign it to a variable:

export OpenSSL_HOME=/usr/local/openssl

And then add it to your system path:

export PATH=$PATH:$OpenSSL_HOME/bin

Next create a private key:

openssl genrsa 2048 > privatekey.pem

In the above command genrsa 2048 tells openssl to generate an RSA key that is 2048 bits long. RSA is basically just an algorithm used for encryption.

Next create a CSR (Certificate Signing Request) using the private key that we have just generated:

openssl req -new -key privatekey.pem -out csr.pem

The command above will ask for the following:

  • Country Name – use the 2 letter abbreviation of your country name
  • State or Province – (e.g California)
  • Locality Name – (e.g Palm Desert)
  • Organization Name – name of your company
  • Organization Unit – name of website
  • Common Name – domain name of website (e.g mywebsite.com)
  • Email Address – your email address

The information above will be used for the certificate that will be assigned to you later on so be sure to supply the correct information.

Enable SSL on Apache

Now that we have generated all the keys we need we can now configure apache to use those keys. First you have to enable the SSL module by executing the following command:

sudo a2enmod ssl

Then restart apache for changes to take effect:

sudo service apache2 restart

Next edit the ssl configuration file for apache:

sudo nano /etc/apache2/sites-available/default-ssl.conf

Comment out the following lines by adding a pound (#) sign before them:

SSLCertificateFile /etc/ssl/certs/ssl-cert-snakeoil.pem
SSLCertificateKeyFile /etc/ssl/private/ssl-cert-snakeoil.key

Next look for the following line:

<VirtualHost _default_:443>

And then under it set the server information:

ServerAdmin admin@mywebsite.com
ServerName mywebsite.com
ServerAlias www.mywebsite.com
DocumentRoot /home/www

Next look for SSLEngine On and then under it add the following:

SSLCertificateFile /home/wern/signed-certificate.crt 
SSLCertificateKeyFile /home/wern/privatekey.pem 

The SSLCertificateFile is where you specify the path to your websites digital certificate. I didn’t cover this step because there are a lot of certificate authorities out there. So far I’ve only tried with Namecheap and its pretty easy to acquire a certificate from them. Just create an account and then log in to it. Once you’re logged in just click on the security menu then select SSL certificates. From there just click on the button under the domain validation, add your preferred certificate to the cart and then just go through the steps. Once you have purchased a certificate just hover over your user name on the upper left side of the screen and then select manage ssl certificates. That will bring you to the page where all your certificates are listed. By default its just sitting there waiting to be configured. So all you have to do is configure it then select Apache + OpenSSL when it asks for your server configuration. And then it will ask for the csr. Just copy the contents of the csr.pem file that we generated earlier and paste it on the textarea which is asking for it. After that just click on submit and go through the steps provided by namecheap. Once everything is ok namecheap will send you the certificate via email. Just copy it and then save it on your server. The path to that file is what you need to assign to the SSLCertificateFile in apache. Next is the SSLCertificateKeyFile that’s the path to your private key. In our case its the privatekey.pem file.

Once that’s done you just have to enable it:

sudo a2ensite default-ssl.conf

And then restart apache so that the changes will take effect:

sudo service apache2 restart

That’s it! Enjoy your new https enabled website. The next step would be to redirect all http request to https but I’ll leave that one to you.

How I Work With Clients

| Comments

In this post I’m going to share some of the things I usually do when working with my clients.

Getting Projects

First off I’m not actively looking for work as I already have a full time job so I usually let potential clients to contact me for projects. My contact details are in the about me page and they can just contact me via my primary email or skype. I have twitter but I usually do not entertain people who contact me there. There’s also linked in but most of my contacts are recruiters which is no good because they usually come at you for full time jobs at a physical office somewhere.

Now that you know how I get client work its time to proceed with the how. So first thing that happens is that I receive an email or a skype contact request with some project details in it. Something like:

Hey I read your blog post on {Some blog post I’ve written before} and I think you would be able to do this project. {An overview of the project}. Is this something you’re interested in doing for us?

Depending on my current work load and how interesting the project is I either decline or accept the project. If I still got a bit of time and the project is interesting I usually say yes. If its not something interesting and I got a lot of free time after work I say no. I don’t really like doing something I don’t enjoy just for the sake of some cash.

Once I decided to accept the project I send an email saying that I accept the project. Here’s a template that I usually go with:

Hi {first name of client},

Yes I’m interested in this project. However I currently have a full time job thus I won’t be able to work on this project full time. I can only do this after I’m done with my work or on some free time on weekends. If you’re ok with this then I’ll happily accept this project.


As you can see above I always try to make it clear of my current occupation. Whether I currently have a job or another project that I’m working on. If the potential client is ok with it only then that the project begins.

Introductory Email

On the beginning of the project I usually send an email to introduce myself and some of the guidelines and process that I follow when working on a project. Something like this:

Hi {first name of client},

Thank you for understanding the situation. I can begin doing the project starting tomorrow. But first here are some guidelines that I follow when working on a project:

- First. All things that have something to do with the project should be added on Trello, a web-based project management software. I’ve already invited to it, please accept my invitation so you can familiarize yourself with it. If you have any questions, suggestions or clarifications regarding the project please add them on Trello.
- Second. If you need to talk to me you can contact me on Skype but first send an email that you want to talk to me and I’ll try to look for a good time to talk. Here is my skype user name: wernancheta
- Third. I may not always be available so please understand that I can’t always immediately reply to an email or a question on Trello.
- Fourth. I usually put a number of features into a group. Once a specific group is satisfactorily completed I ask for a payment.
- Fifth. Estimates cover up to 3 small revisions for each feature. Small revisions doesn’t take more than 10 minutes to do. Anything that will take longer than that I’ll have to charge an additional fee.


This usually goes smoothly and the client says ok.

Trello Workflow

Next is the Trello workflow. What I do is stick with the following list:

  • To do – this is where I put in items that we have talked about with my client.
  • Wont do – items that we have decided not to do. The usual reasons are that the client no longer wants the feature or it will be postponed at a later time.
  • Doing – items that are from the To do list that I’m currently working on.
  • Done – items that I believe are already done. I usually manually test the items before I move them to this list. When there are issues with the items the client can just comment their issue into the specific item. Once I found out that its a real issue that needs to be worked on then I move the item back into the Doing list.
  • Proposals – this contains the features that I consider necessary which the client didn’t mention. Items from here gets moved to the To do list once I get the clients approval.
  • Other Info – anything else about the project that doesn’t belong to any of the above. Initially this is where I put a quick tutorial about how to use Trello.

On each of the list I put in a README card to guide the client what each list is for.

Trello is great for clients who loves asking for project progress every second. Upon looking at Trello they already have an idea what still needs to be done, what I’m currently working on and what else I have to do.


When developing I usually push the files into Openshift because they offer free hosting up to 3 projects. Database is also covered so its really sweet considering the fact that its free. By using Openshift I can also ensure that my clients can’t just run away with the source code and call it a day. If I have already established a certain amount of trust with client and they have a server where I can put the source code then I use their server instead.


Lastly there’s the payments. I don’t receive payments up front. This is how I establish trust to the client. So if the client is not some kind of heartless villain who enjoys not paying for someone’s service I can usually expect them to pay. What I do is group the features that I’ll be working on into 2, 3 or 4 groups depending on the number of features. I usually arrive with 4 groups. This means that I’ll be asking the client for payment 4 times. Once the first group is satisfactorily done without issues I email my client. I go with the following template:

Hi {first name of client},

Here’s the break down for the {name of group}:

{List of features here}

Total: {total price}

You can pay in this email with paypal: {my paypal email address}


That’s it! You might have noticed that I didn’t mention anything about contracts. That’s because I don’t do contracts. I believe contracts just gives you the power to sue someone and go to court. Because I usually work remotely I don’t think I can go to court if my client is on the other side of the world. So if they don’t pay I’ll just pray for their souls.

What I’ve Been Up to Lately

| Comments

You might have noticed that I no longer publish new blog posts as frequently as I have before. That is because I’ve been busy with other stuff lately. It all started when I joined Islick Media last March. My job at Islick Media is pretty much the same as a regular job where you work 8 hours a day, 5 days a week. Nothing out of the ordinary.

Then I got an unexpected project from someone who read my blog post on Amazon Product Advertising API. I was hesitant at first because I’m already happy with my job and I am happy with my salary. After some pondering I thought that extra income would be nice so I tried to give it a shot and I emailed the person back, making it clear that I currently have a full time job and that I would only be able to do this project on my free time. The person then replied back saying that its ok. Then the rest is history. I got the project last April and until now the project is still ongoing so most of my free time goes into that.

Going back to the month of February I also tried emailing Sitepoint, a company dedicated to making awesome articles on web development. It was pretty much a cold email saying that I wanted to write for them. That I’ve been writing articles about web development for a while but I’ve only been doing it on my blog and that I wanted to try and make money doing it. I’ve waited but I didn’t get a reply after a week so I thought they’re not interested. But then after exactly a month, the managing editor of Sitepoint PHP Channel emailed me back with an apology for not getting back to me sooner. But the important part is that I got an ok. And man! that was the most awesome feeling ever! Sitepoint is one of the most popular websites which publishes resources (books, articles, courses) on web development. The fact that I get to write for them is really just awesome.

Lastly, I’m also occupied with my personal project hoping that it would turn into a nice source of passive income. I can’t tell something about the project yet but once I get it out there I’ll be publishing a blog post about it so stay tuned for that.

And that’s pretty much what I’ve been up to lately. I don’t think I’ll be able to write anything lengthy on blog soon. But I’ll try publishing some short tutorials so I still have fresh content in my blog even if I’m busy. But basically the series on the Whirlwind tour on Web Developer Tools isn’t going to continue soon. I’d like to provide as much information as I could on each part of the series. But I don’t think I have time to write lengthy posts so I’m going to temporarily stop the series.

That’s it for this blog post. At times like this I really wish the Hyperbolic Time Chamber was for real so I don’t need to prioritize things and just do everything I want to do.

Things I Learned on My Third Job

| Comments

Its been 3 months since I joined Islick Media, a Web Development shop based in Palm Desert, California. Just like with my previous jobs I work for them as a remote worker. In this blog post I’ll be sharing some of the things I’ve learned on the job.


Synxis is a reservation system. Its a pain in the neck to work with this one. Any code which has something to do with their reservation features are not accessible. At most you can only update the HTML for the header and footer part of the page. Uploading new files is also painful as you either have to install Java so you can run their image uploader or suck it up and upload files one by one.

Wordpress Theme Customization API

I’ve worked with the Wordpress Theme Customization API on my first project on the company. I’ve used it to give the users of the Wordpress theme that I’ve created a simple way of customizing the look and feel of the theme. Things like customizing the color of links, header and background images can go a long way in making your Wordpress theme easily customizable to non-programmers.


Zillow is a home and real estate marketplace dedicated to helping homeowners, home buyers, sellers, renters, real estate agents, mortgage professionals, landlords and property managers find and share vital information about homes, real estate, mortgages and home improvement. I’ve used their API in providing zestimates (zillow estimates) for real properties.


This is not the first time that I’ve learned about Laravel. Its some sort of a reacquaintance since I first used it in the year 2012 where it was only newly released. Fast-forward to 2014 there’s already a bunch of stuff that has changed and improved. Some of my previous knowledge were still of use but I also had to learn new stuff and new way of doing things. I’ve learned about the IoC container, and how to make use of external classes the laravel way. I also learned about the authentication class which makes writing the login functionality for your app a breeze.

Mailing Services

Mandrill and Mailgun are mailing services that I’ve used for sending out emails for my projects. Yes you can pretty much use the built-in mailing server on the server where your app is hosted. But the main advantage of using a mailing service over the built-in mailing server is authentication. With mailing services such as Mandrill or Mailgun you get the benefit of having your email come from a reputable server. This leads to a higher rate of the emails actually making it into your customers inbox and not the spam.


SPF and DKIM is a way to authenticate mailing services such as Mandrill and Mailgun to send on behalf of your server. So you can get a cool looking email like: awesomeness@coolness.com to work and actually make it to your customers inbox.

Amazon EC2

Short for Amazon Elastic Compute Cloud. Its basically a cloud computing platform. You can use it to host web applications and scaling is already taken care of. You can start with a fairly low performance and storage capacity server instance. And once you’ve met a certain point where the current instance is no longer performing well. You can just upgrade your current instance and all your stuff would still be in there.


Stripe is a company that provides a set of APIs for enabling businesses to accept and manage online payments. They have SDKs (Software Development Kit) available for different programming languages. Which is nice since no matter what programming language you’re using to write your app you can use the SDK to easily talk with the Stripe API. Stripe uses credit card for payments. One time payment and subscription based payments are automatically handled for you.


Twilio is a cloud communications company. They allow developers to provide SMS and Voice functionality to websites. I used twilio in my second project (Vmonial) with the company. Vmonial is an app that allows businesses to accept voice testimonials from their clients. I used the Twilio Voice API on the project. You can basically control the flow using XML files (TwiML) which uses tags like <Say>, <Record>, <Play>, <Gather> and <Response>.


WHM is sort of the big mama of cpanel. This is where you can manage cpanel instances, users, third party extensions, and lots of other stuff for managing a server.

Elastic Search

Elastic search is an open source, distributed and RESTful search engine. Its like Apache Solr which I’ve written about a few times in this blog. Lots of people says really good things about Elastic Search that’s why I gave it a try on my third project (Roof99) to handle the search. MySQL was not a choice since its a database and it would be terribly slow for searching. Elastic search on the other hand is a search index. Documents are stored in JSON format and querying can be done by using REST (Representational state transfer) calls.

Prediction IO

Prediction IO is an open source machine learning server. You can use it for creating personalized applications. With Prediction IO you can predict your users behavior, offer personalized content (E.g news, ads, jobs), help them discover things that they might like. All of this can be done by having the server silently record the users activity within your app such as viewing, liking, disliking, and rating something.

Phonegap / Cordova

Phonegap allows developers for creating mobile apps using web technologies (HTML, CSS, JavaScript). Installing stuff for compiling those HTML, CSS, and JavaScript files is really a pain. Sometimes you get an error that takes hours to solve. Thankfully there’s the Phonegap build service by Adobe that allows you to upload your source files and then after a second or two you can readily download the app installers for devices that you support. This is pretty neat since all you have to do is to write HTML, CSS, and JavaScript code like you always do, upload it to Phonegap build and boom! you now have an installer for every mobile app that you support. A QR code is also generated every time you update the source code of your app. You can then just use your phone or tablet’s QR code reader and it will directly download the installer provided you’re connected to the internet. There’s also hydration which allows you to easily update already installed apps. So if you upload a new version of your app on Phonegap build, and then you open up the app on the mobile device hydration will detect the updates and then it will ask you to update the app or not. So no more need to re-install the app every time a new version is uploaded. Lastly there’s also debugging tools provided that allows you to debug the current instance of the app on your mobile device from the browser. This is all really sweet and awesome but we still need to think about performance, app permissions, and writing the code in such a way that it will be easily maintainable. There’s also this mobile development mindset that you have to get into. What I’m saying is that you shouldn’t really write Phonegap apps the way you write web applications. Because the environment is different. In a browser environment clicking on the link will load up a new page but in an app what it will do is open up the browser and then navigate to that link. So basically most of the things that you need to perform in the server side will have to be done using AJAX requests. Updating the UI can be done by using templates and so on.

That’s it! for now. In the coming months I’ll be updating this post and share some more of the things I’ve learned on my current job.

A Whirlwind Tour of Web Developer Tools: Build Tools

| Comments

In this part seven of this series I’m going to walk you through build tools. As usual I’m going to summon a Wikipedia page to do the definition for me because I really suck at defining things:

Build automation is the act of scripting or automating a wide variety of tasks that software developers do in their day-to-day activities including things like compiling computer source code into binary code, packaging binary code, running tests, deployment to production systems, creating documentation and/or release notes

In other words build tools makes developers life easier by automating mundane tasks. In the web development world we commonly use build tools to lint, test, minify and deploy source code.

A Whirlwind Tour of Web Developer Tools: Source Control

| Comments

This is part seven of the series A Whirlwind Tour of Web Developer Tools. In this part I’m going to walk you through source control. Source control is also known as Version Control or Revision Control. Which ever term you have heard of before it means the same thing. Like I did with the previous parts of this series I bring you the definition of source control from Wikipedia since they really do a great job at defining things:

Revision control, also known as version control and source control (and an aspect of software configuration management), is the management of changes to documents, computer programs, large web sites, and other collections of information. Changes are usually identified by a number or letter code, termed the “revision number”, “revision level”, or simply “revision”. For example, an initial set of files is “revision 1”. When the first change is made, the resulting set is “revision 2”, and so on. Each revision is associated with a timestamp and the person making the change. Revisions can be compared, restored, and with some types of files, merged.

In simple terms version control is a way in which we can manage changes to a specific document. In the context of Web Development, the documents that we need to manage are the source files of the websites or web applications that we are building. Things like html files, stylesheets, script files, images, and other assets.

A Whirlwind Tour of Web Developer Tools: Package Managers

| Comments

In this part of the series I’ll walk you through package managers. I believe the definition available at Wikipedia really gives a good overview on what package managers are:

In software, a package management system, also called package manager, is a collection of software tools to automate the process of installing, upgrading, configuring, and removing software packages for a computer’s operating system in a consistent manner. It typically maintains a database of software dependencies and version information to prevent software mismatches and missing prerequisites.

In simple terms package managers make it easy to install and modify software. In this blog post we’ll be walking through some of the package managers available for Linux, Mac and Windows. And also package managers for easily installing front-end dependencies like jQuery or Twitter Bootstrap.

Getting Started With Zillow API

| Comments

In this tutorial were going to have a quick look at the Zillow API. But before we move on with actually writing some code lets first define what Zillow is. Taken from the Zillow about page itself:

Zillow is a home and real estate marketplace dedicated to helping homeowners, home buyers, sellers, renters, real estate agents, mortgage professionals, landlords and property managers find and share vital information about homes, real estate, mortgages and home improvement.

To sum it up Zillow is a place where you can find useful information on real estate properties that are up for sale or rent.

Being a Dark Matter Developer Must Be Nice

| Comments

It must be nice to be a dark matter developer. But before I go ahead and start going through why its nice to be a dark matter developer let’s make sure that were all on the same boat. First what are dark matter developers?

  • they don’t read blogs
  • they don’t write blogs
  • they don’t follow Paul Irish on Twitter
  • they don’t release code on Github
  • they only learn what their boss told them to learn
  • they don’t know what hacker news is
  • they don’t discuss tech outside of work
  • they don’t go to conferences
  • they only use stackoverflow to seek answers
  • they don’t listen to podcasts
  • they don’t need to update themselves of the cutting edge
  • they don’t experiment on different technologies
  • they don’t learn on their free time
  • they don’t subscribe to newsletters

I’m not saying that this is true for all dark matter developers. But most of the items above are definitely true for some developers even if they don’t necessarily consider themselves DMD’s.

A Whirlwind Tour of Web Developer Tools: Command Line Utilities

| Comments

In this part five of the series A Whirlwind Tour of Web Developer Tools I’ll walk you through some of the tools that you can use in the command line. But before we dive in to some of the tools lets first define what a command line is. According to Wikipedia:

A command-line interface (CLI), also known as command-line user interface, console user interface, and character user interface (CUI), is a means of interacting with a computer program where the user (or client) issues commands to the program in the form of successive lines of text (command lines).

So the command line is basically an interface where you can type in a bunch of commands to interact with the computer.