Redux is a powerful application state manager widely used alongside React. Once you define a Reducer, it's possible that you wish to replicate the exact same logic of this single file into multiple identifiers.

TL;DR Complete code Gist || CodeBox Example

Let’s suppose a 'Car' reducer that holds and controls the structure below:

{
name: 'Car Reducer Example',
maxSpeed: 150,
famousPilots: []
}

What you'll achieve is the following:

byId:{
111: {
name: 'Car Reducer Example 2',
maxSpeed: 150,
famousPilots: []
},
1040: {
name: 'Car Reducer Example 2',
maxSpeed: 160,
famousPilots: []
},
}

The whole reducer logic…


Being able to export spreadsheet files such as .xls, .csv, .xlsx, etc, on the client is a pretty cool feature and can be easily implemented using JavaScript.

To achieve such a task, I'll use an approach that requires installing the following libraries:

file-saver: Solution to saving files on the client-side.
xlsx: Parser and writer for various spreadsheet formats.

npm install file-saver xlsx

Create a function to receive the desired data to be written to a spreadsheet. I named it exportSpreadsheetFile.js and it will generate a .xlxs file.

Function to export .xlsx file from provided data.

This approach uses the Array…


This story has a name, it’s called PlayCrafter. A flash-based website where users could create and share their games online.

I joined this fantastic world when I was around 11 years old back in 2009. Flash games were everywhere on the web, and a tool to easily create games using drag and drop suited fairly well for my age.

Game creation

I was thrilled. By publishing my games and interacting with users on the website I would accumulate points and level up, have games appear on the front page and even develop my own game pieces. That’s where it all started.


Opening your favorite browser and accessing your favorite website feels like owning a magical device that shows exactly what you want. But have you ever wondered how does ALL of that work?

If you are a web developer you know that when someone hits a button on a website an action will be executed through some code because there’s an event listener expecting that to happen. It’s great you can understand how this happens, but if don’t, no worries.

Performing a simple button click on a website involves lots of layers of abstraction. I’ll explain a little bit of how…


Since React 16.8 you no longer need class components to work with stateful logic. The way to do it now looks like this:


In this tutorial, we’ll walk through the creation of a react app that displays real-time information from an ultrasonic sensor connected to the NodeMCU esp8266 board (Wi-Fi module) which sends and stores data in the Firebase database.

The project measures the distance to the water in a tank and sends the information to the database through Wi-Fi so that a web page can be rendered with the distance to the liquid in the tank.

React app

If it seems scary at first, believe me, it’s not. I’ll make it as clear and succinct as possible so that even if you have little…

Paulo Levy

You can use code to build anything. https://twitter.com/PFLevy

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