Developing a Snake game

Hello,

The point quite a while a go was for me to update this blog more often publishing my current progress in basically everything. I did not have a lot of knowledge from running a blog previously but I have learned that its not that easy keeping it up to date while at the same time learning about new technologies and programming in general.

I have for the last 3 months planned that I should go to university this year. I am taking a test to increase my chances to be accepted at the 9th of April. I have been studying math and looked at previous tests now for quite i while but I still feel like Im not on the top of my game, I guess i will have to stay at it and just try learn as much as possible and then do my best at the test date. While my current biggest focus is going to school i have also been learning more programming on my own. My latest project was to develop a Snake Clone. So for this project the idea was not for me to learn a lot about fancy graphics or game development but to learn how to implement Algorithms into a product as well as I know some Math could be implemented in a project like this and my math is not my top subject so why not practice a bit of math as well?

The Math In Snake

So first of all i decided to create a Snake clone were you can turn 360 degrees instead of just 90 degree angles. This gives the game something fresh and new at the same time as making it more complicated for the developer.

So math in games are ALOT about Trigonometry. The good part is that you do not have to be a math genius to know trigonometry and you can get very far with just good base understanding and some common sense.

So you might have not thought of it before but games is full of triangles. If we woul imagine a 2D game right now where you have your character on the screen together with an enemy. Lets say we would like to calculate the distance between theese two objects (The Player and the Enemy). In your code you have the X and Y cordinate for both objects so what we could do is basically draw a line between the objects. But how do you know how long that line is? Well simply draw a line from the center position of each object together with the first drawn line to form a triangle.

Triangel

Notice also that the triangle we have drawn have a 90 degree angle. When you have this kind of triangle in your game you can easily start expressing yourself using some predifined math functions.

First of lets look at how a triangle is built:

Something to remember is the the hypotenuse is always the longest side, that will help you spot it out fast. Then just place in the opposite and adjacent sides in the target triangle.

The cool thing with trigonometry is that you only have to know 2 parts of the triangle then you can easily find out the value of the other by using the sine, cosine and tangent functions. For example you know the angle together with the length of one side:

sin(angle) = opposite / hypotenuse

cos(angle) = adjacent / hypotenuse

tan(angle) = opposite / adjacent

There is a great deal to learn when it comes to Trigonometry for games and i recommend you to first read up on some just normal math about trigonometry then move on to applying it to your code. I have previously tweeted about one resource i found out being great http://www.helixsoft.nl/articles/circle/sincos.htm

What i did in my Snake Game

So we got some background on how trigonometry can be helpful but what parts did i use for my game? What i had to do when i developed my 360 degree snake was to find out how to always more the Snake “Forward” what i mean with that is how to move the Snake in one direction depending on the current angle. We can already here spot that we have something we could use together with the functions we talked about before (angle).

When i made the game it wasnt just as easy as popping in some values into a function, the reason was that the Library i used (SpriteKit) has their own rotation code for their Node objects and it is being calculated in Radians from ~3.141 Radians to ~-3.141 Radians (Both is about 180 degrees). It was not just the issue with it being calcualted in Radians but it goes from a positive to a negative number. So how i solved it was to create my own new angle variable and adding or subtracting the rotation speed to both values both my own created Angle variable and the SpriteKit implemented rotation value.

Lets briefly look at some code:

newXPosition = snake.position.x - sinf(DEGREES_TO_RADIANS(angle)) * [snake snakeSpeed];

 newYPosition = snake.position.y + cosf(DEGREES_TO_RADIANS(angle)) * [snake snakeSpeed];
 
 snake.position = CGPointMake(newXPosition, newYPosition);

So what’s going on here is that we are using Trigonometry to decide where the new X and Y position should be depending on the angle. If we would draw up this example to visualise it it would look like this:

Trig

Since in my game the speed for the Snake is a constand we always have the same value there.  That is one way to use Trigonometry in game developmend but i found an easier example to understand and that is to calculate the distance between objects. That would look something like this:

deltaX = playerX – enemyX

deltaY = playerY – enemyY

Then use the arctangent to get the angle, most programming languages has this implemented:
atan2f(deltaY, deltaX);

From this there is an easy function you can just pop in the values to get the actual distance between the objects:

