Arrow Functions in JavaScript

Arrow functions are a new way of writing functions in JavaScript. They are more concise and easier to read than traditional function expressions and make the `this` keyword easier to handle.

Template Literals in JavaScript

Create more readable and concise strings in JavaScript with template literals.

Computed Property Names in JavaScript

Computed property names allow you to create object properties with dynamic keys in ES6. Instead of specifying a fixed key name, an expression can be used to compute the property name at runtime.

Shorthand Properties and Methods in JavaScript

Shorthand properties and methods are a feature introduced in ECMAScript 2015 (ES6) that provides a more concise syntax for defining object literals in JavaScript.

Destructuring in JavaScript

Destructuring is a powerful feature introduced in ECMAScript 2015 (ES6) that allows data to be extracted from arrays and objects and assigned to variables in a more concise and readable way.

Variable Declarations: var, let, const

In JavaScript there are three ways to declare variables: var, let and const. To understand the differences between them, you need to know concepts such as variable declaration and initialization, scope and hoisting.

Git Commands

A list of useful Git commands for everyday use.

Uses

A curated list of my favorite tools and software.

MacBook setup for web development

Setup a MacBook for web development.

Video Games

A curated list of video games that I have enjoyed playing over the years on various gaming platforms.

React Hooks: useEffectEvent

Understand how to use the useEffectEvent hook in React.

React hooks for handling advanced effects

Learn how to handle advanced side effects in React using the useLayoutEffect and useSyncExternalStore hooks.

React Hooks: useMemo and useCallback

Learn how to use the useMemo and useCallback hooks in React.

React Hooks: useReducer

Understand how to use the useReducer hook in React.

React Hooks: useContext

Understand how to use the useContext hook in React.

React Hooks: useRef

Understand how to use the useRef hook in React.

React Hooks: useEffect

Understand how to use the useEffect hook in React.

React Rendering

Understand how React renders components and updates the user interface.

React Hooks: useState

Understand how to use the useState hook in React.

React Events

Understand how event handling works in React.

React Components vs Elements

Understand the difference between React components and elements.

Prototypes in JavaScript

Understand how prototypes work in JavaScript.

Mutation in JavaScript

Understand how mutation works in JavaScript.

Properties in JavaScript

Understand how properties work in JavaScript.

Equality of Values in JavaScript

Understand the equality of values in JavaScript.

Objects and Functions in JavaScript

Understand how objects and functions work in JavaScript.

Primitive Values in JavaScript

Understand the primitive values in JavaScript.

Values and Variables in JavaScript

Understand how values and variables work in JavaScript.

Values in JavaScript

Understand how values work in JavaScript.

Namecheap domain in Vercel

Configure a Namecheap domain in Vercel.

Combine JSX components and MDX documents

Learn how to combine JSX components and MDX documents in Gatsby.

Pure Functions in JavaScript

Understand what it means for a function to be pure in JavaScript.

Understanding the lifecycle of Gatsby

Learn how Gatsby works under the hood.

Border Gradient

Wrap your text with an animated border.

Animated Gradient

Animate your gradient color with CSS.

Text Gradient

Add gradient color to your text with CSS.

How to Get the Current Page URL in Gatsby

Learn how to get the current page URL in Gatsby.

Smooth Scrolling in Gatsby

Implement smooth scrolling in Gatsby using the smooth-scroll package.

Using Google Fonts in Gatsby

Add beautiful fonts to your Gatsby project using Google Fonts.

How to add custom JavaScript to a Gatsby site

Learn how to add custom JavaScript to a Gatsby site without using any plugin.

How to use Tailwind CSS with styled-components

Combine Tailwind CSS with styled-components in React.

Add a Published Filter To Your Gatsby MDX Posts

Add a `published` filter to your Gatsby MDX posts to keep your draft posts hidden until they are ready to be shared with the world.

Add Tags & Categories to Gatsby MDX blog

Learn how to add tags and categories to your Gatsby MDX blog posts.

Medium zoom-effect in Gatsby

Add a zoom effect to your images in Gatsby using the react-medium-image-zoom package.

Add an RSS Feed to your Gatsby MDX blog

Learn how to add an RSS Feed to your Gatsby MDX blog.

Convert an existing Gatsby Markdown blog to use MDX

Learn how to convert an existing Gatsby Markdown blog to use MDX.

Scroll to Hash in Gatsby

Scroll to a specific element on a Gatsby page.

Format Reading Time with JavaScript

Display cups of coffee as indicators of the minutes it takes to read the post.

My Eslint and Prettier Config

Setup Eslint and Prettier with VS Code.

Remove Line Breaks with Javascript

Remove line breaks from a string using plain JavaScript code.

Strict Mode in JavaScript

Understand the importance of strict mode in JavaScript.

How to Hide The Address Bar in a PWA

Learn how to hide the address bar in a Progressive Web Application.

The script tag

Learn how to add JavaScript code to an HTML page using the script tag.

Command-click or Control+click not working

Fix the issue when the user tries to open a link in a new tab by using Cmd+click or Ctrl+click.

A brief history of JavaScript

A brief history of JavaScript, the programming language that powers the web.

It's all about the fundamentals

Learning the fundamentals of JavaScript.

Jamstack Best Practices

Best practices for building Jamstack projects.

What is Jamstack

Understand the Jamstack architecture and its benefits.

About this site

Welcome to my own little corner of the web!