BEM it’s a very useful development methodology based on components. The base of this methodology is to divide the user interface into separate blocks to create scalable, flexible and reusable components. Also, it proposes a style to name each of the classes, thus allowing to create a consistent and clear code (also helps you with the difficult task of finding the best names for each element).

BEM = Block + Element + Modifier


A block is a container where other elements will be. A block is the root of the CSS class and will always go first, and from it…

CSS Efficient

I have to be honest: I didn’t think about how efficient my CSS is. I focus more on trying to make my JS code more efficient so that the browser renders it as soon as possible, but I had never looked at my CSS. So I started to find information about how to make more efficient CSS code and I would like to share with you my investigation:

Selector types

There are 4 selector types: ID, classes, tags and globals. They are ordered according to how efficient they are.

#btn — submit {} /* ID (fastest) */body .main #faq {} /*…

Debugging time

When I’m writing Javascript code, I put every 2 lines a “console.log”. But I have some problems because many times I can’t find a good answer. So I have investigated other forms to test my code and I found some interesting methods.

First of all, what is console.log?

“Console” is an object that provides access to the browser debugging console, and you can print values of your variables. You can use any kind of variables: string, number, boolean, object and array.

Here we have some examples with different types of results:


Shorthands (no matter what language we are working in) always help to make your code shorter, optimized and much cleaner. Here I want to recap some helpful shorthand coding techniques in Javascript that will surely help you a lot.

  1. Ternary operator

We can use “conditional ternary operator” instead of if … else statement and use only one line of code:

// Longhand
let name = document.querySelector(‘’).value,
user = name;
} else {
name = "Anonymous"

// Shorthand
const user = name ? name : "Anonymous"

2. Null, Undefined or Empty

You can check if a variable is…

In JavaScript there’s some Array methods, like forEach(), indexOf(), map(), reduce()… But today I want to show you (if you don’t know them), three methods that seem to be less frequently used to query an array “without looping”. I put it in quotes because it is not entirely true: you don’t make a loop, but internally the loop is created.

Let’s get down to business: some(), every() and find()

  1. SOME()

This method determines if one or more values are in your array and return false or true, depending on whether the values match. …

In any programming language, one of the most important things is to have a clean code that can be read by anyone. And, if you can delete some lines and make it sorter, even better! In Spain we have an old saying: «lo bueno si es breve, dos veces bueno» (The good, if it is brief, twice good). Although whoever invented this saying I don’t think he was thinking about programming, it also works for us.

To carry out this fact, I teach you three very useful JS operators that we don’t use a lot and many people don’t know…


Junior frontend developer

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