JavaScript Methods: Array.sort() Method

The Array.sort() methods sorts the array in alphabetical order by default, or you can pass in a custom sort function.

So let's say you have an array of names that's our of order that you want to sort.

    <script>
        var names = ["zack", "jim", "bob", "adam", "jason"];
    </script>

If we call the names.sort() method we would get resulting array in Alphabetical order

JavaScript Array Methods: The Array.reverse() Method

The Array.reverse() method reverses the order of the array elements.  The easiest way to demonstrate this is to have an array with the numbers 1 to 5.  If we call the Array.reverse() method we should get an array of 5 to 1.  The Array.reverse() does not create a new array, it simply rearranges the array into a new order.  Just keep that in mind when you are using this method.

So let's declare our array from 1 to 5

    <script>
        var numbers = [1, 2, 3, 4, 5];
    </script>

So if we call the numbers.reverse() method we should get an array of 5 to one in the reverse order

JavaScript Array Methods: The Array.join() Method

The Array.join() method converts all of the elements of an array into strings and concatenates the elements.  If no delimiter is defined it is separated by a comma.  The most common use for this is to convert an array into a comma separated list of strings.

For example let's say we want to convert an array of zip codes into a comma separated list.

    <script>
        var zipCodes = [90210, 90211, 90212, 90213, 90214];
    </script>

If we just call the zipCodes.join() method we will get a string of comma separated list

Python: Installing Python

In this post I am going to go over how to install Python on a Windows machine

Here are the steps to install Python

1.  Type in the URL https://www.python.org/downloads/
2.  Click Download Pythong 3.6.5, save it to a location that you will remember

R Programming : Installing R for Windows

R is a programming language used by data scientists to present and manipulate data.  In this blog post I will go over the steps you need to do to install R in your Windows machine.

Here are the steps to install R:

1. Type the following URL into the address bar https://cran.r-project.org

2. Once you are on the page click on the link that says "Download R for Windows"

CSS : HTML Selectors

In CSS you can define styles for HTML elements and apply the styles globally on the page where the HTML element is used.  For example you can define styles for the entire html element or the p element.  Like the following markup

        html {color:blue;}
        p {font-weight:bold;}
        h1 {color:red;}

This is a paragraph

This h1 tag

You can also group your selectors by using commas to define a style for more than one element. Like h2, h3 {color: blue;}

This is h2

This is h3

So far we have define one declaration at a time. But in CSS we can chain together more than one declaration for each element. Let's say we want to make our h4 element a little bit more fancy by combining multiple declarations together.
h4 {font: 12px Ariel; color: green; background: yellow;}

This is the h4 style

JavaScript : Multidimensional Arrays or Arrays of Arrays

JavaScript itself does not have multidimensional arrays, instead you can use an arrays of arrays instead.  Multidimensional arrays are basically arrays that you can reference by rows and columns.  The most obvious real world use is to store rows and columns of a database record.  Imagine if you have a row of the database product from the database from the table "Products".  Instead of storing each value in an individual variable you can store them in an arrays of arrays.

Let's say you have the following database Products table







This is a perfect scenario to use an arrays of arrays in JavaScript.

Here is how you would store the records, let's ignore the column headers and just concentrate on the record rows and columns.

JavaScript Array Deep Dive : Iterating Through Array

Since an array is a collection of elements of objects, values, etc.  The most common function performed on it is to iterate through each elements of the array.  The most frequent way to do that is with a for loop.

Let's say you have an array with the following:

var numbers = ["one","two","three","four","five"];

The numbers array above contains five string elements, which also has a indexes associated with the it.  There's also a length that is defined with each array that we will use for the for loop we are about to write.  So what do the you length of the numbers array will be?

If we output the array to the browser with the statement console.log(numbers.length) do you think we will get the length to be 5 or 4?

If you guess 5 you are correct because there are five elements in the array.  However, the arrays have zero based indexes therefore the index is always length -1

for(var i = 0; i < numbers.length; i++)
{
     console.log(numbers[i]);
}

JavaScript Array Deep Dive: Adding and Deleting Elements Array.push(), Array.unshift(), and delete

When you define an object as an Array in JavaScript you get the benefits of inheriting some useful methods with it.  Some of the common methods are those that allows you to add and delete elements from an array.  The .push() method adds an element at the end of the array, the unshift() method adds an element at the beginning of the array.  The delete keyword deletes an element at the specified index.

