Extending Umbraco with Angular 2.0

I wasn't able find a any information about how to extend Umbraco Backoffice with Angula 2. The official note, make it clear., but it is old so I believe soon we are going to have a some better news. Till there I found a way to make it to work. Please follow the steps:

1. Prerequisites: Make sure you are able to run Angular 2 in your Visual Studio. Please follow this information in Angular website. Double check the prerequisites and follow the step 1-5.
2. Prerequisites: Install Umbraco, for additional information please visit Umbraco website
3. Test Umbraco, see if you are able to access to Uumbraco Backoffice 
4. Test Angular JS, build and launch Angular js page: /src/index.html
5. Extending Umbraco:
1. Open Dashbaord file:  /config/Dashboard.config
2. Lets add a tab to developer section as example. So please add the following code after the last existing section </section>. See the Image below
• Area: choose some area to extend, in this case I am using developer section
• Tab name: the name that will be displayed
• Angular js page to call: Select the page you would like to display. 
3. 
6. Copy your angular files each time you build to Umbraco Folders:
• Select your website project and right mouse click, and select Properties
• In the properties menu: select Build Events
• In the post-build add this line: xcopy "$(ProjectDir)src" "$(ProjectDir)Umbraco\"  /E /Y /C
1. Go to Umbraco Back office and see if you are able to see your Changes

Test it as extensively before you decide to push it to live! 

Have a nice day!

MVC: Tabs in 5 steps

Hello,

A couple of weeks ago I was searching about how to build Tabs in MVC. But I couldn't find a great tutorial, so I decide to build one myself.

Step 1: Model
public class TabModel 
    {
        public int Id { get; set; }
        public string Name { get; set; }
        public bool Visible { get; set; }        
    }

Step 2: Controller - Showing tabs
public enum TabType { TabName1, TabName2 };

private static List<TabModel> LoadTabs()
        {
            List<TabModel> tabList = new List<TabModel>(){
                new TabModel { Id=(int) TabType.TabName1, Name = "Tab 1", Visible = true },
                new TabModel { Id=(int) TabType.TabName2, Name ="Tab 2", Visible = true},
            };
            return tabList;
        }

public ActionResult Index()
        {
            List<TabModel> tabList = LoadTabs();

            return View(tabList);

        }

Step 3: View
@model List<LM.Site.Models.Tab>
<div id="tabs">
    <ul>
        @{
            foreach (var p in Model)
            {
                if (p.Visible)
                {
                    <li>
                        @Ajax.ActionLink(p.Name, "GetTab", new { id = p.Id }, new AjaxOptions
                  {
                      HttpMethod = "GET",
                      UpdateTargetId = "tab-content",
                      InsertionMode = InsertionMode.Replace
                  })
                    </li>
                }
            }
        }
    </ul>
</div>

<!-- 
Other guys were using 1 div for each tab, only one tab is enough.
-->
<div id="tab-content">

</div>

Step 4: Controller - Showing tab content
public ActionResult GetTab(int id)
        {
            switch ((TabType)id)
            {
                case TabType.TabName1:
                    return PartialView("Tab1");
                case TabType.TabName2:
                    return PartialView("Tab2");
                default:
                    return null;
            }

        }

Step 5: jquery.unobtrusive referenced, should be added at the view or template
@section scripts{
    @Scripts.Render("~/Scripts/jquery.unobtrusive-ajax.min.js")
}

Cheers, Adilson

Login - Validate the return url

Hello,

Despite of my 10 years experience working as .Net Developer, I never heard or thought about the needs to validate return url when we are about to login. Ex.: http://SomeSite.com/Account/LogOn?returnUrl=MyAccount. But is better late than never..

Without validation the return url can be attacked:
1- Sending email with advertising about the company
2- Changing the return url: http://SomeSite.com/Account/LogOn?returnUrl=www.MyAccountFake.com.
3- After successful login, the user will expect to be in one page but will be in  a complete different page!

This kind of attack is called Open Redirection Attacks. For more, please visit this link: http://www.asp.net/mvc/tutorials/security/preventing-open-redirection-attacks

Basically, we should check if the return url is under our domain.

Cheers, Adilson

Strategy design pattern

Hello,

I have to say that I'm working around design patterns since about two years ago. I think I know more that average but still long way to go.. So the best thing to do is to climb on the giant's shoulders :)

I spend a lot of time with books no so good as these 3:

• The "Gang of four"
• Patterns of Enterprise Application Architecture
• Pattern-oriented Software Architecture

So if you are think to study design pattern, make the right move choosing the right book.

But books is a long way plan let's understand strategy design in the next 15 minutes! 

Two months ago, my friend gave me this link click here (11:32). I found it a great resource to understand design patterns quick.

After the great above video - very well explained in "how to use" and "why" point of view.

Image from wikipedia

I will add one more drawback of this design pattern that is not mentioned in the video: 

• The strategy interface is shared between all concrete strategy. So we have to be careful with our concrete, to not make some concrete strategy that doesn't need to do any action of strategy interface, in order to not violate Interface Segregation Principle.

Cheers.

XML Serialization with Generics

Hello,

After a long pause writing posts, I'm back to speak about one very nice feature that .Net brought to us: Generics. I'm writing about Generics now, because in this post I will implement a XML Serialization Helper class, that will be very useful to finalize my previous post about Send Email.

This will be a short post, as there are a extension information about Generics on internet. For example: An Introduction to C# Generics - 2005.

Generics provide the following benefits:

• Code Reuse
• Type Check on compile time
• Performance

if we want to write some XML Serialization Helper class, this can be the API one solution:

