Working with GitHub Repositories and Visual Studio 2015

Read full blog post on the Infragistics Blog

GitHub is one of the most popular code sharing platforms, following the GIT algorithm for version control. In this blog post, we will learn how to work with a GitHub repository and Visual Studio 2015, and will answer the following questions:

1. How to sync or share a project from Visual Studio to a GitHub Repository

2. How to clone a GitHub Repository in Visual Studio

Syncing or Sharing project from Visual Studio in GitHub Repository

To share the project, let’s take the following steps:

Step 1: Start with creating a Repository on GitHub. To do that navigate to https://github.com/ and click on the + sign to create a new repository. In this example, I am assuming that you have already created an account in GitHub.

image

Next you need to provide information including:

  • Name of the repository
  • Description of the repository
  • Whether repository is public or private
  • Whether to initialize the repository with a README.

image

Make sure not to initialize the repository with a README. If you do so, you will encounter errors while syncing the project to the repository. Once the repository is created, click on Clone or the Download dropdown and copy the web URL as shown in the image below. We’ll need the GitHub repository URL later in Visual Studio.

image

Step 2: Install Git for Windows on the machine. You can download this here: https://git-scm.com/download/win. After downloading, follow the screens to install completely.

Step 3: Open the Visual Studio solution you want to publish to this GitHub repository in Visual Studio. In the Visual Studio Solution Explorer, right click on the solution and click on Add Solution to Source Control.

image

 

Read full blog post on the Infragistics Blog

What is the Extension Method in C#?

Read full article on Infragistics blog

I often get questions about the Extension Method in C#. The Extension Method was introduced in C# Version 3.0. and allows us to add functionalities in an existing class without modifying it, extending it, or re-compiling it.

Essentially, the Extension Method allows us to add a new method to an existing class:

  • · Without modifying it or adding code
  • · Without extending it or creating a new derived type
  • · Without recompiling the class

image

Extension methods are a special kind of static method but can be called on objects like an instance method. So, an extension method can be used in the same way as normal instance methods.

Steps to create an Extension Method

Step 1: Define a static visible class which will contain the Extension Method or Extension Methods. Make sure the class is visible to the client code by applying the appropriate accede modifier.

Step 2: Create a static method with at least the same visibility level as the containing class.

Step 3: The first parameter of the Extension Method always specifies the type method operates on. Make sure the type name is preceded with the “this” modifier.

Step 4: In the calling code, add the namespace that contains Extension Method class.

Step 5: Use the Extension Method on the type in the same instance method can be used. Keep in mind that we do not need to pass the first parameter because that denotes the type, however we should pass the second parameter onwards to call the extension method.

Read full article on Infragistics blog

Simplifying Objects, Inheritance and prototype in JavaScript

Although JavaScript is a Class-Free language, it supports objects creation, overriding properties/methods and inheritance. In this post, we will explore the concepts of object creation and inheritance.

In JavaScript, Objects can be created in three possible ways:

  1. An object as literal
  2. Using the function constructor
  3. Using the Object.Create method

Object as literal

A simple object Student – as an object literal – can be created as shown in the listing below:


var Student = {

    name: "dj",
    age: 32,
    Father: {
        'name': 'Ram',
        'occupation': 'service'
    },
    Subjects: [{

        name: "Physics",
        marks: 89
    },
	{

	    name: "Chemistry",
	    marks: 95
	}]
};

Above we have created an object called Student. There are three types of properties attached to Student: simple properties like name and age, complex properties like “Father”, and an array property called Subjects. We can read properties as shown in the listing below:


console.log(Student.Father.name);

for (var i in Student.Subjects) {
    console.log(Student.Subjects[i].name);
}

We can also have a function serve as the property of an object, which is known as the method. So let’s say we want to attach a method “Speak” to the Student object.  We can add the Speak method as shown in the listing below.


var Student = {

    name: "dj",
    age: 32,

};

Student.Speak = function (message) {

    var finalMessage = this.name + " has said :" + message;
    console.log(finalMessage);
};

Student.Speak("I am the best");

On calling Speak function as method, we will get output as shown in the image below:

There are some important points about the Speak method to remember:

  1. Properties can be added to an object at any time; a property can be added to an object after its creation too. For example, we added the Speak property later to Student object, rather than at the time of object creation.
  2. In the object’s method, the object is defined by value “this”. That is why we are able to print the name of the Student using this.name in the method.
  3. Calling a function as method is known as “Method Invocation Pattern”

In the above example, we are calling the Speak method on the object “Student”. So the value ofthis inside the Speak method is the Student object.

If we want to pass some other object as the value of “this” in the method, we can use the apply or call function. For example, we have one more object called Parents and,

  1. We are calling the Speak method of the Student object directly and the value of “this” in the Speak method would be Student.
  2. We are passing Parent as the value of “this” in the Student object’s Speak method. We are using the apply function to call the Student object’s Speak method and passing the Parent object as the value of this.

Read full article on the Infragistics Blog

