Showing posts with label nodejs. Show all posts
Showing posts with label nodejs. Show all posts

Reading Notes #206

2015-10-18_2050Cloud


Programming

  • Learn You Node with VS Code (G. Andrew) - This post is really an excellent starting point to learn Node.js. It gives good references, tools, and tips.

Miscellaneous

  • MVP Award Update - Oct 2015 - This post explains the changes done to the MVP program to improve it. A must to all current and future MVP candidates.


Reading Notes #201

balanceCloud

  • Tracing and logging with Application Insights (Andrei Dzimchuk) - You know the 101 about App Insights and you are looking for something more specific? This post if a must it shows how to transform an ordinary logger in a great source of information.

Programming


Databases


Miscellaneous



Reading Notes #194

IMG_20150716_225401Suggestion of the week


Cloud

Customers can replicate on-premises workloads to Azure with Azure Site Recovery for 31 days at no charge

Programming


Documentation


Miscellaneous



~ Frank



Reading Notes #188


I was really happy to ear about Microsoft Azure Data Center that will be built in Canada. And it was definitely not only good thing that was published this week...

Suggestion of the week


Cloud


Programming


Database


Miscellaneous



First VSCode Tasks in less than 5 minutes

I'm working on solution to automating the generation of my weekly post: Reading Notes. While this work is finished, I still need to do many steps manually. I introduced in a previous post VSCode, that already supports markdown. In fact, from any markdown file, you can press Ctrl+Shift+V to preview the oupput. However, today, it's not possible to do anything with this preview. This post explains how we can use VSCode task to fix this problem.

Goal

Create a task that will quickly transform my current open markdown file in HTML.

Step 1 - Get a Markdown parser

First, we need Markdown parser. I'm sure many different are available, but in this post, I will use markdown-js, a Node.js parser that is available on github. To install it, just execute the following command:
npm install -g markdown

Step 2 - Create a Task

Secondly, we need to create our task. Open Visual Studio Code, and type Ctrl+Shift+P to open the Command Palette and then start typing Configure Task. Press Enter or select “Configure Task Runner”. This will create a new file tasks.jon, with many different samples of tasks. Before you replace the content of the page by the following code, take a look at the comment block at the top of the page. You will see different context variables that are available.

// Simple Task to transform MarkDown to Html
{
    "version": "0.1.0",
    "command": "md2html",
    "isShellCommand": true,
    "args": ["${file}"]
}

This defines our task using the json format. The command name in this case is md2html and we pass the name of the current open file as parameter using the variable ${file}. Finally, the "isShellCommand" is set to true so the task will be triggered by pressing Ctrl+Shift+B.

Step 3 - Try it

To try it, open a markdown page, hit Ctrl+Shift+B, and voilà! You should see in the output the HTML code generated.




References



~Frank

Reading Notes #186

published by Gartner
I finally watch most of the recorded sessions from Build, Ignite and MVPvConf, and I had more time to read.

Suggestion of the week

  • Learning to git bisect (Rural) - Very, very interesting walkthrough, I never knew Git got that kind of feature.

Cloud

Microsoft is currently the only vendor to be positioned as a Leader in Gartner’s Magic Quadrants for Cloud Infrastructure as a Service , Application Platform as a Service , Cloud Storage Services and Server Virtualization

Programming


Miscellaneous


~Frank

Note about the image of this week: This graphic was published by Gartner, Inc. as part of a larger research document and should be evaluated in the context of the entire document. The Gartner document is available upon request here.

Reading Notes #185

IMG_20150503_181242Suggestion of the week


Cloud


Programming


~Frank



Meet my new best friend: Visual Studio Code

On the last week of April, Microsoft was having a huge event call //Build. During three (3) days many great conferences were presented. You can watch them on-demand on Channel 9. The keynote of day one is a must! It was during this keynote that Microsoft reveals many amazing news. One of them: Visual Studio Code. In this post, I indent to share my impression of this tool after one week of usage.

The Beast

You may be thinking: VSCode, it must be a light version Visual Studio... To that, I will reply it's not.
VSCode doesn't go without remembering other modern text editor like Sublime text, or brackets. The interface is far different from Visual Studio though. At this day, three themes are available but you can customize e v e r y t h i n g.

VSCode_Theme_contrasteVSCode_Theme_darkVSCode_Theme_light
VSCode is free, and it runs on Windows, Linux and Mac, it includes great tooling for web technologies such as HTML, Asp.net, Nodejs, CSS, LESS, SASS and JSon. It has syntax highlighting and a true IntelliSense. It also included: package managers, repositories, Git experience, debug tools, tasks, and so more!

I could continue over and over, but all the features are well explained on the official website.

My experience

It took me less than a minute to install on my "old" surface one. The interface is fast, and everything was looking good... Until I try to do something.

