DeadHash 2.2.0 has just been released. This release comes with a new and improved design, using the latest mui v5 theme base...


## Information

DeadHash 2.2.0 has just been released. This release comes with a new and improved design, using the latest mui v5 theme base.
In addition to the improved design, a lot of security issues have been fixed in terms of dependencies and the overall performance of the user-interface has also been improved.

For a full list of changes, please take a look at the changelog below.

## Changelog

- Yarn upgrade
- Dependency upgrades
- Upgraded to mui v5
- Refactoring of components and reducing screen space requirements for improved user experience
- Many tiny design changes to improve UX
- Removed unneeded files
- Performance improvements

## Download

You can download the latest version of DeadHash by clicking on the following link:
[DeadHash](https://codedead.com/software/deadhash)

## Other

Feel free to [contact us](/contact) if you have any questions or if you need help.


DeadHash 2.2.0 - Release

DeadHash 2.1.3 has just been released. This release is meant as a security update for the electron runtime that DeadHash uses...


## Information

DeadHash 2.1.3 has just been released. This release is meant as a security update for the electron runtime that DeadHash uses.

It is advisable to install this version as soon as possible if you are a user of DeadHash.

## Changelog

- Fixed an electron security issue
- Dependency upgrades

## Download

You can download the latest version of DeadHash by clicking on the following link:
[DeadHash](https://codedead.com/software/deadhash)

## Other

Feel free to [contact us](/contact) if you have any questions or if you need help.


DeadHash 2.1.3 - Release

We've added a new tool to our website. This time, a cryptocurrency price calculator, specifically made for MultiversX (EGLD)...


## Information

We've added a new tool to our website. This time, a cryptocurrency price calculator, specifically made for [MultiversX (EGLD)](https://multiversx.com).
With this tool, you can retrieve the current simple price for the EGLD currency, using data retrieved from [CoinGecko](https://coingecko.com).

## EGLD Price Calculator

You can find the MultiversX (EGLD) price calculator here:
[EGLD Price Calculator](/software/egld-price-calculator)

## Other

Feel free to [contact us](/contact) if you have any questions or if you need help.


MultiversX (EGLD) Price Calculator

DeadHash 2.1.2 has just been released. We've added a couple of new CRC checksum calculation techniques and some additional themes...


## Information

DeadHash 2.1.2 has just been released.

We've added a couple of new CRC checksum calculation techniques and some additional themes to spice up your user experience. For a full list of changes,
please take a look at the changelog below.

## Changelog

- Added deep orange color profile
- Added amber color profile
- Added brown color profile
- Added CRC1 functionality
- Added CRC8 functionality
- Added CRC16 functionality
- Added CRC24 functionality
- Dependency upgrades

## Download

You can download the latest version of DeadHash by clicking on the following link:
[DeadHash](https://codedead.com/software/deadhash)

## Other

Feel free to [contact us](/contact) if you have any questions or if you need help.


DeadHash 2.1.2 - Release

DeadHash 2.1.1 has just been released. We've added the ability to calculate CRC32 checksums, which was a feature that was available in versions before 2.0. In addition...


## Information

DeadHash 2.1.1 has just been released. We've added the ability to calculate CRC32 checksums, which was a feature that was available in versions before 2.0.
In addition, a new theme toggle switch at the top bar is now available for easy access.

For a full list of changes, please take a look at the change log below.

## Changelog

- Added the ability to calculate CRC32 checksums
- Added a light and dark theme toggle in the top bar
- Fixed 'Reset all settings' functionality not resetting the theme style
- Refactoring
- Upgraded all dependencies

## Download

You can download the latest version of DeadHash by clicking on the following link:
[DeadHash](https://codedead.com/software/deadhash)

## Other

Feel free to [contact us](/contact) if you have any questions or if you need help.


DeadHash 2.1.1 - Release

Information DeadHash 2.1.0 has just been released. This release mostly focuses on performance improvements and general bug fixes. We've also added the ability to switch between light and dark themes while retaining the selected color profile...


## Information

DeadHash 2.1.0 has just been released. This release mostly focuses on performance improvements and general bug fixes. We've also added the ability to switch between
light and dark themes while retaining the selected color profile.

For a full list of changes, please take a look at the change log below.

## Changelog

- Added a light and dark theme toggle
- Added orange color in themes
- Updated copyright notice
- Upgraded all dependencies

## Download

You can download the latest version of DeadHash by clicking on the following link:
[DeadHash](https://codedead.com/software/deadhash)

## Other

Feel free to [contact us](/contact) if you have any questions or if you need help.


DeadHash 2.1.0 - Release

If you're a frequent visitor of our website, you might have noticed that we've switched over to an all-new design. Our previous website used WordPress to both manage and display the content on our website, but performance wise, WordPress is quite heavy and slow...


## Information

![Gatsby + React](https://buttercms.com/static/images/tech_banners/webp/GatsbyJS.07de237c5d92.webp)

If you're a frequent visitor of our website, you might have noticed that we've switched over to an all-new design.

The previous version used WordPress to both manage and display the content on and off our website, but performance wise,
WordPress is quite heavy and slow.

In fact, we had a very low score on Google PageSpeed Insight for both mobile and desktop devices and as such, we decided to rework the entire site using
[GatsbyJS](https://gatsbyjs.com), [React](https://reactjs.org) and [Material-UI](https://material-ui.com/).

One thing to note is the increased performance: Our site will load approximately 3 times faster!
In addition, the entire website is completely open-source, meaning you can edit, build and even host your own
instance!

You can find the source code of this very website here: [GitHub](https://github.com/CodeDead/codedead.com)

## Other

Some functionalities might still be missing at the time of this post, but bear with us while we update and improve the site and our server even further!

Feel free to let us know your thoughts on [Twitter](https://twitter.com/C0DEDEAD), [GitHub](https://github.com/CodeDead)
or via [e-mail](/contact).


New website layout

Information AniView 1.6 has just been released. This release focuses on performance improvements and dependency updates. For a full list of changes, please take a look at the change log below. Change log Added a confirmation dialog when resetting settings AniView will...


## Information

AniView 1.6 has just been released. This release focuses on performance improvements and dependency updates. For a full list of changes, please take a look at the change log below.

## Changelog

- Added a confirmation dialog when resetting settings
- AniView will no longer reload the same image
- Improved update process
- Included latest theme version

## Download

You can download the latest version of AniView by clicking on the following link:
<a href="/software/aniview">AniView</a>

## Other

Feel free to contact us if you have any questions or if you need help.


AniView 1.6 - Release

Information DeadHash 2.0.4 has just been released. This release mostly focuses on performance improvements and general bug fixes. As such, we have drastically increased the speed of hash calculations. For a full list of changes, please take a look at the change log...


## Information

DeadHash 2.0.4 has just been released. This release mostly focuses on performance improvements and general bug fixes. As such, we have drastically increased the speed of hash calculations.

For a full list of changes, please take a look at the change log below.

## Changelog

- Allow hash calculation of large files
- Improved the speed of hash calculations
- Minor design changes
- Fixed an issue with the auto updater
- Removed duplicate assets
- Removed Axios library

## Download

You can download the latest version of DeadHash by clicking on the following link:
<a href="/software/DeadHash">DeadHash</a>

## Other

Feel free to contact us if you have any questions or if you need help.


DeadHash 2.0.4 - Release

Information DeadHash 2.0.3 has just been released. It includes several bug fixes and translation fixes. In addition, Portuguese was added and users are now prompted to confirm that they want to reset their settings. For a full list of changes, please take a look at...


## Information

DeadHash 2.0.3 has just been released. It includes several bug fixes and translation fixes. In addition, Portuguese was added and users are now prompted to confirm that they want to reset their settings.

For a full list of changes, please take a look at the change log:

## Changelog

- Added a confirmation dialog when resetting the settings
- Added Portuguese translations
- Added an icon when the window is maximized
- Added update button on about window
- Simplified views
- Translation fixes
- Dependency upgrades

## Download

You can download the latest version of DeadHash by clicking on the following link:
<a href="/software/DeadHash">DeadHash</a>

## Other

Feel free to contact us if you have any questions or if you need help.


DeadHash 2.0.3 - Release

Information DeadHash 2.0.2 has just been released. This release is mainly intended to fix security issues and in order to perform dependency upgrades. Additionally, the drawer bar will now automatically close when clicking outside of its scope. For a full list of...


## Information

DeadHash 2.0.2 has just been released. This release is mainly intended to fix security issues and in order to perform dependency upgrades. Additionally, the drawer bar will now automatically close when clicking outside of its scope. For a full list of changes, please take a look at the change log below.

## Changelog

- Automatically close the drawer bar when clicking outside of its scope
- Dependency upgrades
- Refactoring

## Download

You can download the latest version of DeadHash by clicking on the following link:
<a href="/software/DeadHash">DeadHash</a>

## Other

Feel free to contact us if you have any questions or if you need help.


DeadHash 2.0.2 - Release

This short but informative tutorial, will cover the very basics of looping through arrays in JavaScript using a couple of different techniques. There are some requirements that you should be aware of before starting this tutorial, so be sure that your skill level is...


## Information

This short but informative tutorial, will cover the very basics of looping through arrays in JavaScript using a couple of different techniques. There are some requirements that you should be aware of before starting this tutorial, so be sure that your skill level is adequate.
This will not be an extensive tutorial, but very basic and hopefully you can learn some things here that you didn’t know before. As always, if you’re in need of help, you can always leave a comment. Feedback is also welcome. If you’d like to see something corrected or added to this particular tutorial, feel free to let us know.

### Requirements

- Basic understanding of what an array is in JavaScript
- Basic understanding about the var, let and const keywords in JavaScript
- Basic understanding of HTML
- Basic understanding of CSS is optional but always nice
- Basic understanding of arrow functions

### Useful resources

- [vscode](https://code.visualstudio.com/)
- [WebStorm](http://jetbrains.com/webstorm)
- [var, let const – what’s the difference](https://dev.to/sarah_chima/var-let-and-const--whats-the-difference-69e)
- [Arrow functions in JS](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Functions/Arrow_functions)
- [JSFiddle](https://jsfiddle.net/)

## JavaScript Arrays:

JavaScript arrays are high-level, list-like objects that have the ability to contain multiple elements. Since JavaScript is such a versatile language, arrays can contain anything from strings to complete objects and even functions.
For a more well-defined definition:

`Arrays are list-like objects whose prototype has methods to perform traversal and mutation operations. Neither the length of a JavaScript array nor the types of its elements are fixed. Since an array’s length can change at any time, and data can be stored at non-contiguous locations in the array, JavaScript arrays are not guaranteed to be dense; this depends on how the programmer chooses to use them. In general, these are convenient characteristics; but if these features are not desirable for your particular use, you might consider using typed arrays.`

https://developer.mozilla.org/en-US/docs…ects/Array

You can declare arrays in JavaScript, like so:

```
const array = ["Jack", "John", "Arthur"];
const array = new Array("Jack", "John", "Arthur");
```

Be wary, there is a difference between using new Array and the contained array declaration ( [] ). The Array method can be used to pass an argument to indicate the length of the array. This will set the length property of the array to whatever value you pass to the constructor.

```
console.log(new Array(200).length); // Will output '200'
console.log([].length); // Will output '0'
console.log(new Array(200)[0] === undefined); // Will output 'true'
console.log([][0] === undefined); // Will output 'true'
```

https://jsfiddle.net/rhdjowtv/

As explained above, arrays are not limited in containing only a single data type. Here’s an example of an array that contains both strings and numbers:

```
const array = ["Jack", "John", "Arthur", 666];
console.log(array[0]); // Will output 'Jack'
console.log(array[3]); // Will output '666'
array[3] += 1;
console.log(array[3]); // Will output '667'
```

https://jsfiddle.net/tka96530/

Do note that you should avoid situations in which mixed content in arrays are involved. They are confusing and can break the programmer’s flow of thought.

You can retrieve an element inside an array by utilizing the index of the element that you want to retrieve on the array object, like so:

```
const array = ["Jack", "John", "Arthur"];
console.log(array[0]); // Will output 'Jack'
console.log(array[1]); // Will output 'John'
```

https://jsfiddle.net/cf4hqa05/

You can also change array elements like you would with any other variable (using the equals operator ‘=‘):

```
const array = ["Jack", "John", "Arthur"];
array[0] = "Micah";
console.log(array[0]); // Will output 'Micah'
console.log(array[1]); // Will output 'John'
```

https://jsfiddle.net/uL2fvj69/

Adding items to an existing array can be done by utilizing the push() function:

```
const array = ["Jack", "John", "Arthur"];
array.push("Abigail");
console.log(array[3]); // Will output 'Abigail'
```

https://jsfiddle.net/nqtgdk1r/

As is obvious by the example above, the push() function will add an element to the array and will append it to the end of said array. In case you want to add elements to the front of an array, you can use the unshift() function:

```
const array = ["Jack", "John", "Arthur"];
array.unshift("Abigail");
console.log(array[0]); // Will output 'Abigail'
console.log(array[3]); // Will output 'Arthur'
```

https://jsfiddle.net/xpjtczmo/

Removing and at the same time retrieving elements from an array can be as simple as using either a pop() or a shift():

```
const array = ["Jack", "John", "Arthur"];
const lastElement = array.pop();
console.log(array[2]); // Will output 'undefined'
console.log(lastElement); // Will output 'Arthur'
const firstElement = array.shift();
console.log(array[0]); // Will output 'John'
console.log(firstElement); // Will output 'Jack';
```

https://jsfiddle.net/8arw4g7L/

Arrays can also be sliced in the sense that we can grab a portion of the array and create a new one in the process. The slice() method offers this functionality:

```
const names = ['Jack', 'Abigail', 'John', 'Arthur', 'Micah'];
console.log(names.slice(3));
// Arthur, Micah
console.log(names.slice(3, 5));
// Arthur, Micah
console.log(names.slice(0, 4));
// Jack, Abigail, John, Arhur
```

https://jsfiddle.net/25h6ktew/

Later, we’ll look into the filter() method which is similar in nature.

This concludes the short introduction into JavaScript arrays and some of their functionality. If you want more information about them, there are some great resources that you can check out. For example, I recommend that you check out the Mozilla developer docs. These include more in depth examples an explanations about the functions used above and more.

## Array traversal

There are various ways in which you can loop through the elements of an array. The one most people are familiar with and the one that looks similar to other programming languages, is the traditional for-loop. We will be looking at that shortly, along with the forEach loop, for-of loop, for-in loop, map, reduce and of course the filter methods, what they’re used for and how you can use them to achieve your goals.

### For-loops

For-loops are the traditional looping mechanic when it comes to array traversal techniques. There’s nothing special about them. For-loops have been available since the early days of JavaScript and offers precise control over the loop itself.

```
const array = ["Jack", "John", "Arthur"];
for (let x = 0; x < array.length; x++) {
console.log(array[x]);
}
// Output iteration 0: 'Jack'
// Output iteration 1: 'John'
// Output iteration 2: 'Arthur'
```

https://jsfiddle.net/sv9e5L31/

This works, in essence, by incrementing the counter variable (in this case x) that is used to select an element at a certain index in the array. Since we start the loop at index 0 and only stop when the iterator has reached the end of the line (e.g. when the iterator is equal to the size of the array), we can safely print out any values that the array contains.
There are a couple of advantages and of course disadvantages linked to this methodology.

#### Advantages

- Precise control over the looping mechanics (return, break, continue)
- You can safely use this in IE3+ (if of course you change the let keyword to var because IE is extremely old and outdated at this point)

##### Disadvantages

- Extremely verbose, requiring multiple lines of code.
- The same applies to while loops and do-while loops (available in IE4+). I highly recommend that you avoid do-while loops in JavaScript. While they are a valid way to traverse through arrays or iterate/loop, they should not be used because they have a tendency to look extremely bad to programmers and might break the flow of thoughts.

For demonstration purposes, the example above can be re-written using while loops using the following code fragment:

```
const array = ["Jack", "John", "Arthur"];
let counter = 0;
while (counter < array.length) {
console.log(array[counter]);
counter++;
}
// Jack
// John
// Arthur
```

https://jsfiddle.net/ye71dhzt/

As you can tell, you are required to manually increment the counter variable that is used to select an element from the array.

### forEach loop

The forEach method is simple, yet elegant, in the way that it executes a single function for each element inside an array. Said function, called the callback function, can receive the element and index of the element as parameters. An example of this would be:

```
const array = ["Jack", "John", "Arthur"];
array.forEach((item, index) => console.log(item + " at position " + index ));
// Jack at position 0
// John at position 1
// Arthur at position 2
```

https://jsfiddle.net/daLfp2b1/

This example uses a reusable function as the callback parameter, instead of an anonymous arrow function:

```
const array = ["Jack", "John", "Arthur"];
array.forEach(printElement);
function printElement(item, index) {
console.log(item + " at position " + index );
}
// Jack at position 0
// John at position 1
// Arthur at position 2
```

https://jsfiddle.net/qyxm39p8/

#### Advantages

- Simple, clean and elegant
- Easier to read than for loops
- Less chance of making increment (e.g. i++) errors when compared to for-loops

#### Disadvantages

- Harder to break out of the loop
- They skip empty elements

Example of empty element skipping:

```
const arr = ['Jack',,'John'];
for (let x = 0; x < arr.length; x++) {
console.log(arr[x]);
}
// Jack
// Undefined
// John
arr.forEach(v => console.log(v));
// Jack
// John
```

https://jsfiddle.net/naxhe3b8/

### for-of loop

Not to be confused with the for-in loop, the for-of loop is similar to the for-loop in syntax and declaration. The difference being that the for-of loop can iterate over items (not the properties of the items like for in loops) in arrays, without the need of declaring an iterator. In addition to that, the for-of loop can be used to iterate over strings, maps, sets and other data types.

```
const names = ['Jack', 'John', 'Arthur'];
for (let name of names) {
console.log(`The person's name is ${name}`);
}
// Jack
// John
// Arthur
```

https://jsfiddle.net/mwfy59ba/

#### Advantages

- Simple, clean and elegant
- Easier to read than for loops
- Precise control over the looping mechanics (return, break, continue)
- No chance of making increment (e.g. i++) errors when compared to for loops

#### Disadvantages

- Harder to break out of the loop
- They skip empty elements
- If, for some reason, you want to keep track of the index of the item you’re looping over, you will need to create and increment a variable for each iteration

### for-in loop

The for-in loop is similar to to the for-of loop in syntax and workings, except for one large detail. The for-in loop will loop through the properties of an object and not the values.

```
const person = {
firstName: 'John',
lastName: 'Marston'
};
for (const prop in person) {
console.log(prop);
}
// firstName
// lastName
```

https://jsfiddle.net/75wsx63j/

### map

The map() function is used to create a new array, populated with the elements of the calling array, with said elements having been calculated or modified by the result of a calling function. While this is not a traditional looping mechanic, it can be used to perform powerful calculations.

Let’s use the following scenario to demonstrate what this all means:

Imagine having an array that is populated with a couple of names. You’d like to retrieve a new array that contains all the elements of the original array with something extra added to it as well. Map() would be a great way to do this:

```
const array = ['Jack', 'John', 'Arthur', 'Marcus'];
const aurelified = array.map(item => item += ' Aurelius');
console.log(aurelified);
// Jack Aurelius
// John Aurelius
// Arthur Aurelius
// Marcus Aurelius
```

https://jsfiddle.net/okcg4nt0/

### filter

The filter() method can be used to, as the name indicates, filter certain values out of an array. Do note that this will not change the original array. Just like the map() method, this will return a new array with the result of the filter operation, which is calculated by a calling function.

Consider the following scenario:
You’d like to retrieve an array of elements in which the length of the elements is greater than 10:

```
const array = ['Jack', 'John', 'Arthur', 'Marcus Aurelius'];
const aurelified = array.filter(item => item.length > 10);
console.log(aurelified);
// Marcus Aurelius
```

https://jsfiddle.net/m54yjdnq/

### reduce

The reduce() function can execute a reducer function on each element in an array. To explain this with an example, think of calculating the sum of all the elements in an array and outputting only a single value (e.g. the sum of the elements 1,2 and 3 is equal to 6). To translate this to code:

```
const array = [1, 2, 3];
console.log(
array.reduce(
(accumulator, currentValue) => accumulator + currentValue
)
);
// 6
```

https://jsfiddle.net/udj8m6nr/

The reducer function can take up to four arguments and the reduce() function can also be provided with an initial value. The arguments for the reducer are as follows:

- Accumulator
- Current value
- The current index
- The source array

This example utilizes all four arguments, and will provide the reduce() function with an initial value to perform calculations on:

```
const array = [1, 2, 3];
const result = array.reduce((accumulator, currentValue, index, source) => {
console.log('Index: ' + index);
console.log(source);
return (accumulator + currentValue);
}, 20);
console.log(result);
// Index will start at 0 because an initial value is provided. Without an initial value, the index will start at 1
// result = 26 | This is because we set the initial value to be equal to 20
```

https://jsfiddle.net/Lqwea2b7/

## Extra

That concludes this short tutorial. It is by no means a complete overview of all the available techniques and the demonstrations are rather short, but will hopefully help you along the way on your journey as a webdeveloper / JavaScript developer. Again, if you have any questions, suggestions, comments or feedback, feel free to leave them in the comment section below.


Blog