Category

JavaScript

Is an 80 Character Code Line Length Still Relevant?

By | C#, CSS, JavaScript, TypeScript, Visual Studio | One Comment

If you’ve spent any time reading about coding standards on the internet, you’ve probably come across the suggestion to limit lines of code to 80 characters and wondered if it’s still relevant today. The advise to limit lines to 80 characters is often connected to the historical limit of 80 characters in terminal windows. But what if your team is not subject to this constraint? Are there still any benefits to adopting this limitation? I tried living with it for a while and here are my takeaways. Growing pains Indentation When I first set out to try this style out,…

Read More
Scout Promise

A Brief Introduction to Promises

By | JavaScript | No Comments

It took me a while to get used to working with Promises in JavaScript. I fundamentally knew how the jQuery Deferred object worked from years ago, so some of the concepts were familiar to me. But, the beauty of the newer Promise implementations is in how it really cleans up your code by breaking it up into blocks that can then be chained and executed asynchronously. Consider the following:

The process is kicked off at the bottom with a call to doSomething() . Notice that doSomething()  calls fetchSomething() , and all that fetchSomething()  does is return the results of someHttpClient.get() . But, in…

Read More

Kendo UI Combobox Customized: Previous Value Restore

By | JavaScript, Kendo UI | No Comments

Today I want to share a little Kendo UI Combobox customization, one that I hope you’ll find useful: restoring the previous value on an invalid entry. Often we see validation, especially numeric validation on a range for example, use coercion to simply force the value to either the highest or lowest number. This certainly prevents invalid entry, but the user experience isn’t all that great in every scenario. What may be preferred, for an allowed range of 0-10, and if the user intends to change a 3 to a 4 and instead accidentally enters 44, would be to just restore the value of 3 (not coerce to 10).

Read More
Experimental Decorator Warning

Suppressing Experimental Support for Decorators warning in VS Code

By | Angular 2, JavaScript, Mobile, NativeScript, TypeScript | No Comments

When working with TypeScript and Angular 2 in VS Code, you may encounter an Experimental Support for Decorators warning on some of the decorators you wish to use in your code. While it doesn’t affect the compilation or functionality of the application, it is a tad annoying to look at. In this example, I’m working with a NativeScript application.  Here are a couple steps to take in order to suppress this warning. Set the Experimental Decorators Property The first step in suppressing this warning, is to set the “experimentalDecorators” property to “true” in the TypeScript configuration file in the root of the project…

Read More

Getting Started With Electron and TypeScript

By | Desktop, Electron, JavaScript, TypeScript, Web | One Comment

What is Electron? ElectronJS is a cross-platform app framework that allows you to leverage existing knowledge of JavaScript, HTML, and CSS to build apps for Windows, OSX, and Linux using a shared codebase. It is based on Node.js and Chromium and is used by many popular apps such as Visual Studio Code, Slack, and the Atom editor. If you haven’t already, install the Electron Prebuilt package from npm:

What is TypeScript? TypeScript is a typed superset of JavaScript that compiles into plain JavaScript. It is an easy way to simplify large complex JavaScript codebases or ensure integrity when working…

Read More

Preserve Feather Content Block HTML Formatting

By | JavaScript, MVC, Sitefinity | 2 Comments

Feather widgets in Sitefinity are a significant improvement over traditional Sitefinity widgets. They are more responsive, provide better tooling, and are easier to customize (both the main area as well as designer views). However, I recently encountered an issue with one of the basic default Feather widgets included with more recent versions of Sitefinity. In this post we’re going to see how to modify this behavior, so that when working with the Feather Content Block widget we have it behave the way we would like. This post also serves a second purpose: Introducing how to modify a built-in Sitefinity Feather…

Read More
view-model-typescript-file

Case-sensitive File Naming for NativeScript TypeScript Source Files

By | Android, iOS, JavaScript, NativeScript, TypeScript | No Comments

When working with NativeScript it’s important to pay attention to the casing of filenames for your JavaScript source files, especially when working with TypeScript. When importing classes, interfaces, or other exported TypeScript items from other files, you must make sure that the letter casing in the reference matches the actual source file. More specifically, the letter casing of your reference needs to match the casing of the actual JavaScript (.js) files that will ultimately be loaded by the NativeScript runtime. After all, TypeScript ultimately gets compiled to JavaScript, and you want to make sure everything lines up! To demonstrate this,…

Read More

Escaping From Relative Paths in Node.js With DI

By | JavaScript, node.js | No Comments

I’ve written before about one way to escape from relative-path “hell” in Node.js by leveraging the built-in behavior of the require function to look in the node_modules folder starting in the current folder and working upwards until it can’t go any further. This approach has some great benefits and I do like it a lot, except for one major problem: My preferred code editor–Visual Studio Code–automatically omits the contents of node_modules folders from search results by default. I have managed to configure my preferences in the past to exclude only the root node_modules folder while including lower ones, but the…

Read More

Node.js + Express.js Video Walkthrough Part 2

By | JavaScript, node.js | One Comment

This is post 2 of 2 in the series “Node.js + Express.js Video Walkthrough” After my recent series on Node.js culminating in an introduction to Express.js, I wanted to give a tour of what an Express.js project looks like, but I also thought that doing so in written form would result in a lot of copy-pasted code that would obscure the bigger picture of the project strucure. So instead, I thought that maybe a video would be a good way to show things in action! This is the second half of a two-part walkthrough of the structure of a Node.js…