First, I was a bit confused. How should I open or create a project? Where is the menu? How do I use the debugger? After few minutes reading the excellent documentation on the official website, everything became clear. Visual Studio Code is sharing his name with his big brother, but he is really different. VS Code is using a folder approach, and a lot of shortcuts (so you keep your hands on the keyboard). And you quickly learn to use the Command Palette (Ctrl + Shift + P) to do more specific work.

My initial test was why Ghost. I cloned the repository directly from Github to my computer. Then from VSCode, open the folder. Without changing / editing anything, VSCode knew my project was in JavaScript, and the coloring and IntelliSense were working. And(F5), the debugger and I felt already more at home.

Firstdebug

A little message informed me that I needed to specify the starting point in the configuration file and voilà! I was debugging a Node.js project, that was easy.


Verdict

After a really short adaptation, Visual Studio Code reveals to be a reel gem. I strongly suggest that you spend few minutes reading the documentation before, to enjoy all his capabilities! The further I use it the more I become completely addicted. Visual Studio Code is an indispensable tool for everyone doing web development or looking for a powerful code editor.

VSCode_Markdown
 
 
Reference:
  • Visual studio code: Official website where you can find documentation and download VSCode for your favourite platform.

Reading Notes #184

CDxQRhpUIAAqBij[1]Last week, Microsoft released tones of news during the //Build 2015. The event was broadcast live, but if you are like me, you probably work during the day.... That smile because the conferences were recorded and are now available on Channel 9

You should definitely take a look and create your own schedule, but in all cases, you must watch the day's one Keynote
Enjoy!

Suggestion of the week


Cloud


Programming


Miscellaneous

Reading Notes #182

post-it_AzureBootcamp2015Suggestion of the week


Cloud

released the DocumentDB Data Migration tool, an open source solution that imports data from a variety of sources, including JSON files, CSV files, SQL Server, MongoDB and existing DocumentDB collections.

Programming


Miscellaneous


~Frank B.


Reading Notes #181

Post It - MVP V-ConfSuggestion of the week


Cloud


Programming


Miscellaneous

  • Making the Complex Simple - Not sure how to "classify" this post, is it a top list of the best bad practices, or literally "du bonbon"? A post to read, and relax.

Reading Notes #180

Quebec, Canada weatherSuggestion of the week


Cloud


Programming


Miscellaneous


~Frank B.


Reading Notes #177

2015-03-15 13.45.14

Suggestion of the week


Cloud


Programming


Miscellaneous



Tons of statistics and metrics for Microsoft Azure websites (not only Asp.Net)

Your website is finally online. That great, good job. But now, you have a lot of questions: How much visits do I have? Which part of the site is mostly visited? Does the site performs well? In this post, I will show you some tools that exist in Microsoft Azure that will help you to get some answers.

Request and Error

When you create a website in Azure, you automatically got some monitoring. Go on portal.azure.com (the preview portal), and select your website.

Monitoring_2015-03-05_1540

This will be useful to see how many requests and errors you got. You could create some alerts, by clicking the "+" sign, and you would be notified by e-mail if the number of request is greater than x, over the last hour.

Analytics

The first time you will click on this section all the instruction will be given to you.
To collect end-user usage analytics about your application, insert the following script into each page you want to track. Place this code immediately before the closing </headtag, and before any other scripts. Your first data will appear automatically in just a few seconds.
To get analytics for the whole web site, in an Asp.Net MVC site, a good place will be: \Views\Shared\_Layout.cshtml.

In a Ghost blog, if you are using the default theme, the file will be /content/themes/casper/default.hbs. Otherwise, just replace "casper" by your theme name in the path.

Once your website is re-deployed, re-open the website blade and click again on the Analytics graph. And you will be able to see a lot of information: Session per browser, information on page's views, slowest pages, details on sessions, etc.


Analitics_tour


When you click on a graph, the Metrics Explorer blade will be visible. On the top of this blade, you will have many different options to customize your results. You will be able to add a chart, change the time range, add some filter and even set some alerts.


Metrics_explorer


Moreover, if you click on those Charts, tables or even on a row, you will have more details and options to fine-tune the result.


Diagnostics_Search


Application Insights

You thought it was enough? Well, Microsoft Azure still has one more tool for you, that will cover in this post: Application Insights. With this one, you will be able to see the health of your application by adding some tests, custom events, logs, errors, etc.
Adding Application Insights to your Asp.Net website, can easily be done via Visual Studio, like I explained in a previous post.

Since Azure is compatible with many different languages, chances are that you are using one of those. Let say you are running a node.js Ghost blog, how could you add Application Insights? By using website extensions. To add an extension you could use the Kudu interface. This interface is easy to access. In a browser, type the URL of the website but inject "scm" between the name of the application and the azurewebsites.net. Something like http://mybookmanager.scm.azurewebsites.net/


