Setting up a wordpress blog with SSL and custom domain for $6 per month

When I started this blog I wanted to host it on Azure but it would have cost roughly $100/month with my requirements of SSL and custom domain. There are some nice benefits of Azure but I realised I needed a blog and WordPress is the king of blogs.

I started my blog on wordpress.com just so I could start writing before the enthusiasm fizzled out. This is really awesome for free blogs but the costs quickly add up if you want to add a custom domain, SSL and google analytics. All of this requires the business package and costs $25/month (at time of writing). You are also prevented from installing many themes and plugins here. I did some searching for a cheaper host and settled on DigitalOcean .

Create the WordPress droplet

Digital Ocean is a container based host. They call the containers droplets. To create your cheap WordPress site go to DigitalOcean and sign up. You get a month free with that link. After signing up select “Create Droplet”. In the page that opens click the “One Click Apps” tab.

Digital Ocean one click selection

 

Scroll down and select the WordPress 4.7 on 16.04

Digital Ocean wordpress application selection

 

Select the smallest size droplet. This should be fine as you start.

Digital Ocean price selection

 

I recommend getting a backup of your droplet. This is a weekly backup for $1/month. Pretty good deal I’d say.

Digital Ocean backup selection

 

That’s it! Just wait for the droplet to spin up. You’ll get an IP address and username password in an email. The IP is also available on your Droplets page.

Setup the WordPress blog

On windows you’ll have to download putty to log in to your new droplet. Visit http://www.chiark.greenend.org.uk/~sgtatham/putty/download.html and get the full msi installer.

Putty msi file

Use the IP, userame and password to log in to the new droplet using putty.



<pre class="code-pre "><code>ssh root@192.168.1.1</code></pre>

Next visit your wordpress site in your browser – http://192.168.1.1 – but replace the IP there with the one for your droplet and follow all the prompts to install WordPress. Don’t use “admin” as the main account.

Setup some security

Next you should set up some security on the droplet. run the following to display your passwords. The mysql secure installation script will ask for the root password later.


cat /root/.digitalocean_password

Then run

 mysql_secure_installation 

and follow the prompts. You probably want to say yes to everything.

Now make sure mysql is started

 service mysql start 

Setup your domain

If you have a custom domain then digital ocean can act as a nameserver for you for free. It’s best to configure digital ocean first before changing nameservers on the domain. If this is a new domain then add the following records under networking.

Create TXT records for


www.mycustomdomain.com VALUE www.mycustomdomain.com

*.mycustomdomain.com VALUE www.mycustomdomain.com

mycustomdomain.com VALUE www.mycustomdomain.com

and A records for


www.mycustomdomain.com VALUE 192.168.116.115

*.mycustomdomain.com VALUE 192.168.116.115

mycustomdomain.com VALUE 192.168.116.115

Now change the nameservers for your domain to point to digital oceans name servers.

Set up SSL

You can get free SSL with Let’s Encrypt. First get cert-bot.


sudo wget https://dl.eff.org/certbot-auto

then make it executable.

sudo chmod a+x /usr/local/sbin/certbot-auto

Then run for the domains you would like to add certs for.

 certbot-auto --apache -d mycustomdomain.com -d www.mycustodomain.com 

Using a cron job to renew your certs automatically

Open your crontab file

sudo crontab -e

and add the following line to the end of the file but replace XX with a number between 0 and 59

 XX 2 * * 1 /usr/local/sbin/certbot-auto renew >> /var/log/le-renew.log 

Start Writing

That’s it! You’re done. A wordpress blog with SSL and custom domain for $6.

5 learnings from hiring for an unfamiliar tech stack

I recently went through the process of hiring a new mobile developer for Android and iOS development. I’ve always been a .Net developer so I wasn’t very comfortable at the start. As I went through process I realized that it didn’t matter too much that I wasn’t an iOS/Android expert but I still learned some important things.

Intimate knowledge of the tech stack is a small part of the hiring decision

If you’ve hired before you probably use some sort of process like this.

  1. Screen resumes – 100% of candidates
  2. Behavioral interviews – 8% of candidates
  3. Take home tech tests – 6% of candidates
  4. Tech test reviews  – 4% of candidates [** Needs expertise in framework]
  5. Candidate comes in to discuss and review tech test [** Needs expertise in framework]
  6. Candidate meets team
  7. Decision
  8. Offer

As you can see the tech test and review can be outsourced to an expert (with your help). You should be able to do everything else. Even if you’re hiring for a senior developer, getting the behavioral part right is more important. If the candidate is right for the team the tech test decides at what level/salary they get hired.

