When working with many node projects I often run into a situation in which I need to just set up a simple static web sever, often purely for the sake of serving a path over the http rather than file protocol in a web browser. There are many npm packages such as node-static that can be used to pull this off, but I often find myself just working out a simple solution using the built in http module in node itself. It can be a bit time consuming to do this though, and when it comes to starting a more serious production app it might be better to use a well supported framework such as express to make quick work of this and much more. However in this post I will be using just plain old native javaScript in node.js to create a simple node static file server.

Read More

These days I have been playing around with all kinds of javaScript projects just to get a better feel of all that there is out there to work with in the javaScript and nodejs world. There is much that is helpful when it comes to making quick work of something like parsing mark down to html for example, however there are many projects that are just interesting for one reason or another.

In my travels of researching what to write about I have come across something called particles.js on github which is also available via npmjs also like many such projects. There are many other similar projects with similar names, but in this post I am working with this older project that has to do with a collection of objects that are often called particles.

Particles js is a fun little toy to play with for a short while if you are looking for something along those lines. I can not think of any piratical use for particles.js really it is just a fun artful thing to do with javaScript just for the sake of fun, which is the main reason why I got into javaScript to begin with. It is also not so hard to make ones own particles.js module also, and when it comes that that I have my canvas example post on an object pool example that is something similar to this module. However in this post I will be focusing mostly on using this particles module.

Read More

There is a javaScript project on github called Dragula that can be used to quickly move elements from one element container to another when it comes to front end javaScript. It is a quick and simple way to get this sort of thing working, and does not require any additional dependencies such as jQuery or lodash.

There are of course many other ways to go about doing this when it comes to working out a custom vanilla javaScript solution for dragging and dropping things around. In modern client side javaScript there are even some native browser options now such as the HTML drag and drop API, and there is also doing drag, drop, and snap in a canvas element with display objects rather than HTML elements. So this post will be on using Dragula, but also click and drag in general with javaScript in the front end.

Read More

Part of my debugging process involves placing a console.log in my code at some point to log out to the console the status of some value. Often it might be placed in the body of some code that ends up getting called often, and as such it will get logged to the console a whole bunch of times real fast. So for this reason, along with many others this might not always be the best solution for debugging.

So when it comes to getting into situations where something is being logged to the console to fast this is where using something like the _.once in lodash can be helpful when working on a project that uses lodash as part of it’s code base. The method will return a new function that will call a given function only once when called, and any additional calls after that will not call the given function as an argument.

It is also not so hard to create a vanilla javaScript once method also, and if you have not done so at any time thus far I would say that it is a good idea to do so if you are still somewhat new to javaScript. A once method is a good, simple example of closure in javaScript.

Read More

The _.debounce method in lodash is great for delaying the invocation of a method for a certain amount of time. In addition it can be canceled, or flushed at once when called which is another feature about it that might be absent in many alternatives to lodash denounce that might come to mind such as the setTimeout method. Still it is nice to stick to native methods and certin simple copy and past solutions in order to avoid having to depend on a library such as lodash. So in this post I will be going over a few quick examples of the lodash debounce method as well as looking into this subject in detail when it comes to javaScript in general.

Read More