Hjertnes.blog

Understanding find

October 17, 2017

Find is a method you can use on any array in Javascript. You use to find a single element in a array. It is very similar to for example filter(covered in a future post), the big difference between the two is that find returns a single element or undefined; while filter returns an array of matches or a empty array if none are found. For example like this:

You provide it with either a full function, arrow function or a simple expression, and it returns the <em>first</em> match or undefined; if you don&#8217;t have any matches.<br /> This is usually how I did it before I discovered .find:

Or even worse, some horrible for loop with a break.

Understanding Reduce

October 16, 2017

Reduce is a in the Array.prototype; which means you can run it on any array or list. It is a method that lets you reduce a list or collection down to a value.

You have probably written something like this more times than you care to

The next time you&#8217;re about to do that, is the perfect time to figure out how reducers work. Because those four lines can be replaced by a single line using a reducer.

This is how it works. Reduce takes a function as its argument, and you can also provide an optional default value. I almost always do that. The function takes two arguments one accumulator and the currentValue. The accumulator is the result of what the reducer have done up to this point, and the currentValue is the value of the item in the array.

For example, the first time it is called in our simple example above the parameters will be (0, 1) and then it will be (1, 2) and so on.

I personally think that reducers is a great way to turn a array of values or objects into a single value. They produce less code than looping over them. And as a bonus: they have far fewer side affects.

OS X

October 15, 2017

There are a few tasks I have to break down into small chunks. One of them are maintaining the “Audit” section of 1Password, another one is to manage Notifications on OS X.

The short version is: I don’t want any.

So. The way you disable notifications on OS X, is more or less the same as iOS. You have to you through every singe app and disable everything. And it is a major pain in the ass.

My problem with it is two fold. First of all, why not let me mark all of them and do what ever I want to do with either all or any selection of apps. Second, why do I have to click a million different things to just disable notifications?

This is one of the areas where the iOS influence on OS X was wrong. Not the inclusion of it, but rather that the interface are lacking every ability to work efficient.

Welcome

October 11, 2017

Too many Javascript blogs isn’t possible, right?

The pitch for this blog is a collection of short and easy to understand explanation of something related to Javascript. I might sneak in some related topics here and there. But the core focus will be javascript; both as a front end and back end language.

I&#8217;ll publish one post per weekday.

Enjoy.

The Power of Environment Variables

October 08, 2017

What is an Environment Variable? It is more or less the same as every other kind of variable, it contains some data. The difference is that an environment variable lives outside of your program and in the “environment” it is being executed. Like for example the command line prompt shell you run your program. This is for example how the path in your zsh or fish shell is stored, so that it knows to look for the program “vim” in /bin, /usr/bin and /usr/local/bin”.

They are a very powerful tool to have in your belt when you have slightly different configurations for your stuff in various environment. I use them all the time when I run stuff in docker.

What you can do is to tell your javascript build system or your backend to look for some piece of data in the environment instead of a configuration file. For a backend this might be the database connection settings. Or the URL of your site in the javascript build system.

Why would you do this instead of a configuration file? Because it Is much easier. And support for it comes out of the box in most programming languages, plus both docker-compose and webpack makes it very easy to integrate with it.

And you don’t need to maintain multiple configuration files for production, staging, development etc. You just add it to scripts or docker-compose files.

I used to use it a lot back in the old days. I have started using them all the time again with the growing popularity of docker and docker-compose. And they are in many ways the de facto way to configure docker images at run time.

Node, Express and Passport

October 01, 2017

It took me a while to get it working the first time, and I have seen a lot of interns and student interns struggeling with getting it working with one of our traning assignments at my day job (WA.works). So, I have decided to take the passport section of something I&#8217;ve already open sourced, that use Passport and highlight how it works.

<a href="https://github.com/hjertnes/passport-local-demo">Check out the GitHub repo</a>

<strong>This is the short version of what you need to get Passport to work:</strong>

<li>

  Set up Express to accept body data, cookie data and to use sessions

</li>

<li>

  Enable Passport and sessions

</li>

<li>

  Write a local strategy that validates against a local data source

</li>

<li>

  Write a serializer

</li>

<li>

  Write a deserializer (takes the id from the serializer and fethces the data from the data source)

</li>

<li>

  Add code to register, log in and log out; and check if the user is logged in on protected resources.

</li>

Apple Watch

October 01, 2017

So, I’ve had my Apple Watch Series 1 for about a year now. And it is without doubt one of — if not the — most important piece of hardware I have bought.

The reason? It is the first device I have owned that keep track of how much I move, even when I don’t remember to start tracking a exercise.

I use my Apple Watch for three things:

<li>

  Health and fitness tracking

</li>

<li>

  Notifications

</li>