From_Kudu_Console2015-03-01_2044


Once you are in the Kudu interface, click on the tab Site Extensions, then section Gallery. Add the Application Insights Extension.
It's also possible to add a website extension using the website blade.


From_portal_2015-03-01_2101


This will gives you a lot of information already, but to add more customs metric in .Net by sure to add the Application Insights SDK to your porject. In node.js use the applicationinsights package from npm,

~Frank Boucher



References




Reading Notes #166

IMG_20141123_093027577_HDRSuggestion of the week


Cloud


Programming


Miscellaneous


~Frank B.


The making of: Franky's Notes Azure Search - part 2

This post concludes The making of: Franky’s Notes Azure Search. In the previous post, I build a console application in .Net using the RedDog.Search library, to populate an index in my Azure Search Service with my notes.
In this post, I’m sharing with you how I created the user interface to query my notes. To know more about the Azure Search REST API, all the documentation is available online.

Objectives


For this part of the project, we will use the azure-search javascript client of Richard Astbury available on Github. The idea is to build a nice user interface (UI) that will provide a simple and efficient way to search. Since the code will be in JavaScript, it’s strongly suggested to use a query key instead of a master key. These keys can be managed from the Azure Portal.

Azure Search Query Keys

Creating the Interface


First, we need to get the azure-search. To get it, you can whether download the file azure-search.min.js on Github or by execute npm install azure-search from a Node.js console.
Now we need a simple HTML page with a form, a textbox and a button.
    <html>
        <head>
            <title>Search</title>
            <link  href="css/bootstrap.min.css" rel="stylesheet">
            <!--[if lt IE 9]>
                <script src="scripts/html5shiv.min.js"></script>
                <script src="scripts/respond.min.js"></script>
            <![endif]-->
        </head>
        <body>
            <form>
                <label>Search</label>
                <input id="txtSearch" placeholder="Search">
                <button id="btnSearch" type="button">Search</button>
            </form>

            <div id="result"></div>

            <script src="scripts/jquery.min.js"></script>
            <script src="scripts/bootstrap.min.js"></script>
            <script src="scripts/azure-search.min.js"></script>
            <script>

                var client = AzureSearch({
                  url: "https://frankysnotes.search.windows.net",
                  key:"DB7B9D1C53EC08932D8A8D5A1406D8CA" // - query only
                });

            </script>
        </body>
    </html> 
As you can see I’m creating the AzureSearch client using my query key from before. Afterwards, we create a Search function to retrieve the search criteria from the textbox and pass it to the client. A dynamic function is used as a callback that receives the parameter noteList which is an array of matching documents. We finally just need to loop through the result to build a nice output.
    function Search(){

        var _searchCriteria = $("#txtSearch").val();   
        var _objSearch = {search: _searchCriteria, $orderby:'title desc'};

        client.search('notes', _objSearch, function(err, noteList){
            var $divResult = $("div#result");
            $divResult.html( "<div class='panel-heading'><h3 class='panel-title'>" + noteList.length + " Result(s)</h3></div><div class='panel-body'>" );

            if(noteList.length > 0){

                var _strResult = "";
                _strResult = "<ul class='list-group'>";

                for(var key in noteList){
                    var fNote = noteList[key];

                    _strResult += = "<li class='list-group-item'><a href='" + fNote.url + "' target='_blank'>" + fNote.title + "</a><p>" + fNote.note + "</p></li>";
                }

                _strResult += "</ul></div>";
                $divResult.append( _strResult );
            }
      });
    }

If we put all this together, we got a nice result.

Franky's Notes Search UI

Live Demo

Conclusion


I really had a lot of fun creating these little applications. I found the client incredibly easy to use. I hope it will help you to get ideas and moving forward to use Azure Search. Any comments, suggestions and/or questions are welcome.


~ Frank Boucher


References


Reading Notes #158

ButtonsamplepngSuggestion of the week


Cloud

  • Designing for Big Scale in Azure (K. Dotchkoff) - Nice post that explains how we should change our design in the cloud and use logical container or scale units.

Programming

  • Building a Better NuGet (Edward Charbeneau) - Nice post that gives us the best practices when developing a NuGet package.

Miscellaneous


~Frank


Reading Notes #157

microsoftazurewebsitescheatsheetSuggestion of the week


Cloud


Programming

  • Inception-Style Nested Data Formats (Scott Hanselman) - What seem to be a good solution at one point could put you in a big problem tomorrow. This post explains one possible cause.

Database


Miscellaneous

  • Markdown Style Guide - This post gives some simple tips to keep our Markdown document easy to read when not converted.

~Frank


Reading Notes #154

 

compare_iaas_paas_saasSuggestion of the week


Cloud


Programming


Miscellaneous


~Frank