Patient, Positive, Persistent

The main differences, when to choose one over the other, and why you should know both

React logo in space
React logo in space

React is a JavaScript library created by Facebook. It uses a declarative approach and simplifies the creation of user interfaces. A web application built in React is structured in several small and isolated pieces of code called React components. There are two main types of components:

  • Functional components
  • Class components

This article will help you understand the differences, when to choose one over the other, and why you should know both.

A Leap Into the Past

To understand the differences, it’s important to know what the React ecosystem used to be like. Years ago, functional components were used only to render JSX to show content to the user. …

Do you want to boost your productivity as a web developer? Give a try to these 5 free resources that you can start to use now!

Image for post
Image for post

1. ngrok

ngrok allows you to expose a web server running on your local machine to the internet with minimal effort.

A demonstration of what you can build with nothing but HTML5, CSS, and JavaScript

The book “Eloquent JavaScript” on top of a screen showing a cat
The book “Eloquent JavaScript” on top of a screen showing a cat

Learn Vanilla JavaScript Before Any Frameworks or Libraries

The term vanilla JavaScript basically means JavaScript without any additional frameworks or libraries.

JS frameworks are surely an essential part of modern front-end web development and fundamental to increase development velocity. However, having a good knowledge of JavaScript is a must before jumping into any of these frameworks or libraries.

That’s why I decided to gain more confidence with vanilla JavaScript. To improve my skills, I built 20 projects in 20 days with nothing but HTML5, CSS, and JavaScript.

This is not a tutorial but simply a demonstration of what you can build with the basics of web development. …

Five Chrome Extensions to stay focused and to facilitate your daily workflow as a developer.

Image for post
Image for post

Extensions are small programs that personalize and add new features to your browser. You can customize Chrome and your browsing experience by adding extensions from the Chrome Web Store.

Here are five Chrome extensions that I use to stay focused and to boost my productivity and development:

1. Wappalyzer

A comprehensive guide to help you find your way to learning how to code

Image for post
Image for post


Do you want to learn how to code? But you don’t know which of these ways is the right one for you? Keep on reading. I got you!

There are basically 3 possibilities to choose from when wanting to learn how to code: studying for a computer science degree, becoming a self-taught software engineer, or attending a coding bootcamp.

I decided to compare these options based on 5 different criteria: cost, opportunities, efficiency, support, and speed.

How to create a newsletter web application with the Mailchimp API.

Image for post
Image for post

Newsletters are a powerful marketing tool to promote a product, articles, or just to attract traffic to your website. In this article, I will show you how to build a newsletter web application for free! If you get stuck, don’t worry! I will provide you with the whole code at the end of each section.

Before we get started

Our application will be composed of a sign-up page that will be connected to Mailchimp’s servers via their API. For those readers who are not familiar with it, Mailchimp is a marketing automation platform and an email marketing service. …

Set up a local Web Server from scratch with the most popular backend technologies

Image for post
Image for post

Before we get started

In this article, we are going to build a simple web server using Node.js, Express, and the command line. For those readers who are not familiar with these technologies, take a quick look at this introduction before we get started:

  • Node.js is a JavaScript runtime environment that executes JavaScript outside a web browser. It has become one of the most used backend technologies. To install it download the LTS version from the Nodes.js website.
  • Express is a minimal Node.js framework. It helps to write DRY code when building web applications with Node.js. …

Five different scenarios to figure out what “this” is all about.

Image for post
Image for post

One of the most confusing features of JavaScript is the this keyword. Although it looks intimidating, this is not so hard. Here are five different scenarios to finally decode the mystery of this!

Before getting started:

  • You can follow along by executing the code snippets in your browser’s Developer Console. Open up your Chrome Developer Console with this shortcut→ Mac: Cmd + Option + J || Windows: Ctrl + Shift + J.

What is “this” in JavaScript?

We can define this as: “the object that is executing the current function.”

What does that mean? The value of this is usually determined by the execution context. The execution context is the environment in which the JavaScript code is executed. It’s important to know that the JavaScript runtime keeps track of a stack of these execution contexts, and the one that is at the top of this stack is the one currently being executed. …

Here’s how Facebook prevents you to be a Self XSS Victim.

Image for post
Image for post

Many security experts still argue that humans are the weakest link in cybersecurity. The Self-XSS scam confirms this position.

Self-XSS, self cross-site scripting, is a social engineering attack used by hackers to access and control victims’ web accounts. This kind of scam can be also used to compromise your own Facebook account.

How does it work?

The attacker’s goal is to trick you into running their malicious code in your own web browser.

Usually, the scammer posts a message that says that by copying and running a certain code in your JavaScript console, you will be able to hack into anyone’s account. …

Functional programming: What are Compose and Pipe in JavaScript?

Five pipes against a wall
Five pipes against a wall

Compose and Pipe are among the most powerful concepts in functional programming in JavaScript. However, they can be difficult to understand. This article will help you to better grasp these functions.


In algebra, function composition allows you to apply one function to the output of another function.

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