Sqrt(deltaX^2 + deltaY^2)

 

This should explain a bit of what i have been working with. Do not get me wrong Im not an expert on this subject in fact im pretty at math as I’ve said before. I will continue learning more about trigonometry since I am starting to find math in general more and more interesting. I will also try to update this blog more often.

Until next time!

Building a JSON Parser in Javascript

Hello,

The latest time spent coding has been on a new project I’m developing with a good friend of mine. The project is Called OpenWeatherJS and is an open source JavaScript library to process weather information parsed from the OpenWeatherMap API.

Also i should mention that the code examples is written in TypeScript using TypeScript syntax.

I was immediately assigned the task to build a JSON parser, i found this task very interesting since i have never built one before. So this post will be a post of my progress learning about parsing and building my first parser for a JavaScript library.

First of all i found the information that to retrieve data by sending a request to a website we can use the XMLHttpRequest that JavaScript supports. That lets us send a GET request to a specified URL and it’s not that hard to implement error handling.

So lets look at some code:

var xmlHttp = new XMLHttpRequest();

xmlhttp.onreadystatechange = function() {
if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
var myParsedJSON = JSON.parse(xmlhttp.responseText);
}
};
xmlhttp.open(“GET”, url, true);
xmlhttp.send();

So lets step by step walk through this initial code. First of all we are creating a new XMLHttpRequest object. After that is the function that contains the event handler that gets called when the readystatechange event fires. The if statement inside it is from the XMLHttpRequest documentation:

Value State Description
0 UNSENT open() has not been called yet.
1 OPENED send() has been called.
2 HEADERS_RECEIVED send() has been called, and headers and status are available.
3 LOADING Downloading; responseText holds partial data.
4 DONE The operation is complete.

So what happends inside the if statement is that the Request was a success and we are currently on the requested url. Then we use the xmlResponseText that returns the contents of the DOM in text form. We are expecting the called url to contain JSON so we are using JSON.Parse on the response text we got out of the request and now our variable called myParsedJSON should contain the parsed JSON from the website.

Since the event is only called when the ready state is changed this wont run by itself so below we are adding open function to open the GET request to the target url and the third argument is if the request should be asynchronous or not.

We finaly send the request with the send function.

So this is a working piece of code we have built a simple JSON parser but what if we would like to go to the next step. In our project OpenWeatherJS we wanted to build a library that functions well. If we would implement the above code in a working library that the public should use there is a high probability that someone that uses the library will stumble on for example a request failing or we would like to timeout a request so its not just waiting forever or if we want to check if the specified url is really an url or if the JSON we parsed is actually JSON.

All of this is something we implemented in our library. And i will explain how.

After this initial part was finished i moved onto checking if the URL was a valid URL. So how does one do this? We have to use something called Regex (Regular expressions). A regular expression lets us filter a string. Regex commands can be very difficult and takes time to understand. Here is a resource to learn about Regex: http://regexone.com/

Lets look at the code i implemented and then explain it.


/**
* Validates provided value is a URL and throws a new TypeError
* with specified message otherwise..
*
* @param value - a value being tested.
* @param message - a short description of the assertion.
*/
static isUrl(value: string, message: string): void {
var URLValidationRegExp = /(^|\s)((https?:\/\/)?[\w-]+(\.[\w-]+)+   \.?(:\d+)?(\/\S*)?)/gi;
var matcher = URLValidationRegExp;
var match = value.match(matcher);
if (!match) {
throw new TypeError(message);
}
}

So what we have here is a function that takes in an URL to check as well as a message to display if the URL was invalid. The function starts with a new variable URLValidationRegExp and this is the variable that contains the Regular expression i mentioned. To not dive too deep into just Regex I’ll just mention that this particular Regex is good for todays URLs’ because today an URL doesn’t have to follow the standard “www.example.com” it can be for example “api.example.com” or “example.com” this Regex expression will allow us to use a wide variety of URLs’ which is good.  Moving on we use a new variable called match to contain this regular expression as well as a match variable that will contain a boolean depending if the value matches the matcher variable (Which contains the regex) if the match is false after our match then the value doesn’t match the regular expression and the value is not a valid URL. Thats when we throw a new TypeError with the message from the parameters.