Got Microsoft Most Valuable Professional Award 7th times

 

Thank you Microsoft, once again for recognizing me and my contributions

clip_image002

I am very excited and happy to share that, once again I have got Microsoft Most Valuable Professional (MVP) Award. Microsoft has been awarding me this prestigious MVP Award for last 7 consecutive years. Even though, I have got it many times, I feel same happiness as I felt when I got it first time. I carry this award with pride and below mail from Microsoft gives me motivation to work harder and smarter.

clip_image004

First time I got Microsoft MVP award in 2010 and getting it each year after that. I have been getting it different expertise.

image

Note: WCF also knows as Connected System Developer (CSD)

Since 2010 technology has been changed lot, it has changed so much that now you have bash shell in windows and android emulator in Visual Studio. It’s tough to be relevant in continuous changing eco system. However, I will try to keep contributing as speaker, blogger, and a developer evangelist.

In year 2015 stats of my contribution was as follows:

image

Thanks Note

These contribution were never possible without constant help and motivation from my employer Infragistics and my boss Jason Beres. I love my job as developer evangelist here, and I will forward culture of Infragistics to create more awareness about technology in developer community.

I would also like to thank C-SharpCorner community and Mahesh Chand for giving me opportunity to contribute to their chapters and conference.

I would also like to thank Microsoft India evangelism team, India MVP Lead Biplab Paul , and Gandharv Rawat for their continuous support.

Once again thank you so much for everyone for being part of this journey.

Happy Coding

Objects and Inheritance in JavaScript – Free Webinar on 31st March

We at Infragistics are excited to bring another webinar in India time zone. On 31st March at 3 PM IST, we are hosting a webinar on Objects and Inheritance in JavaScript.

Register for free to attend the webinar here

In the webinar we will cover following topics

  • Object as literal
  • Function constructor
  • Object.Create
  • __proto__ property of object
  • Prototype property of function
  • Prototype based inheritance

We will code something like below :

image

You expect less slides and more codes in the webinar. We will use sublime text for all the demos.

Register free for the webinar here

Feel free to share about the webinar using the hashtag #igwebinar and you may have chance to win some cool goodies from us.

You have chance to win more goodies if you learn about our jQuery library Ignite UI before coming to webinar.

Excited to see you on 31st March at 3 PM IST in the webinar.

Register free for the webinar here

Completed 8 years in the industry

 

 

 

image

 

The woods are lovely, dark and deep,

But I have promises to keep,

And miles to go before I sleep,

And miles to go before I sleep. – Robert Frost

I am very excited to share that I have completed 8 years of working as professional. In these 8 years, I have worked on various technologies and for esteem organizations. I have been fortunate to work with inspiring teams and under the guidance of great people. In infographic, I can summarize 8 years of my working as below:

image

In these 8 years I was very much involved in writing technical blog posts, speaking in various tech events and organizing tech conference. I worked and wrote on WCF, SilverLight, SharePoint, Azure, Windows Phone, Windows 8 Apps, WinJS, JavaScript, AngularJS, and MVC etc.

image

In these 8 years, I wrote articles on my blog, C-sharpCorner, and Infragistics blog. I was fortunate enough to start C-Corner chapters and lead conference from less than free 50 attendees to paid 500 attendees in 6 years. Due to my contribution to developer community, Microsoft has been awarding me prestigious Most Valuable Professional award for last 6 times.

 

image

I am aspired to work harder in 9th year of my career and bring more value to my employer Infragistics, community site C-SharpCorner and to in work of all your readers. In this year, I will focus on MEAN, ReactJS, Ignite UI, Angular, Ionic, Hybrid Apps and Azure services.

Once again thank you so much for being with me in all these 8 years. Happy coding.

How to Implement the Repository Pattern in ASP.NET MVC Application

Read full article on the Infragistics blog

The Repository Pattern is one of the most popular patterns to create an enterprise level application. It restricts us to work directly with the data in the application and creates new layers for database operations, business logic and the application’s UI. If an application does not follow the Repository Pattern, it may have the following problems:

  • Duplicate database operations codes
  • Need of UI to unit test database operations and business logic
  • Need of External dependencies to unit test business logic
  • Difficult to implement database caching, etc.

Using the Repository Pattern has many advantages:

  • Your business logic can be unit tested without data access logic;
  • The database access code can be reused;
  • Your database access code is centrally managed so easy to implement any database access policies, like caching;
  • It’s easy to implement domain logics;
  • Your domain entities or business entities are strongly typed with annotations; and more.

On the internet, there are millions of articles written around Repository Pattern, but in this one we’re going to focus on how to implement it in an ASP.NET MVC Application. So let’s get started!

Project Structure

Let us start with creating the Project structure for the application. We are going to create four projects:

  1. Core Project
  2. Infrastructure Project
  3. Test Project
  4. MVC Project

Each project has its own purpose. You can probably guess by the projects’ names what they’ll contain: Core and Infrastructure projects are Class Libraries, Web project is a MVC project, and Test project is a Unit Test project. Eventually, the projects in the solution explorer will look as shown in the image below:

