Ny blogg

Bloggar vidare på: nekman.se istället!

/Nils

Modelmapper

Förra veckan blev jag tipsad om modelmapper som automagiskt mappar ett objekt till ett annat. Rekommenderar verkligen detta bibliotek då det sparar mycket tråkigt arbete med att manuellt kopiera värden från ett objekt till ett annat.

Fungerar såhär:

Har man t.ex. en Order som representeras av en OrderView ...

...Kan Modelmapper användas för att göra om en Order till en OrderView på följande sätt:


Gjorde en hjälpklass för att ännu snabbare kunna mappa ett objekt till ett annat:


Användning:


Egentligen skulle man vilja kunna skriva något i stil med:

Och använda ett TypeToken för att ta reda på typen. Alltså något i stil med:

Dock fungerar inte detta i Java eftersom typen (TResult) inte går att bestämma förrän i runtime...Tyvärr.


/Nils

jQuery/Zepto plugin & Github Pages

I mitt föregående inlägg publicerade jag en gist om en jQuery / Zepto plugin.
Skrev att jag ej visste om jag skulle använda den, eller om jag skulle utveckla den mer.
Vet fortfarande inte om jag ska använda den (förutom i ett projekt på jobbet där det möjligen finns ett use-case där den kan passa in).

I brist på andra ideér gick jag dock "all in" med denna plugin (nästan, för jag har inte publicerat den på plugins.jquery.com än...Vilket jag kanske heller inte gör eftersom det verkar onödigt komplicerat att publicera plugins där...Vilket dock kan vara bra, då det håller mindre genomtänkta plugins borta...*hrrmm*).

Fick iallafall möjlighet att titta lite närmare på Github Pages, vilket är ett mycket smidigt sätt att direkt publicera en projektsida/demosida till sitt repository.

Github-sida för mitt projekt finns här: http://nekman.github.io/keynavigator

Återigen, vet som sagt inte om denna plugin är till någon som helst nytta annat än möjligen för egen del. Det känns ju lite "år 2009" att sitta och utveckla jQuery plugins...

Imorgon vaknar jag upp ett år äldre och har förhoppningsvis blivit så pass klok att jag inte lägger mer tid på jQuery plugins :)

/Nils

Navigeringsplugin till jQuery/Zepto + semester!

Har inte suttit så mycket vid datorn (relativt, men inte så mycket som hade velat) under den senaste tiden. Haft fullt upp med annat.

Finns så mycket man skulle vilja titta närmare på. Windows Azure verkar riktigt smidigt att komma igång med och stödjer flera språk (bland annat NodeJS och MongoDB), plattformar, automatiska byggen, TFS / GIT integration mm. Hoppas kunna ta en närmare titt på detta under våren.

Har dock påbörjat ett hack i form av en navigeringsplugin till jQuery / Zepto.
Med hjälp av denna plugin kan man t.ex. med piltangenterna navigera i listor och tabeller. Har för mig att det finns någon liknande plugin, men ingen som gjorde exakt det jag ville.

Exempel: $('ul li').keynavigator(/*options*/);
Demo:  http://fiddle.jshell.net/Evh3Q/show/
Källkod: https://gist.github.com/nekman/5250423

Oklart om jag kommer använda denna plugin, eller utveckla den mer.
Kritik mottages tacksamt. Ända sättet att bli bättre enligt mig :)

Nog om det!
Sitter i skrivande stund på tåget påväg mot Kastrup för att därifrån flyga till Singapore och för att därifrån flyga vidare till Bali där jag och min kära sambo ska befinna oss de kommande veckorna.

Kommer inte bli någon form av bloggande eller kodande under denna period.
Tänker mest ägna mig åt att sola, bada och ta mig igenom boken om Steve Jobs.

/Nils - från tåget mot Kastrup.

JSView för Google Chrome

Har sedan 1år (cirka) använt Google Chrome som primär webbläsare. Tidigare körde jag (nästan)  enbart Firefox. Kör dock fortfarande FF då DOM-inspektorn i Firebug enligt min mening slår den som finns i Chrome.

Oftast är det dock Chrome som gäller, även om det knappast kommer vara så i all framtid.

Ett addon jag även använder i FF är JSView. Det enda detta addon gör är att visa en webbsidas inkluderade JS och CSS-filer i context-menyn. Självklart finns det andra sätt att ta reda på detta, men jag gillar att man endast med hjälp av ett högerklick kan bilda sig en uppfattning av vad som är inkluderat på en webbsida.

Ett tag fanns en port av detta addon tillgängligt för Google Chrome, men nu är länken död och jag kan inte längre hitta addonet. Hittar flera extensions för Chrome som visar JS/CSS, men inget som endast visar inkluderade script i context-menyn.

Byggde jag därför en egen version av JSView för Chrome.