After that we can use the validation function inside our parsing function to check if its a valid URL we are sending the request to.

Next while we are validating values we can look at how we could validate that the JSON we parsed is actually JSON. Take a look at this function:


/**
* Validates provided value is a JSON Object and throws a new TypeError
* with specified message otherwise.
*
* @param value - a value being tested.
* @param message - a short description of the assertion.
*/
static isJSONString(value: string, message: string): void {
try {
var o = JSON.parse(value);
if ((typeof o !== 'object') || (o == null)) {
throw new TypeError(message);
}
} catch (e) {
throw new Error(message);
}
}
So if we look at this function it has the same structure as the function we used to validate the URL. Inside here we takes in a Parsed JSON value in the parameters and inside a try / catch statement we attempt to parse the value to JSON. So we are Parson a JSON value. JSON.parse returns an JSON Object so we are below checking if the type of the parsed variable is of the type object. And if the type is either not object or is null we want to return a type error since the value couldn’t parse it. Also we want to catch any errors that occur using the catch block to throw a new error with the same message in the parameters.

So we now have validation functions to use protecting our users so they do not either parse something that is not JSON or trying to parse from an invalid url. Also this gives us the freedom to type our own error messages so someone using the library has an easy time understanding what went wrong.
Next up we should give the code the functionality to be able to timeout after a certain time attempting to get the request from the URL. XMLHttpRequest has a property called timeout. Its a unsigned long number that we can use to specify in milliseconds how long the request has until it should timeout.

Something to note when implementing timeout functionality using XMLHttpRequest is that it has to be an asynchronous request. If you wonder what an asynchronous request is you could think of it like this:

Synchronous request would be you for example calling your friend on the phone asking him to get some information for you. You agree that he should call you back when he has the information, when you hang up you are just sitting and staring into the wall waiting for your friend to call back.

Asynchronous request would be you calling the same friend on your mobile phone asking him the same thing, get me some information and call me back. You then proceed with your day and then your friend calls you in the middle of the day and you get the information you wanted.

So adding the timeout feature make sure you are using an Asynchronous request and then you could implement some code like this:

xmlHttp.timeout = 2000;
And then look into adding a function that explains what would happen if the request timed out.
xmlHttp.ontimeout = function () {
xmlHttp.abort();
throw new Error("Request Timed Out.");
};

So what happens here is out request now times out after 2 seconds and then aborts the request and returns an Error.

The thing with adding in this functionality is that you would have to restructure your code a bit. Using an Asynchronous request as i mentioned would make your code continue and then getting the JSON in the middle of doing something else. That means we cannot set a variable equals to the parsed JSON inside the on ready state change event and then just return it and go on with our day. The function would return before our request is finished and our JSON is in our hands. But do not worry there is a solution for this as well.

In JavaScript the solution is called callbacks. We would have to restructure our entire function to have a callback function that the parsed JSON is returned to.

Here is how that would look together with our validation functions:

static Parse(url: string, done: (obj: any) => void): void {
Asserts.isUrl (url, 'URL is invalid.');
var xmlHttp = new XMLHttpRequest();
xmlHttp.onreadystatechange = function() {
if (xmlHttp.readyState == 4) {
try {
if (xmlHttp.status == 200) {
var obj = JSON.parse(xmlHttp.responseText);
Asserts.isJSONString(JSON.stringify(obj), 'Retrieved JSON is invalid.');
done(obj);
}
} catch (err) {
throw new Error("Error connecting: " + err);
}
}
};
xmlHttp.open('GET', url, true);
xmlHttp.timeout = 2000;
xmlHttp.ontimeout = function () {
xmlHttp.abort();
throw new Error("Request Timed Out.");
};
xmlHttp.send();
}

If we look inside this we can see how our parameters for the parse function takes in a function. Thats how we add a callback. That means when we call the parse function we have to add a function into the parameters that takes one argument and when the parse function is finished then the done would be called (the callback) and our JSON object is placed into the parameters.

Then there is more things to do like adding support for Internet Explorer. Anyways our completed function looks almost the same as what i explained here. The difference is that we added another callback function that is called if there is an error getting the request. That means we can have another function in the parameters which we use to run another piece of code if the request was a failure.

