DEV Community: Abhishek Raina

Asynchronous Programming and Promises in JavaScript

Abhishek Raina — Mon, 12 Aug 2024 07:30:56 +0000

Asynchronous Programming and Promises in JavaScript:

Let’s break down these concepts in a fun and easy-to-understand way!

What is Asynchronous Programming?

Asynchronous programming is like having a superpower that allows your code to do multiple things at once without getting stuck. In traditional synchronous programming, tasks are executed one after the other, like a single-threaded chef who can only cook one dish at a time. This can lead to long wait times, especially when tasks take a while, like fetching data from a server.

Example of Synchronous vs. Asynchronous:

1. Synchronous:

console.log("Start cooking");
// Waits for the dish to finish
console.log("Dish is ready!");

2. Asynchronous:

console.log("Start cooking");
setTimeout(() => console.log("Dish is ready!"), 3000); // Cook for 3 seconds
console.log("I can do other things while waiting!");

In the asynchronous example, the chef starts cooking and immediately moves on to other tasks while the dish is cooking in the background. This is the magic of asynchronous programming!

Enter the Promises

Now, let’s meet Promises—the trusty sidekick of asynchronous programming. A Promise is like a waiter who promises to bring you your order. You place your order (make a request), and the waiter assures you that they will deliver it later, even if you have to wait a bit.

Promise States:

Pending: The initial state; the promise is still waiting for the operation to complete.
Fulfilled: The operation was completed successfully, and the promise has a value.
Rejected: The operation failed, and the promise has a reason for the failure.

Creating a Promise:

let orderDish = new Promise((resolve, reject) => {
  let cookingTime = 3000; // 3 seconds
  setTimeout(() => {
    resolve("Dish is ready!"); // Fulfilled
  }, cookingTime);
});

Using Promises: .then() and .catch()

Once you have your Promise, you can use .then() to handle the successful completion of the task and .catch() to handle any errors.

orderDish
  .then((message) => console.log(message)) // If fulfilled
  .catch((error) => console.log(error));   // If rejected

Async/Await: The Cool Sibling of Promises

Now, let’s introduce the async/await syntax. It allows you to write asynchronous code that looks synchronous, making it easier to read and maintain.

Async: This keyword is used to declare a function as asynchronous.
Await: This keyword is used to pause the execution of the async function until the Promise is resolved.

Example:

async function serveDish() {
  try {
    const message = await orderDish; // Wait for the promise to resolve
    console.log(message);
  } catch (error) {
    console.log(error);
  }
}

serveDish();

Comparing .then() vs. await

1. .then():

Good for chaining multiple asynchronous operations.
Can lead to "callback hell" if not managed properly.

2. await:

Makes your code look cleaner and more readable.
Easier to handle errors with try/catch.

Learning Resources

To dive deeper into asynchronous programming and Promises, here are some resources that can help:

MDN Web Docs: A comprehensive guide to Asynchronous JavaScript.
Eloquent JavaScript: Chapter 11 covers asynchronous programming in detail.
FreeCodeCamp: Offers a Beginner's Guide to Asynchronous JavaScript.
JavaScript.info: A great resource for understanding Promises.

IP addresses and DNS. How this dynamic duo is holding the Internet🤔

Abhishek Raina — Sat, 10 Aug 2024 03:36:32 +0000

In the vast universe 🌌 of the internet, two key players make the digital world go round:

IP addresses

and

DNS (Domain Name System).

Let’s go on a fun journey to understand these concepts, their roles, and how they work together to connect us all!

🏃‍♂️🏃‍♂️🏃‍♂️🏃‍♂️🏃‍♂️🏃‍♂️🏃‍♂️🏃‍♂️🏃‍♂️🏃‍♂️🏃‍♂️🏃‍♂️🏃‍♂️🏃‍♂️🏃‍♂️🏃‍♂️🏃‍♂️🏃‍♂️🏃‍♂️🏃‍♂️🏃‍♂️🏃‍♂️🏃‍♂️🏃‍♂️🏃‍♂️🏃‍♂️

What is an IP Address?