public interface IXMLSerializationHelper
{
        string SerializeToString(Newsletter objToSerialize);
        Newsletter DeserializeToString(string objToDeserialize);
}

Problem: The problem of this solution is that, Newsletter are hard-code. If we need to serialize Product Class tomorrow, we will have to write a new API.

Solution 2:
public interface IXMLSerializationHelper
{
        string SerializeToString(Object objToSerialize);
        Object DeserializeToString(string objToDeserialize);
}

Problem: This is a improvement against solution 1, but still not the best solution as this will require boxing that will affect the performance. For more have a look here

Solution 3 using Generics:
public interface IXmlSerializationHelper<T>
    {
        string SerializeToString(T objToSerialize);
        T DeserializeToString(string objToDeserialize);
    }

public class XmlSerializationHelper<T> : IXmlSerializationHelper<T>
    {
        /// <summary>
        /// Serializing to String
        /// </summary>      
        public string SerializeToString(T objToSerialize)
        {
            var sb = new StringBuilder();
            var serializer = new XmlSerializer(typeof(T));
            using (var writer = new StringWriter(sb))
            {              
                serializer.Serialize(writer, objToSerialize);
            }

            return sb.ToString();
        }


        /// <summary>
        /// deserializing to T type
        /// </summary>
        public T DeserializeToString(string data)
        {
            var serializer = new XmlSerializer(typeof(T));
            T result;
            using (var reader = new StringReader(data))
            {
                result = (T) serializer.Deserialize(reader);
            }
            return result;
        }
    }

This solution take advantage of Generics. Examples:

var model = GetNewsletterModel();
var serializer = new XmlSerializationHelper<NewsletterModel>();
serializer.SerializeToString(model);

Or

var model = GetProductsModel();
var serializer = new XmlSerializationHelper<ProductsModel>();
serializer.SerializeToString(model);

This is all for now. I hope come back soon.

Sending Email (Part 1)

Sending Email (Part 1)

Email functionality is a common feature in many applications, which can be triggered by user action (ex.: email confirmation after buying a online product) or direct email (ex.: newsletter).

Normally this is done in about 4 steps:

1. Get template from some source: database, file, etc.. 
2. Get a business object with information to be personalized;
3. Configure message body to be sent;
4. Send Email.

One important task is prepare the message to be sent (3), we have several solution, lets analyze some.

Solution 1: Make template with tags to be replaced later. Example:

var template = "Hi [Name], Here's some activity you may have missed on Facebook."; string messageBody = template.Replace("[Name]", "Adilson"); Problem of this Solution: Hard to configure the template according to the business data. Ex.: To send list of news we have to do more than find replace tags..

Solution 2: Using Razor Engine(open source project) to build templates. Example:

string template = "Hi @Model.Name, Here's some activity you may have missed on Facebook."; string messageBody = Razor.Parse(template, new { Name = "Adilson" }); Problem of this Solution:  Still less flexible..

Solution 3: Using XML and XSLT to transform documets and to get HTML.

This solution is more flexible than the previous two, as it allow us to use the power of XSLT to Transform documents. More about XSLT can be found in any search engine, but this is my suggestion: w3schools

How to get message body using solution 3:

1. Get XSLT file (template);
2. Get XML: serializing the business object;
3. Call the processor given the XSLT and XML to generate the HTML(message body).

Suppose we are looking to send this newsletter:

Your Logo Here Date Here Issue #

Newsletter Title Here

USER GRETINGS... • NEWS TITLE 1 • NEWS TITLE 2 advertisement here

TITLE 1 TEXT NEWS 1... Read Full Article

TITLE 2 TEXT NEWS 2 ... Read Full Article

Copyright © 2013 Your Company Name. All Rights Reserved.

So to implement solution 3, lets summarize the steps:

1. Get template from some source: XSLT File;
2. Get a business object with information to personalize: Serializing to XML;
3. Configure message body to be sent: Applying XSLT Processor to get the message body;
4. Send Email.

Implementation will be in the next Post.

.Net Developers vs Java Developers

.NET Developers vs .Java Developers

Is easy to find over internet, for example click here, forums discussing about .Net vs Java Developers. I would like add my point of view as well..

Typically, the goal of this discussion is to understand, which developers group, are better. I had similar discussion about 10 years ago, when I was at university in Portugal, discussing about which University was better!

Sometimes or most of the time, this discussion doesn't make sense, because people want to "know" the smarter groups, rather than they ability to build Applications.

For .NET developers, Microsoft is doing a great job putting a lot of effort to improve .NET (click here for more info) And this great job has some benefits for .Net Developers, as is making the live easy for them.

Java developers, doesn't have a big "daddy", like Microsoft! So they develop the ability to work together, and build thousands of Open source communities that have been doing a great job, helping and pushing the group to use the best available practices. So to talk each other effectively, as a big team, with no doubts about, they had to push for Design Patterns. Downside for Java developers is that, very easy to get lost, as there are, sometimes, many alternatives for the some thing, not good documentation and so hard to configure.

Going back to .Net developers, downside of Microsoft efforts, is that developers gain the habit of "eat a ready food". That was OK, for most of the project yeas ago, as they were small in the early years of .Net. But not Nowadays,  is not true as there are many big projects to build and maintain in a very powerful tool: .Net Framework.

Microsoft is pushing developers to work in agile environment, and build more open source communities much more than before, basically recognizing that isn't easy prescind the "eyes" and R&D of thousands of people around the world. One example is ASP.NET MVC Framework.

So as a .NET developer, for the next articles I will share my thoughts about Programming in .NET, based in my experiences and researches, with main focus on design patterns and data structure.

Thanks for your time:)