As we progress in this post, we will learn in detail about the purpose of each project, however, to start we can summarize the main objective of each project as the following:

So far our understanding for different projects is clear. Now let us go ahead and implement each project one by one. During the implementations, we will explore the responsibilities of each project in detail.

Core Project

In the core project, we keep the entities and the repository interfaces or the database operation interfaces. The core project contains information about the domain entities and the database operations required on the domain entities. In an ideal scenario, the core project should not have any dependencies on external libraries. It must not have any business logic, database operation codes etc.

In short, the core project should contain:

  • Domain entities
  • Repository interfaces or database operations interfaces on domain entities
  • Domain specific data annotations

The core project can NOT contain:

  • Any external libraries for database operations
  • Business logic
  • Database operations code

While creating the domain entities, we also need to make a decision on the restrictions on the domain entities properties, for example:

  • Whether a particular property is required or not. For instance, for a Product entity, the name of the product should be required property.
  • Whether a value of a particular property is in given range or not. For instance, for a Product entity, the price property should be in given range.
  • Whether the maximum length of a particular property should not be given value. For instance, for a Product entity, the name property value should be less than the maximum length.

here could be many such data annotations on the domain entities properties. There are two ways we can think about these data annotations:

  1. As part of the domain entities
  2. As part of the database operations logic

It is purely up to us how we see data annotations. If we consider them part of database operation then we can apply restrictions using database operation libraries API. We are going to use the Entity Framework for database operations in the Infrastructure project, so we can use Entity Framework Fluent API to annotate data.

If we consider them part of domain, then we can use System.ComponentModel.DataAnnotationslibrary to annotate the data. To use this, right click on the Core project’s Reference folder and click on Add Reference. From the Framework tab, selectSystem.ComponentModel.DataAnnotations and add to the project.

Read full article on the Infragistics blog

How to Create a Custom Action Filter in ASP.NET MVC

Read full article on the Infragistics blog

In ASP.NET MVC, Filters are used to inject logic at different levels of request processing and allow us to share logics across Controllers. For example, let’s say we want to run a security logic or a logging logic across the controller. To do so, we’ll write a filter containing those logics and enable them across all controllers. When we enable a filter across all controllers or actions, the filter enables the upcoming HTTP request.

Let us consider a scenario of Logging: for every incoming request, we need to log some data to the files on the basis of some logic. If we don’t create this logic inside a custom filter, then we will have to write logic for each controller’s action. This mechanism will lead to two problems:

  1. duplication of code; and
  2. violation of the Single Responsibility Principles; actions will now perform additional tasks of logging.

We can mitigate the problems above by putting the logging logics inside a custom action filter and applying the filter at all the controllers’ level.

Have you ever come across source code as shown in the image below? [Authorize] is an Authorization filter, and it gets executed before any HTPP request or Action method execution.  The Authorize filter is part of MVC, but if needed, we can create a custom filter too.

Read full article on the Infragistics blog

Different ways of injecting dependency in an AngularJS Application

When you start learning the very first characteristics of AngularJS, you may come across something called Dependency Injection (DI): the premise that AngularJS injects dependencies whenever an application needs them. As a developer, our task is only to pass the dependency to the module and everything else will be taken care by AngularJS.

To create a controller, we pass $scope object and other dependencies to the module’s controller function. For example, to create a ProductController, we are passing $scope object and Calculator service dependencies. As a developer our job is to pass the dependencies and AngularJS will inject them whenever the application needs them.

As a developer, we really don’t care about how AngularJS injects dependencies – we don’t need to know how the injection process works to develop applications.  However, it is better if we know different ways of passing dependencies. In AngularJS, dependencies can be passed in three possible ways. They are as follows:

  • Passing a dependency as Function Arguments
  • Passing a dependency as Array Arguments
  • Passing a dependency using the $inject service

Let us explore these options one by one.

Passing a dependency as a Function Argument

Perhaps most of the time you pass a dependency as a function argument, which is perfectly fine. For example, we pass a $scope object to create a controller as shown in the listing below:

Read full article on the Infragistics blog

Understanding the Grid Layout in Bootstrap

With each passing day, new devices with new screen sizes are popping up – and as web developers, we need to create web applications that are responsive to these various screen sizes. There are multiple ways you can create a responsive layout, however I find Bootstrap grid layout to be the easiest. In this post, we will cover various aspects of the Bootstrap Grid system with various examples. To start with let us create a four equal column layout for medium-sized devices in Bootstrap Grid system.

image

 

4 equal columns layout

To create the layout, you need to complete the following steps:

  1. Create a div with class container for fixed width or container-fluid for the full width of the screen
  2. Create a div with class row. Div with the class row must be inside container
  3. Create 4 divs for 4 columns. Div of the column must be the immediate child of the row div
  4. Content will be inside the column div

To create four equal columns in a row, I have created four divs with the class set at col-md-3 as shown in the listing below:

Read full article on the Infragistics blog