Sometimes you have an array of data and you want to remove all duplicates from the array. In this article, I will show you three ways in which you can do this.
1) Remove duplicates using forEach and includes
The Array includes() method determines whether an array includes a certain value among its entries, returning true or false as appropriate.
With this method, we will create a new empty array. All unique values from our array will be put into this array. We will loop over our array of data and check if the current item is in our new array. If it isn't then we put it in our new array. If it is in our new array then we do nothing.
[continue reading…]
In this article, I will show you how to create a toggle to display items in a grid from a list. This will be using basic JavaScript skills with no external code or libraries. We will be using Flexbox.
What we will be creating
[continue reading…]
One of the best ways to learn CSS is by creating something useful while you learn. I will show you how to use the following CSS items by creating the Google logo:
- position relative and absolute
- pseudo classes ::before and ::after
- positioning an element that is absolute
- transform: translateY
- create triangle
What we will be creating
We will create the Google logo in pure CSS. It will look like this:
[continue reading…]
One of the best ways to learn CSS is by creating something useful while you learn. I will show you how to use the following CSS items by creating the Git logo:
- Transform to rotate an image
- position relative and absolute
- pseudo classes ::before and ::after
What we will be creating
We will create the Git logo in pure CSS. It will look like this:
[continue reading…]
One of the best ways to learn CSS is by creating something useful while you learn. I will show you how to use the following CSS items by creating the React logo:
- position: absolute
- vw (view width)
- transform: rotate()
- animation using keyframes
What we will be creating
We will create the React logo in pure CSS. It will look like this:
[continue reading…]
