Omzetten van de Affinno.nl website van ASP.Net webforms naar ASP.Net MVC 4

asp-net-mvc-hosting-logo

Vorige week had ik wat tijd over, dus heb ik wat tijd gestoken in het ombouwen van de eigen Affinno website van ASP.Net webforms naar ASP.Net MVC.

Aangezien ik best tevreden was over de look and feel, heb ik besloten om deze ongemoeid te laten en alleen wat admin functionaleit in te bouwen, zodat het wat gemakkelijker wordt om content aan te passen.

De laatste projecten die ik heb uitgevoerd waren ook MVC projecten, dus daar waren geen problemen te verwachten. Wel maakte ik de stap van MVC 3 naar MVC 4. Daar verwachtte ik weinig problemen mee; overstappen naar een hogere versie is meestal niet veel meer dan de releasenotes tot je nemen (Release notes MVC 4) en kijken wat er voor goodies in zitten. Voor mijn site was alleen de bundling en minification een meerwaarde, dus die heb ik gebruikt.

Na het aanmaken van het nieuwe project met de internet template viel me gelijk op dat deze meer dan voorheen al onderdelen include; zo zit bv Modernizer er al standaard in. Je hebt dus wel al vanaf scratch een groot aantal referenties en Javascripts in je project. Aan te raden is om deze even te doorlopen en te kijken welke je hier echt van nodig hebt.

Een meevaller was dat ook het inloggen via external services erg gemakkelijk is gemaakt: de voorbeeld code zit er al uitgecommentarieerd in. Zo was het een fluitje van een cent om het inloggen via Google mogelijk te maken.

Toen kwam de eerste kennismaking met Visual Studio 2012; ook hier verwachtte ik geen issues mee omdat overgangen van de ene versie van Visual Studio naar de volgende tot nu toe ook geen verrassingen hebben opgeleverd.

Deze keer heb ik de Express versie eens geprobeerd, om te kijken wat de stand daar van is ten opzichte van de professional versie. Ik moet zeggen: ik ben onder de indruk, ik heb geen moment het idee gehad met een of andere uitgeklede versie te maken te hebben. Wel is er een belangrijk nadeel aan de Express versie: het ondersteunt geen plugins dus ik moest het doen zonder mijn hulpje Resharper, en dat was wel een groot gemis!

Met een vers project heb ik als eerste de masterpage van de oude site overgezet naar de nieuwe _layout pagina. Daarna een actionmethod op de controller, een statische .aspx pagina gekopieerd naar een view, de css’s en js’s gekopieerd van het ‘oude’ project en voila: de eerste pagina was al te zien.

En dan stap je toch al snel in de valkuil die je op projecten ook vaak ziet als je zo snel iets zichtbaar hebt: je denkt bij jezelf “bijna klaar”. En dat is nou net wat te snel gedacht, want ik had natuurlijk nog geen errorhandling, 404 redirects, omleidingen van de oude url’s, content editing, caching, contact edit pagina’s etc. etc.

Uiteindelijk heeft het omzetten iets meer dan 2 dagen gekost. Grote meevaller was dat in de ‘oude’ site de logica al in een aparte laag zat waardoor ik veel code 1 op 1 kon kopiëren. De views moeten natuurlijk wel opnieuw worden aangemaakt (geen ASP.Net panel, ASP:Textbox etc. meer) en omdat de abstractielaag van webforms er niet meer is moet je toch wel voor elke pagina wat code aanpassen; weliswaar meestal niet al te veel, maar wel voor bijna elke pagina. Gebruik je echter veel server componenten zoals de grid, bereid je dan maar voor op redelijk wat ombouwtijd.

Wat ik nog niet eerder had gedaan was het automatisch deployen vanuit Visual Studio naar de server. Ik heb dat nu via een FTP deploy gedaan, wat goed werkte. Hierbij heb ik ook kennis gemaakt met de automatische web.config transformatie waarbij direct de juiste server web.config settings worden gemaakt vanuit je development omgeving.

Op aanraden van oud collega André heb ik ook T4MVC gebruikt. Deze vernuftige T4 template maakt voor elke controller en controlleraction strongtyped strings aan zodat je altijd strongtyped naar controllers en actions kunt verwijzen. Erg handig.

Al met al een leuk project waar je goed kan zien dat als je een goed uitzicht hebt op het eindresultaat je snel meters kunt maken.

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s