jsmanifest

Sign in

Write clear code

Clean park

In this article, I will go over some practices in JavaScript that will help you in the long run. You might have already heard of some (or all) of them, but it’s the details that follow below them that are most important.

Some of these examples are real-world examples taken from a production code-base. Since they were shipped to production I would like to take this opportunity to help others understand the good and the bad when we write code.

1. Handle Different Data Types

As time passes the day to realize this becomes an important practice comes closer than ever. By not handling different…


Make your life more productive by making development interesting

Code

Node.js is one of the most popular platforms to develop applications due to its blazing-fast ability to process I/O operations. But there are plenty of other good reasons for its popularity.

This article will go over some useful tricks you can use in Node.js right now to enhance your development experience to the point where you will become fascinated. Most of these tips are possible thanks to the flexible nature of the JavaScript language. Without further ado, let’s begin!

1. Inspecting Your Code in the Console (Enhanced)

I think we’ve all been there — placing our calls to console.log all over our functions during development. Debugging code can…


Use the MutationObserver to observe your users

Woman coding at computer

In modern programming, there is plenty of discussion about what is known as state, which most commonly revolves around user interactivity. The MutationObserver is a powerful API that can help us with this because we can use it to react to user interactivity. It is what replaced the legacy Mutation Events API from the DOM3 Events specification.

To create a MutationObserver, we need to instantiate it with the new keyword along with a callback like so:

The onMutation callback receives two arguments (in order):

  1. Mutations — A list of MutationRecord objects.
  2. Observer — The MutationObserver that was constructed. In…


Run a chain of functions that do stuff

Chain

Knowing design patterns is vital in the software industry, as they have been proven to solve real-life problems in business applications. For example, Publish/Subscribe is a common pattern that is extensively used in the DOM. The Command pattern is used in Redux, which boomed in a short period of time due to its unique, robust, and simple ability to manage app state that is also very scalable.

The interesting part about design patterns is that they aren’t one-size-fits-all solutions. …


With examples to help you implement it

Striped pattern

Have you ever come across code where some function was suffixed with Adapter? Chances are that you were reading code incorporating compatibility in behavior between two interfaces using the Adapter pattern. This article will go over the Adapter pattern in JavaScript and explain why the pattern is important and why it can be beneficial in modern programming.

The way the Adapter works is that you create a function (which can be a class, but it doesn’t have to be implemented as a class) that adapts its interface’s properties and methods into a new class seamlessly — as if the adapter…


Be a team player

1. Avoid Multiple Files With the Same Name (Especially With Similar Behavior)

Naming our files is seemingly a simple task. But just because it is simple to do doesn’t mean it wouldn’t become much of a problem. Just like naming our variables in code, it is a practice that can become a huge deal when you aren’t the only one writing the code for some project.

Recently, there was a colleague that maintained a package that I had to take over since he was no longer maintaining it.

In a perfect world, all code should be easy to maintain and easy to work with, but not everything in life goes in our…


Extending the Error class

It is important to keep in consideration the different scenarios in which errors could occur while writing your code. They play an integral part in your web application because you can avoid deadly scenarios (like your application crashing completely) that would otherwise not have been avoided if left unhandled.

This article will go over some best practices for controlling errors and handling them in JavaScript.

Extending the Error

It’s often useful to provide a more descriptive error inside your error handlers. And by this, I don’t just mean writing your error message clearer. What I’m referring to is to extend the Error class.


Functions and composability

JavaScript is widely known for being extremely flexible by its nature. This article will show some examples of taking advantage of this by working with functions.

Since functions can be passed around anywhere, we can pass them into the arguments of functions.

My first hands-on experience with anything having to do with programming in general was getting started with writing code in JavaScript, and one concept in practice that was confusing to me was passing functions into other functions. …


Better composition

JavaScript is praised for its unique ability to compose and create functions. That’s because in JavaScript, functions are first-class citizens, meaning they can be treated as values and have all of the operational properties that others have (like being able to be assigned to a variable, being passed around as a function argument, or being returned from a function, etc.).

We’ll be going over five critical tips to compose event handlers in React. This article won’t cover everything that’s possible, but it’ll cover important ways to compose event handlers that every React developer should know at a minimum.

We’re going…


Thinking of render phases as little, isolated worlds

If you’ve been a React developer for a while you might agree with me that working with state can easily be the biggest pain in your day.

So here’s a tip that might help keep you from introducing silent but catastrophic errors: Avoid closures referencing state values from their callback handlers.

If done right, you should have no problems dealing with state in callback handlers. But if at just one point you slip and introduce silent bugs that are hard to debug, that’s when the consequences begin to engulf time in your day that you wish you could take back.

jsmanifest

Team Lead Front End Developer for TeleMedicine. Follow and Join Me on my Adventures. https://jsmanifest.com

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store