Get HTTPS for your WordPressSite Title image

Get HTTPS (SSL) for your WordPress Site

By the end of this tutorial your WordPress – site/blog will have an SLL certificate, so that it can be served over the secure HTTPS protocol.

For which stack does this tutorial apply?

  • WordPress site/blog
  • Hosted on AWS (Amazon Web Services) EC2 instance
  • Bitnami stack (Ubuntu Linux + Bitnami specific software)

NOTE: The Bitnami WordPress setup (which I also use myself), is an “out-of-the-box” package, available on the AWS marketplace.
What this preconfigured stack doesn’t provide from the get go, is an SLL certificate. So your site will be http only in the beginning and cannot be served via HTTPS. For some blogs that’s probably fine. But users will certainly feel much more comfortable when their browser isn’t shouting at them, for accessing an unsecure site.

This tutorial will mostly follow the Bitnami-tutorial, extended by some explanations or “gotchas” I encountered myself.

Let’s get ourself a certificate!

We will use SSH (secure shell) to connect to our server (EC2 instance). If you don’t know anything about “how to connect to a remote server”, you might want to look at the slightly less alianated/scary way (through an FTP-client) first. I already wrote a tutorial on “Access Your WordPress EC2 Instance via SFTP”, if your interested.

First we need to connect to our server via SSH (If your on Mac, SSH is already available in your terminal/command line). You will need a keyFile to successfully connect to your server. It ends on .pem (e.g. myKeyPair.pem). You should have gotten that keyFile when you first launched your WordPress instance on AWS.

NOTE: If you don’t know where you put your keyPair-file that’s very unfortunate. You might not get SSH access to that EC2 instance anymore. A work around is, to copy your instance as an AMI (Amazon Machine Image). Initialize a new EC2 instance, using that image. Disable the old instance. Here is a discussion on how to do that.

1. Activate Inbound Traffic for SSH

We need to make sure that SSH is enabled for inbound traffic, on our WordPress instance:

  • Log in to your AWS dashboard
  • Navigate to: Services > EC2 > running instances
  • Click on your running WordPress instance

You should see the main Menu of your instance now. Somewhere at the bottom you also see which keyPair is associated with your site.

aws EC2 instance overview

Check or activate SSH traffic. You can find the corresponding settings under:
NETWORK & SECURITY > Security Groups….

…click on the Inbound-tab.

SSH should be activated with a Port Range of 22.
And as Source it should show your IP-Adress.

NOTE: If SSH is not there yet, you can add SSH by clicking on Edit -> Add Rule -> and choose SSH from the dropdown. The port defaults to 22 automatically.
For the Source you could use anywhere (0.0.0.0/0). But this means every computer that has your KeyPair could access your server/instance remotely. This is not ideal. BETTER: choose My IP (some-ip-address). You don’t have to know your IP address. It gets filled out automatically. Now only your computer has access to the instance.

FANTASTIC! That was already quite essential.

2. Access your Instance through the Secure Shell

Open a terminal window.
Navigate to the place where your KeyPair-file resides.
It needs a certain set of permissions. Therefore run the following command:

command: read/write permissions (for owner)

This command defines that the file can be read and being written to, only by the owner of the file (e.g. root-user).

Now connect to your server by executing the following ssh command in your terminal:

ssh command to connect to remote server

Your SSH client will most likely ask you to confirm the server’s host key and add it to the cache before connecting. Accept this request by typing “Yes”.

You should be logged in to your server and see something like this in the terminal:

Bitnami server login-welcome page (photo from: https://docs.bitnami.com/aws/faq/get-started/connect-ssh/)

NOTE: If this doesn’t work, try resetting your “MyIp-Adress” in your SSH inbound traffic settings in the AWS dashboard (as described above). This has thrown me a couple of times, because it seems I have a dynamic IP-address. And if it has changed, the server thinks someone else is trying to connect and will deny the access.

3. Get your SSL Certificate

We assume you are logged in to your server now, via your terminal.
If your site/blog is based on the Bitnami-stack you should be on an Ubuntu Linux distribution. But if you like, you can double check that by typing:

cat /etc/os-release

This shows some details about your operating system.

Bitnami uses a tool called Lego to automate some of the SSL-certificate juggling. The program might be already installed under /opt/bitnami/letsencrypt/. In my case it wasn’t. You can find out whether it is by typing:

whereis lego

If after that you get prompted with something similar to…

lego: /ect/lego /usr/local/bin/lego

…you’re golden and you can jump forward to #4. If it only says:

lego:

…you need to install Lego first.

>> Installing Lego

Change into the temp folder of your server by typing:

cd /tmp

Download Lego with this command:

curl -Ls https://api.github.com/repos/xenolf/lego/releases/latest | grep browser_download_url | grep linux_amd64 | cut -d '"' -f 4 | wget -i -

This will download the latest Lego-version from the repository. Type ls (you should still be in the /tmp directory) to see the exact name (version) of the file you downloaded.
Unpack the tar file with the following command:

command to unpack lego tar file

Move the unpacked lego binary into the usr/local/bin directory by typing:

sudo mv lego/usr/local/bin/lego

If you like, type whereis lego again. Lego should show up in usr/local/bin now.

The next thing sounds scary. But we are going to shut down your server.

BITNAMI-NOTE: Before proceeding with this step, ensure that your domain name points to the public IP address of the Bitnami application host.

To shut down all Bitnami services run the following command:

sudo /opt/bitnami/ctlscript.sh stop

Now FINALLY get your certificate!!! You do so by running the following command. But for EMAIL-ADDRESS you enter your email-address and for DOMAIN you enter your domain (e.g. www.myblog.com).

sudo lego --tls --email="EMAIL-ADDRESS" --domains="DOMAIN.com" --domains="www.DOMAIN.com" --path="/etc/lego" run

NOTE: With the –domains flag you can specify several domains in one go as you can see in the example command above (–domains=”myblog.com” AND –domains=”www.myblog.com”).

You will have to agree to the terms of service.
After that, certificates will be generated in the /etc/lego/certificates directory. This set includes the server certificate file DOMAIN.crt and the server certificate key file DOMAIN.key.
To really see how they’re named, check for the files by running the following command:

sudo ls /etc/lego/certificates

4. Configure your Server

Figure out what server is used on your instance by running:

sudo /opt/bitnami/ctlscript.sh status

If it is Apache the following lines will apply (Nginx below). Those first three commands rename the old server certificate files by adding .old onto the end.

sudo mv /opt/bitnami/apache2/conf/server.crt /opt/bitnami/apache2/conf/server.crt.old
sudo mv /opt/bitnami/apache2/conf/server.key /opt/bitnami/apache2/conf/server.key.old
sudo mv /opt/bitnami/apache2/conf/server.csr /opt/bitnami/apache2/conf/server.csr.old

The next two commands will inform your server about your brand new SSL certificates. Make sure that for DOMAIN you enter exactly the name of your certificates (e.g. www.myblog.com) as described above.

sudo ln -sf /etc/lego/certificates/DOMAIN.key /opt/bitnami/apache2/conf/server.key
sudo ln -sf /etc/lego/certificates/DOMAIN.crt /opt/bitnami/apache2/conf/server.crt

And the last two of those seven commands change the owner of the certificates to the root user and change the rights to read/write only for this owner.

sudo chown root:root /opt/bitnami/apache2/conf/server*
sudo chmod 600 /opt/bitnami/apache2/conf/server*


If your server turned out to be Nginx, the principle is the same. But the commands from above will look like this:

sudo mv /opt/bitnami/nginx/conf/server.crt /opt/bitnami/nginx/conf/server.crt.old
sudo mv /opt/bitnami/nginx/conf/server.key /opt/bitnami/nginx/conf/server.key.old
sudo mv /opt/bitnami/nginx/conf/server.csr /opt/bitnami/nginx/conf/server.csr.old
sudo ln -sf /etc/lego/certificates/DOMAIN.key /opt/bitnami/nginx/conf/server.key
sudo ln -sf /etc/lego/certificates/DOMAIN.crt /opt/bitnami/nginx/conf/server.crt
sudo chown root:root /opt/bitnami/nginx/conf/server*
sudo chmod 600 /opt/bitnami/nginx/conf/server*

DONE! Restart your Engine

Here is the very last command which will restart the Bitnami services (server, database, etc.), with your new SSL certificates in place:

sudo /opt/bitnami/ctlscript.sh start

Your WordPress Site should now be servable via HTTPS. Try it out by going to your browser and enter your domain. Don’t forget to put https:// in front of your domain (e.g. https://www.myblog.com).

That was really quite an effort, but you made it. CONGRATULATIONS!!!

There is one last thing you should know. Your certificates do not last forever. To be more specific. They expire after 90 days

NOTE: If you would like to check when your certificate expires, you can run the following OpenSSL command (while you’re on your server): sudo openssl x509 -text -noout -in server.crt

This will spit out a lot of data, including the validity period: Certificate:
Data:
......
Validity
Not Before: Apr 19 08:38:40 2019 GMT
Not After : Jul 18 08:38:40 2019 GMT

There is a way to renew them of course. And even a way to do this automatically by setting up a cron-job. Since I don’t have a tutorial on that topic yet, I will point you to the original Bitnami tutorial (renewal starts at #5).

NOTE: If you want to redirect your HTTP version of your site/blog (without SSL) to your HTTPS version now: Follow the instructions on the Bitnami docs.

That’s it for today. I really hope that by reading this you had less trouble setting up SLL/HTTPS for your WordPress site than I did.

If you liked this post or if you would like to comment on it, please feel free to share it on social media or send me an email.

Späters

niilz

server room (by Manuel Geissinger)

Access your WordPress EC2 Instance via SFTP

Three times now I had forgotten how to connect to my WordPress instance via an FTP-client. So I need to write down how it works, as long as my memories are fresh.

What I have:

  • AWS (Amazon Web Services) account
  • EC2 instance on AWS
  • WordPress on that EC2 instance (bitnami)

What I want:

  • Connect to the server/instance via SFTP,
  • so that I can get access to the files on my server.

What I need:

  • access to my AWS-dashboard
  • a security user group (on AWS)
  • the access-key-pair-file (.pem) of my EC2 instance
  • the AMI (Amazon Machine Image) user-name
  • an FTP-client

Let’s begin!

Do I have an FTP-client like FileZilla?
Yes: Good! You’ll need it later.
NO: Get one. You’ll need it later. FileZilla is free of charge and is available here: https://filezilla-project.org/

Do I have access to my AWS dashboard in the browser?

  • YES: Login to the AWS-Console/Dashboard.
  • NO: Stop here and contact AWS support to regain access.

Do I have a running AWS instance with WordPress on it?

  • YES: On the AWS Console: Navigate to Services -> EC2 -> Running Instances. Click on the instance that runs the WordPress site.
  • NO: If you like to host a WordPress Site I suggest this tutorial: https://aws.amazon.com/de/getting-started/tutorials/launch-a-wordpress-website/. Make sure to either use an existing KeyPair when you launch the instance or create a new KeyPair. DOWNLOAD, SAVE the KeyPair.pem file AND REMEMBER WHERE YOU SAVED IT!!!

So you are looking at your instance summary. Check which KeyPair name is associated with your instance:

You know where the .pem file with that name (My_KeyPair_Name.pem) resides on your computer?

  • YES: Very good. Open your FTP-client (e.g. FileZilla).
  • NO: Very unfortunate. You might not get direct access to that EC2 instance anymore. A work around is to copy your instance as an AMI (Amazon Machine Image). Initialize a new EC2 instance, using that image. Disable the old instance. Here is a discussion on how to do that. (This time: REALLY REMEMBER AND SAVE THE keyPair.pem FILE).

In the AWS EC2 dashboard, navigate to NETWORK & SECURITY -> Security Groups

aws Security Groups dashboard

Check the Inbound tab. You need port 22 (SSH) activated. If it is not already there you can add SSH by clicking on Edit -> Add Rule -> and choose SSH from the dropdown. The port defaults to 22 automatically. You have to choose a source. You could use anywhere (0.0.0.0/0). But this means every computer that has your KeyPair can access your server/instance remotely. This is not ideal. BETTER: choose My IP (some-ip-address). You don’t have to know your IP address. It gets filled out automatically. Now only your computer has access to the instance. After doing the above, your inbound settings should look something like this:

aws security group settings for SSH

FANTASTIC! That was actually the most critical part.


Now open FileZilla on your computer. Navigate to Settings (a window pops up). Click on SFTP (under Connections). Which looks like this:

FileZilla SFTP Settings to add a keyfile

There is a button to add a KeyFile with. Remember that My_KeyPair_name.pem file? Good!
Click the Add keyfile… button, go to the directory where you stored the downloaded .pem file. Choose it. (There might be some conversion happening but this is so far in the past that I don’t remember). If so, let it convert the file. And click OK.

Almost done! In the top left corner of the FileZilla user interface you can spot an icon that looks like three server-machines, wired together.

FileZilla site manager icon

That is the site manager. Click on the site-manager-icon. A new window pops open.

In the main settings (which should already been chosen by default):

  • Check that SFTP is chosen as protocol.
  • In the server-field: type your public IP address. You can find it in the AWS EC2 instance dashboard on the right of the instance summary.
aws EC2 instance summary public IP address
  • Leave port empty (it should default to 22 on it’s own).
  • As Logon type choose ask for password. (once you do get asked for one, simply press ok, without typing any password).
  • The user name is based on the operating system’s distribution. Meaning: it can be root, ec2-user, ubuntu, etc. A list of some very common ssh user-names to connect to EC2 can be found here. In my case btw. ubuntu works (the WordPress site runs on an Ubuntu server). But bitnami also works. Which is the stack of the site and seems to be added as an alias for ubuntu.
  • Leave password empty. The window should look similar to this:
  • Click Connect. FileZilla should automatically find the right keyfile. And – like I already mentioned – if you get asked for a password, just click ok. FileZilla should now connect to your server, which means that on the right side of the FileZilla user interface a bunch of folders will magically appear.

Am I connected and do I see my server files on the right?

  • NO: Very sorry, that this blog wasn’t any help….don’t really have any suggestions other than Stackoverflow, Google and patience.
  • YES: FANTABULOUS! We made it! I am very very happy if this blog was helpful to you (which might be myself…again).

If you liked this post or want to hint something, please feel free to share it on social media or send me an email.

Späters

niilz

Help! How do I add a PATH?!…

(on MacOS)

If you’re here you probably have this issue:
You just downloaded this new program. But when you try to use it:
“Error: program “new_shiny_program” not found in PATH”…

One thing I wish I knew when I first started to code is:

“how the heck do I add this “PATH”?!

Let me start by briefly talk about the command line. If you know what it is, and how it’s basics work, feel free to skip ahead.

The command line, also called CLI (command line interface), terminal or shell is basicly a program where you can interact with your computer. You can:

  • change into different directories/folders
  • create files
  • download and install stuff
  • write scripts to automate tasks
  • a lot more…

Why do we even need the command line?

  • Sometime it’s just faster to simply type a little command into the command line, instead of opening an entire program.
  • Other programs do’t even have a GUI (graphical user interface) like a Microsoft’s word.

The latter are called “command line tools”. And if you’re starting out: it is most likely, that one of your first programs can only be run through the command line.

A little Example: Let’s say you have Python installed on your machine and you wrote a little Python-program that prints “hello, world!”. You will need to open the command line. (It shows a promt, probably showing two right angel brackets (>>). And behing them you can type:
python my_program.py
And “magically” the text “hello, world!” appears below (also in the command line).

How does that work?

I won’t tell you what happens on the OS (operating system) level. But is really useful to know, that the command line (which is a program in itself) is running other programs for your (the the python interpreter in the example above).
Also when you type “ls” (to see what files and folders are in your current folder) the command line actually executes a program called ls.

How does the command line know what to do?
Let’s get a bit more specific. One of the available command lines (also most likely the one that opens when you open terminal on your mac) is called bash. And bash will look into a couple of directories on your computer to see, which programs are available for it to run.
But those folders are hidden folders. They can be seen though by adding the -a flag to the ls command (ls -a). Or if you’re in the Finder you can use this nifty shortcut cmd + shift + .  (<- the third key is a dot)  to make the hidden folders visible/invisible.

Where are those folders?

On your mac you will find them in your root directory:
In my case: Harddrive/some_hidden_folder
You can find folders like:

  • bin
  • usr/bin
  • usr/local/bin

Inside those folders are the programs your command line can use. Why? because those folders are specified in the PATH variable of your bash command line program.

How to actually add a PATH

Your are here because some program could not be run. And it complained that the “path is missing” and you should add it. Let’s do it than.
We need to know where the program is located, so we can that specific path that lead to the binary (program), to the command line environment variable PATH.
Just imagine we would have installed some_program into Users/your_user_name/programs/cool_program
So the program is not in one of the usr, usr/bin, something hidden directories. Therefore our command line cannot find it.
Here comes the rescue:
Type into your your command line PATH=”Users/your_user_name/programs/cool_program”:$PATH

Little aside, incase you don’t understand the slightly cryptic command.

The command line also has a syntax. You can even write entire scripts, with loops, conditions, variables and everything. (If you like to learn a bit more about that, I highly recommend the codecademy learn the command line tutorial.)
Here, the variable is calles PATH. We set it to a new value with the equal character (=). No spaces are allowed. The value (our path) is surrounded by quotes (” “). And at the end we add the old PATH to it, using the colon (:). The old path’s value is accessed by putting the dollar-sign in front of it’s variable name ($PATH).

This adds the path (including the folder cool_program where some_program resides) to the PATH variable. To be more specific: the path get’s added to the front of the already existing PATH. We could add it to the end with:
PATH=$PATH:”Users/your_user_name/programs/cool_program”
Your program should be found by the command line now and you can use it.

BUT! This only works temporarily. More specific, for as long as you keep the current command line window open. Once you close it, the recently added path is gone again. Sorry.

How to add a PATH permanently?

There are user specific folders like:

  • Harddrive/your_user_name/.bash_profile
  • Harddrive/your_user_name/.bashrc
  • Harddrive/your_user_name/.profile

Those hidden files are essentially text files. You can double click on them to open them (if made visible with cmd + shift + . ). You will find some very familiar looking lines of text, or more concrete instructions.
Your bash-command-line looks into the above mentioned folders, because of these files.
The files might contain something like this.

bash environment setting

The lines prefixed with the hashtag (#) are just comments. Below you can see export and a path declaration (like the one we discussed earlier). Export is a built-in-command of your bash-command-line. It simply puts the declared variable (here it is a PATH) into your command line environment, ready for you or the bash-command-line to use it.

Et voilà! You have added a PATH to your command line environment. I hope this was helpful for you and that you can understand the command line a little better now. If you would like to know more about the command line you might wanna have a look at the learn UNIX tutorial by tutorialspoint.

If you liked this post or if you have some comments, please feel free to send me an email. Or share and comment it on twitter.

Thanks for stopping by
Späters

niilz

My Journey to Becoming a Developer – A Roadmap (with side tracks)

This post could be seen as a syllabus for CodeNewbies. Although I mainly wrote it as a summary about what I have learned and which roadblocks I had to overcome on my journey towards becoming a developer so far. If you are a newcomer and just want a quick tip on where to start: have a look at topic 6 “Learning HTML, CSS, JavaScript Round 2” or the “Conclusion” at the the end of this post.
This post lists all the steps I took, when I took them (some of them happened simultaneously) and how much time I invested. You shall find recommendations as well as routes you might wanna avoid in order to stay on track.

1. Figuring out what to learn
(2 weeks: 23 Jun 2017 – 08 Jul 2017)
The beginning of everything, the root of my desire to being able to code was: “How the heck do people talk to computers?”. Someone might have told me: “Java is used a lot for that”. So I started to learn Java on a mobile app (or at least I was trying to). With absolutely zero programming experience, this was not really working out well for me. And even though Java is or at least was used heavily throughout many tech-stacks (e.g. Android app development), I would not recommend it as a point of entry for beginners. Maybe they person recommending meant JavaScript, which is a completely, fundamental different programming language and would have been way better to start with, but what did I know at the time. Anyways, question now for the goal-less coding-padawan: “Back to square one. What should I learn in order to speak computerish?….” Someone else told me to “Learn HTML! Then CSS and JavaScript.” I was like: “But I don’t want to build websites! That’s what people use Wix and stuff for now, riiight?!” How incredibly wrong I was. The possibilities you have with just these three “web” technologies/languages are sheer endless. Most cool web-apps look and behave based on them.

2. Learning HTML and CSS with a mobile app
(2 weeks: 12 Jul 2017 – 28 Jul 2017)
Despite the rocky start I had with Java, the mobile-app-learning-experience was fantastic. I used SoloLearn. Where you can read and solve quizzes, while waiting for the bus. Great! So I worked through both curriculums and really got fascinated with what you could or had to do to put text, pictures, forms, STUFF on the web. So I was ready to go ahead and make something, correct? Absolutely NOT! Clicking on a mobile app is great to get an idea but won’t cut it.

3. Installing a code editor…
(a couple of hours, including research: 20 Jul 2018)
…which I should have done from the very beginning. It can be so easy to install and use an editor and is so incredibly helpful and more fun to practice in general. Theoretically you could use any plain text-writing-tool (Microsoft Word does not work btw.). But please do yourself the favor and get a real code-editor. I used Brackets in the beginning but later switched to VS-Code (by Microsoft) which is highly recommended by successful, known developers (e.g. Wes Bos and Scott Tolinski on Syntax.fm). Both editors are free of charge. There are many great alternatives so I hear (but have not tried them myself) like: Atom or SublimeText. When in doubt: go with VS-Code. Little trivia: VS-Code and Atom are both ElectronApps. Which means, even though you download the program and run it offline on your desktop, their main building blocks are HTML, CSS and JavaScript. Isn’t that exciting?
I also got a free codepen account at that time. It’s an online editor, where you can write HTML, CSS, JavaScript and see how they interact with each other, all in the same browser window. Without downloading anything. This is so useful and fun to protoype and experiment with, I can’t even express it in words. You don’t have an account, yet? Get one now! Seriously! – I’ll wait.

4. “Dipping your toes in!..”
(3 weeks: 21 Jul 2017 – somewhere in September 2017)
…as the like to say. I tried out typing some basic html in my editor and mainly followed Shay Howe’s HTML-CSS-Tutorial. Again, something I can highly recommend, even if, as of writing, it does not cover CSS-flex-box and CSS-grid (element positioning techniques) yet. This tutorial made me understand how to structure content using HTML and how to apply some CSS to set how this content should look. Parallel to this I started and finished the SoloLearn’s mobile-app-curriculum for JavaScript. “NOW we’re talking” I thought. “Here it is! A real programming language with calculations, loops, conditions – things you tell your computer to do!” I immediately knew, that this is more of what I wanted to learn in the first place. Was dipping my toes in HTML and CSS a waste of time? Nooooo, both are really important and I need to get a lot better at them still. Because without them, most programs that do stuff (like command-line-tools) just look like plain text with one font, one color, in one size. One thing was certain though. I wanted to code logic! Without having an idea or even a conceptional understanding. Sooo back to the research: “Hey Google,

  • what are some good coding projects for beginners?
  • how to learn basic JavaScript?
  • where to start, please just tell me the right way, pleeeeaaase.”

5. Reading a book
(many weeks: 29 Jul 2017 – someday in 2018)
My researches lead towards a book. Books are a generally a great resource for everything, are they not?. And with platforms like Packt there is a lot of awesome content out there for just a few bucks or even for free. Actually it feels like way to much you have free access to. Because sooner or later you’ll find yourself sliding down a steep, dark rabbit hole, where you jump from topic to buzzword to definition to the explanation to that definition to the next topic and so forth. What helps? Taking a breath, telling yourself “I can use a TV, a microwave, a refrigerator, all without knowing how it actually really works internally and never got seriously injured.” So nothing to worry about just yet.”
One book that is recommended as an introduction to JavaScript throughout the community is Eloquent Javascript. It is a great, free book. Is is for beginners you ask? NO and three times NO. I do really love it and read the 2nd Edition in when I started out learning and finished reading it a second time (3rd Edition) in Oct 2018. The second time around though, I was typing along with every single line of code that appeared. And I still did not understand every chapter. But this was a much nicer experience and I’ve learned a ton. Of course you can give it a swing, even as a beginner, it’s free. But don’t be angry at the writer or anyone else, in case you won’t get everything right away. If you do though, please send me an email and tell me how you did it. Thanks in advance.
In the end I haven’t really read a good book for beginners. Also, reading on it’s own has a great disadvantage. It does not train your “muscle memory”. Like a pianist, your brain and your fingers need to get used to typing out programming syntax. With just reading you might glance over code examples, thinking you got it when you really didn’t, yadda yadda yadda. So if you got a good book, it makes more sense to read it on your computer, with an editor open. Which obviously I did not. Even though I had heard you should. …maybe one just has to live through that experience of total waste of time.

6. Learning HTML, CSS, JavaScript Round 2
(about 20 weeks: Nov 2017 – March 2018)
Easily my most favorite way of learning is: getting told what to do. And being evaluated whether you did it right. So my holy grail of learning is:
Interactive Tutorials.
Tadaaaaa! And my place to go is codecademy. I busted through the introduction to HTML and learn CSS tutorials and afterwards spent quite some time on introduction to JavaScript. In those tutorial webapps you have a split screen. With short topic explanations and small consecutive tasks on the left. On the right you have an editor where you write your code-solutions to those tasks. You run your code, it get’s tested and if it was correct, you get to the next section. What an experience. I could not believe that those things where out there. FOR FREE! Btw. I also heard good things about KhanAcademy and FreeCodeCamp. Very similar concept, I just haven’t tried them. Which is a good sign. Because coming back to tutorial-land for the same topics over and over, just to reassure yourself you haven’t missed any subtopics is just bad. You won’t remember all the available JavaScript-functions or all the little syntactical details on every single HTML-tag anyway. This is where one looks things up on:

  • Google
  • stackoverflow (incredible forum, which mostly is the first google search-result anyways)
  • MDN (by Mozilla)
  • W3School (tutorial / encyclopedia with “try-it-out-functionality”)

7. Learning from Podcasts
(almost every day)
Podcast were something I had underestimated a lot. If you get the right ones, they are helpful, educative and simply fun to listen to. Some of my favorites for your daily commute or while you’re cleaning the house are:

8. YouTube
(when ever there is time)
Learning material on YouTube is something I really like watching. But because it is so time consuming and sometimes difficult/impossible to code along. I watch them not too often. The two channels that stuck with me are:

9. Getting started with MachineLearning
(9 weeks: 01 Mar 18 – 16 Jul 18)
Not having a real project and thinking to myself: “Doesn’t everything of value nowadays involve data processing?” made me wanna dive into MachineLearning. Well say hello to all those worms escaping from this massive can I had just opened. Long story short. I followed the highly recommended free MOOC (Massive Open Online Course) by Andrew Ng on Coursera. Veeeery interesting. And faaaar beyond my capabilities to apply what I was learning to some real life problems. Nevertheless, I now have a decent overview on the field of machine learning. Which helps in case you want to wrangle some data using a more human friendly framework. Do you need it? In my opinion, only if you actually want to get into MachineLearning.

10. The Scary Commandline
(1 day: May 2018)
Depending on your system (Mac, Linux, Windows) it can be called Terminal, Shell or Console. It is always the same. You have an almost empty window with some directory (folder) on your computer written down in the top left corner. And you can type in the line behind that directory-name like in DOS times, if you’re young enough to remember that. When you hit Enter, the things you just have typed get executed. If this command is unknown to the program (shell, terminal, console) it just prints (writes in the next line) “command not found”. I wish someone would have told me that in the beginning. For weeks I was scared to type anything in the command line. To me if felt like I was carrying out brain surgery on the open head of my operating system and every wrongly typed command could probably lead to instant self destruction. While that is not the case and most developers do not have to become experts on the command line, carelessly copy-pasting install commands from stackoverflow should not be excuted either. Here is what I recommend: After finishing the HTML and CSS basic tutorials on something like codecademy, quickly work through the learn the command line course there. It doesn’t take very long but it gives you almost superpowers in the sense of how much more secure you’ll feel in the console.

11. GitHub basics
(1 day: May 2018)
In real life projects (in small and big companies) you have the situation that many people work on the same code base, while this very program they work on is running online. How is that even possible? With version control. What does that mean? There are simply different copies of the code available to the developers, called branches. If some new code has been written locally and it has passed all the tests it gets merged into the real application code on the master branch. This clever system is called git. Why should you care? Because there is an online service around that system called GitHub which makes version control possible to everyone, even for your own projects, so you can work on new features for your app, while another version runs fully functional on the web. GitHub also works as a repository for your projects. And since it is the go-to-platform for open source projects you can look at the the actual code of your favorite open source program. AND you can even participate if the maintainers allow open contribution. How cool is that. If I haven’t convinced you by now: GitHub shows a timeline, monitoring your activities. Every time you push (upload) something to some repository, you’ll get a green dot on your timeline. And recruiters apparently like to look at one’s repositories and timeline to see how much coding experience that person actually has. This seems to be a controversial approach for recruiting if you listen to developers on podcasts, but as long as this is still being done, why not starting early with GitHub. You will come across it at some point no matter what. Where to start? Again: codecademy. Learn Git. Also not very long and if I remember correctly you even set up an account. Double Thumbs Up.

12. Learning a backend language
(June 2018 – until today)
If you start coding in JavaScript, interacting with HTML and CSS, you tend to work on what is called the front-end or client side. Things the user behind the screen interacts with. This is extremely simplified and I recently listened to a podcast episode of Software Engineering Daily, where Malte Ubl from Google said: “effectively everyone at Google is a frontend engineer, right? Because there’s always a backend that you’re talking to…” As you see, this discussion could go very deep. Which I won’t go into. But if you want some computation being done outside the browser, on some machine (e.g. a server), you need a certain environment. A runtime. That translates your code (which in the end is just text) into machine code. And for quite a while that was not possible with JavaScript. So people looked at PHP or Python. I chose Python. It is a very cool language, looks different than most languages because it separates blocks of code not by wrapping it in curly braces but through line indentation. And the community around it is huuuuuge. Meaning that there is a lot of learning material available on the web. And there is a lot of extra code (libraries) written by others, which you can download, import and use in your projects. Nevertheless, there is Node.JS now. JavaScript in a car if you will. And that makes it possible to write JavaScript for the back-end. So if you even want to get into that server side, routing, data query, backendy stuff, with just learning JavaScript, you can still sit on both sides of the table.

13. Learning Rust (a low level language woooooooo)
(Sep 2018 – until today)
At some point I heard about this distinction between high level and low level languages. The latter is closer to the operating system. Which is why very efficient algorithms are written in C or C++ for example. Those are such low level language. An alternative and much younger language is Rust. So I read the Rust book. A tutorialish online documentation about the Rust programming language. Very interesting. Not particularly relevant for beginners. I’d even say if I had started with Rust, my shock about how difficult programming can be would probably have been even bigger than my reaction to Java. Rust is a topic for maybe another post on another day. Just hear that: With JavaScript or Python you can not write operating systems. At least not yet. With Rust you could, like you could with C or C++. Boom!

14. Courses & practice playgrounds
(Nov 2017 – today)
In case you have completed some tutorials, you understand the fundamentals of git and still don’t know what to build? Or your want to up your game, maybe practice in your lunch break? There are great courses to fill that gap. At the moment I am in the middle of Wes Bos’ JavaScript 30 course. 30 tasks, explained by him in high quality videos. An absolute treat. He also offers a very famous CSS-grid course which was done in cooperation with Mozilla, which is on my to-do-list. Both are free of charge and the best way to see if you like his style and maybe even purchasing one of his payed courses.
One of my favorite in-betweenies are quiz/puzzle/challenge sites. You just hop on to their site and try to figure out some programming problem. The ones I have tried and that I think are all fun are:

15. Staying up to date
(in between things)
I am from Germany and Twitter did not take off as much as in many other countries it seems. But if you want to get the daily news and topics and you do not have an account yet, get one. You don’t have to become all posty. But you will be surprised how much help, amazing blogs and tips are offered there. And of course jokes and gossip, but who doesn’t like that.
Other update resources which I haven’t really used yet would be reddit, HackerNews or HackerNoon.

16. Blogging
(2017 – today)
The best way to remember thing you have learned is to write it down. So my idea was to have this blog sort of as a diary. Writing down all the things I learn. But for almost an entire year I did not. Why? The answer is simple. I wanted it to be a certain, very ambitious way. And that was just always a bit too much for the time I had. I elaborate a bit more on that in my last post “Procrastination is caused by Perfectionism”. But blogging or even just writing things down for yourself is great. It will help you sorting your thought. And if you forget things you have already learned you can go back to your scribbles to refresh your memory. Once you put your findings out there, on the web, you might even help others on their journey. Which is what I hope to achieve as well.

Conclusion:
Coding is the best hobby I have picked up in years. It makes me feel empowered. You can do so many things with it and endlessly grow in the field. So if you just want to get started with something? Here are my absolute highlight tips.

To set you up properly, not wasting any time fumbling around, immediately start with interactive tutorials on either codecademy or FreeCodeCamp or KhanAcademy. I suggest the following order:

  • HTML Basics
  • CSS Basics
  • Learn the CommandLine
  • Learn about git
  • JavaScript Basics

Concurrent to the tutorial (on your commutes, while in the gym or while cleaning the house):

Getting more practice:

Thing I haven’t touched on but might be worth looking at:

I think that is enough to start with. Once you have started you will ask your own questions anyway and look for the topics you want to dive in deeper, finding your own favorite resources. Hopefully this was any help to you and I would look forward to getting your feedback. If you like you can send me an email or get in touch with me on twitter. Meanwhile enjoy coding and let the world know about your experience.

Späters

niilz

Procrastination is caused by Perfectionism

Wow! It has been almost a year since I wrote my initial post “how to become a programmer”. And I have done nothing of what I had in mind for this blog.

But why?… There are sooo many experiences I have lived through, so many things I have on my mind.
Simply because I was aiming too high. I wanted a very chronological time line. Where no step was missing. With every post I had planned to spice up the design, extend the resources section and create a dictionary with new words I had learned along my learning experience. And because that was always a bit much for a 10min writing session in between all the other things in my life, I just never did it.

NEW APPROACH!

Get this bloody diaryish time line out of my head into a <p> tag, so I don’t block myself from blogging anymore. So look out for the next post. To learn about some pros and cons of different resources and approaches, when you want to become a self taught programmer.

Späters

niilz

how to become a programmer

This is my story about how I am becoming a programmer. And it is just at the very beginning. If you are only interested in resources – stop reading right here. Instead take a look at the resource-section. There I am posting stuff that helped me so far and will help you getting started as a developer.

For you, who is apparently still reading, let me briefly explain what is going on in this blog. I understand it as a diary-ish documentation of my journey to the center of programming. Mainly so I keep track of my progress. Secondary to spread useful, interesting, hopefully entertaining mush along the way.

This is how it went down:

On 23 July 2017 I was finally too sick of that feeling being left behind by this world of technology we are living in. Inside my head, a tiny little voice SCREAMED “I want to become a programmer NOW!”

So I did what everyone does that wants the quick and easy way out. I downloaded an app on my phone. A cute little question-answer gamified learning-app for JAVA. It felt awesome! and unfortunately also very useless. Once I had completed all chapters and thought I was half way there I installed and opened a big ass SDK (Software Development Kit). What happened next nothing less than I a minor panic attack. This was exactly how I felt all along. Like an idiot and that I won’t stand a chance to ever get a grasp of this stuff.

// little side note from the present: This has not been proven otherwise, yet. But I feel very confident I am getting somewhere, as you will find out in later posts.

A first introductory shouldn’t be too long but I want at least end on slightly higher and uplifting note.

Of course the job wasn’t done by rushing through an app, millennial-style. Also it was maybe not a particular fortunate choice to start with JAVA (which is great and versatile but not very beginner friendly). I just did not know where to start. The good news is: there is guidance out there. And so sooo SOOOO much stuff that is absolutely awesome to learn about programming. And the best part. A vast amount is totally for free (people luckily brag about their knowledge and share it more than is good for them). Programming can be self-taught for the most part. AND it is extremely fun to make progress with. I might still be in the rather shallow part of a learning curve. BUT for someone who thought that there is like THE ONE major programming language everyone uses nowadays I have come a long way.

After my little stumble in the beginning, I’ve mainly looked at webDev (Web Development) stuff with JavaScript. Which is, as everyone knows but me when I started, not the same as JAVA. I’ve looked at HTML and CSS, nothing on the web can be done without those two fellas (BTW never EVER say you program in those two. They’re markup-languages and people look weird at you if you call them programming languages). And of course I read a lot about certain concepts, like client-server communication, APIs (Application Programming Interface), listen to podcast and on and on and on. It is very rewarding, i.promise.

To sum up: You are an advanced programmer? This might not be your blog, unless you like my writing. Then please let me know. Who doesn’t feed of flatterment. If not, well I guess you won’t have read this far anyway. Are you new to programming? You actually might get some good information to start with. And I aim to keep developing that part.

Final secret: The actual purpose of this blog is very egoistic. While learning loads of new stuff, I tend to forget things that I already learned. So writing it down seems to be most efficient for memorization. Here comes my first life-advice: write things down! Thank me later.

That is it for today. Get on coding, have fun and stay connected.

niilz

It’s all about being connected

Bangkok electric wires

photo: electric wires in Bangkok, taken by myself 2016