Your general hiring knowledge will be fine for most of the process

If you’ve hired a developer before then most of what you know will still apply. You can easily short list candidates yourself. In fact after this process I feel far more confident in hiring for technical roles in subjects I don’t know a huge amount about.

In my opinion there are some basic traits I look for in a developer.

  • Attention to detail
  • Intellectual curiosity
  • Resilience – gets s**t done!
  • Can communicate effectively
  • Is not a dick

Of course you consider years of real experience, training etc as this will affect the speed at which the candidate becomes productive but if they’re keen to learn we have an existing code base full of great patterns to learn from and an awesome team who are happy to help out.

Get expert help

OK so you will need to check the candidates knowledge of their framework and their assertions of ability eventually. To do this you need to get help. No other way around it. iOS, Android, Javascript and .Net have complex ecosystems that are evolving far too quickly to keep up or pretend you know about them all well enough to hire for them (erm – unless you do, then sorry).

Luckily where I work we have guilds for iOS and Android. They actively encourage including them in hiring to keep the quality of their colleagues high. If this is your first hire for that stack and you don’t have anyone who can review the candidate just make sure you hire someone very senior – lot’s of highly rated apps in the relevant store, an awesome portfolio, recommendations and solid work history.

You can (and should) review the tech test too

If you have good experience in any programming stack you can do some evaluations yourself that should correlate highly with a strong candidate.

  • How much of the brief supplied to the candidate has been completed?
  • How clever is the general solution, how well structured?
  • Any tests around some critical parts of the code?
  • Can you build and run the code?
  • What kind of comments has the candidate added to their solution?

The expert should focus on framework details

Things that the expert can help you with vary but in general

  • Are they doing things the way the framework designers intended?
  • How many libraries do they use, which ones are common, which are weird and why?
  • Which libraries didn’t they use when it would have made things much easier?
  • How modern is the code – does it use the latest paradigms for that framework?

I like being present through all of this so the candidate has one person they know from all the stages in the hiring process. Even if I can’t contribute much directly. It’s a great opportunity to see how they will work with the people they will have to soon collaborate with!

 

Swagger UI: Custom HMAC hash authentication headers

Last year I launched a new API for an integration project. It’s using Microsoft’s WebApi framework. I was looking for a fast way to document the API so I wouldn’t have to do much work and clients could use the API easily. After some research it was obvious that I needed Swagger.

Swagger

