DEV Community: Narasimma Radhakrishnan

The Ultimate Guide to HTML Meta Tags: Boost Your SEO and Social Presence

Narasimma Radhakrishnan — Thu, 22 Oct 2026 05:57:00 +0000

When building a website, it’s easy to focus entirely on what users see on the screen—the headings, images, and layout. But some of the most critical elements of your webpage are invisible to your users.
Welcome to the world of HTML meta tags. These hidden lines of code live in the background of every webpage, acting as a direct communication channel to search engines, browsers, and social media platforms.
If you want your website to rank higher on Google, look professional when shared on social media, and fit perfectly on mobile screens, mastering meta tags is non-negotiable. Let’s break down exactly what they are and how to use them.

Closure in JavaScript

Narasimma Radhakrishnan — Wed, 21 Oct 2026 05:19:16 +0000

closure is same as Encapsulation java.
Global variables can be made local (private) with closures.

 function bank(){
            let balance=500;

            const service={
                deposit : function(amt){
                    balance+=amt;
                    console.log(balance);
                },
                withdraw : function(amt){
                    balance-=amt;
                    console.log(balance);
                },
                viewbalance : function(){
                    console.log(balance);
                }
            }

            return service;
        }
        const person1= bank();
        person1.deposit(1000);
        const person2=bank();
        person2.withdraw(3000);
        const person3=bank();
        person3.viewbalance();

output:

1500
-2500
500

Async and await in JavaScript....?

Narasimma Radhakrishnan — Wed, 21 Oct 2026 04:13:37 +0000

Async and await are the JavaScript keywords used to create a asynchronous function or code. Its mainly for clean code, better readability and reusability.

1.Async keyword:
It is used to declare the await keyword used in the async function.
And the function will always return the Promise. if the function returns like string or value it converts or wraps into an resolved promise.

async function greet() {
return "Hello!";
}

2.Await keyword:
This keyword is only used inside async function.
it pauses the function execution until the promise settles(resolve, reject).

Event Listener in JavaScript?

Narasimma Radhakrishnan — Tue, 20 Oct 2026 13:06:20 +0000

An event listener in JavaScript is used to execute a function when an event happens, such as clicking a button, typing in an input, or moving the mouse.

Simple example click me

let button = document.getelementbyId("btn");
button.addEventListener("click", function(){
console.log("hello world");
});

Common event listeners
- Event When it happens
- click User clicks an element
- mouseover Mouse moves over an element
- mouseout Mouse leaves an element
- input Input value changes
- change A value is changed and committed
- keydown User presses a keyboard key
- submit A form is submitted

Synchronous vs Asynchronous vs Promise in JavaScript 🚀

Narasimma Radhakrishnan — Thu, 15 Oct 2026 06:00:24 +0000

What is Synchronous JavaScript?

Synchronous means one task executes at a time, in order. The next task waits until the current task finishes.

console.log("First");
console.log("Second");
console.log("Third");

Output:

First
Second
Third

Each statement executes in order.

Real-life example: Standing in a queue. One person finishes before the next person is served.

What is Asynchronous JavaScript?

Asynchronous operations allow JavaScript to continue doing other work while waiting for certain tasks to finish.

console.log("First");

setTimeout(() => {
  console.log("Second");
}, 2000);

console.log("Third");

Output:

First
Third
Second

Why? setTimeout() schedules the callback to run later, so JavaScript continues with the next statement first.

What is a Promise?

A Promise is a JavaScript object that represents the eventual success or failure of an asynchronous operation.

A Promise has three states:

Pending – Still waiting.

Fulfilled – Completed successfully.

Rejected – Failed.

Example:

let myPromise = new Promise((resolve, reject) => {
  resolve("Task completed!");
});

myPromise.then((result) => {
  console.log(result);
});

Output:

Task completed!

LocalStorage in JavaScript for Beginners 💾

Narasimma Radhakrishnan — Wed, 14 Oct 2026 14:09:13 +0000

When I started learning JavaScript, I learned how to store data in variables. But I had one question: What happens to the data when we refresh the webpage?

Normally, data stored only in variables is lost when the page reloads. That's where localStorage becomes useful!

What is LocalStorage?

localStorage is a browser feature that allows us to store data in the user's browser.

The best part? The data stays saved even after refreshing or closing the browser, until it is removed by the user or the application.

Store Data Using setItem()

We can save data using localStorage.setItem().

localStorage.setItem("name", "Narasimma");

Here:

"name" is the key.

"Narasimma" is the value.

Get Data Using getItem()

We can retrieve the saved data using getItem().

let name = localStorage.getItem("name");

console.log(name);

Output:

Narasimma

Remove Data Using removeItem()

