2. What we’ll be talking about
• About me
• ASP.NET and ViewState
• ASP.NET MVC
• AJAX
• WCF to move towards SOA
• Overlaps between ASP.NET MVC and WCF (in some
ways)
• Does ASP.NET MVC really helps separating UI from
Server Side concerns?
• jQuery and jTemplates
• RESTful WCF with jQuery/jTemplates
3. About me
Damiano Fusco
• Musician: I’ve studied music for a total of 15 years and played
professionally for about 12.
• Graphic Designer: Always did free-lance work as a graphic designer
along with music
• Web Designer (briefly): Started creating static html sites when
internet was starting to become popular (I had a 28kb modem back
then)
• Software Developer: Eventually switched to software development
about 16 years ago when switching to creating dynamic websites
(using Classic ASP and SQL Server 7.0 back then). For about 90% of
my career I worked with Web.
• Used .NET since 2003
• Recently learned a little bit about Linux and NodeJS using MongoDB
4.
5. ASP.NET and ViewState
• If you use traditional ASP.NET Web Forms with Server Side
Controls, you get ViewState as well.
• ViewState is a hidden field on a page that ASP.NET uses to
manage control states.
• ViewState consumes bandwidth
• ViewState has a performance hit on the server (and
eventually on the client as well)
• Therefore, ASP.NET is not really good for UI. However, ASP.NET
can still be used for what is good at on the server side.
6. ASP.NET MVC
Moved away from ViewState, but framed in the MVC design pattern
• Model
– Structured data or entity. Usually the design of this is tied to a specific
need in the UI. So, it usually means Model for View.
• View
– Represents a single view, most of the time a single html page. MVC
Views are most of the time files with both HTML and server side code
(Razor or other view engine). The server will be consuming resources
to process Razor or other view engine language.
• Controller
– We can say that offers ways to link Model to Views with the promise of
de-coupling (separation) UI from the backend.
7. AJAX
Asynchronous Javascript and XML
• Not tight to a specific technology, even thought
started with Javascript and XML, therefore the name.
Mostly used today with JSON instead of XML
• It’s a group of web development techniques to
facilitate devel of asynchronous web apps. Some
define Ajax as a “client” technology, but it’s more
than that.
8. WCF
• Microsoft Framework to build Service
Oriented Architectures (SOA)
• Evolved from Microsoft Web Services (.asmx)
• Nice out-of-the-box features to quickly build
services.
• Bad: usually hard to configure. But for most
common uses there are simpler ways to
implement WCF.
9. Overlaps between ASP.NET MVC and
WCF (in some ways)
• We could think of a Controller to really be like a
Service in many ways. Indeed, a controller usually
returns a view as an ActionResult, or JSON as a
JsonResult.
• If you ever used Ajax with ASP.NET MVC, you
probably found yourself in using the Controller as a
service.
• In this case, now you are not really following the
MVC pattern as originally thought.
10. • Nice thing about MVC is also the Url Routing.
It truly offers a nice out-of-the-box way to
have friendly routes that map to your
Controllers and Views.
• In WCF most of the time you’ll be doing
routing as well with the help of
System.Web.Routing and some other .NET
namespaces.
• In a way we could say that ASP.NET MVC offers
a mix of both: services (server side) and UI
(views) in the same project, while WCF is
really only for services (server side).
11. Does ASP.NET MVC really helps separating UI from
Server Side concerns?
• I personally think ASP.NET MVC frames you in
a specific pattern. You can still do Ajax and
other things, but that you’ll be not be really
following a pure ASP.NET MVC approach.
12. jQuery and jTemplates
• Most of you probably know what jQuery is.
• jQuery is a framework build on top of JavaScript
mostly to simplify DOM manipulation (DHTML) but
also to simplify Ajax calls to server, and ultimately
the promise of Asyncronous Web Apps.
• jTemplates, a jquery add-in, can be used to render
html views directly in the client (browser)
• There are probably other jquery add-ins, but all my
experience has been with jTemplates.
13. • jTemplates allows you to push to the client the work of
rendering your views.
• But where are the views? Well, with this approach your
views will be really snippets of html stored in .htm files
that you’ll be loading when needed through
jTemplates.
• There are pros and cons with this approach, as
anything. The main pro I like is the greatly improved
user experience (UX). The main con most people will
face is the shift from doing views in Razor with C# to
using JavaScript/jQuery/jTemplates syntax and some of
the limitations that might come with that. For one
thing, you’ll have to love JavaScript. Furthermore,
you’ll have to love debugging JavaScript as well.
14. • One thing that is above everything else and I’ll
repeat once more here is that with jTemplates
you’ll be pushing the work to the client
browser, while with ASP.NET MVC that work
will be done on the server side. From my
experience this is usually a good thing, but
there might be cases in which you might want
to do more of the work on the server and
leave the client with much less work to do.
15. RESTful WCF with jQuery/jTemplates
• A much more lightweight approach is to move
towards a SOA.
• We can use WCF on the server side to offer a
REST API from where we get the data (or perform
CRUD operations). This really separate this from
anything else much better than ASP.NET MVC
• We then use jQuery/jTemplates to make calls to
our REST API and render jTemplates views on the
client side. Again, this really helps remove the UI
concerns from the services concerns.
16. • This approach requires more organization and
discipline from the developer. You’ll have to
constantly make sure you organize your files in
a logical way, follow a good naming
convention, aim for code reusability also in
your jQuery/jTemplates files.
• At the same time, this approach offers much
more flexibility to break your own rules from
time to time, without causing spaghetti code
or breaking the main design approach. As long
as you are making exceptions to serve a
specific need.
17. Other advantages
• You’ll be able to quickly offer your WCF REST
services as an API by hosting them in an
ASP.NET Web App. This way you can consume
them also from a mobile app or other client.
• You’ll be able at any time to move from WCF
to another service technology (i.e. Node.js)
without having to rewrite you jQuery/HTML
• You’ll have much less code to maintain.