Sunday, September 10, 2017

Rule "Same architecture installation" failed with Microsoft SQL Server Data Tools for Visual Studio 2013

Scenario:

I was installing Microsoft SQL Server Data Tools - Business Intelligence for Visual Studio 2013 with a 64 bit SQL Server 2014 Express and Visual Studio 2013. The installation will not start because of a failing rule check. "Same architecture installation"

I have selected existing SQL Server instance to add features:

image

Then selected “SQL server Data Tools – Business Intelligence for Visual Studio 2013.

image

After that installation start running “Feature Configuration Rules” and I got an error saying that Rule “Same architecture installation” failed.

image

Solution:

I have searched for the problem and found that only 32-bit version of SQL Server Data Tools for Visual Studio 2013 published by Microsoft.

image 

From MSDN forum and blog article:

Make sure you choose the "New Instance" option (strange as that might seem). Otherwise, you'll get an error that says the following:

Rule "Same architecture installation" failed.

On my machine x64 version of SQL Server was installed so it requires to do a new installation rather adding features to existing instance. I thought that It was due to the Operating System architecture difference but these tools require 32 bit instance of SQL Server.

Hope this help others to solve this strange issue.

Friday, June 30, 2017

Out of box “Emmet” code snippets in Visual Studio Code

Visual Studio Code has a port for Emmet out-of-the-box too, which gives us more HTML features. Emmet is a web-developer’s toolkit that can greatly improve your HTML & CSS workflow or programming.

Basically, most text editors out there allow you to store and re-use commonly used code chunks, called “snippets”. While snippets are a good way to boost your productivity, all implementations have common pitfalls: you have to define the snippet first and you can’t extend them in runtime. Same like full version of visual studio, Emmit is way to implement code snippets in the VS Code editor.

For example  let's say we wanted to just type div and then inside of that div we wanted to have a UL. And then we want that UL to have, let's say, five LIs. We could do LI right there and how do you do five of those, we can do *5. Now if I hit Tab, it's going to automatically generate all that HTML.

Emmet_in_vscode_thumb[2]

Notice it's kind of got a cursor there in the first spot, so let's see what that happens there. I can type I first, hit Tab, and go to second, and then just keep typing like this. Now you can use that and hit Escape to get out and to also create things like table or anything else that's more complex.

if you want to learn more about the Emmet syntax you can check out this link here at docs.emmet.io.

Thursday, June 29, 2017

How to run Node.js and Npm with web proxy

Recently I needed to install npm on my workplace computer and it always showing below connection timeout error message every time when I run any command.

clip_image002

I have faced such issue with VS Code when trying to install extensions and updates. After going through documentation, I found that here is the same issue with proxy settings and I got information by running ‘npm help config’ command. It redirected me to the npm config documentation and I found this:

clip_image004

To authenticate my corporate proxy, I set the environment variables HTTP_PROXY and HTTPS_PROXY but npm did not recognized these environment variables.

After doing search on internet and from my previous experience with vscode issue, I found the following same way to configure the proxy for npm.

npm config set proxy http://proxy.company.com:8080
npm config set https-proxy http://proxy.company.com:8080

If you need to specify credentials, they can be passed in the url using the following syntax.

http://user_name:password@proxy.company.com:8080

You can also set the proxy configuration as a command line argument or environment variable. Configuration parameters can be specified using -- when executing npm. So the proxy could also be specified as follows.

npm --https-proxy=http://niranjansingh:MyPass@172.29.01.01:8080 -g install yo

I have tried command line configuration to make it work and I have done my job.

Hope this help others also... Happy Coding!

How to setup major tools for VS Code development environment?

Visual Studio Code is light weight editor for web development languages. To enhance it you require some tools which speed up development in Visual Studio code and also prerequisites for doing development e.g. Node.js . Here are the few players which play some important roles to enhance the development environment features:

clip_image002

Bower is a package manager for the web.
Gulp enables you to automate and enhance your workflow.
Yeoman is Scaffolding tool for modern web apps and helps you to kick start new projects, prescribing best practices and tools to help you stay productive.

You can setup these as follows:

Step 1 – Install Node.js

To through previous post - How to create Node.js development environment in Visual Studio?. Just download the installation package from Node.js site and go through the setup wizard to complete installation to work npm working.

Step 2 - Install Bower

To install Bower first run the Command Prompt and Bower is installed globally by running the following command:

npm install -g bower

Step 3 - Install Gulp

To install Gulp.js globally on your system run the below command which enable you to run the ‘gulp’ command in your command prompt:

npm install -g gulp

clip_image004

Step 4 – Install Yeoman

To install Yeoman, just run the below command on command prompt:

npm install -g yo

You can install these in one go using below command:

npm install -g yo gulp bower

clip_image006

After that most of things are up and running to start with VS code.

Happy coding!