Want to remove a particular item?

localStorage.removeItem("name");

This removes the data stored with the key "name".

Clear All Data Using clear()

localStorage.clear();

This removes all entries from the website's local storage. Use it carefully!

Store Objects and Arrays

One important thing to remember is that localStorage stores values as strings.

To store an object or array, we can use JSON.stringify().

let student = {
  name: "Arun",
  age: 21
};

localStorage.setItem("student", JSON.stringify(student));

To retrieve the object, use JSON.parse().

let data = JSON.parse(localStorage.getItem("student"));

console.log(data.name);

Output:

Arun

Where Can We Use LocalStorage?

Saving a user's theme preference

Remembering form data

Storing shopping cart information

Saving simple application settings

Building small projects without a backend

How to Prepare for an IT Interview: A Beginner's Guide 🚀

Narasimma Radhakrishnan — Mon, 12 Oct 2026 13:59:22 +0000

As a beginner preparing for IT interviews, I learned that preparation is not just about memorizing questions. It is about understanding concepts, solving problems, and explaining our thoughts clearly.

Here are the steps that can help every fresher prepare for an interview.

Understand the Job Description 📋

Before starting your preparation, read the job description carefully.

Understand:

Required technical skills

Programming languages

Tools and technologies

Responsibilities of the role

This helps you focus on the topics that matter most.

Learn the Fundamentals 💻

Build a strong foundation in the technologies required for your role.

For example, if you're preparing for a Java Full Stack Developer role, focus on:

Java fundamentals and OOP

HTML, CSS, and JavaScript

React basics

SQL and databases

REST APIs

Git and GitHub

Tip: Understand the concepts instead of memorizing answers.

Practice Coding Daily 🧠

Start with simple problems and gradually increase the difficulty.

Practice:

String manipulation

Arrays and loops

Sorting and searching

Functions and objects

Basic SQL queries

Even 30–60 minutes of daily practice can help you improve over time.

Prepare Your Projects 🛠️

Interviewers may ask questions about the projects mentioned in your resume.

Be ready to explain:

What problem does your project solve?

Which technologies did you use?

What was your role?

What challenges did you face?

How did you solve them?

Try to explain your project in simple words, as if you are teaching someone.

Practice Scenario-Based Questions 🎯

Some interviews test how you apply your knowledge in real situations rather than asking only theoretical questions.

For example:

Question: What would you do if an API returns an error?

A good approach is to:

Understand the error.

Reproduce the issue.

Check the request and response.

Investigate the cause.

Fix the problem.

Test the solution.

This approach helps demonstrate your problem-solving skills.

Prepare Your Self-Introduction 🗣️

Prepare a short introduction covering:

Your education

Your technical skills

Your projects

Your internship or practical experience

Your career goals

Practice speaking naturally instead of memorizing every word.

Research the Company 🏢

Before attending an interview, learn about:

The company's products and services

The job role

The technologies it uses, if publicly available

The interview process, if known

This helps you understand the opportunity better.

Learn from Every Interview 📈

Not every interview will go as expected, and that is okay.

After an interview, ask yourself:

Which questions did I answer well?

Which concepts were difficult?

What should I improve?

What will I prepare differently next time?

Every interview can become a learning opportunity.

JavaScript Loops for Beginners

Narasimma Radhakrishnan — Sun, 11 Oct 2026 05:17:41 +0000

When I started learning JavaScript, I often repeated the same code multiple times. Then I learned about loops, which made my code much easier to write!

What is a Loop?

A loop allows us to execute a block of code repeatedly while a condition is satisfied.

For example, instead of writing console.log() five times, we can use a loop to print numbers from 1 to 5.

For Loop

A for loop is useful when we want to repeat something a specific number of times.

for (let i = 1; i <= 5; i++) {
  console.log(i);
}

Output:

1
2
3
4
5

How does it work?

let i = 1 → Starts the counter at 1.

i <= 5 → Checks the condition.

i++ → Increases the counter by 1.

The loop stops when the condition becomes false.

While Loop

A while loop repeats code as long as its condition is true.

let i = 1;

while (i <= 5) {
  console.log(i);
  i++;
}

It produces the same output as the for loop.

Important: Remember to update the counter. Otherwise, the loop might run forever!

Do-While Loop

A do...while loop executes the code at least once, even if the condition is false.

let i = 1;

do {
  console.log(i);
  i++;
} while (i <= 5);

For Loop vs While Loop

For Loop

While Loop

Useful when the number of repetitions is known

Useful when repetition depends on a condition

Initialization, condition, and update are together

These are usually written separately

Common for counting and arrays

Common for condition-based tasks

Using a Loop with an Array

Loops are especially useful when working with arrays.