Let say you have an the following array:

var numbers = [3,4];

If you output the array in the browser console you will see that the array has two elements with the number 3 occupying index 0 and the number 4 occupying index 1.

JavaScript Array Deep Dive: Reading and Assigning Values To Array

In the previous post we created arrays of different types, in this post we are going to read the values from our arrays.

Let's work with the following arrays

1. var numbers = [1,2,3,4];
2. var stringArray = new Array("USA", "Canada","China");
3. var objectArray = [{firstName: "Jane", lastName:"Johnson", weight:"115lbs"},{firstName: "Jack", lastName:"Johnson", weight:"200lbs"}];

Let's start with getting a value from an array:

To get the second value of an array you would write the following code by using the :

console.log(numbers[1]);
console.log(stringArray[1]);
console.log(objectArray[1]);

JavaScript Array Deep Dive: Creating Arrays

Arrays in JavaScripts are a collection of values stored in what are called elements.  Each element is represented by a numeric index that is zero based, meaning the first element of an array starts at index zero.  JavaScript arrays are dynamic and can contain many types of objects including functions.  The useful thing about arrays is that they are a specialized object that contains a variety of built-in methods that are useful in the manipulation of the array.

First let's create an empty array, there are several ways to do this:

1. var empty = [ ];
2. var empty = new Array();
3. var empty = new Array(0);

JavaScript Object Deep Dive: toString() and toLocaleString() Methods

Every JavaScript object has a toString() and a toLocaleString() method defined with it.  It is a string representation of the object. 

For example if we define a date object like the following:

 var date = new Date();

and we output the console.log(date.toString()) method without any extra code we would get the current date and time automatically







By default the toString() method outputs the long form of the date and time.  If we want to output a format that is tied to the current locale of the browser.  We can call the toLocaleString() instead. Like the following:

console.log(date.toLocaleString())

and the output will be like the following:







The toString() method works for arrays as well.  Let's say we have an array of countries like the example below:

var countries = new Array("U.S.A","Canada","China");

We can output the toString() method to the console with the following code:

console.log(coutnries.toString());

and you would see the following output.






However, the toLocaleString() method will give you the same result because the method does not perform any special locale functions for you.  It only works for the date.  In order to out the locale representation for the array you need to write your own custom toLocaleString() method for the array.

JavaScript Objects Deep Dive: Object Property Setters and Getters

Most people don't realize JavaScript has object property setters and getters or accessor methods.  When an object has a setter only it is a write only property, when it has a getter only method that it is a read only property.  If a property has both then it is a read/write property.  A perfect example is if you are working with a private property in JavaScript which has the $ prefix in front of it.

Let's say you have an object with a private property $n like the example below:

        var game = {

            $n: "Awesome Game!",

            get name() { return this.$n}
        };

The code above only has a getter name that exposes the private property $n when you console.log you should get value of the $n like the code snippet below

   console.log(game.name);

  As you can see the output is as expected, it prints out the value of $n the private property because we have a getter method name()  things get interesting when we try to assign a value to name.  Its a bit confusing because we access the name method with a dot notation, the same as how we would access a property.

JavaScript Objects Deep Dive: Deleting Object Properties With The delete Operator

In JavaScript you can delete an object's property with the delete operator.  Let's use the product object again as an example.

Let say you have the following JavaScript code to create a product object.

        var product = new Object();

        product.name = "Chai";
        product.category = "Tea";
        product.country = "India";
        product.badProperty = "Bad Property";
        product.badProperty2 = "Bad Property 2";
        product.supplier = {
            name: "ACME Tea Of India",
            location: "New Delhi"
        };

console.log(product);

If you view the above code in a web browser window you will see the following.












We are going to use the delete operator to delete badProperty and badProperty2.  As with the way we access properties we can delete properties with either the dot notation or the [] operator.  To delete the properties type in the following.

delete product.badProperty;
delete product["badProperty2"];

If you type console.log(product) again the two properties will no longer be there

JavaScript Objects Deep Dive: Preventing Errors When Accessing Object Properties

There are times when you will get an error when you tried to access a property in an object, sometimes you think a property exists in the object but it does not.  Let's use the product object from the previous blog post as an example.

        var product = new Object();

        product.name = "Chai";
        product.category = "Tea";
        product.country = "India";
        product.supplier = {
            name: "ACME Tea Of India",
            location: "New Delhi"
        };

