Merging Javascript for Dynamic CRM Development

SOC (Separation of Concerns) is one of the best Design Patterns that I love so much. Using this design pattern, I found it more easier for me to identified bug on my code.

When developing Javascript code on Dynamic CRM, I will separate my concerns into 3 parts:

  1. Events: Bridge from Dynamic CRM event to our Javascript Business Logic.
  2. Business Logic: Business logic related to your application.
  3. Data Access: Handling data access.

The goal for this article is to show you that you can do separation on your Javascript but when deploying on CRM, I only want to have 1 file instead of creating multiple file.

javascript-soc

After build, the content will merge into one file like this:

result-soc

So this is tutorial how to merging multiple Javascript files into single Javascript.

1) On your project, add reference to AjaxMin nuget. After install the nuget reference on your project, put <Import Project=”ajax-min.targets” /> on your .csproject

csproj-soc

2) After installed the reference, create new file with name ajax-min.targets on your root project. (Change the output folder to your Solution Directory folder for finding the result)

result-directory-folder is a folder after merging complete. So you need to change this configuration to the Folder that you want (Folder is must inside the Solution Folder).

3) Next step is to make a configuration file. For instance in my example, I want to merge all javascript in the LimoPayment folder, then I will create _manifest.ajaxmin.xml in the root of that folder.

Using this method, when you want to get the result. You only need to build and open your result folder to see the result.

Benefit using this method:

  1. More focus when developing feature.
  2. Reduce scrolling if your Javascript is very long (we break it into 3 function: DataAccess, Business, and Events).

 

Advertisements

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 )

Google photo

You are commenting using your Google 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 )

Connecting to %s

This site uses Akismet to reduce spam. Learn how your comment data is processed.