Read More

Node.js + Express.js Video Walkthrough Part 1

By | JavaScript, node.js | No Comments

This is post 1 of 2 in the series “Node.js + Express.js Video Walkthrough” After my recent series on Node.js culminating in an introduction to Express.js, I wanted to give a tour of what an Express.js project looks like, but I also thought that doing so in written form would result in a lot of copy-pasted code that would obscure the bigger picture of the project strucure. So instead, I thought that maybe a video would be a good way to show things in action! This is the first half of a two-part walkthrough of the structure of a Node.js…

Read More

Getting Started with Node.js in Windows – Web Apps With Express

By | JavaScript, node.js | No Comments

This is post 3 of 3 in the series “Getting Started with Node JS” Recap In my first post, I went over the basics of Node.js package management with the NPM CLI. In the second, I went a little deeper and delved into the the basic architectural foundations of a Node.js application. Today, we will take all of these things and apply them to create the skeleton of a web application capable of reading data from request URLs and bodies and responding with HTML templates or JSON formatted data. Choices! If there’s one thing that really differentiates the ecosystem of Microsoft .NET…

Read More

Getting Started with Node.js in Windows – Node Modules

By | JavaScript, node.js | No Comments

This is post 2 of 3 in the series “Getting Started with Node JS” Introduction In the previous post, I gave a quick idea of what Node.js is and then fell down the rabbit hole of the topic of NPM. With all that said and done, you should have a basic working knowledge of how to manage NPM packages, both locally and globally. So now let’s turn to the topic of Node.js programming itself. In the previous post about NPM, I mentioned that NPM uses a file named package.json to keep track of dependencies so others can reinstall packages that your…

Read More

Getting Started with Node.js in Windows – NPM

By | JavaScript, node.js | No Comments

This is post 1 of 3 in the series “Getting Started with Node JS” Introduction I’ve already written a few posts about my own journey to find a good Node.js development environment on Windows: journeying from the familiar environment of Visual Studio, to the opposite end of the spectrum with Sublime Text, and then finally somewhere in the middle with Visual Studio Code, where I have dwelt happily ever since. But in the telling of that journey, I’ve glossed over the meat of getting to know Node.js itself, and so that’s what I’m going to do in this post: share…

Read More

Kendo Grid Custom Column Sort

By | HTML5, JavaScript, Kendo UI | No Comments

In my previous post, I demonstrated a simple natural sort that could be used to generate a sortable string that has mixed letters and numbers by padding the numeric portions of the string. As demonstrated in that post, alphanumeric strings may not sort the way users expect if it uses the standard ASCII sort instead of a natural sort:

While it is true that we could implement our own IComparer in C#, by using a string extension method, we can generate a sort-friendly string that can easily be used outside of your C# service. In this post, I’ll show you how…

Read More

Working with HTTP – An Introduction to Angular 2

By | Angular 2, HTML5, JavaScript, Microsoft, News, Web | No Comments

This is post 8 of 9 in the series “An Introduction to Angular 2” In a previous article, we discussed RxJs and how we can use it with Angular2. In this post, we will take a closer look at HTTP and some of the key differences in using HTTP with Angular 2 vs Angular 1. Background jQuery came up with a very intuitive way of dealing with HTTP requests (XMLHttpRequest (XHR) and JSONP). It introduced a $.ajax() method which takes a request configuration and returns a promise. Many JavaScript frameworks followed the path of jQuery and Angular 1 was no different. While similar…

Read More

Bootstrapping Your App – An Introduction to Angular 2

By | AngularJS, JavaScript, TypeScript | No Comments

This is post 2 of 9 in the series “An Introduction to Angular 2” Bootstrapping your app in Angular 2 is quite a bit different than in Angular 1 where we add “ng-app”.   Bootstrapping in Angular 2 uses the ‘bootstrap’ function from which is located in angular2/platform/browser.  Here are examples of bootstrapping an Angular 2 application.   Which example you use will depend on which language you are using JavaScript(ECMAScript 5), JavaScript(ECMAScript 6), or TypeScript. Bootstrapping with JavaScript(ECMAScript 5)

Download complete code sample for ECMAScript 5 Bootstrapping with JavaScript(ECMAScript 6)

Download complete code sample for ECMAScript 6…

Read More

JavaScript: The Semicolon Debate

By | JavaScript | 6 Comments

Emacs or Vim? Tabs or spaces? Android or iOS? In the world of technology, there are always some contentious topics that are hotly debated, yet ultimately come down to a matter of taste, will therefore never be truly settled, but will nevertheless provide fuel for the fire for years to come. I recently learned of another such topic that I want to weigh in on: semicolon-free JavaScript. I actually stumbled across this debate while browsing the configuration options for JSHint. There it was, “asi“, complete with a description that just invited further investigation. I did my research and read posts on both sides…

Read More

Escaping From Relative-Path require() in Node.js

By | JavaScript, node.js | No Comments

Introduction As an ASP.NET web developer coming to Node.js, one thing that you will notice quickly is the difference in how you reference code in other files. In .NET, you declare at the top of each file which namespace the enclosed code belongs to, and you can then reference that code from any other file simply by importing the namespace; relative file position is irrelevant. In Node.js, this is not the case; every file is implicitly a module, and other files can only reference and load them with the synchronous require function. The simplest way to use require in your own project…

Read More