Swagger (https://swagger.io) is an open source framework that makes it really easy to design, build and document APIs. At it’s core, it’s a specification for describing APIs. Once you have an API documented in swagger you get access to a huge number of free tools. There are tools available for automatically generating clients on rails, iOS, node, angular or Android and it has tools for generating detailed html documentation right off of your specification.

Swashbuckle

Swashbuckle (https://github.com/domaindrivendev/Swashbuckle) is an awesome wrapper around some of the swagger tools for .Net WebApi projects. You can just install it from nuget package manager. After installing, if you visit https://your-api.com/swagger you will see the resulting documentation. There are loads of options to make the documentation better and describe your API, mostly using attributes and XML comments on the controllers and models.

The hmac authentication problem

Swagger-ui supports HTTP Basic Authentication and OAuth2. Our API supports a cookie token authentication and it allows some endpoints to be accessed using an HTTP request hashing authentication based on Amazon Web Services (http://docs.aws.amazon.com/AmazonS3/latest/dev/RESTAuthentication.html). I needed to find a way to get swagger-ui to accept the credentials from the user, hash the details of the request and finally add the hash in to some headers we read on the server.

It took a bit of trial and error and some investigation to figure it out so I want to share it here.

Adding custom javascript and css to the swagger-ui page

You can inject css and javascript files onto the swagger-ui index using the swashbuckle configuration as you can see below. You just need add them in the configuration section as below.

I use moment.js to handle datetime manipulation in javascript – used for getting UTC time in ISO 8601 format. enc-base64, sha256 and hmac-sha1 are all from Google’s CryptoJS project. You can get them here: https://cdnjs.com/libraries/crypto-js. Import them using whatever module loader you prefer.

The content files must be set to Build Action: Embedded Resource in your .Net solution. Then you refer to them in the configuration using their resource names which is basically AssemblyName.Folder.Path.Filename.js.

Embedded Resource

 

.EnableSwaggerUi(c =&gt;
{
c.InjectStylesheet(assemblyType, "Api.SwaggerExtensions.swaggeroverrides.css");

c.InjectJavaScript(assemblyType, "Api.SwaggerExtensions.hmac-sha1.js");
c.InjectJavaScript(assemblyType, "Api.SwaggerExtensions.moment.js");
c.InjectJavaScript(assemblyType, "Api.SwaggerExtensions.enc-base64.js");
c.InjectJavaScript(assemblyType, "Api.SwaggerExtensions.sha256.js");
c.InjectJavaScript(assemblyType, "Api.SwaggerExtensions.apihmacheaderauth.js");

c.CustomAsset("index", assemblyType, "Api.SwaggerExtensions.custom.index.html");
}

The custom index.html is just used to set some titles. You should change the custom.html as little as possible so you can easily upgrade to the next version of Swashbuckle or swagger.

Overriding the swagger authentication

Everything for the HMAC authentication is done in apihmacheaderauth.js. The swagger-ui library exposes an authorizations pattern that gives you access to the HTTP request context and all of it’s properties as you can see below. I’ve over commented and consoled just for this tutorial.

This file adds some custom headers for authentication and authorization based on Amazon’s hmac pattern for AWS. I’ll get in to why I chose to do this in another post. In retrospect it was too heavy handed for sure. It also has to use custom headers rather than the Authorization header to lazily support multiple Authentication scenarios with precedence. Sorry about the lack of indentation, it got destroyed by wordpress.

(function () {
$(function () {

/*I add the ui elements I need here. I thought it would be better put them in here at runtime rather than hard code them in the index.html in case the index.html from my version of swashbuckle is made obsolete in a future version of the package. */
var hmacAuthUi =
'
&lt;div class="input"&gt;&lt;label for="input_api_username"&gt;Api Username: &lt;/label&gt;&lt;input placeholder="Api Username" id="input_api_username" name="input_api_username" type="text" size="20"&gt;&lt;/div&gt;
' +
'
&lt;div class="input"&gt;&lt;label for="input_api_hmackey"&gt;Api Key: &lt;/label&gt;&lt;input placeholder="ApiKey" id="input_api_hmackey" name="input_api_hmackey" type="text" size="20"&gt;&lt;/div&gt;
' +
'
&lt;div class="input"&gt;&lt;label for="input_customer_api_username"&gt;Customer Username: &lt;/label&gt;&lt;input placeholder="User Name" id="input_customer_api_username" name="input_customer_api_username" type="text" size="20"&gt;&lt;/div&gt;
';
$(hmacAuthUi).insertBefore('#api_selector div.input:last-child');

/*Hide the standard controls provided by the swagger-ui index.html. We won't need them. */
$("#input_apiKey").hide();
$("#input_baseUrl").hide();

/* This just sets a default value for this username field  so we don;t have to enter everytime in test*/

$("#input_api_username").val("testUser");

var CustomHmacRequestSigner = function (name) {
this.name = name;
};

/* This is the main hashing function. It takes the HTTP request context and uses various parts of that request to create a hash */

function customHash(obj, datestamp, apiKey) {
var stringToSign = obj.method + obj.url + datestamp;
if (obj.body) {
var bodyUtf8 = CryptoJS.enc.Utf8.parse(obj.body);
console.log('utf8 of body: ' + bodyUtf8);
var bodysha256 = CryptoJS.SHA256(bodyUtf8);
console.log('sha256 of utf8 of body: ' + bodysha256);
var bodybase64Hash = CryptoJS.enc.Base64.stringify(bodysha256);
console.log('base 64 of body hash: ' + bodybase64Hash);
stringToSign += bodybase64Hash;
}
console.log('raw string to sign: ' + stringToSign);
var utf8StringToSign = CryptoJS.enc.Utf8.parse(stringToSign);
console.log('utf8 string to sign: ' + utf8StringToSign);
var utf8OfApiKey = CryptoJS.enc.Utf8.parse(apiKey);
console.log('utf8 api key: ' + utf8OfApiKey);
var hash = CryptoJS.HmacSHA1(utf8StringToSign, utf8OfApiKey);
console.log('hmac sha1 hash of string with key: ' + hash);
var base64Hash = CryptoJS.enc.Base64.stringify(hash);
console.log('base 64 of hash: ' + base64Hash);
return base64Hash;
}

/* This is the function that is called every time the ui tries to make a request. We take the username and key that the user has entered in to the form fields. We hash the request with those values and add some new headers. This is where you can do any authentication you might want to do. */

CustomHmacRequestSigner.prototype.apply = function (obj, authorizations) {
var datestamp = moment().toISOString();
var hashFunction = customHash;
var apiKey = $('#input_api_hmackey').val();
var customerUserName = $('#input_api_customer_username').val();
var apiUserName = $('#input_api_username').val();

var hash = hashFunction(obj, datestamp, apiKey);

obj.headers['X-Custom-Identity'] = customerUserName;
obj.headers['X-Custom-Authorization'] = apiUserName + ":" + hash;
obj.headers['X-Custom-Timestamp'] = datestamp;

return true;
};
authorizations.add("custom-hmac-authorization", new CustomHmacRequestSigner());
});
})();

Here are the new fields on my index page that replace the HTTP basic authentication for swagger

Showing new fields on html page

And here is the console output of the HMAC authentication when I try to make a request

Console output for request

That’s it! I hope it helps you.

Some tips for tech leads conducting behavioral interviews

I’ve interviewed and hired a bunch of people for our tech organisation but I still struggle with the non-technical behavioral interview. I’d be lost without help from my boss and other team members who always manage to ask great questions to get a candidate talking.

These are some of the things I try to do in every interview to get the candidate at ease and set up the interview for success.

Start with proper introductions

Describe your role, what that means in your company. Describe the role they’re applying for. Describe the company, the organisation and the team they will work for. Describe the style of work you do. It can be a nice ice-breaker for a nervous candidate to sell the job to them at the start of the interview.

Also don’t forget to describe the interview process. Every company has a different interview process so they might not know what to expect from this interview and subsequent stages!

Cover the key behavioral areas

There are some things I absolutely need to come away with a good answer to.

  • Teamwork – can the candidate work with our style of teamwork
  • Resilience – can they see things through, can they handle change and pressure
  • Ethics – Are they decent, how do they speak about colleagues and assign blame

Go beyond a list of canned questions

Unless you run out of time and absolutely need to. We don’t have a script for our interviews and they’re usually conducted like normal conversations. This is the way I was interviewed and it put me really at ease. Don’t make it feel like an interview.

I try to stay away from starting a conversation with generic “Describe a situation when…”or “”How have you used blah blah blah in the past…” type questions. It’s much better to ask about how a person feels about some latest technology themselves and go from there. Ask how they would change a thing. How the thing compares to their current thing. What they contribute to their current thing. See what they get passionate about and follow that to the end.

There are some great standard questions like “Why our company?”, “Why are you leaving your old job?” that I would ask at the end if it wasn’t clear by the end but usually the candidate has already answered.

Ask open ended questions

I’m not great at framing my questions in an open ended way. This is something I constantly work on. Like any tech person I have opinions on all kinds of things and I love to hear what the candidate thinks about topics, however it’s extremely important not to lead them in answering so you don’t just get a biased answer.

Don’t rely on gut-feeling too much

My instinct is to rely too heavily on gut-feeling. I think gut feeling is important but I know what it’s like to be a nervous candidate at a job interview so it’s really important to give the person time to relax and settle in to the interview before making a judgement of any kind. Fight that urge to instantly judge the candidate!

It’s not a tech interview

Don’t ask specific tech questions. I absolutely don’t ask questions about C# generics for example. But I would try to get a feeling for the candidates love of technology in general. Things like “Why are you working as a developer?” often give a great incite in to the candidate’s motivations and their ability to learn.

“What is your favorite app?” often gives you some insight in to how much technology the person uses day-to-day.

See if they use or tried to use your software. This is great if you have some popular  consumer software. We always ask “What’s your favorite app out of all our apps? (we have three)”, “Do you use our website/apps?”.

Identify if a mechanism is used for answering

If the candidate is using S-T-A-R (Situation/Task, Action, and Result) to answer then they have probably prepared beforehand which is awesome. If they don’t use star but are giving lots of answers based on past experience then they’re probably great communicators anyway.

Just try to identify if they’re bullshitting. Look for lots of “We did…” rather than “I did…”. Don’t let them use generic answers. Don’t let them hypothesize too much. It should be very specific and based on past experience.

Look for enthusiasm (and burnout)

I’ve had candidates that were unable to look me in the eye for an entire interview. This is a bad sign but I understand that there can be nerves and cultural differences that cause it. What I immediately notice however is candidates that come across as burned-out when asked about their favorite project. Without enthusiasm for development you probably won’t enjoy working anywhere and you should take a holiday before looking for work. Seriously!

Setting up a poor man’s continuous deployment using Azure and Github

Summary

Right. I created an MVP personal site last month (yay agile!). It’s an MVP because it;s not fancy but all important information about me is available and it’s a bit more expressive than linkedin. If I get lazy and forget about this project next month then at least I’ll always have one piece of creativity on the interwebs that Facebook doesn’t own.

Main Goal

I’ve been using the internet since 1996 or earlier. I’ve owned domains since 1998 and I’ve done f**k-all with any of my knowledge in all this time. So my goal was to have a personal website describing my experience, achievements and learnings. A bonus would be having some ability to contact me and I really wanted a blog. I wanted to do all of this using the skills I have now to get it done quickly while minimizing the cost.

Hosting

I’d used AWS for production environments in previous jobs but I wanted to use Azure for this to get experience with its interface. It’s not cheap for a static site like mine – $15/month for sites with domains on pay as you go. But it offers stellar integration with the toolset and IDE I’ve used for a decade or more. I was coding and deploying to production in about an hour.

Azure is very cool compared to what I’ve used in the past for hosting. Server debugging was easy with visual studio integration. Setting up CI through my github master branch was super easy. Storing production configuration data was really simple.

Whats bad? The price is a bit crappy. Like I’m pretty sure Heroku could host my site for free on a different platform “But Rails is so easy Darragh” – yea yea, whatever) . I knew if I didn’t get this up quickly my enthusiasm would absolutely crash.

Here is a list of amazing free tools for software developers  https://github.com/ripienaar/free-for-dev/blob/master/README.md

I had to buy the domain. I started with my old domain fuzzyminds.com. but then I thought “screw it I’ll check if darraghoriordan.com is available” and it was.  Now I know it’s hard to say, spell and remember, it’s me dammit! I might regret it later. Dara O’Brien was pretty smart to change his name to be phonetic.

Site Architecture and Setup

Nothing special here. A basic .Net MVC site sending out server generated html to clients directly. It uses Ninject for dependency injection and NUnit for a smattering of tests (I don’t TDD because I’m lazy, I’m sorry).

The weirdest thing with it is that the blog is hosted by WordPress.com so I don’t have to pay extra for hosting it. This means a redirect to wordpress.com for the blog. I’ll almost certainly change this in the future in favour of my domain. The main site template matches the free wordpress blog template so the menus look reasonably seamless on redirect. MVP all the way.

The site is all server side. There’s a tiny bit of javascript for Google Analytics and the menu. There’s no database. Some data is served off a json file as a file I/O proof of concept with azure. I’l be moving all the data in here in the future.

You can’t have https with the cheaper azure websites and  custom domain. So don’t let any accidental https links to parts of your site get in to google. If you want a custom ssl cert you need to pay for  a $70/year web application.

Code

72 commits, 4 branches. Mostly c# (It’s not a javascript project no matter what you think github project classifier:p)

Learnings

Learning BEM was great. I had read about it quite a bit and recently used it in our new platform at work but I didn’t really understand it until this site. Really solid learning there.

Azure pricing. It pays to be wary here.  They show you more expensive server options than you need as “recommended”. Always scroll down to find the really cheap options. You can’t run databases on the really cheap sites. But you probably don’t need to either. Just use files for any readonly data. Hide data retrieval behind a service so you can put it in a database later.

Debugging directly on azure was amazing. Through it I discovered that when you’re doing github deploys, Azure doesn’t delete any files from your Web application that aren’t in github anymore. Its not a ‘clean’ deploy. So if this might be causing you issues log in through azure manager and delete the offending file off the server directly.

This is more of a .Net issue, but if you rename your MVC project and you manually change any broken references or namespaces and your site is still messed up then check the additional Web.config in the Views folder. You need to update that one too.

Things to Improve

Ohhhh so many things. Primarily I want to change the architecture to have an api and a client. This will let me play with all kinds of tech like ng2 or react.

Other than that I would…

  • Have all the data come from a data source (not on the page directly)
  • Wrap file IO in async methods
  • Make the controller methods async
  • Add asset versioning to js and css
  • Not having to deploy for data changes would be awesome (admin panel to edit json data source file).
  • Maybe try to improve speed. It should very fast given its simplicity.
  • Improve meta tags. Currently shared by all non-blog pages
  • Huge css bloat from copying theme file csstle and overriding properties I wanted. 99% of it is unused.
  • Hire a designer:)

 

What I’m working on this year

1. I’m going to be more of a creator this year. For my whole life up to now I’ve been a 100% consumer. Whether that’s struggling through blog posts, writing software for myself or making my own beer I’m going to make more things!

2. I have to write a blog post as a retrospective before starting a new thing. I keep starting new things without really thinking about what I learned. Unless it starts sucking the fun out of the stuff I’m working on:)

3. I want to get myself on the first page of google search results for my name! None of these are me!

darragh-oriordan-google-search.png

That’s it.