Something to mention when implementing cross browser support is that IE5 and IE6 uses something called ActiveX object instead of XMLHttpRequest.

Here is a brief introduction to the subject: W3Schools XMLHttpRequest

And here is another resource: www.jibbering.com/2002/4/httprequest

Next up i will cover some Algorithms i have recently studied. Also if i encounter some new pieces of code like building a parser i will write about it as i do it so it becomes more. I am also soon going to build a project in Java which i will try to cover here as well.

Until next time, see you later!

An IRC-Bot in Go

I was looking around on the web confused as always and i found some interesting projects on Github that were built using a programming language i had never heard of before “Golang”. I immediately started looking up what Golang was and noticed that its a C/C++ inspired language used for a good range of different applications, its a compiled language which is attempting to bring the best of dynamic typed languages like Javascript and compiled languages such as Java. I got a book and started to read more about Go. I decided to switch it up and start writing in English to reach a bigger audience.

So i started with step by step walking through the book called “The Little Go Book” its a good book explaining most parts very well. So i followed the book from start to finish as well as taking noted and trying to write small examples and extending code provided in the book. It was going well and everything was working as intended.

After reading the book i was struck with how great it felt coding in Go. Before i was a bit skeptic to getting my hands dirty with a compiled language. But when reading a little bit more and trying for myself i noticed that the compile time is almost non existent, its so fast and easy to get started with.

I moved on creating a real project not just test code, i decided after thinking a while and finding the net package to create my own bot that connects to an IRC chat and “remembers” users as well as their messages.

The development of the bot was really smooth and i almost never encountered any problems with using Go. Dependency management is really easy using go get and i just overall got encouraged to just write code.

So i wanted this bot to actually do something so before i started coding i started writing up some features i wanted the bot to have:

  • Logging users & their messages to a sqlite database.
  • Able to print out .txt files of user loggs.
  • Listen to user commands both from the chat & the terminal.
  • Able to evaluate statements from the chat Example: !eval 5 + 5 would return 10

There were two things i found difficult and it was to create the eval feature. Implementing a reader that reads identifiers from a string was not that supported and this is what i came up with:

ast.Inspect(tr, func(n ast.Node) bool {
var s string
switch x := n.(type) {
case *ast.BasicLit:
s = x.Value
Evalvalues = append(Evalvalues, s)
case *ast.Ident:
s = x.Name
Evalvalues = append(Evalvalues, s)
case *ast.BinaryExpr:
s = x.Op.String()
operands = append(operands, s)
}
if s != “” {
fmt.Print(“Pos: “, n.Pos(), ” Value: “, s)
}
return true
})

This piece of code is using the ast package and it is inspecting nodes parsed from a string looking at all identifiers and literals. It is placing all the values found (Numbers, Strings, etc) into one interface slice and the operands (+, -, * etc) is placed into a separate interface slice. The empty interface is something i had a hard time to understand at first in Go. There is no such thing as optional parameters in Go so you will have to use interfaces. So when coding in Go i noticed two parts you will have to read a few extra parts is about interfaces and type assertion since you will need it.

I also created a feature of blocking users, blocked users cannot use the commands for the bot in the chat. Currently the featured chat commands is:

  • !help – Displays help message
  • !status – Displays uptime, users & messages tracked
  • !eval – Evaluates a statement

Another thing i like about Go is concurrency, its a feature you can compare to threads where you have multiple processes running at the time. In my bot application i was determined that i was going to use Golangs concurrency features. There is three different processes running in my bot application, two processes for each control panel (one for the terminal and one for the chat) and one process for the connection and listener. Go uses “channels” to communicate between processes and in my application i am using one channel to send strings from the chat reader to the chat control panel.

My weeks of using Go has been great and i encourage people who want to try new things to try learn Golang, its easy to learn and very fun and rewarding as well.

My next projects is a Weather API which i will write more about here.

Untill next time!

En simpel “Att göra” applikation Del 2

Efter lite tänkande bestämde jag mig för att utöka min lilla applikation och lägga till kategorier för dina tasks. Hur det fungerar är att det använder sig av en “Mant To Many” databasstruktur vilket innebär att en Task kan ha många kategorier och en Kategori kan ha många tasks kopplade till sig. Just nu i min applikation så kan man bara lägga till en kategori till en task men man kan se alla tasks tillhörande en specifik kategori.

