.reduce()

Definition + Syntax — MDN

When to Use:

reduce() allows us to loop over values in an array and return a single output. At its most basic use, you can sum an array of numbers. You can also use other methods inside the reduce like conditional statements or other applicatives.

In Action:

A simple .reduce() used in A Very Big Sum on HackerRank.


Taking a look at

.map, .filter, and .reduce explained with emojis

As a Bootcamp graduate, I still find some programming vocabulary pretty intimidating and constantly fear using the wrong term or phrase when describing code. This is the hardest part: understanding the core concepts.

“Higher-order functions” is one of the phrases I first struggled with at first. In 3 Ways to Write Cleaner Code, I wrote about the DRY principle, or Don’t Repeat Yourself. In functional programming, one of the ways to accomplish this is by using higher-order functions, which take a function as an argument, return a function, or both. It is simply a decorative phrase for a simple concept.


This will be a multi-part series covering simple components using Google’s Material-UI library with React. If there’s a topic you’d like to cover specifically, please leave a comment!

Material-UI logo

You’ve (maybe) done your research about different CSS libraries and stumbled across Google’s open-source project, Material-UI. As a TLDR, Material-UI is a library that allows you to reuse Google’s Material Design components. Material Design is essentially a front-end developer’s go-to for best design practices.

If you’re familiar with Bootstrap, you’ll find navigating Material-UI (MUI) to be very similar. It is one of the top user interface libraries for React out there. Why? It’s incredible:

  • It comes responsive out of the box.
  • You can create a theme to apply global styles to your components.
  • In the process of learning how to…


Best Practice Tips to Incorporate in Your Code

Text Wall of Code

Every programming language has its syntax nuances that help ensure code is communicated clearly and consistently. If our code is self-explanatory and predictable when read by other programmers, the focus can be on the design and functionality rather than “What is going on in this function?

The way we write our code could reflect negatively on us, indicating we don’t have the skills or experience needed to write readable code. …


With the development of diverse screen sizes, such as your phone or tablet, the concept of responsive web design started to gain traction. It approached web design by making the content adapt to various screen and window sizes on different devices.

Since screen sizes are always changing, it’s important for a website to adapt to any screen size and provide ways for users to interact with the website according to the devices’ features.

Twitter Web Layout

For example, Twitter’s desktop browser layout is a two column layout with its logo on the left and action buttons on the right. …


Laptop with VSCode open

You’ve done the pre-work, you aced the interview, and you’ve finally been accepted into a bootcamp program. Congratulations on the beginning of your journey! These next few months will not be easy, and oftentimes, not for the faint of heart.

You will need to work harder, study more, and take care of yourself more than you ever had before. This program will challenge you in ways you didn’t even think were possible — and if you found the right program, such as I did, it will change your life forever.

If I had an opportunity to give myself advice on…


A short list of programming games to play!

I have always been a fan of video games. You can imagine my excitement when I found out there were games I could play to sharpen my programming skills. From CSS to SQL to some of the most common programming languages — here is a list of my top 5 games from 2020.

CodeCombat preview

CodeCombat

CodeCombat is aimed at teachers and students, but anyone can play. Learn Python, JavaScript, CoffeeScript, or C++. Move your hero through the beginner Dungeon level using basic commands!


PWA vs Native (Photo from AppInstitute)

In the time of COVID-19, more and more people are spending time on their mobile and desktops. While we’re not technically allowed to go anywhere, there are still some of us who exercise, take public transit to work, etc.

In general, more people use their mobile devices — so it’s imperative that apps provide two things: storage and high performance. There has long been a war between Native Apps and Progressive Web Apps (PWAs). Most apps are Native Apps, whereas PWAs are fairly new to browser support.

In order to answer the public demands, developers seek to choose the right…


Flexbox and simple CSS

For many new developers, CSS seems like a very daunting task. However, honing this skill is incredibly important. Who would want to use a website that looks like it came from the late 90s?

90s CSS
90s CSS

Yeah, that’s not exactly aesthetically pleasing.

We have better tools now to make more visually appealing websites. In this post, we’ll just be styling a simple Login form. Here’s a look at the finished product.


For Loop Rick and Morty Meme

Code challenges are a common way to reinforce your understanding of the concepts related to a certain language. In addition to brushing up your skills on the basics, it’s also a way for potential employers to see your efficiency as a problem solver. As with any problem, there are multiple ways to solve the same question.

Let’s take a look at HackerRank’s challenge Simple Array Sum. We’ll be solving this two ways using JavaScript: using a simple for loop and Array.prototype.reduce().

Tiffany Kanjanabout

Full stack web developer. Frontend and design enthusiast. Avid rock climber and amateur photographer.

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