<li>

  Simple data capture

</li>

I wear my Apple Watch more or less 24/7; and I charge it when I get home from work, between dinner and when I walk my dogs, and when I shower after that walk. This is usually enough to get me through until the next day.

It tracks my hearth rate, and it tracks how much I move and my sleep. And that is more or less it. From a health perspective. Then I use it to monitor <em>important</em> notifications. And I ignore the rest.

And the last thing I use it for is very simple data capture, like adding to Water minder as I drink water.

The thing I think is the real value of a Apple Watch is to not “use” it and let it do its thing, and then use it as a tool to first survey how much you move per week, and then use it as a tool to move more and experiment until you find the spot where it requires work but not too much work to reach your goals.

I’m in much better shape now, than I was a year ago. And I have a much better idea of how I’m going to work against improving it even more.

I have the Series 1, and I probably won’t upgrade this year, unless I break mine. But I will probably upgrade next year.

The band I have used the most is my Product Red sports band. These rubbery plastic bands are much better than the ones you might have used on your cheap Casio watch from when you were growing up. And I think they are the best option for most people most of the time. But you might consider something nicer to do when dressing up; but I never do.

I have one complaint about it: it is sometimes a little bit hard to get the end into the hole. It isn’t a problem most of the time, but sometimes I unbuckle it in my sleep.

Review

September 24, 2017

Paw is more or less the same as Postman. It is an app you can use to configure more or less any type of HTTP request. It manages sessions, cookies and so on. And I think it is one of the most useful tools available when you do web development.

The reason it is so useful is that you make some kind of API that communicate over HTTP; usually a RESTful one; even though there still are some weirdos using SOAP, probably only of legacy reasons. This is the API your web front end or your native apps are going to talk to. But it is invaluable to make sure that they work as you expect them to before hooking them up to the front end. Because then you know where to start debugging if something isn’t working. It is much easier to do it if you know for certain that it has to be in the client side code.

You can probably do more or less the same with Postman as you can with Paw, I just prefer Paw because it looks much better and is a native Mac app.

What I love about it is that it supports multiple documents, so I can have one document per project I sometimes work on, containing all the requests I have used on that project. It gives me some kind of organisation, and I don’t have to re-create all of the requests between each time I use Paw.

An awesome app that everyone that do any kind of development that involve backends should have in their tool belt.

Review

September 17, 2017

I think I first started using <a href="https://manytricks.com/moom/">Moom</a> when I discovered when the OS X App Store launched.. And I have had it running on all of my Macs since then.

Moom is the only window manager for OS X that have made much sense to me. It combines the simple, with the powerful.

When you install Moom, you get a hover menu when you place your mouse over the green window control button on any given window. You know the button that puts an app in full screen. It will let you resize that window to fill the whole screen, or resize and move it to fill half the screen in four different combos (left half, right half, top half, button half). This is very easy to do, and very power ful and it would require a lot of messing around to do it manually, many times.

You can also create your own, and attach them to that menu or assign keyboard shortcuts. Or even create a snapshot of a specific layout.

The way I use it the most, is when I connect my 27” 4K monitor at work. Because then I want to have four apps on each virtual desktop. One in each corner.

The way I do it is that I laugh four apps; Visual Studio Code, iTerm, Google Chrome and Tweetbot. For the first one. Option Control Space to trigger the Moom shortcut and then 1 to move an app to the top left corner, 2 to move an app to top right, 3 top bottom left and 4 to bottom right.

It usually takes me five minutes to launch and move stuff around to be ready to start working. And that includes the time the various apps need to launch. I don’t even want to thin about how much it would take me manually.

Setting up a backend with Docker, Postgres, Express.

September 11, 2017

I often find myself wanting to set up something simple to solve a very specific problem, but in the past I have often just implemented it as a part of the larger monolithic backend for what ever project it is, because the hassle of setting up a new server and configuring a framework etc would be too much for that simple thing.

But with Docker and Docker Compose I no longer think it is much of a hassle to write what should be a separate service as one. The reason is that you just instal what ever Linux distro you prefer, and run docker-compose up -d and you’re set (if the compose file you used works).

It is also very easy to set up a Express.js project, with CORS, PostgreSQL and Basic Auth. And I also think that it is one of the library / language combos that I have used that is the fastest to develop in.

I have finally gotten around to making my boilerplate sample project available on <a href="https://github.com/hjertnes/sample">GitHub</a>) It is the same thing I based Pompeii, tracker, active users and many other projects (that aren’t open) on.

The time it takes me from going from idea to working is limited to the time you need to get the code working and a machine running docker compose in the cloud; no fiddling around with configuration or complicated frameworks.

To get something up and running both local and on the server with something like Django or .NET Core would probably take ten times as long.