Sign in

Learn the intricacies of map, reduce, sort, foreach, and more

Laptop on the ground
Laptop on the ground

We’ve all been there: we’re in that coding flow where code springs from our fingers like lightning bolts. Then we need a method to manipulate an array, but we’re blanking! So we do some quick Googling, even quicker copy-pasting, run our code, and there it is: a big red error in our console. All because our code was slightly different from the code we copy-pasted.

This article aims to prevent that from happening again by improving your understanding of five commonly used array methods, their ins and outs (complete with example use cases), and the gotchas to watch out for…


Always wondered how to design those cool animations you see upon clicking a hamburger menu? It’s easy, and we can do it in less than 100 lines of code.

A hamburger menu with an arrow pointing to a cross indicating what will happen from animation start to animation end.
A hamburger menu with an arrow pointing to a cross indicating what will happen from animation start to animation end.

Let’s make an animated hamburger menu with some vanilla JavaScript! Did you know that there are kebab menus, meatball menus, and bento menus too? We’ll focus on the burger in this one though, but the concept taught in this article can be applied to all types of menus.

Here’s what we’ll do:

  1. Create a div tag, which will hold a p tag, which in turn will be our hamburger.
  2. Add an eventListener to our div tag so we know when our user clicks it and toggle the class on our div.
  3. Add CSS, which is where we control our animation.


In 7 easy steps, add a Three.js-scene to a React app and watch the 3D-magic happen!

1. Create your project

Assuming you don’t already have a React project up and running, the easiest way to start a new one is to run npx create-react-app my-app in your command line, wait for the initiation to finish, and then navigate to the new folder of your React app by running cd my-app.

2. Install and import Three.js

While in the command line, let’s install Three.js. Run npm install three to install Three.js as a dependency to your project. Before jumping into our code, let’s start our app up by running npm start. Navigate to localhost:3000. If everything has gone well we should now see the default start…

Mickey

Lawyer by day, web developer by night.

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