Join 34,779 other Developers as we Learn, Build, and Grow Together.

Connect with fellow developers and gain access to tools that will help you build a profitable SaaS ๐Ÿš€

Sign Up

Webdev

Webdev posts, videos, courses, and more

My VS Code setup

My VS Code setup

In this blog post I will be sharing my VS Code set up i,.e themes and extensions. Themes One-dark-pro: I am currently using One-dark-pro which is Atom's theme made for VS Code. Icons File Icons enhance our VS Code Editor looks. It helps us to differentiate between different files & folders by their given icons. I currentl...

Karthikeyan

1 day ago

4
Select One:
Inheritance and Composition JavaScript Tutorial

Inheritance and Composition JavaScript Tutorial

Some days back I wrote about Composition vs Inheritance in React (Here). Got an amazing response on Twitter. So, in this post, we'll see about Composition vs Inheritance in JavaScript. Intro What is Inheritance? In simple language, inheritance means properties you got from your ancestors. Your parents borrowed some properties f...

Rahul

1 day ago

4
Select One:
 What is Nullish Coalescing Operator? - JavaScript

What is Nullish Coalescing Operator? - JavaScript

With the presentation of Symbols (fortunately to which you can make 100% interesting properties - consistently), Optional Chaining, Nullish Coalescing, destructuring assignment and much more JavaScript is turning into a truly steady language reasonable for enormous codebases and the advancement incredible applications. The ?? o...

Rahul

2 days ago

3
Select One:
The Most Important Thing You Don't Know About Promises

The Most Important Thing You Don't Know About Promises

