Five users for the Spread Operator in JavaScript

5 Uses for the Spread Operator

Copy array

let arr = [1,2,3,4]
let copy = [...arr]
// copy is [ 1, 2, 3, 4 ]

Concatenate arrays

let arr1 = [1,2,3,4]
let arr2 = [5,6,7,8]
let concat = [...arr1, ...arr2]
// concat is [ 1, 2, 3, 4, 5, 6, 7, 8 ]

Pass arguments as arrays

function dev(x, y, z) { }
var args = [0, 1, 2]
dev(...args) // call function

Copy Object

let obj = {a: 1, b: 2, c: 3}
let copy = {...obj}
// obj is {a: 1, b: 2, c: 3}

Merge Object

let obj1 = {a: 1, b: 2, c: 3}
let obj1 = {d: 4, e: 5, f: 6}
let merge = {...obj1, ...obj2}
// merge is {a: 1, b: 2, c: 3, d: 4, e: 5, f: 6}

Find more details on the source link above, thanks to @laurie for putting this list together

Transform black into any given color with CSS filters

How to transform black into any given color using only CSS filters:

My question is: given a target RGB color, what is the formula to recolor black (#000) into that color using only CSS filters?

For an answer to be accepted, it would need to provide a function (in any language) that would accept the target color as an argument and return the corresponding CSS filter string.

There are only a few number of SO questions which are worth reading and this one is for sure one of them, I really enjoyed reading the thought process from the author’s point of view and how complex this feature it is even though it seems so simple and something that should be readily available.

Instagram filters with CSS3 Effects

Instagram filters recreated using CSS3 filter effects

Ever wanted to recreate Instagram filters on the fly using CSS3 (without needing to open a graphics program)? Now you can!

Using the new filters feature in CSS3, you can recreate all of the Instagram filters. I have, with varying levels of success, recreated every Instagram filter. They’re definitely not perfect, but they show how CSS3 can be used to do things that weren’t possible before. The CSS code is included with each filter, so you can use them as is or play around for more accuracy.

It is amazing that just a few years ago you had to fire up Photoshop or a similar product in order to produce effects like those in Instagram, but thanks to how far the web has come and the tools available to browsers you only need your imagination to create something similar.

Blank Target vulnerability

A developer that opens a new window or tab with target=‘_blank’ is exposing their users to a little known vulnerability which deals with a malicious code taking ownership of the new opened window.

This can be easily solved by appending rel=“noopener noreferrer” to the anchor tags. With that said the URLs should look like this:

<a href="newpage.html" target="_blank" rel="noopener noreferrer">New Page</a>

Resetting Passwords

I bought an application a few years ago and I have always been able to login without any issues, however with this particular application I didn’t use a password manager to save the string needed in order to get back in. It is a paid application and the “forgot password” functionality didn’t work.

I could have contacted the original creators of the application, however being that my version was behind it would probably have taken days to get me back on line so I went ahead and did what most developers would do. Open the application and figure out the encryption function, cryptographic hash function, login signature in order to create a new password that then could be added to the database, at this moment the only thing I had was the encrypted password and the salt value.

Here is the end of the function that would encrypt the password to compare to what is in the database:

return  $salt . substr(sha1($salt . $password), 0, -$this->salt_length);

With this information I was able to remove the salt valuable temporarily in order to access the application and update the password directly in the database. After accessing the application the password could be updated directly within the system.

Are you locked out of your application? Look at the database and find the login methods to figure out how you can update your database directly and maybe be able to get back in.

As always since you are dealing with the system directly ensure you have a back up of your data in the event that you need to revert the application completely.

photo credit: Yuri | cc

Spotify and third party connections

One of the reasons why you will not see me connecting my Twitter, Facebook, LinkedIn, (enter any other social network) with another application is because in exchange for that specific connection you may be giving away something of value.

We all know that there is a price on being part of a social network, networks provide their service in exchange for your data and the more they convince you to give your personal data the better. That’s why they encourage you often to set reminders, check in, like something, provide your DOB, city, state, and more.

Where I feel networks go beyond harvesting your personal data is when networks harvest data from my friends or family.

Today as I restarted Spotify to install the new and shiny application I was prompted to accept their Privacy Policy and their Terms of Service. Doing a quick scan on their Privacy Policy I ran into the following two paragraphs:

If you connect to the Service using credentials from a Third Party Application (as defined in the Terms and Conditions of Use) (e.g., Facebook), you authorise us to collect your authentication information, such as your username and encrypted access credentials. We may also collect other information available on or through your Third Party Application account, including, for example, your name, profile picture, country, hometown, email address, date of birth, gender, friends’ names and profile pictures, and networks.

That may not be scary for you but take a look at what else they can do with your data:

the use of cookies and other technologies;
the transfer of your information outside of the country where you live;
the collection, use, sharing, and other processing of your information, including for advertising-related purposes (as described in the rest of this Privacy Policy, so please keep on reading!); and
the public availability of your information and the controls over such information as described in Sharing information.

There you have it, short and simple. Does that mean that I will stop using Spotify? Personally I won’t stop using the service, I just won’t connect my other social networks.

Auto populating forms

I received an email fro Adobe and after following the link provided I was welcomed with a pre-populated form (as the one below)



At this point I would press submit and download the marketing material, after taking a closer look I noticed the “Show/hide pre-populated information” link.

I personally do not like pre-populated forms, I believe that if the form is going to try to fetch my information at that point that can be a tracking even on the database even if I do not download the information offered.

Dealing with Apache, Dispacher, and AEM on Mac OS X

I am working with our team to have AEM (Adobe Enterprise Manager) and their Dispatcher (AEM caching and/or load balancing tool) running along with Apache running on our local installations. AEM is rather easy to “install” but here are some of the commands that help me during the installation.

#display Apache version installed on your system along with other useful details
$ apachectl -V

Server version: Apache/2.4.9 (Unix)
Server built:   Sep  9 2014 14:48:20
Server's Module Magic Number: 20120211:31
Server loaded:  APR 1.4.8, APR-UTIL 1.5.2
Compiled using: APR 1.4.8, APR-UTIL 1.5.2
Architecture:   64-bit
Server MPM:     prefork
  threaded:     no
    forked:     yes (variable process count)

#test your configuration settings
$ sudo /usr/sbin/apachectl configtest

You will get information about the modules installed and also if there any syntax errors in your httpd.conf

AH00526: Syntax error on line 606 of /private/etc/apache2/httpd.conf:

If your httppd.conf file is error free you will only get an OK.

Syntax OK