Items in category javascript

Validating arguments in JavaScript like a boss

JavaScript

In software engineering we try to discover and eliminate bugs as soon as possible. One of most important heuristics here is validation of input/output on functions and methods. If you are going with TypeScript or Flow, you are fine. But if not? Then we have to manually validate at least input (arguments). But what would be the best way doing it? First comes to mind aproba library. It’s “ridiculously” light-weight and equally popular:

0 comments

Handling forms with React and HTML5 Form Validation API

JavaScript

When we talk about user input within a web app we often think first of HTML forms. Web forms have been available with the very first editions of HTML. Apparently the feature was introduced already in 1991 and standardized in 1995 as RFC 1866. We use them everywhere, with almost every library and framework. But what about React? Facebook gives a limited input on how to deal with forms . Mainly it’s about subscribing form and controls for interaction events and passing state with “value” property.

0 comments

Setting Up Dev Environment with Webpack 3

JavaScript

I observe as some people still write ancient ES5 syntax of JavaScript and it’s disheartening. I wonder what keeps them from moving forward. Some must be driven by psychological inertia, but some likely just find it to complex to make their new syntax running in a wide range of browsers. In fact, nowadays we may not fear about it anymore. One can set up a dev environment where tools decide what transformations requires the code and what polyfills to load depending on selected target (list of user agents to support).

0 comments

State of JavaScript Modules 2017

JavaScript

Before modules Historically JavaScript had neither a module system, nor facilities to load sources from within the code. In order to understand what have now, let’s take a retrospective look. I remember in the past a number of libraries where the code-base was split into a separate files which were concatinating during the build process. As simply as that it didn’t help with module isolation, but improved maintainability by organizing the code in files of meaningful names.

0 comments

Guarding Functions in JavaScript

JavaScript

As developers we spend a lot of our time on debugging and particularly on spotting the source of a problem. DevTools guides us though the call stack, but the tracing process can be still pretty time consuming, especially on a cascade of asynchronous calls. The remedy here is early problem reporting. Let’s say we have a function to search trough a multidimensional structure for the elements containing a given string. We make a call that looks like legit:

0 comments

Modularizing and Packaging JavaScript for Scalable, High Performance Web Apps

JavaScript

Modules in JavaScript With the advance of MV* frameworks you can observe as JavaScript evolves ahead of official specs towards large scale development. It requires even higher level of maintainability and one of the first focuses here is encapsulation and information hiding. We need the code-base to be organized into independent, interchangeable components so that each of them contained code implementing only one aspect of desired functionality. Here comes to help the Module pattern.

0 comments

JavaScript MV* Framework - Making the Right Choice

JavaScript