Wednesday, June 28, 2017

How to setup Proxy settings in Visual Studio Code?

I ran into problem that when I try to find extensions in the VS Code, it does not display anything and even not able to check for updates. In this scenario, I have downloaded newer version of VS Code but it was not the permanent solution to solve this problem.

In such type of issues, I found that our enterprise proxy block the request which sent to the respective software vendors. Finally I decided to get to know that how can I setup proxy settings in VS Code as I did with tortoiseSVN and other tools.

I found reference in VS Code documentation - Proxy server support

Many enterprises require that their computers run behind a proxy server and don't allow direct access to the Internet. A proxy server intermediary can limit access to the VS Code Extension Marketplace and prevent installing VS Code extensions.

Follow the below steps to setup proxy settings:

  1. File > Preferences > Settings

    clip_image002
  2. Navigate to the HTTP settings section and you will find settings for proxy as shown in below image:

    clip_image004

  3. Now change the proxy settings as per your environment, If you proxy does not require authentication then just simply enter proxy details:
    "http.proxy": http://172.28.57.20:8080/
    If proxy require authentication then you have to provide user details:
    "http.proxy": "http://niranjan:password@172.28.57.20:8080/"

Complete Settings which works in my case:

// VSCode: Place your settings in this file to overwrite the default settings
{
  "http.proxy": "http://user:pass@proxy.com:8080",
  "https.proxy": "http://user:pass@proxy.com:8080",
  "http.proxyStrictSSL": false
}

From documentation:
Additionally, use "http.proxyStrictSSL": false if your proxy server uses a self-signed certificate.
Note: VS Code supports http and https proxies, but not SOCKS proxies.

Friday, May 26, 2017

Running the first .NET Core program in Docker environment


 

What is .NET Core?

.NET Core is a general purpose development platform maintained by Microsoft and the .NET community. It is cross-platform which suppors Windows, macOS and Linux, and can be used in device, cloud, and embedded/IoT scenarios.

What is Docker?
Docker is an open platform for developers and sysadmins to build, ship, and run distributed applications. It leverage the speed in developing, packaging and running portable distributed applications. Docker for Windows is a Docker Community Edition (CE) app.

Note: It requires Microsoft Hyper-V to run and the current version of Docker for Windows runs on 64bit Windows 10 Pro, Enterprise and Education (1511 November update, Build 10586 or later).
Hardware Virtualization must be enabled. It is prerequisites for Hyper-V and also for Docker also.. You can check it in the Task Manager’s performance tab for CPU.

image



Now we start installing Docker on Windows 10 Pro.
First enable Hyper-V and here are the steps:
  1. Press Windows + R and run appwiz.cpl to open “Programs and Features” section of Control Panel.

    clip_image001
  2. Now click on “Turn Windows features on or off”.

    clip_image003
  3. Check Hyper-V in Windows Features section to enable it.

    clip_image004
I found an interesting and easy to understand moving image(gif) to know that how to enable Hyper-V form control panel.
clip_image005
Installing Docker application
  1. First download Docker InstallDocker.msi installer from here and then double-click InstallDocker.msi to run the installer.
  2. Follow the install wizard to accept the license, authorize the installer, and proceed with the install.

    clip_image006
  3. Follow the install wizard to accept the license,and click Next.

    clip_image007
  4. Click Finish on the setup complete dialog to launch Docker.

    clip_image008
  5. When Docker start without error then you will see Docker icon in the taskbar.

    clip_image010
and Linux virtual machine in the Hyper-V so we need to switch to Windows containers. It may restart your computer as did with me.
and switch to windows container.
Now time to come for creating the first “Hello World” program on Docker and run it. To work with Docker, we have start “Power Shell” to run the CLI command to create the program.
  1. First run the following command to get a container with the dotnet core tools.

    docker run -it microsoft/dotnet:latest
  2. Now create “Hello World” console application:

    dotnet new console -o hwapp 
  3. It will create a directory with name ‘hwapp’. Go into that directory using ‘cd hwapp’ and run the restore command.
    dotnet restore
image

 

Description from MSDN article:
You can, of course, develop your applications by using any language supported by Docker, like Node.js, Java, Go, Python, etc., Right now Microsoft working hard to make better support for .NET Core and .NET Framework in Docker environments. You can actually try the official  .NET and ASP.NET Core images available at Docker Hub as I have used one of them in above exercise to run the program on the Docker container.

It is quite interesting that these containers are help full to create different type application and host them to make auto build as read so far about them.
















Wednesday, May 17, 2017

DevExpress introduces new ASP.NET Bootstrap controls in v17.1

DevExpress controls suite now include Bootstrap enabled ASP.NET controls in upcoming release. So far I found these controls well incorporated with Bootstrap framework.

