Arkiv för kategori ‘Guider’

jQuery är snyggt

Större delen av gårdagen ägnades åt en workshop (tack @stpe) kring frontendutveckling. Fokus var på YUI, men eftersom jag jobbat en del med det redan, men däremot inte hunnit dyka ner i jQuery på riktigt, valde jag det senare.

Min idé var att göra ett lajvflöde av Flickr-bilder och Twitter-postningar baserat på ett givet sökord eller tag.

JSONP

Både Flickr och Twitter har rika APIer i JSON-format som gör det lätt att åstadkomma det jag vill. Då dessa av naturliga skäl inte ligger på samma domän som min labb, kan jag inte göra ett vanligt XHR-anrop eftersom webbläsaren av säkerhetsskäl kastar ett same domain-policy-fel. Räddningen stavas JSONP, som helt enkelt wrappar hela JSON-svaret i ett metodanrop. Detta går vi inte in närmare på denna gång, utan konstaterar istället glatt att jQuery har stöd för detta och löser detta under ytan.

jQuerys effektköer

Planen är alltså att långsamt smyga in en bild, visa den ett tag, sedan dimma ner den och till sist ta bort den helt.

Sedan jQuery 1.4 finns det en toppenmetod för att hantera pauser i den allmänna effektkön, fx. Metoden heter delay() och låter mig åstadkomma önskat beteende på ett oerhört kompakt och tydligt vis.

$(img).fadeIn('slow').
    delay(1000).
    fadeTo('slow', 0.3).
    delay(2000).
    fadeOut('fast', function() { $(this).remove(); });

Det är ju nästan som att prata svenska (engelska)! Vi repeterar:

  • Smyg långsamt in bilden
  • Vänta en sekund
  • Dimma ner den litet
  • Vänta två sekunder
  • Smyg snabbt bort bilden och ta bort den

Koden

Vill du se hur det ser ut, kan du titta här eller ladda ner hela koden och labba vidare själv.

Den produktive programmeraren

En av de bättre dragningarna på årets Øredev var Neal Ford’s ”The Productive Programmer: Mechanics”. Neal har skrivit en bok med samma namn, som jag hört litet blandad kritik om. Därför hade jag inga större förväntningar när jag klev in i rummet. Efter orden ”Graphical tools are med for novices” visste jag att detta var något för mig!

Nedan följer en rad tips, som alla syftar till att hjälpa dig bli en mer produktiv programmerare, oavsett om du använder emacs, notepad eller Eclipse.

Urklippshanteraren (eller clipboard)

Varför, varför finns det bara plats för ett urklipp i taget i dagens moderna operativsystem (*nix-dialekter undantagna)?

Det är ju helt tokigt att inte kunna gå tillbaka och ta fram något man kopierade eller klippte ut för bara några minuter sedan, bara för att man råkat svara på ett mail, mitt i ett enhetstest eller liknande. Lösningen finns i form av några hjälpprogram:

Lär dig kortkommandon

Tiden det tar att lära sig även det mest obskyra kortkommando är väl investerad tid. Varje gång dina fingrar måste lämna tangentbord slösar du med tid. Hitta en bra partner att parprogrammera med och be honom/henne raljera över hur långsam du är varje gång du använder musen.

Scripta dina vanligast kommandon/texter

Om du märker att du ofta skriver samma sak, skriver samma fel eller skriver samma sekvens av kommandon i en terminal, finns det hjälp. Textexpander är ett litet makroverktyg som verkligen sparar tid. Du kan använda det till allt från epostsignaturer till kod-”snippets”.

Tyvärr kostar det pengar och finns det bara för Mac, men jag är övertygad om att det finns ett Windowsalternativ.

”Locus of Attention”

Att kunna fokusera och komma in i flytet (”the Flow” eller ”the Zone”) är lika viktigt som verktygen du använder. Om du programmerar vill du att platsen för din uppmärksamhet (fritt översatt) ska vara din IDE. Inte din klienter för IM, Twitter eller email, etc. Med den mängd information vi utsätts för varje minut är detta svårare och svårare.

  • Stäng av dina klienter för epost, twitter och IM och uppdatera dig då och då när du tar en paus från programmerandet
  • Använd hörlurar för att visa att du inte vill bli störd
  • Inför tysta timmar på kontoret, exempelvis mellan 14 och 16 varje dag då du verkligen kan fokusera

