Dzemal Becirevic

Nu är min RIA (Rich internet application) färdigställd (i alla fall inom ramarna för kursen) och då tänkte jag skriva några rader kring projekt och kursen överlag. Applikationen finns att se här, och källkoden finns här.

Innehåll:

1. Planering
2. Implementation
• Backbone & Underscore
• Events – It’s tricky.. sometimes
3. localStorage
4. Kollaborering
5. slutsats

Anledningen till att jag valde att göra en ”simpel” Todo applikation är för att det kändes som det enklaste sättet att lära sig ett nytt ramverk. Man får lära sig arbeta med vyer, events, CRUD och får en grundläggande förståelse för hur Backbone fungerar.

Planering

Planeringsstadiet i kursen kändes som ett bra moment, man fick tänka igenom alla objekt och funktioner innan man ens hade börjat koda någonting. Det är faktiskt väldigt ovanligt för mig som webbutvecklare som inte riktigt varit med i skarpa projekt och därför skippar planeringsstadiet i varje ”privat” projekt men jag ser klart fördelen med att göra detta och jag ska försöka bättra mig på den fronten.

Implementation

Nästa steg var att börja implementera min planerade applikation. Det var här problemen, självklart, började dyka upp. Först upplevde jag en hel del problem med att förstå hur require.js fungerar men att ha läst igenom Organizing your application using Modules (require.js) så klarnade det hela väldigt mycket faktiskt.

Backbone & Underscore

Nu gällde det bara att förstå sig på Backbone i sig, så där fick jag även spendera några timmar med att läsa på och testa olika implementationer för att få en bättre förståelse. Implementationen gick vidare och jag fick väldigt konstiga och kluriga buggar som både jag och David fick sitta och försöka lösa väldigt länge men felsökning är alltid roligt, i rimliga mått.

Events – It’s tricky.. sometimes

Det klurigaste, men även det smidigast när förståelsen var på plats, var helt klart events och hur man ska jobba med dessa. Det finns t.ex flera olika lösningar för att ta bort en modell som man klickat på, men vad är det smidigaste sättet? Jag valde att implementera en vy för varje enskild Todo som gjorde att jag kunde koppla ett klick event till det elementet som i sin tur gjorde att jag bara kunde köra this.model.destroy();

1
2
3

delete : function() {
  this.model.destroy();
}

localStorage

Jag använde mig utav localStorage som lagring för den här applikationen men har de senaste dagarna även hittat en, i brist på annan kunskap, lösning för att koppla på MongoDB som lagring genom att lägga en url-egenskap på modellen/collectionen som sedan går via ett php script för att hämta data från en MongoDB databas. Denna funktionalitet är inte implementerad i min applikationen utan testad för ”utbildningssyfte”. Eventuell vidare utveckling av applikationen är att implementera en lösning för att applikationen ska använda MongoDB för att spara data externt och när användaren är online, men samtidigt använda localStorage på varje enskild klient för att kunna köra applikationen offline med.

Kollaborering

Jag har ännu inte hunnit göra så mycket i kollaboreringsstadiet förutom det jag nämner i föregående inlägg – kollaborering – pollthingy, vilket var väldigt enkelt att implementera. Sen var det inte heller några större svårigheter att använda github för kollaboreringen, det fungerade väldigt smidigt och har fått mig att inse kraften i github, faktiskt så pass att jag hellre kör det nu än någon annan versionhanterings lösning som t.ex Google Code genom SVN.

Slutsats

Ja, då var vi här.. Allt som allt så har hela projektet varit roligt att genomföra, klurigt, utmanande men samtidigt väldigt givande. Det känns skönt att ha fördjupat sig lite mer i ett javascript ramverk för att lära sig göra ”riktiga” applikationer med det istället för att bara använda javascript för t.ex. valdering av formulär och lite snygga animeringar. Känns som att jag fick upp ögonen för javascript som ett programmeringsspråk ännu mer än tidigare, men det kommer nog aldrig riktigt ersätta kärleken för PHP eller ASP.NET.

Dock, så har jag faktiskt börjat skriva om mina senaste applikationer som t.ex Chatter i Backbone, men jag har ännu inte kommit speciellt långt i utvecklingen.

Summa summarum, Backbone, underscore, require kommer definitivt komma till användning i mina framtida applikationer.

I kursen Webbutveckling med PHPII så skulle vi arbeta med ramverk, vi hade ett antal workshops där vi gick igenom frågor som behandlar inkapsling, databaser, olika design mönster osv. Vi fick även lära oss grundläggande kring hur man ska jobba mot Facebook Graph API för att inkludera sociala funktioner från facebook på sina webbplatser.

Det var faktiskt enklare än vad man trodde, har fasansfulla minnen för några år sen när jag försökte mig på samma sak och då gick det inte så bra. Slutade nog med att jag bara la ner hela grejen.

Men iaf, i PHPII kursen, så skulle vi ha ett projekt i slutet, där man skulle välja ett ramverk att fördjupa sig inom. Jag har tidigare inte använt något annat ramverk än CodeIgniter (som jag förövrigt lärde mig under en av workshoparna), och jag fastnade för det direkt. Tycker att det väldigt smidigt och väldigt likt ASP.NET MVC som jag sedan tidigare tycker väldigt mycket om. Jag har länge ”sökt” eller önskat att det skulle finnas något ramverk i php för att skriva MVC applikationer på liknande lösning som i ASP.NET MVC men aldrig riktigt tagit mig tiden till att faktiskt aktivt söka efter ett. Antar att det är på grund av den här arkitekturen som jag faktiskt fastnat för CI.

Chatter

Som projekt till kursen valde jag att skriva en online chatt skriven med CI och Javascript/Jquery för Ajax bitarna. Det kanske inte är den mest avancerade koden som finns skriven, men jag har i alla fall lärt mig att använda CI på ett bra och godkänt sett. Fick även ge mig på att skriva sk. helper-klasser för enklare hantering av strängberoenden och dylikt, vilket säkerligen kommer underlätta vid eventuell framtida vidareutveckling.

Jag har tänkt mig att kanske släppa källkoden för chatten publikt här på bloggen, men är fortfarande lite osäker så tills jag har bestämt mig så får ni köra på live versionen som ligger upp. Testa, leta buggar, förstör, ja gör precis vad ni vill. Kommentera gärna här på sidan om ni har synpunkter osv.

Chatter – Online chat developed by Dzemal Becirevic using CodeIgniter and JQuery.