Why hackits are the first thing I teach new classes

[update] I've created a website called 0xf.at which hosts all my hackits.

Every year I get new classes to teach and there are always students who took computer science but don't have a strong interest for it and don't relate many fun things with this subject. It sounds like a cliché but I thought long about how to reach those kids and I tried to remember how I became interested in computer science and programming.

I immediately remembered the Starfleet Academy Hackits (offline for years) which was a Site where you were presented with many levels of JavaScript hackits with increasing difficulty. I spent many hours on that site and even though I didn't come far I had lots of fun solving the first levels.

What are hackits?

Hackits are usually web pages that show you a password field and you have to find out the right password.

There is always a hint for the password in the source code of the page and you have to find it.

For my students I created a series of hackits. You can try them yourself with or without logging in.

Link: https://www.0xf.at

Example 1: Simple Hackit

function checkPW()
{
       var el = document.getElementById('pw');
       if(el.value=="tooeasy")
                    document.location.href="/success.html";
       else alert("Wrong password");
}

In this example the user enters a password and the function checks if it's right. The text the user entered is compared to the string "tooeasy" meaning if the user entered this it's the right password and they are presented with a success page. This is the first hackits I show my students and it's so easy that you don't need to know much about programming, HTML or JavaScript to find the answer. Many students can solve this on their own and the sense of achievement for cracking this password that would have been unbreakable for them a few minutes ago is what motivates them to continue.

Example 2: Using variables to confuse the player

function checkPW()
{
   var foo = 5 + 6 * 7;
   var bar = foo % 8;
   var moo = bar * 2;
   var rar = moo / 3;
   var el = document.getElementById('pw');
   if(el.value == moo)
       document.location.href="/success.html";
   else alert("Wrong password");
}

Here the students learn about variables and how they can store information. It's pretty straight forward and the only help most students need in this level is because they don't know what the % (modulo) sign does.

Why is this the first thing I teach?

Hackits represent all things that got me excited about computer science in the first place.

1. Curiosity

When you first see a hackit you usually have no idea what's going on. Step after step you have to find out what the site does and since you know that this is a hackit that must have a solution it encourages you to try harder. When you've got a lead you advance to step 2:

2. Experimentation

There are many different kinds of hackits and that means that you can try many things. The first thing you should try is always to enter a blank password. Next try "password" and "admin". If that didn't work you should take a good look at the source code. There might be a hidden message or a clue what you could try next

3. Success

Nothing is as rewarding as succeeding in your mission. This feeling is the main drive for many programmers and also for hackers. You beat the system and you learned something from it.

---

Comment using SSH! Info

Comments

---