Let's say another developer works on the project and he assumes that since there's a "country" property that there should be a "city" property.  If he tries to access the access the "city" property in the product object he will get an undefined, because the property does not exist.   If he types the following he will get the undefined message.

product.city; or type console.log(product.city)







If the developer still persists and still tries to access property by checking it's length he will get the TypeError:








As you can see these errors are not very descriptive, so the best thing to do is to avoid them all together.  The way to do that is to check to if a property exists before you access it with the example below.

var length = undefined;

if(product)
  if (product.city)
      length = product.city.length;


Now if console.log(length) we will get an undefined if the "city" property does not exist.  It's way better than getting a TypeError exception and it's the expected result because you initialized the length variable to "undefined".  Another alternative is to use the .hasOwnProperty() method or the in
operator to test if the property exists in the product object.

For the .hasOwnProperty()

The code would look something like this

if(product.hasOwnProperty("city")
     length = product.city.length;

With the in operator the code would look something like this.

if("city" in product)
   length = product.city.length;

CSS : block vs inline Elements

Since CSS does not live in an island no technology does.  It has to interact with it's neighbor HTML on a regular basis.  In the HTML world there's the block-level elements and then there's the inline-level elements.  Most developers could care less what the meanings of these words mean.  For the designers, it's okay they are just trying to make things look pretty cut them some slack :)

First let's look at block elements:

Block elements are needs to stand on it's own, meaning there's no elements at either sides.  They generate a break on the top of bottom of itself.

Here is an example:

The <h1> and <p> tags are block elements.  Even if you write the code <h1>This is H1<h1><p>This is a paragraph tag!</p> in one line next to each other without any breaks.  The resulting respresentation of those tags in the browser would look like this.

This is H1

This is a paragraph tag!



As you can see even without any line break tag <br/> the elements puts at tag all by itself.

The inline-level elements:

The inline-level elements are the nice kid that shares toys with his friends, while his CEO friend the block elements tries to dominate everything.  If you have to think of it that way you can!  The inline-element works within the context/text etc. and does not generate a line break.

For example if we put a <strong> in the middle of the paragraph tag text it won't generate a line break. with something like this <p>This is a <strong>paragraph</strong> tag!</p>


This is a paragraph tag!


As you can see the <strong> tag in the middle of the sentence did not break up the text into a new line.

JavaScript Objects Deep Dive : Setting And Getting Properties

Now that we've learned to create objects in all sorts of ways it's time to set and get the object properties that we've created.  In this blog we will go over how to access the object properties either to set them or get them.

First let's create an object that we can work with:

Type in the following code in the between the <script type="text/javascript"></script> tag in an html page.

        var product = new Object();

        product.name = "Chai";
        product.category = "Tea";
        product.country = "India";
        product.supplier = {
            name: "ACME Tea Of India",
            location: "New Delhi"
        };

        console.log(product);

If you run the page with the code above you will see the following in the browser console:

Connect To Azure Subscription in Visual Studio 2015

In this blog post I am going to show how to connect to your Azure subscription in Visual Studio 2015.  As a developer it's nice to have the Azure subscription integrated into Visual Studio so that you don't have to log into the Azure portal every time you want to interact with Azure.

Follow the steps below to connect to your Azure subscription in Visual Studio:

1.  Open Tools → Connect to Server
2.  On the top of the "Server Explorer" connections list right click on "Azure" and select "Connect to Microsoft Azure Subscription"













3. A login prompt pops up, log into your Azure account














4.  Once logged in, you will be connected to your Azure subscription

Get Azure Subscription Using Secure Certificate Method In Powershell

In this blog post we are going to get the Azure subscription in Powershell using the secure certificate method.

Follow the steps below to get the Azure subscription:

1.  Open Powershell as an Administrator
2. Type Get-AzurePublishSettingsFile once you type the command into the Powershell command line it will pop-up the Azure authentication prompt.  Authenticate into Azure and save the publish file settings into a place that you will remember.



























3. Now type into Powershell the command Import-AzurePublishSettingsFile "path of the publishsettingsfile"




4. Now you are connected to Azure from Powershell

Download and Install The Azure Module for PowerShell

In this blog post we are going to download and install the Azure Module for PowerShell.  This will allow you to interact with your Azure account through PowerShell.

Follow the steps below to download and install the Azure Module for PowerShell:

1. Go to https://azure.microsoft.com/en-us/downloads/ , scroll down until you see the "PowerShell" section and click on the "Windows install" under the section