Neal menar exempelvis att Windows är som en treåring som konstant stör dig med påpekanden som ”Du har oanvända ikoner på ditt skrivbord”, ”Ditt virtuella minne håller på att ta slut” eller ”Det finns säkerhetsuppdateringar till din dator”. För att ytterligare hjälpa dig att minska störande moment finns det verktyg, skärm-dimmers, som sakta släcker ner allt förutom ditt akiva fönster:

Sök

En sökning slår alltid navigation med mus eller till och med tangentbord. Se till att du har en bra lokal sökmotor för din dator, som Google Desktop (Mac/Windows) eller QuickSilver (Mac). Neal menar att navigera i en trädstruktur i utforskaren eller i din IDE är som att berätta för datorn att du vet hur du använder musen. Om du vet vad filen heter – sök!

Automatisera

Ett spiffigt användningsområde för Selenium är faktiskt att automatisera ditt iterativa testande. Du kanske felsöker en funktion som kräver att du klickar dig igenom en sekvens, fyller i litet testdata och till slut når fram till funktionen du felsöker. Denna process kan bli ganska trist att upprepa om och om igen. Med Seleniums IDE, som du installerar som ett plugin till Firefox, kan du enkelt spela in sekvensen en gång och sedan spela upp den varje gång du vill testa. Eller som Neal uttrycker det; ”You should never manually interact with the thing you are building unless you want to”.

Han avslutar med tänkvärda ”Solving problems by hand, makes you dumber”. Word!

Så får du Google Sync att fungera med din iPhone

För några månader sedan flyttade vi över epost, kalendrar, kontakter och en hel del annat till Google Apps. Det kan jag verkligen rekommendera, men det är inte det vi ska prata om idag. För några dagar sedan fick Athega äntligen leveransen av alla iPhone 3GS-telefoner. Detta aktualiserade hur vi skulle få just epost, kalendrar och kontakter att synkroniseras mellan mobil, dator och Google.

Visst, man kan hävda att Googles iPhone-anpassade Safari-applikationer är bra nog och ibland bättre, men den här guiden visar hur du får epost, kalendrar och kontakter till de nativa motsvarigheterna i din iPhone.

Viktigt att tänka på innan du börjar är att Google endast tillåter ett konto av detta slag (jag har exempelvis lagt till min privata gmail via vanlig IMAP).

Aktivera Google Sync för Google Apps

För att synkroniseringen ska fungera fullt ut behöver du eller din Google Apps-administratör aktivera Google Sync. Detta görs genom att kryssa för ”Aktivera Google Sync” under ”Inställningar för mobilen” när du befinner dig på Tjänstinställningar för Google Apps som administratör.
Inställningar för mobilen

Välj kalendrar

Om du inte aktivt väljer vilka kalendrar du vill synkronisera, kommer du bara få din standardkalender. Detta kanske räcker för en del, men jag har flera olika kalendrar som jag vill få synkroniserade. Att få detta att fungera var inte helt problemfritt. Google kommer säkert förbättra detta, men när detta skrivs behöver du göra enligt nedan.

Svenska stöds inte

Svenska stöds inte

Nu visas Sync-ikonen

Nu visas Sync-ikonen

Din iPhone

Din iPhone

Se till att du är inloggad med ditt Google Apps-konto och att m.google.com är konfigurerad till din domän. Tyvärr såg jag ingen Sync-ikon, efter detta. Det visade sig att jag var tvungen att ändra språk långst ner på sidan. Efter jag ändrat till ”English (US)” och även land till ”USA”, visades ikonen som den skulle.

Nästa steg är att välja din iPhone och sedan vilka kalendrar du vill synkronisera.

Välj kalendrar

Välj kalendrar

Sätt upp ett Exchange-konto

Detta gör du genom att välja Inställningar -> E-post, kontakter, kalendrar -> Lägg till konto… De inställningar du behöver hittar du här.

Sätt upp ett Exchange-konto

Om du har befintliga kalendrar får du välja om du vill ersätta dem. I mitt fall ville jag det eftersom de kalendrar som redan fanns i min iPhone var samma Google-kalendrar, synkroniserade via iTunes.

Radera eller spara befintliga kalendrar?

Radera eller spara befintliga kalendrar?

Så var det klart, alltid samma data i din iPhone som på Google Apps och med Push!

Fördjupning

Mer information hittar du hos Google: