Using custom background image in Tailwind CSS (incl. dark mode)

Published Jan 12, 2022 6 min read

Tailwind CSS is a nice and powerfull utility-first framework that allows crafting websites/apps…

Read more →

Subscribe to receive the free weekly article

Data fetching in Next.js — How To Use SWR

Nov 04, 2020☕ ☕ 8 min read

Next.js offers several ways for fetching data since it supports both client and server-side…

#next

Routing in Next.js — A Complete Beginner's Guide

Oct 01, 2020 6 min read

Next.js is a React framework that ships with all the features you need for production. Next.js…

#next

Introduction Guide to Next.js

Sep 22, 2020 3 min read

Next.js is a React framework that ships with all the features you need for production. It gives you…

#next

How To Use Redux in your React TypeScript App

Sep 08, 2020☕ ☕ 9 min read

Redux is a predictable state container for JavaScript apps. It's a popular library for managing…

#typescript#react#redux

The React TypeScript Cheatsheet – How To Set Up Types on Hooks

Aug 04, 2020 6 min read

TypeScript is a great language that allows type-checking your code in order to make it more robust…

#typescript#react#hooks

How To Build a Todo App with React, TypeScript, NodeJS, and MongoDB

Jul 21, 2020☕ ☕ 18 min read

In this tutorial, we will be using TypeScript on both sides (server and client) to build a Todo App…

#typescript#react#node

Advanced TypeScript Types cheat sheet (with examples)

Jun 15, 2020☕ ☕ 11 min read

TypeScript is a typed language that allows you to specify the type of variables, function parameters…

#typescript

A Practical Guide to TypeScript - How to Build a Pokedex app using HTML, CSS, and TypeScript

May 21, 2020☕ ☕ 12 min read

TypeScript is a superset that needs to compile to plain JavaScript. It offers more control over your…

#typescript#html#css

Apollo GraphQL: How to build a Full-stack app with React and Node Js

Apr 29, 2020☕ ☕ 8 min read

Apollo Client is a complete state management library for JavaScript apps. It's a powerful tool since…

#react#graphql#apollo

How To Build Finite State Machines using XState and React?

Apr 21, 2020 4 min read

XState is a library for creating, interpreting, and executing finite state machines and statecharts…

#react#xstate

How to Style Your React Apps with Less Code Using Tailwind CSS, Styled Components, and Twin Macro

Apr 14, 2020 7 min read

Tailwind is a utility-first CSS framework for rapidly building custom designs. It can be used alone…

#react#tailwind#styled-cmp

How to build a GraphQl API from scratch with Node JS, Express, and MongoDB

Apr 03, 2020☕ ☕ 11 min read

In this guide, we will build from scratch an API with GraphQL, Node JS, Express, and MongoDB. So…

#node#graphql#express

How to build a Fullscreen Slider with React Hooks

Mar 24, 2020 6 min read

In this tutorial, we will build a Fullscreen Slider component with React Hooks. And to do that, we…

#react#hooks

Introducing the Redux+TypeScript template for Create-React-App

Mar 16, 2020 1 min read

There is something new in React, particularly with Create-React-App. Now, we can set up a brand new…

#react#redux#typescript

How to Start Testing Your React Apps Using the React Testing Library and Jest

Mar 12, 2020☕ ☕ 19 min read

Testing is frequently seen as something tedious. It's extra code and in some cases, to be honest it…

#react#testing

How to build an Event Booking App using HTML, CSS, JavaScript, and Firebase

Mar 02, 2020☕ ☕ 11 min read

In this tutorial, we are going to build an Event Booking App with HTML, CSS, JavaScript, and…

#javascript#firebase

How to lift your React App performance using Lazy Loading?

Feb 21, 2020 4 min read

React, as you already know is a JavaScript a library for building user interfaces. And when we…

#react

A Complete Beginner's Guide to React Router (including Router Hooks)

Feb 17, 2020☕ ☕ 14 min read

React is a JavaScript library for building user interfaces. We can also extend it to build Multi…

#react#hooks

Build a search filter with JavaScript

Feb 11, 2020 4 min read

In this tutorial, we are going to build a search filter with just JavaScript. It's a cool…

#javascript

How to build a PWA from scratch with HTML, CSS, and JavaScript

Jan 31, 2020☕ ☕ 13 min read

Progressive web apps are a way to bring native app feeling into normal or traditional web apps…

#html#css#javascript

How to copy text to the clipboard with JavaScript ?

Jan 27, 2020 3 min read

As a developer, we know how useful and good it is to have a "copy" button sitting next to a code…

#javascript

Build a sticky navigation bar with React

Jan 23, 2020 6 min read

In this tutorial, we are going to build a sticky navigation bar using React hooks. You can preview…

#react#hooks

Differences between forEach and map that you should know

Jan 20, 2020 4 min read

JavaScript has handy methods which help us iterate our arrays. The two most used for iteration is…

#javascript

JavaScript array methods: Mutator VS Non-mutator

Jan 16, 2020 7 min read

JavaScript array methods enable us to manipulate our data. However, we've to use them with care…

#javascript

15 must-know JavaScript array methods in 2020

Jan 09, 2020 6 min read

In JavaScript, an array is a special variable that is used to store different elements. It has some…

#javascript

Redux VS React Context: Which one should you choose?

Jan 02, 2020☕ ☕ 9 min read

React context has been there for a while. With the coming of React hooks, it's now much better. It…

#react#redux#hooks

7 steps to understand React Redux

Dec 26, 2019☕ ☕ 14 min read

React is awesome, we can't say it enough. But where it comes to the state management part, things…

#react#redux
cover

Make a parallax effect with 10 lines of JavaScript

Dec 19, 2019 3 min read

In this post, we're going to make a nice Parallax effect with HTML, CSS and just 10 lines of…

#html#css#javascript
cover

Advanced CSS selectors

Dec 12, 2019 3 min read

Selectors in CSS are used to pick elements and style it. They can be very powerful following which…

#css
cover

CSS flexbox cheat sheet (with examples)

Dec 05, 2019 5 min read

CSS flexbox makes it easier to design flexible and responsive layout structure without using float…

#css
cover

Build a testimonial card with HTML, CSS, and JavaScript

Nov 28, 2019☕ ☕ 8 min read

In this post we are going to have some good time with CSS animations and DOM manipulation by…

#html#css#javascript
cover

Fullscreen slider with HTML, CSS and JavaScript

Nov 21, 2019 6 min read

In this post we gonna build a Fullscreen slider using HTML, CSS and JavaScript. You can check it…

#html#css#javascript
cover

Better Http request with interceptors in Angular 8 and beyond

Nov 14, 2019 4 min read

Dealing with API based token is sometimes cumbersome. Due to the fact that, on every request, we…

#angular
cover

Build an image gallery with HTML, CSS, and JavaScript

Nov 07, 2019 6 min read

CSS grid is awesome, we can't say it enough. It helps a lot on making our website responsive…

#html#css#javascript
cover

How to replace Component lifecycle with useEffect hook in React?

Nov 04, 2019 2 min read

Before React 16.8, we were forced to use class based component to have access in component lifecycle…

#react
cover

5 reasons to use Reactive form in Angular

Oct 31, 2019 3 min read

This post assumes that you have at least a basic knowledge about Angular and specially Angular Forms…

#angular
cover

Awesome Stepper Form with HTML, CSS, and JavaScript

Oct 28, 2019 7 min read

A stepper or multi-step form is a handy feature to have when dealing with long-forms. It enhances…

#html#css#javascript