Imagine an IP address as the home address of your favorite website. Just like your home address helps friends find you, an IP address helps computers find each other on the internet. It’s a unique string of numbers assigned to every device connected to the internet, allowing them to communicate and share information.

Types of IP Addresses:

IPv4:

The classic 32-bit address format, which looks something like 192.168.1.1. It can provide around 4.3 billion unique addresses, which sounds like a lot until you realize there are over 7 billion people on Earth!

IPv6:

Enter the superhero of IP addresses! With its 128-bit format, IPv6 can provide an astronomical number of addresses (about 340 undecillion). This format looks like 2001:0db8:85a3:0000:0000:8a2e:0370:7334. It was introduced to tackle the shortage of IPv4 addresses.

What is DNS?

Now, let’s meet DNS, the friendly translator of the internet.

DNS stands for Domain Name System,

and it’s responsible for converting human-friendly domain names (like www.example.com) into IP addresses that computers can understand. Think of it as the internet’s phonebook!

How DNS Works

When you type a web address into your browser, here’s what happens:

Query:
Your device requests a DNS server to find the corresponding IP address for the domain name.
Response:
The DNS server looks up the address and sends it back to your device.
Connection:
Your device uses the IP address to connect to the web server, allowing you to access the website.

The Dynamic Duo: IP Addresses and DNS

Together, IP addresses and DNS create a seamless browsing experience.

While IP addresses ensure that data is sent to the right destination, DNS makes navigating the web easy without memorizing complex numerical addresses.

Fun Facts

No, no, no don't focus on image facts are below you gotta read through them 😁 ->

Root Name Servers:
These are the backbone of the DNS system, helping to direct queries to the appropriate DNS servers. They’re like the wise elders of the internet, knowing where to send everyone!
Caching:
DNS servers cache (store) previously looked-up addresses to speed things up. So, if you visit a site frequently, your device won’t have to ask for the IP address every time!
Security:
Just like a good security system for your home, DNS has measures like DNSSEC to ensure that the data being sent and received is authentic and secure.

Conclusion

In summary, IP addresses and DNS are essential components of the internet that work hand-in-hand to facilitate communication and navigation.

So, the next time you browse the web, remember the incredible teamwork of these two systems that keep the internet running smoothly!

Communicating on the Web

Abhishek Raina — Wed, 07 Aug 2024 08:57:56 +0000

Have you ever 🤔wondered how you pick up your phone and send a voice message to your friend and in a few seconds your friend listens to your message and sends back his/her response ( text or voice )?

How does all that happen? How does your friend's voice just come on your phone even though your friend is sitting miles away from you?

Let's dive 🤽‍♂️ into how the Web works under the hood

When two computers communicate with each other, they need to use the same rules. An English speaker can't communicate verbally with a Japanese speaker, similarly, two computers need to speak the same language to communicate.

This "language" that computers use is called a protocol. The most popular protocol for web communication is HTTP, which stands for Hypertext Transfer Protocol.

Working of HTTP

At the heart of HTTP is a simple request-response system. The "requesting" computer, also known as the "client", asks another computer for some information. That computer, "the server" sends back a response with the requested information.

HTTP URLS

A URL (Uniform Resource Locator) is the address of a unique resource on the internet. It is one of the key mechanisms used by browsers to retrieve published resources, such as HTML pages, CSS documents, images, and so on.

Now Let's look at some amazing things about a URL or simply a Link:

A URL or a link is composed of different parts, some mandatory and others optional. The most important parts are highlighted on the URL below:

Click here to Dig Deeper

What are the terms Web Clients and Web Servers?

WEB CLIENT

A web client is a device making requests to a web server.

A client can be any type of device but is often something users physically interact with. For example:

A desktop computer
A mobile phone
A tablet

In a website or web application, we call the user's device the "front end".

A front-end client makes requests to a back-end server.

WEB SERVER

Similar to how a server at a restaurant brings your food to the table, a web server serves web resources, such as web pages, images, and other data.

The server is turned on and "listening" for inbound requests constantly so that the second it receives a new request, it can send an appropriate response.

Ending here.........!

Hi, you can learn more by clicking the links provided in between.

The Web is much Deeper and has lot more details, which I will be covering in upcoming posts.

So do follow me for the amazing content.