Hur det loopas ut är det som jag fan komplicerat när jag skapade denna funktionen, jag hade nyligen läst om JOIN statements i SQL och var ivrig att få testa det i min egen kod. Men det var inte så lätt att uttrycka sig i SQL första gången men tillslut efter jag tagit lite hjälp från en psuedo kod som fanns på internet lyckades jag snickra ihop detta

<?php
foreach($conn->getConnection()->query(“SELECT * from tasks t
JOIN `task category table` cc ON t.TaskID = cc.TaskID
WHERE cc.CategoryID = $category”
) as $row) {
?>

Det som händer här är att den joinar de kolumner där TaskID instämmer på task databasen och task category databasen där de innehåller ett specifikt kategori ID. Nu i efterhand förstår jag hur det fungerar och jag hade kunnat göra det igen.

Något annat jag kom över och blev intresserad av var något som nyligen länkades i  en av de internet tidningar jag läser och det var en artikel som handlade om Design Patterns i PHP. Bland annat i denna artikeln stod det om ett pattern som kallades för Singleton. En Singleton är ett sätt att begränsa användningen av en klass till endast en instans. Det du gör är att du ändrar klassens constructor till private så man inte kan skapa en ny instans bara sådär samt skapar du en privat statisk variabel som kommer innehålla en instans av klassen, sedan skapar du en funktion som kollar ifall det finns en instans och om det finns returnerar den en existerande instans.

public static function getInstance(){
if (empty(static::$instance)) {
$class = get_called_class();
static::$instance = new $class;
}

return self::$instance;
}

Mer går att läsa här: http://www.phptherightway.com/pages/Design-Patterns.html

 

Jag har återrigen vandrat iväg med tankarna angående min kariär som programmerare och jag har faktiskt kommit fram till att jag ska göra ett beslut. Det som jag faktiskt tycker om att göra det är att skriva backend kod, jag gillar själva idéen att faktiskt skriva kod och inte sitta och knäppa med HTML/CSS hela tiden. Design har aldrig lockat mig och även om jag måste jobba med det nu som frilans webb utvecklare så är det inte min grej. Jag vill kunna bli kallad programmerare och backend är min väg till det. Så vad jag har bestämt mig för är att vid sidan om lära mig PHP och göra det bra, jag ska från och med nu läsa allt, vara som en svamp och suga åt mig all kunskap jag kan få tag på.

En sak som hållt mig tillbaka länge nu har varit det att det går sakta att lära sig, jag har försökt pusha på lärandet hela tiden med det ska ta ett stopp nu, jag ska istället för att skumma igenom information på internet läsa varje ord. Det är dags att få ett slut på detta påhitt jag vet inte hit och dit, jag vet vad jag vill och det är dags att plocka äpplet från trädet. Jag ska avsluta min bok PHP 5 And MySQL Bible och sedan gå över till en ny bok som väntar vid namn Code Complete.

 

Med detta säger jag tack för mig!

En simpel “Att göra” applikation

Efter att jag fortsatte att läsa boken om PHP och MySQL förstod jag att jag inte kan ge mig in på ett för stort projekt. Jag måste börja från början och skapa någonting enkelt och jobba mig uppåt. Jag tänkte igenom vad jag använder mycket och något jag gjort under lång tid är att skriva listor. Att skriva listor har hjälpt mig att komma ihåg vad som måste göras samt sätta upp mål angående vad som ska göras under en viss dag.

Jag bestämde mig att skriva en applikation i PHP och MySQL som använder just de två språk den bok jag läst handlar om. I detta projektet hade jag inte säkerhet i baktanke utan jag tänkte att jag bara ska få allt att fungera. Jag använde inga ramverk eftersom jag anser att det hade försvårat utvecklingen av en så liten applikation. Något jag ville öva på var också objekt orienterad programmering vilket jag ville klämma in i detta lilla projektet.

För enkel start började jag med anslutningen till MySQL databasen,  i en separat klass Connection.php skapade jag en constructor som initierade en anslutning till databasen via PDO. PDO är en väldigt simpel väg att ansluta till databasen samt ifall man skulle vilja byta databas är det väldigt lätt att ändra. Jag nämnde att jag inte skulle tänka på säkerhet men kan endå nämna att PDO är ett säkert sätt att hantera databasen via kod då den förbereder kodraden innan den körs vilket lägger på ett lager säkerhet.

<?php
public function __construct() {
$dbh = new PDO('mysql:host=localhost;dbname=test', $user, $pass);
}
?>
Jag gick manuellt in i databasen via phpmyadmin och lade till ett par test inlägg för att ha något att jobba med visuellt. Därefter gick jag in i index.php och började jobba med att få något att visas på skärmen. Vi var nu anslutna till databasen och hade ett par test inlägg i databasen. Det som behövdes var en funktion som hämtar inläggen ifrån databasen och placerar dem så användaren kan se dem visuellt.
<?php
foreach($dbh->query('SELECT * FROM tasks') as $row)
Ett enkelt sätt att loopa igenom varje inlägg som finns i databasen. I denna loopen skapar vi HTML kod som man normalt hade gjort om man designar en hemsida och lägger in klasser som sedan låter oss hantera dem visuellt i CSS efter. Efter detta hade jag mina test inlägg visandes på skärmen.
Sista som behövdes var ett sätta att både ta bort och lägga till nya inlägg. Jag skapade ett simpelt formulär som skickar en POST request till samma sida för att lägga till nya inlägg och lade till en länk som var till för att ta bort ett inlägg genom att också skapa en form med en hidden input som var inläggets id. Enkelt härefter kunde jag skapa två funktioner som var näst intill identiska.
<?php
public function addTask($title, $text){
$sql = "INSERT INTO tasks (title, text) VALUES(:title, :text)";
$q = $this->dbh->prepare($sql);
$q->execute(array(
':title' => $title,
':text' => $text));
}
Efter detta var jag färdig med min simpla applikation. Något jag hade velat tillägga till applikationen hade varit kategorier som använder fler databaser så jag får känn för MySQLs JOIN statements samt lägga till funktion för att uppdatera / redigera inlägg. Något mer som hade varit bra hade varit säkerhet så som att inte vem som helst kan lägga upp tasks.
Något som jag kommit och tänka på nu efteråt är att PHP och backend i helhet är något som är väldigt roligt och underhållande för mig som programmerare men som ensamvarg är just nu frontend viktigare. Något som är bra med frontend är att det nästa varje dag händer något nytt, det finns nyhetssidor att följa och så mycket att lära sig. Det är också väldigt viktigt eftersom det är vad din kund som webbutvecklare ser, din kund ser inte din kod för hur ditt bokningssystem ser ur han vill bara att det ska fungera. Han ser och bryr sig om hur det visuella på sidan ser ut vilket fått mig att tänka på ifall jag ska hålla mig till WordPress som bidrar med färdigställda backend funktioner och sedan fokusera på design och frontendutveckling. Detta är något jag ska kika på!
Tack för mig!

 

Var är jag nu?

Jag har nu bestämt mig att börja hålla i en blogg som jag driver på min portfolios webbserver. Jag såg på drivandet av en blogg som en möjlighet att dokumentera ner min personliga utveckling vilket också kommer vara inriktningen på det jag skriver här och jag tänkte börja med ett inlägg som grundligt berättar om hur jag kom hit där jag är idag.

För cirka 5 år sedan var jag väldigt inne i spelvärlden och redan då såg min far att det inte var bra för mig att jag hela dagarna satt och spelade spel. Han har mycket under min uppväxt försökt uppmuntra mig till att bita tag i studier så att jag kan få ett bra jobb som jag trivs med. Han försökte att få mig intresserad av olika saker vilket inget av det bet på mig, jag var bara intresserad av att spela datorspel. En dag då jag var 13 år kom han på idén att locka mig till att göra något annat genom att berätta för mig hur man kan skapa egna spel. Detta var då jag först fick reda på vad programmering betydde vilket jag inte hade en aning om förut. Jag blev helt fångad av hans idé och följde snabbt den första “Tutorial” jag hittat och efter några timmar hade jag laddat ner Visual Studio och skrivit mitt första Hello World i Visual Basic. Jag fortsatte med att lära mig mer om programmering och jag läste varje dag på internet om programmering för att lära mig mer, jag började även spendera mitt studiebidrag på böcker som jag nu har väldigt många av.

Olika perioder gick och mitt intresse för kod och programmering gick upp och ner men då tiden kom för att börja på Gymnasium och jag hade kommit in på Teknik linjen som skulle lära ut just programmering fick mig väldigt intresserad igen och jag började snabbt komma igång med mina gamla vanor då jag satt varje bussresa morgon och eftermiddag på min smartphone och läste om programmering och så fort jag kommit hem var det bara att koda som gällde. Sedan kom programmerings kurserna och det var TOTAL katastrof, allt som blev utlärt i hela programmering de två programmerings kurser vi hade kunde jag redan och det var bara tråkigt för mig att ens vara där. Jag tappade snabbt mitt intresse för Java, C++ och C# och började komma igång med mina gamla vanor med spelandet.

Ett annat ämne som vi också hade kurser i var gränssnittsdesign och webbutveckling vilket jag alltid i tidigare ålder har boycottat och sagt att det inte är riktigt programmering att skriva HTML & CSS.  En dag kom då vi fick en uppgift att designa om den sämsta hemsidan vi hade hittat på internet till en modern och bra hemsida. Jag hade kammat hem jackpotten om uppgiften bara gällde att hitta den sämsta hemsidan för jag valde den mest gräsliga någonsin. Hemsidan jag hittat tillhörde en egenföretagare som sålde traktorer och lastbilar, han hade blandat färger, typsnitt och text storlek hur som helst och det var i princip omöjligt att göra en sämre hemsida än den jag hittat. Dagen kom för redovisning och jag kopplar in min dator till projektorn och sedan kollar på det jag själv har att visa upp och vad är det jag ser.. En stor besvikelse, jag hade alltså lyckats att skapa den fulaste hemsidan som någonsin skådats.

Detta slog hårt på mig då jag tillåter aldrig mig själv att vara sämst eftersom jag är lite av en tävlingsinriktad människa. Efter detta började jag läsa på mer om design samt HTML & CSS och jag tillochmed frågade min lärare om råd efter lektionerna då jag verkligen kände att jag var så dålig. Han var snäll och hjälpte mig med råd samt bidrog med böcker som behandlar design. Jag tog min fritid och riktade bort den ifrån spelandet och drog mig mer åt frontend webbutveckling. Några månader gick och det var dags att visa upp en ny uppgift vi alla hade fått vilket var en portfolio hemsida. Jag gör samma som sist och jag kopplar in kabeln till projektorn och kollar på min skapade hemsida och känner mig mycket mer stabil och lycklig. Jag vände mig till min klasskamrater och ser också att jag fångat deras intresse.

Att skapa en hel hemsida som också blir färdig var en helt annan upplevelse än att programmera eftersom mina program skrivna i Java, C++ och C# sällan blev 100% färdiga innan jag gick vidare. Nu när jag skapat något från början till slut som jag gjort med min hemsida förstod jag vad jag verkligen ville.

Idag fortsätter jag med att lära mig webbutveckling, jag har inte bestämt mig ifall jag vill rikta in mig på backend lösningar eller fortsätta med frontend då mina design förmågor inte krigar med de som är tip-top. Jag har utvecklat mina kunskaper och har lanserat hemsidor som jag faktiskt är nöjd med. Idag då detta inlägget skrivs så är jag mer taggad på att lära mig frontend eftersom det är där mina rötter ligger, jag har påbörjat en app i angularjs som jag sedan ska lägga upp på min server där jag ska kunna skriva listor i form av “Att göra” så jag slipper använda upp alla mina anteckningsblock här hemma. Jag har också börjat läsa böcker igen och jag har kommit långt i boken PHP Bible samt påbörjat Eloquent Javascript.

Var jag är nu är på god väg inför att fullfölja min dröm med programmering och jag vet just nu vad jag vill och jag blir mer och mer målmedveten dag för dag. Jag kommer fortsätta göra inlägg i framtiden som behandlar vad jag gjort samt vad jag lärt mig utav det för att de som är intresserade och framför allt jag själv kan följa min utveckling enkelt då jag behöver det.

Tack för mig!