Downloading Automation Scripts From An Azure Virtual Machine

In this post I will show how to download the automation scripts that Azure provides when you create a new virtual machine in Azure.  This is great for PowerShell scripting or if you want to interact with your VM in Visual Studio.  You don't have to start from scratch.

Here are the steps to get the automation scripts for your VM in Azure:

1. Log into the Azure portal at https://portal.azure.com
2. Click on "Virtual Machines"

Deploy Windows Server 2016 Virtual Machine With Azure Portal

In this blog we are going to deploy a Windows Server 2016 Datacenter Virtual Machine in Microsoft's Azure Portal.


Follow the steps below to create a Windows Server Virtual Machine:

1. Log into https://portal.azure.com
2. Select "Virtual Machines"

Connect Ubuntu Deployed In Azure

In the previous blog we deployed a full stack Ubuntu Server in Azure.  In this blog we are going to connect the server using a tool call Putty.  You can download Putty at https://www.chiark.greenend.org.uk/~sgtatham/putty/latest.html .

Follow the steps below to connect to your Ubuntu Server in Azure:

1.  Log into the Azure Portal at https://portal.azure.com
2.  Click on "Virtual Machines"

Create Azure CentOS Virtual Machine in New Portal

People often get confused when they work with Azure because there are two versions of Azure.  Most people call it the classic mode and the new portal Azure or the more official term is ASM vs ARM.  In this post we will create a CentOS Linux virtual machine in the new Azure portal.

Follow the steps below create a new Azure portal:

1. Go to the URL : https://portal.azure.com
2. Log in with your Azure credentials
3.  Click on "Virtual Machines" make sure it doesn't say classic on the link

Software For Cheap Bastards : 7-Zip File Archiver And Extractor

Don't have money to buy Winzip?  If you are looking for a good file achiver or extractor look no further than 7-Zip.  It archives and extract most of the file formats and the best part of the value proposition for this great application is that it's free!  And if you act now, you will get it for free!  So hurry while supplies last! It's still free!  Anyways I haven't had any problems with the application.  Even though it's free it's high quality.  So head over to the official website at http://7-zip.org/download.html and download the version for your OS.

Deploy A Ubuntu Linux Virtual Machine To Azure Classic Mode

In this blog post we are going to deploy a Linux virtual machine in Azure.  Most of the steps takes place in the Azure portal.  To get to the Azure portal type in the browser this address https://manage.windowsazure.com

Follow the steps below to create a Linux virtual machine in Azure:

1.  Type into the browser https://manage.windowsazure.com/
2.  Log into Azure with your Azure credentials
3.  On the left hand side of the portal click on the "Virtual Machines" link

Create A Private Virtual Network In Azure

In the previous blog post we created an Azure cloud service.  Now we are going to create a private virtual Azure network.  The importance of this is that when you create a virtual machine in Azure you will use this virtual network to connect to your virtual machine.

Follow the steps below to create a virtual network in Azure:

1.  Click on the "Networks" link on the left hand side

Create A New Azure Cloud Service

The first thing you want to do in Azure is to create a new "Cloud Service" which is a deployment service your resources will be deployed in such as a virtual machine or a web site.

Follow the steps below to create a new Azure "Cloud Service":

1.  Once you are logged into the Azure Portal click on the "Coud Services" on left hand side

JavaScript Objects Deep Dive : Flexibility of Array Notation

In JavaScript there are two ways to access an object, first by dot notation like this

product.name

or with array notation

product["name"]

They both get the job done.   However with the array syntax [""] you access the object as if it's an array but instead of accessing it by numbers or index you access it by the property names.  That's because JavaScript objects are associative arrays.  They look like other objects in other languages such as C, C++, and Java.  However they behave very differently.

In other languages objects are defined in advance, their properties are methods are fixed.  To add a property or method to the object you have to change the class the object instance is created from.

JavaScript Objects Deep Dive : Create Objects With Object.Create

Object.Create( ) is a static function which can take two arguments.  The first argument is the prototype of the object, while the second argument is the properties of the argument.  A prototype is a second object that is created with every JavaScript object.  It is like a blueprint, or the model that the object is built on.  Think of it as a car prototype.

So let's create an object with Object.Create( ) function:

var person = Object.create({
    name: "Tech Junkie",
    location: "Mars",
    hobbie: "Video Games"
});

console.log(person);