The main differences, when to choose one over the other, and why you should know both
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!
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
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.
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
Introduction
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.
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
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.
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.
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?
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.
Compose
In algebra, function composition allows you to apply one function to the output of another function.