let fruits = ["Apple", "Banana", "Mango"];

for (let i = 0; i < fruits.length; i++) {
  console.log(fruits[i]);
}

Output:

Apple
Banana
Mango

Here, fruits.length tells us how many elements are in the array.

Where Are Loops Used?

Displaying product lists

Processing student records

Calculating totals

Searching for values

Repeating tasks automatically

Conclusion

Loops are one of the most important JavaScript fundamentals. Start with the for loop, understand the condition and counter, and then practice while and do...while.

Learn → Practice → Build → Improve! 🚀

javascript #webdev #beginners #coding

JavaScript Promises for Beginners 🚀

Narasimma Radhakrishnan — Fri, 09 Oct 2026 06:45:43 +0000

When I started learning JavaScript, I learned about variables, functions, arrays, and DOM manipulation. Then I came across Promises.

At first, Promises looked confusing, but simple examples helped me understand them.

What is a Promise?

A Promise is a JavaScript object that represents the eventual success or failure of an asynchronous operation.

For example, imagine ordering food online 🍕. Your order may be accepted, rejected, or still processing.

Promises have three states:

Pending – The operation is still in progress.

Fulfilled – The operation completed successfully.

Rejected – The operation failed.

Creating a Promise

Let's create a simple Promise.

let myPromise = new Promise((resolve, reject) => {
  let success = true;

  if (success) {
    resolve("Task completed!");
  } else {
    reject("Task failed!");
  }
});

Here:

resolve() indicates success.

reject() indicates failure.

Using .then() and .catch()

We can handle the result of a Promise using .then() and .catch().

myPromise
  .then(result => {
    console.log(result);
  })
  .catch(error => {
    console.log(error);
  });

Output:

Task completed!

.then() handles successful completion.

.catch() handles errors.

Promise with setTimeout()

Let's simulate a task that takes two seconds.

let task = new Promise((resolve) => {
  setTimeout(() => {
    resolve("Data loaded successfully!");
  }, 2000);
});

task.then(result => console.log(result));

The message appears after two seconds.

Using Promises with the DOM

Now let's display the result on a webpage.

<h2 id="message">Loading...</h2>

let message = document.getElementById("message");

function loadData() {
  return new Promise(resolve => {
    setTimeout(() => {
      resolve("Welcome to JavaScript!");
    }, 2000);
  });
}

loadData().then(result => {
  message.textContent = result;
});

Here, the DOM displays Loading... first and updates the text after two seconds.

This demonstrates how Promises and DOM manipulation can work together.

Why Are Promises Useful?

Promises are commonly used for:

Fetching data from APIs

Loading information from a server

Handling asynchronous operations

Managing success and error responses

Conclusion

Promises help us handle operations that don't finish immediately. Understanding resolve(), reject(), .then(), and .catch() is a great first step toward learning asynchronous JavaScript.

Learn → Practice → Build → Improve! 🚀

javascript #promises #webdev #beginners

DOM in JavaScript for Beginners 🌐🚀

Narasimma Radhakrishnan — Thu, 08 Oct 2026 06:13:46 +0000

After learning the basics of JavaScript, I started learning about the DOM.

At first, DOM sounded complicated. But when I understood how JavaScript can interact with HTML elements, it became much easier.

What is DOM?

DOM stands for Document Object Model.

The browser converts an HTML page into a structure that JavaScript can understand and modify.

For example:

<h1>Hello World</h1>

JavaScript can find this

and change its content.

Selecting an Element

We can use getElementById() to select an HTML element.

<h1 id="title">Hello World</h1>

let heading = document.getElementById("title");

console.log(heading);

Changing Text

We can change the text using textContent.

heading.textContent = "Hello JavaScript!";

Now the webpage displays:

Hello JavaScript!

Changing CSS

JavaScript can also change the style of an element.

heading.style.color = "blue";
heading.style.fontSize = "40px";

Handling Button Clicks

We can use an event listener to respond when a user clicks a button.

<button id="btn">Click Me</button>

let button = document.getElementById("btn");

button.addEventListener("click", function() {
  alert("Button clicked!");
});

Now something happens when the button is clicked. 🎯

Creating Elements

JavaScript can even create new HTML elements.

let paragraph = document.createElement("p");

paragraph.textContent = "I created this using JavaScript!";

document.body.appendChild(paragraph);

Why is DOM Important?

DOM helps us create interactive websites.

With DOM, we can:

Change HTML content

Change CSS styles

Add or remove elements

Handle button clicks

Validate forms

Create dynamic web pages

Easy Way to Remember 🧠

Think of it like this:

HTML → Creates the structure 🏗️
CSS → Makes it beautiful 🎨
JavaScript + DOM → Makes it interactive ⚡