På köpet lärde jag mig mer om extensions för Chrome och fick även tillfället att sätta mig in i mock-dependencies för RequireJS (eventuellt mer om detta i ett framtida inlägg).

Installera: från Chrome Webstore
Källkod: https://github.com/nekman/jsview

PS: Om ni orkar testa tillägget vore jag mycket tacksam om ni rapporterar buggar eller kommer med tips/synpunkter om jag missat något eller borde göra saker på annat sätt.


/Nils

RequireJS - Del3 - Optimering

Föregående inlägg (RequireJS - Del2 - Konfigurering) handlade om konfigurering av RequireJS. Detta inlägg kommer handla om RequireJS Optimizer , r.js.

r.js kan köras med Node.js (v0.4+) eller i Java (v1.6+ med Rhino) eller direkt i webbläsaren med Javascript. Det sistnämnda är endast till för att göra optimering av enskilda filer (har inte testat detta, se exempel). Rekommendationen är att köra i Node.js eftersom detta enligt uppgift är snabbast.

När vi definierat ett antal AMD-moduler, och lagt dessa i egna filer vill vi inte att besökarna av vår sajt ska behöva hämta alla våra moduler med ett HTTP-request per modul.
Vi vill givetvis slå ihop och minifiera alla våra AMD-moduler till en fil.

r.js körs enklast genom att skriva en byggfil: Som sedan kan anropas:

r.js -o build.js

Det går också bra att starta r.js från konsollen:

node r.js -o baseUrl=js paths.jquery=lib/jquery name=app out=app.min.js

Så, vad är det då som gör r.js speciellt? Räcker det inte att bara köra UglifyJS eller någon annan JS-komprimerare? Nej. För r.js håller koll på pluginmoduler och anonyma moduler:

// anonym modul
define(function() {});

Utan r.js hade anonyma moduler resulterat i script-fel, och plugin-moduler hade inte kunnat användas.

När scripten har minifierats till en fil och ligger ute i test/produktionsmiljön är det ofta svårt att debugga den minifierade koden. En fin sak som r.js också stödjer är Source Maps. Genom att lägga till följande i byggfilen kommer RequieJS Optimizer generera en app.min.js.src - fil:

Dock behöver UglifyJS2 användas, istället för UglifyJS (som används som standard). För att använda UglifyJS2, lägg till optimize=uglify2 som ett argument till byggscriptet:

r.js -o build.js optimize=uglify2

Debug med hjälp av Source Maps!

Har i denna post, endast gett en inblick i hur man kan använda RequireJS Optimizer. Som tur är finns det gott om dokumentation och en exempel-byggfil som innehåller all tänkbar r.js-konfiguration.

Detta var den sista delen i min introduktionsserie till RequireJS. Kommer troligen skriva ett till inlägg om pluginhantering och testning allt eftersom erfarenheterna blir fler.

Slutligen vill jag avsluta med ett sidospår.
Läste en intressant artikel läste på dailyjs.com - Meet the New Stack, Same as the Old Stack :

Five years ago, if you asked any client-side developer which library or framework to use the most likely answer would have been jQuery. Since then, client-side development has become far more complex. A friendly wrapper for DOM programming and a browser compatibility layer isn’t enough to help us write modern applications.

Idag innefattar modern javascript och webbutveckling:

• Packethanterare
• Modulsystem
• Testramverk
• Byggsystem
• Templates

Med mera.

Det räcker alltså inte endast med att kunna några rader jQuery för att manipulera DOM-strukturen längre. I takt med att Javascript blir mer populärt, och används till mer och mer komplexa saker ställs det högre krav än så.

Därför har jag börjat snöa in mer och mer på optimering, testning och beroendehantering.


/Nils

TDD-presentation .NET

Höll ett föredrag på jobbet om TDD i tisdags.

Presentationen finns här: http://www.rvl.io/nekman/test-driven-development
Demokoden finns här: https://github.com/nekman/TDD-demo

Projektet jag byggde vidare på var en simpel applikation för att ändra belopp på bankkonton. Inte direkt något seriöst projekt, men det räckte gott i demosyfte.

Tog upp 
Metodik XP, SOLID,
Argument för TDD,
Hur man (enligt regelboken) ska implementera kod enligt TDD (börja med att skriva testklassen först).

Hade lite problem med att få ett bra flyt under live-kodningen, men det har väl sannolikt att göra med att att man är lite ringrostig i Visual Studio efter snart 10 månaders harvande i Eclipse.

Kan i allafall inte skylla på miljön. Det var trevligt med .NET 4.5, Visual Studio 2012 och Resharper 7 :)

Tekniker
Moq - (Mockramverk)
NUnit - (Testramverk)
Castle Windsor - (IoC)
RavenDB - dokumentdatabas - noSQL (som jag länge velat testa)

Verktyg
NChrunch
Resharper 7.1


/Nils