The Future of DNN Speaks Razor - #6 - Mapping Needs to Technologies

Admin User Interfaces
like configuration dialogs

Content Input
like edit-dialogs for your data

Use

1. Simple HTML-forms or client SPAs (Single-Page-Applications)...
2. ...based on AngularJS (or knockoutJS if need be)...
3. ...receiving and saving data through WebAPI (ideally the DNN-flavor with security-checks etc.).

Avoid

• All WebForms-Controls (like Labels, Input-Boxes, etc.), especially the built in Telerik Controls (these are not updated any more)
• Avoid Postbacks and ViewState at all cost, they are history.

In-Page Content Editing
In-Content Editing Dialogs

Use

1. This is mostly done in JavaScript (jQuery or AngularJS)...
2. ...simple editable DIVs and form-elements
3. ...receiving and saving data through WebAPI (ideally the DNN-flavor with security-checks etc.).

Avoid 

• All WebForms- & Telerik-Controls, Postbacks and ViewState
• Don't compensate ViewState with Session-State - this will fail in the long run

Module Front-End Views
like a login-control or contact-form

Use

1. You will often need some custome HTML, so use C# Razor for the HTML-generation
2. Use jQuery for the front-end logic (like input-field validation) 
3. ...and a JSON/WebAPI interface for processing the data. 

Avoid 

• All WebForms- & Telerik-Controls, Postbacks and ViewState

Interactive Module Front-End Views
like galleries, charts, image-rotators

These usually consist of an initial HTML fragment containing some data (like DIVs containing images) and a feature rich script. Use: 

1. The script are made with AngularJS, jQuery or specific third party JS libraries like TimelineJS. 
2. To deliver html-data (usually list of something) you will need C# Razor or DNN-Tokens
3. for any kind of JSON feed either use a standard WebAPI or a module specific JSON-feed
4. Module-instance configuration (usually just 1 record containing animation speed etc.) is usually delivered in the HTML as inline JSON to avoid unnecessary extra requests.

Avoid

• All WebForms- & Telerik-Controls, Postbacks and ViewState

Content-Element Output
like images, videos, simple text/image combinations, addresses, product-details etc.

Most of these templates are simply responsive HTML-fragments with minimal logic. They must place the content-data inside the HTML for SEO-reasons and should be easy to customize. Use

1. The ideal solution is C# Razor or DNN-Tokens
2. Token-templates offer a security benefit since they contain no code but are not flexible
3. C# Razor templates are power-edition
4. Use Server-Side Image-Resizers to auto-resize/crop your images [todo]

Avoid

• All WebForms- & Telerik-Controls, Postbacks and ViewState
• ...especially data-bound WebForms templates
• XSLT - this is sometimes used, but most developers are very louse at it, so even though the technology is great, it's not good for this requirement. Also note that XSLT is almost dead in Web-Output - most CMSs that went for this approach have moved on, a bit like XML-Streams being replaced by JSON
• Don't use you own invented "improved" engine. Your solution might be better than Tokens, but it's unlikely that you'll create anything better than Razor

Content-List Output
like lists of news, list of products and similar

These are usually designed/responsive table-like lists of things like news, downloadable files etc. Use:

1. C# Razor to ensure that you can also apply some custom formatting, hide some items based on rules etc. 
2. DNN-Tokens might be used, but are usually too trivial for good lists

​Avoid

• Everything you should also avoid in the list above...
• ...especially data-bound WebForms templates

Data-List Output
like feeds from external sources, lists of data from a DB

These are usually designed/responsive table-like lists of things like news, downloadable files etc. Use:

1. C# Razor to ensure that you can also apply some custom formatting, hide some items based on rules etc. 
2. DNN-Tokens are usually too trivial for good lists.

Avoid

• Everything you should also avoid in the list above...
• ...especially data-bound WebForms templates

End-User SPAs
Single Page Applications meant to react quickly but still get indexed by Google.

These are currently the most challenging of solutions. In brief: 

1. create them client-side using AngularJS and similar
2. Deliver the data throughWebAPI or custom JSON
3. To ensure SEO, use Hashbangs for application state...
4. ...and create C# Razor fallback-views on the server (processing the _escaped_fragment_ URLs) to deliver search-engine HTML. Note: Most people don't understand what I just wrote here - I'll blog about it in detail one day.

Avoid

• Don't create them with server-side rendering or any of the WebForms-solutions
• Don't create complex solutions with jQuery only - this always works at first, but development time grows exponentially with complexity. So always use...
• ...a good client side MVC-Framework like AngularJS. Avoid knockoutJS, as it doesn't even offer real View-Management, so is too trivial for SPAs