These new  ASP.NET Bootstrap controls are compatible with the Bootstrap version 3.3.7. These provides out-of-the-box Bootstrap framework. Right now all not all DevExpress ASP.NET controls found in DevExpress Bootstrap controls. In DevExpress 17.1 Beta Demo Bootstrap controls are totally a separate category of controls.

DevExpress ASP.NET Bootstrap controls are new line of controls which somewhat gives us similar versions of DevExpress ASP.NET features There controls contains 4 type of controls as a subset of the DevExpress ASP.NET controls:

image

And Visual Studio toolbox also showing them in separate category of controls:

image

Let  check the DevExpress Bootstrap Controls:
Most of the added controls are similar to the standard DevExpress ASP.NET controls because they are derived from them. Editor controls has almost all of these properties and the client side events.

 

image

These bootstrap enabled controls has new properties section which specifies the bootstrap related properties. In case of button we use SettingsBootstrap.RenderOption  to specifies the button style as shown in the above image.

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Default.aspx.cs" Inherits="DevExBootstrapControls.Default" %>

<%@ Register Assembly="DevExpress.Web.Bootstrap.v17.1, Version=17.1.2.0, Culture=neutral, PublicKeyToken=b88d1754d700e49a" Namespace="DevExpress.Web.Bootstrap" TagPrefix="dx" %>

<%@ Register Assembly="DevExpress.Web.v17.1, Version=17.1.2.0, Culture=neutral, PublicKeyToken=b88d1754d700e49a" Namespace="DevExpress.Web" TagPrefix="dx" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
    <!-- Latest compiled and minified CSS -->
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">

    <!-- Optional theme -->
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap-theme.min.css" integrity="sha384-rHyoN1iRsVXV4nD0JutlnGaslCJuC7uwjduW9SVrLvRYooPp2bWYgmgJQIXwl/Sp" crossorigin="anonymous">

    <!-- Latest compiled and minified JavaScript -->
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script>
</head>
<body>
    <form id="form1" runat="server">
        <div>
            <dx:BootstrapTextBox ID="btnMessage" ClientInstanceName="message" runat="server" Text="Hello, Bootstrap TextBox"></dx:BootstrapTextBox>
            <dx:BootstrapButton ID="btnShowTextMessage" runat="server" AutoPostBack="False" Text="Button">
                <ClientSideEvents Click="function(s, e) {
    alert(message.GetText());
}" />
                <SettingsBootstrap RenderOption="Success" />
            </dx:BootstrapButton>
            <br />
            <br />
            -- Grid --
            <br />
            <dx:BootstrapGridView ID="BootstrapGridView1" runat="server" AutoGenerateColumns="False" DataSourceID="SqlDataSource1" KeyFieldName="AddressID">
                <Columns>
                    <dx:BootstrapGridViewTextColumn FieldName="AddressID" ReadOnly="True" VisibleIndex="0">
                    </dx:BootstrapGridViewTextColumn>
                    <dx:BootstrapGridViewTextColumn FieldName="AddressLine1" VisibleIndex="1">
                    </dx:BootstrapGridViewTextColumn>
                    <dx:BootstrapGridViewTextColumn FieldName="AddressLine2" VisibleIndex="2">
                    </dx:BootstrapGridViewTextColumn>
                    <dx:BootstrapGridViewTextColumn FieldName="City" VisibleIndex="3">
                    </dx:BootstrapGridViewTextColumn>
                    <dx:BootstrapGridViewTextColumn FieldName="StateProvinceID" VisibleIndex="4">
                    </dx:BootstrapGridViewTextColumn>
                    <dx:BootstrapGridViewTextColumn FieldName="PostalCode" VisibleIndex="5">
                    </dx:BootstrapGridViewTextColumn>
                    <dx:BootstrapGridViewTextColumn FieldName="rowguid" VisibleIndex="6">
                    </dx:BootstrapGridViewTextColumn>
                    <dx:BootstrapGridViewDateColumn FieldName="ModifiedDate" VisibleIndex="7">
                    </dx:BootstrapGridViewDateColumn>
                </Columns>
                <CssClasses Table="grid-table-with-template" />
            </dx:BootstrapGridView>
            <asp:SqlDataSource ID="SqlDataSource1" runat="server" ConnectionString="<%$ ConnectionStrings:AdventureWorksConnectionString %>" ProviderName="<%$ ConnectionStrings:AdventureWorksConnectionString.ProviderName %>" SelectCommand="SELECT top 20 * FROM [Person_Address]"></asp:SqlDataSource>
        </div>
    </form>
</body>
</html>

and below is the output of these added controls on the page:

image

 

Conclusion: DevExpress Bootstrap controls idea is quite good and really decrease the development time rather using the flat table for rendering data and other operations using the editor controls. DevExpress native web form controls rich with the features so these Bootstrap enabled control really make intuitive user interface.