In this article, we will see the most important thing about promises which you might not know but it's important to have knowledge about it to avoid creating bugs in the application. So let's get started. Take a look at the below code: const promise = new Promise((resolve, reject) => { resolve(); }); promise .then(() =&g...

Yogesh Chavan

6 days ago

3
Select One:
Most Useful Features of Chrome Developer Tools That You Must Know

Most Useful Features of Chrome Developer Tools That You Must Know

Chrome developer tools are an essential part of web development. Following are some of the tips and tricks of chrome developer tools to make your life a lot easier during development. Take Screenshot Of The Entire Page Right click anywhere on the page and select inspect option to open the Chrome developer tool Open command menu...

Yogesh Chavan

1 week ago

6
Select One:
Redux Middleware โ€“ What it is and How to Build it from Scratch

Redux Middleware โ€“ What it is and How to Build it from Scratch

In this article, we will explore what is a middleware in Redux, why it's used, and how you can create your own middleware from scratch. So let's get started. Want to learn Redux from scratch and build a full-stack food ordering app with stripe payment integration? Check out my Mastering Redux course. What Is Redux Middleware?...

Yogesh Chavan

1 week ago

6
Select One:
When It's Not Good to Use React State

When It's Not Good to Use React State

In React, whenever we are working with any data, we always use the state for storing that data which may be a string, number or any complex object. This is fine if you are using that state while rendering the component or If you want to do something when the state value changes but If you are using that state just for storing d...

Yogesh Chavan

1 week ago

3
Select One:
Develop a RedwoodJS URL shortener application

Develop a RedwoodJS URL shortener application

Introduction What is RedwoodJS Redwood is is built on React, GraphQL, and Prisma, Redwood works with the components and development workflow, but with simple conventions and helpers to make your experience even better, this is opinionated. To keep it simple, let's use the tag line which they go by. "Bringing full-stack to t...

Rohith Gilla

2 weeks ago

3
Select One:
How to Add Type Checking in React

How to Add Type Checking in React

React is a Javascript library and Javascript is a loosely typed language so by default it does not provide any type checking because of which it's very easy to create bugs in your application when we pass the wrong type of data and it will easily crash your application. There are various static type checkers used in larger appli...

Yogesh Chavan

2 weeks ago

4
Select One:
400+ Free resources to learn to code in 2021

400+ Free resources to learn to code in 2021

You only need this post to become a Front-end Developer because this post has nearly unlimited amount of every type of resources covering everything you will need. Blog your Journey Hashnode - Hashnode is the easiest way to start a developer blog on your personal domain ๐ŸŒ for free and connect with the readers through our glo...

Dev Bookmark

3 weeks ago

6
Select One:
15 Websites to host your projects for free in 2021

15 Websites to host your projects for free in 2021

A web facilitating administration is one kind of Internet facilitating administration which permits any people or organizations to make their site available on the World Wide Web. For the most part facilitating is paid, however there are numerous free site facilitating options, that can fill your need. We as a whole love gifts a...

Dev Bookmark

3 weeks ago

6
Select One:
12 websites to Ace you programming skills in 2021

12 websites to Ace you programming skills in 2021

Hey everyone building projects and solving real world problems is inarguable one of the best ways you can learn how to code. In a culture dependent on usefulness, more often than not, practice is left to the side. It is now and again viewed as an exercise in futility, particularly for those with more long stretches of involvemen...

Dev Bookmark

3 weeks ago

5
Select One:
How To Create A React App From Scratch Using Webpack 5 + Babel

How To Create A React App From Scratch Using Webpack 5 + Babel

The easiest way of creating a react application is using a create-react-app tool. This is good to use when you have just started learning React but it hides a lot of details regarding: What happens under the hood What configuration is needed to work with the latest features How does the conversion from ES6 to ES5 happen Also,...

Yogesh Chavan

3 weeks ago

7
Select One:
The Node.js ultimate beginner to pro Cheatsheet in 2021

The Node.js ultimate beginner to pro Cheatsheet in 2021

Many of you guys requested us for NodeJS cheatsheets and here you go guys, this is an ultimate NodeJS cheatsheet. In programs, the 'high level' scope is the global scope. That implies that in programs in case you're in the global scope 'var' something will characterize a global variable. In Node this is unique. The high level s...

Dev Bookmark

3 weeks ago

7
Select One:
How to Configure ESLint For Your Project From Scratch

How to Configure ESLint For Your Project From Scratch

ESLint is a linter that helps to improve the code quality and fix bugs beforehand to avoid them from coming at runtime. It also helps to avoid hard to debug issues in the future. Knowing how to use ESLint is very important as most companies are actively using it. There are also other linters available like jslint, jshint but ESL...

Yogesh Chavan

3 weeks ago

7
Select One:
An ultimate guide to Logging in JavaScript

An ultimate guide to Logging in JavaScript

In this post we'll also learn more about Logging in JavaScript. This post is for everyone who wants final guide to Logging in JavaScript. The console is part of the window object that gives you access to the browser's console. It lets you output strings, arrays and objects that help debug your code. We can get access to the con...

Dev Bookmark

4 weeks ago

5
Select One:
The Most Surprising Behavior of JavaScript Regular Expression

The Most Surprising Behavior of JavaScript Regular Expression

JavaScript regular expression objects are stateful when they have the /g or /y flag in the pattern to match. When we create a regular expression that has the /g flag, it maintains the lastIndex property which keeps track of the index where to start finding for the next match. So next time when we start testing using the same...

Yogesh Chavan

1 month ago

5
Select One:
Why You Should Use async And defer Attributes In a Script Tag

Why You Should Use async And defer Attributes In a Script Tag

Do you know the importance of defer and async attributes in the script tag? This is one of the most popular interview question asked in JavaScript interviews. When we load any webpage in theย browser, the browser generates a DOM(Document Object Model) byย parsing the document. When there is no attribute(defer or async) to the scri...

Yogesh Chavan

1 month ago

3
Select One:
How to fetch a pull request locally and test it out before merging

How to fetch a pull request locally and test it out before merging

Introduction In this post, we'll learn how to fetch a pull request locally and test it out before merging it into our project repository. We can also make changes to it if required and push those changes as well. Testing the PR locally Suppose, we have an open source project on GitHub and contributors are contributing to it in t...

Raunaq

1 month ago

4
Select One:
Super ultimate guide to Regex in 2021 (how to  use in JavaScript)

Super ultimate guide to Regex in 2021 (how to use in JavaScript)

Regular expressions play a vital role in every high-level programming language and so in JavaScript. Let's know them all in detail... A Regular Expression (RegEx) is a sequence of characters that defines a search pattern. It helps you to "match" part of the text (string) by given rule. // Let's get our hands dirty wit...

Dev Bookmark

1 month ago

2
Select One:
17 Top CSS3 libraries to use in 2021

17 Top CSS3 libraries to use in 2021

No big surprise, then, at that point, that CSS Frameworlds arose over the long haul and took the vast majority of the aggravation away. Today we can't envision coding without our #1 CSS structure, as focusing on numerous screen sizes has become a need. In any case, how would you realize your system is the awesome the current tas...

Dev Bookmark

1 month ago

Select One:
Top 4 Amazing font generators for looking cool on the Web

Top 4 Amazing font generators for looking cool on the Web

Everyone wants their website to look unique, so we'll learn about some Typography font generators in this post. Let's get into it. What is Typography? Most importantly, typography is about convenience. Type is the UI for passing on data, and passing on data is what we're here to do on the web. After (and solely after) convenien...

Rahul

1 month ago

6
Select One:
How to Write Better React Components

How to Write Better React Components

JavaScript added many useful features starting with ES6 and nd these changes help developers write code that is short and easy to understand and maintain. When you use create-react-app to create a React App, you already have support for these changes. This is because it uses Babel.js to convert the ES6+ code to ES5 code which al...

Yogesh Chavan

1 month ago

4
Select One:
Understanding the React useRef() Hook

Understanding the React useRef() Hook

Introduction In this post, we'll look at the useRef() hook that provides a way to directly access a DOM node. We'll also look at scenarios where we can use the value of the reference returned by the Ref hook that is persisted between component re-renderings. Prerequisites An understanding of the useState() and useEffect() Hook...

Raunaq

1 month ago

4
Select One:
Open any Github Repo in VS Code

Open any Github Repo in VS Code

Introduction GitHub has added built-in support to open your repository in Visual Studio Code easily. Previously, we either need to use octotree extension to browse files or use github1s to view in Visual Studio Code. But github1s was opening just a read-only editor where you can't make any modifications to files. Now, with GitHu...

Yogesh Chavan

1 month ago

7
Select One:
How Prototypal Inheritance Works In JavaScript

How Prototypal Inheritance Works In JavaScript

Before starting with prototypal inheritance letโ€™s first understand what a prototype is. All the objects in JavaScript like Array, Boolean, Date etc all inherit properties and methods from their prototype. Object is the at top of the Prototype chain means all the other objects inherit their properties and methods from Object.pr...

Yogesh Chavan

1 month ago

4
Select One:
How to Pass Additional Data For a Route In React Routing

How to Pass Additional Data For a Route In React Routing

In this article, we will see how we can pass extra data while redirecting to a different route in React that uses react-router-dom library. So letโ€™s get started. Using Link Normally we use the Link component from react-router-dom as shown below: <Link to="/register">Register</Link> So when we click on the...

Yogesh Chavan

1 month ago

4
Select One:
How To Get Better At Googling

How To Get Better At Googling

Introdction Don't worry, you've read the title of this post correctly. We are indeed going to explain how to get better at googling. In the web dev world, googling is one of the main things that someone should know how to do properly. There are actually quite a few stuff that you could do to get the answers and results that you...

Boyan Iliev

1 month ago

7
Select One:
How to Easily Fix The Port is Already in Use Error

How to Easily Fix The Port is Already in Use Error

Have you ever struggled with the the port is already in use error while starting any application? A lot of times when we are using multiple applications or forget to stop the previous process, we get the the port is already in use error. Then we try to find the process using that port and then kill it or maybe restart the machin...

Yogesh Chavan

1 month ago

5
Select One:
A Complete Introduction to JavaScript Array filter Method

A Complete Introduction to JavaScript Array filter Method

The Array filter method is one of the most widely used methods in JavaScript. It allows us to quickly filter out elements from the array with certain criteria. So in this article, you will learn everything about the filter method and its various use cases. So let's get started. Take a look at the below code that does not use th...

Yogesh Chavan

1 month ago

4
Select One:

Loading More Content