JavaScript frameworks have been proliferating recently with a frightening rate. Just take a look at TodoMVC that provides dozens of MV* framework-specific implementation for a single task. It gives a felling how must be confused a developer making a choice for a framework. Some time ago I even ran into a manifesto (http://bitworking.org/news/2014/05/zero_framework_manifesto) against JavaScript frameworks. I do not completely agree with the author, yet he has a point – it’s too many of them, too many of meta-languages to study that you as a web-developer may not need at all.

0 comments

Enabling Templates in Client-Side JavaScript with CJSC

JavaScript

In spite of most server-side languages JavaScript was not designed for templates. Yet we have plenty of template engines for client-side JavaScript now. They allow us processing templates, but what about declaring a template? As you know JavaScript doesn’t provide a decent way to assign a multiline text to a variable. Well, you can go with string spitted by back-slashes, but in this case a trailing space would break your JavaScript.

0 comments

Modular JavaScript in the browser with CommonJS Compiler

JavaScript

JavaScript was designed as a script language that is easy to embed in a larger host system and meant to manipulate the objects of the host system. With the advance of HTML5 formerly mostly static web-pages are turning into sophisticated web-applications. Now we expect JavaScript code to be scalable and modular. But how when JavaScript has no built-in facilities to combine distinct scripts? Surely, you can insert a script element into the DOM and therefore have outer scripts loaded dynamically.

0 comments

Making Browser Refresh in Response to Our Sources Modification

JavaScript

We all are taught not to repeat ourselves while coding. Nonetheless we keep repeating the same operation over and over – pressing F5/Ctrl-Rfor browser reload every time we have to examine the results of our last changes. After watching some of Paul Irish screencasts where he was showing the magic of live reload under Sublime Text 2 I wondered if I could employ something alike while keeping working with my beloved NetBeans IDE.

0 comments

Importing External Files in JavaScript

JavaScript

As JavaScript application grows, navigation on the code becomes a hell. It comes on mind how useful would be to have ability including JavaScript files. For example, thanks to include/require statements we can build an expressive file structure in PHP. Let’s say following PSR-0 standard we have one class per file (or one prototype object per file in JavaScript) and class name (namespace) reflects the location of the file where it belongs.

0 comments

JavaScript Asynchronous Dependency Loader

JavaScript

A substantial web application doesn’t need to wait until all the required JavaScript libraries loaded. Usually most of them can load asynchronously and start acting whenever they are ready. Most commonly used approach here would be AMD. That’s a sophisticated and time-proved solution. However to use it with libraries, you must have them converted to modules. I don’t appreciate the idea to interfere with 3-rd party library code. At the same time I still need non-blocking loading and dependency being resolved in my code.

0 comments

Harmony with TypeScript

JavaScript

On the way to harmony Not so long ago Microsoft announced a new language, targeting on front-end developers. Everybody’s first reaction was like “Why on Earth?!” Is it just Microsoft darting back to Google? Is that a trick to promote their Visual Studio? But anyway, what’s wrong with JavaScript? Why everybody is so keen to replace it? JavaScript for a language designed in only 2 weeks is freakishly powerful and flexible.

0 comments

Getting started with TypeScript

JavaScript

After Microsoft released TypeScript I took a look at their examples and found the idea pretty promising. I do love JavaScript. However, it has its bad parts. JavaScript doesn’t provide any built-in facilities to declare interfaces or object abstraction. There is no explicit way to have type annotations and type checking. Well, even class-based OOP is not a part of the language. Flexibility of JavaScript is incredible. So, there are tons of libraries meant to work-around these inconveniences.

0 comments

10 things you need to know about JavaScript

JavaScript

Back in 1995 Netscape wanted a language with a simple programming model, but flexible enough for building real scalable applications. Curious, that Brendan Eich accomplished the task in a few weeks. So, we have JavaScript which seems so simple that many people don’t even bother to learn the language while using it. And yet it works! However, it turned out to be one of the reasons why JavaScript was dramatically misunderstood .

0 comments

Scalable JavaScript Application

JavaScript

Make of JavaScript the language you need Any diligent developer is constantly working on improving his or her code. There are plenty of books telling how to make your code better. However most of them use the language of class-based OOP. Reader must have enough of experience to reflect those classical design patterns on JavaScript. Thus, many and many developers give up on the language before mastering its true power. That is one of major reasons JavaScript is referred sometimes as The World’s Most Misunderstood Programming Language.

0 comments

Pseudo-classical Inheritance in JavaScript for Modules

JavaScript

The classical design of object in JavaScript can be expressed like: var ConstructorFunc = function () { var _privateMember = "private member"; } ConstructorFunc.prototype.publicMember = "private member"; ConstructorFunc.prototype.privilegedMethod = function () { return _privateMember; }; Pretty clumsy, isn’t it? I prefer the module design propagated so indefatigably by Addy Osmani (http://addyosmani.com/largescalejavascript/): var Module = function () { // Constructor's job var _privateMember = "private member"; return { publicMember : "private member", privilegedMethod : function () { return _privateMember; } } } It looks much nicer to me.

0 comments

ECMAScript 5 and JS frameworks

JavaScript

Standards are being always approved with a slow pace. Though, the features declared in drafts usually find their implementation long before the standard release. Let’s take for an instance Websockets, which were already implemented in Chrome/Safari and Firefox 4b when standard unexpectedly changed. Apparently YUI3 and jQuery have implemented for long time the features, which are only coming up with ECMAScript 5 (the implementations is called JavaScript 1.8.5) spread. YUI 3 from the very beginning introduced controllable attributes.

0 comments

YUI3 vs jQuery

JavaScript

Everybody time to time comes to the dilemma which JS library to choose for further development. I used to work with prototype coupled with script.aculo.us and now use YUI3 in the office and jQuery at home. I like both of them, though finding each as the best one ‘sui generis’. YUI3is a classical framework that provides design patterns and development philosophy as well as tool. jQueryis meant as a rapid, lightweight, flexible and pretty easy to start library.

0 comments

Image Slider: Comparing JS, JQuery and YUI3 Implementations

JavaScript

Here lies the story… First I decided rewrite my old BlogSlideShow JS-class. In fact I have a plan to rewrite all of my old works gaining to update functionally and appearance regarding to nowadays fashion and make better their code. You can see what I got at the demo page. So, after I finished with implementation on fluent JS, without use of any external library I ported it on jQuery. After that I wrote also implementation on YUI3.

0 comments

How to Make AJAX Read between the Lines

JavaScript

Your site may contain a wealth of technical terms. The user while viewing it may have to wonder about their meaning. What can be done to provide site visitors with instant answers to the questions they have? Previously technical terms were represented as links so that users could click them and get a definition window. This approach, however, is rather clumsy and time-consuming: one has to click the link, wait for the definition window to load and then close it.

0 comments

Interactive Grid with Your Own Hands

JavaScript

I am sure being accustomed to desktop applications GUI, users find interfaces of web-applications as extremely uncomfortable. Their notes, probably unexpressed, are timely within AJAXAge. Besides, it is not so difficult to make web-applications more user-friendly. I will not describe whole variety of interface forms in this article, but will concentrate on such an indispensable element as a grid. Almost every web-application needs linear data list management. DB record management of PhpMyAdmin is likely a classical solution in this field.

0 comments