Conclusion

Learning the DOM helped me understand how JavaScript actually interacts with a webpage.

My next step is to practice more DOM concepts by building small projects.

Learn → Practice → Build → Improve 🚀

javascript #dom #webdev #beginners

React.js for Beginners: My First Step into React ⚛️

Narasimma Radhakrishnan — Wed, 07 Oct 2026 15:35:48 +0000

After learning HTML, CSS, and JavaScript, I started learning React.js.

At first, React looked confusing because of components, props, state, and JSX. But after understanding the basics, I realized that React is a powerful way to build user interfaces.

What is React?

React is a JavaScript library used to build user interfaces, especially for web applications.

React was created by Meta (Facebook).

Instead of creating one large webpage, React allows us to divide the UI into smaller reusable components.

What is a Component?

A component is a reusable piece of the user interface.

For example:

Navbar

Button

Card

Footer

Simple React component:

function Welcome() {
  return <h1>Hello, World!</h1>;
}

export default Welcome;

What is JSX?

JSX allows us to write HTML-like code inside JavaScript.

function App() {
  return (
    <div>
      <h1>Welcome to React</h1>
      <p>I'm learning React!</p>
    </div>
  );
}

It makes UI code easier to understand.

What are Props?

Props are used to pass data from one component to another.

function Student(props) { return <h2>Hello {props.name}</h2>; }
We can use the component like this:

What is State?

State stores information that can change inside a component.

For example, a counter:

import { useState } from "react";

function Counter() {
  const [count, setCount] = useState(0);

  return (
    <button onClick={() => setCount(count + 1)}>
      Count: {count}
    </button>
  );
}

When the button is clicked, the count increases.

Why Learn React?

React is useful for building:

🌐 Websites

📱 Web applications

📊 Dashboards

🛒 E-commerce applications

💻 Full Stack applications

React is also widely used with technologies like Node.js, Express, and MongoDB.

My Learning Path

As a beginner, I'm focusing on learning React step by step:

HTML → CSS → JavaScript → React → APIs → Full Stack

I believe understanding JavaScript properly makes learning React much easier.

Conclusion

React may look difficult at first, but don't try to learn everything at once.

Start with:

Components → JSX → Props → State → Events → Hooks

Then practice by building small projects.

Learn → Practice → Build → Improve 🚀

react #javascript #webdev #beginners

What is Call Back Function? and Array Inbuilt method=> filter() ;

Narasimma Radhakrishnan — Tue, 06 Oct 2026 05:31:10 +0000

While learning JavaScript, I came across two important concepts: Callback Functions and the array filter() method.

At first, they looked confusing, but simple examples made them much easier to understand.

What is a Callback Function?

A callback function is a function that is passed as an argument to another function.

Example:

function greet(name, callback) {
  console.log("Hello " + name);
  callback();
}

function message() {
  console.log("Welcome to JavaScript!");
}

greet("Narasimma", message);

Here, message is passed to greet() as a callback function.

Simple Way to Remember 💡

A callback is simply a function given to another function to be called later.

What is filter()? 🔍

filter() is a JavaScript array method used to select elements that match a condition.

Example:

let numbers = [10, 15, 20, 25, 30];

let result = numbers.filter(function(number) {
  return number > 20;
});

console.log(result);

Output:

[25, 30]

The filter() method checks every element and keeps only the elements where the condition is true.

Using Arrow Function

We can write the same code in a shorter way:

let numbers = [10, 15, 20, 25, 30];

let result = numbers.filter(number => number > 20);

console.log(result);

filter() with Objects

We can also filter objects.

let students = [
  { name: "Arun", age: 20 },
  { name: "Kumar", age: 17 },
  { name: "Ravi", age: 22 }
];

let adults = students.filter(student => student.age >= 18);

console.log(adults);

This returns only the students whose age is 18 or above.

Callback + filter()

Now we can connect both concepts.

The function passed inside filter() is a callback function.

let numbers = [1, 2, 3, 4, 5];

let evenNumbers = numbers.filter(function(number) {
  return number % 2 === 0;
});

console.log(evenNumbers);

Output:

[2, 4]

So, filter() uses a callback function to check each array element.

Easy Way to Remember 🧠

Callback Function → A function passed to another function.

filter() → Selects elements based on a condition.

Array
↓
filter()
↓
Callback checks each item
↓
Condition true?
↓
Keep the item ✅

Conclusion

Today I learned that callback functions are an important part of JavaScript, and filter() is a very useful array method.

These concepts are especially useful when working with arrays, objects, APIs, and real-world JavaScript applications.

Learn → Practice → Build 🚀

javascript #webdev #beginners #coding